import { setFileScope, endFileScope } from "@vanilla-extract/css/fileScope";
import { style } from "@vanilla-extract/css";
import { defineProperties, createSprinkles, createNormalizeValueFn, createMapValueFn } from "@vanilla-extract/sprinkles";
import { breakpoints, breakpointNames } from "../breakpoints.mjs";
import { unresponsiveProperties, pseudoProperties, colorProperties, responsiveProperties } from "./atomicProperties.mjs";
setFileScope("src/lib/css/atoms/sprinkles.css.ts", "braid-design-system");
const unresponsiveAtomicProperties = defineProperties({
  properties: unresponsiveProperties,
  shorthands: {
    inset: ["top", "bottom", "left", "right"]
  }
});
const pseudoAtomicProperties = defineProperties({
  defaultCondition: false,
  conditions: {
    active: {
      selector: "&:active"
    }
  },
  properties: pseudoProperties
});
const darkMode = style({}, "darkMode");
const colorModeSelectors = {
  light: `html:not(${darkMode}) &`,
  dark: `html${darkMode} &`
};
const colorAtomicProperties = defineProperties({
  defaultCondition: "lightMode",
  conditions: {
    lightMode: {
      selector: colorModeSelectors.light
    },
    darkMode: {
      selector: colorModeSelectors.dark
    }
  },
  properties: colorProperties
});
const responsiveAtomicProperties = defineProperties({
  defaultCondition: "mobile",
  conditions: {
    mobile: {},
    tablet: {
      "@media": `screen and (min-width: ${breakpoints.tablet}px)`
    },
    desktop: {
      "@media": `screen and (min-width: ${breakpoints.desktop}px)`
    },
    wide: {
      "@media": `screen and (min-width: ${breakpoints.wide}px)`
    }
  },
  responsiveArray: breakpointNames,
  properties: responsiveProperties,
  shorthands: {
    padding: ["paddingBottom", "paddingTop", "paddingLeft", "paddingRight"],
    paddingY: ["paddingTop", "paddingBottom"],
    paddingX: ["paddingLeft", "paddingRight"],
    margin: ["marginBottom", "marginTop", "marginLeft", "marginRight"],
    marginY: ["marginTop", "marginBottom"],
    marginX: ["marginLeft", "marginRight"]
  }
});
const sprinkles = createSprinkles(unresponsiveAtomicProperties, responsiveAtomicProperties, pseudoAtomicProperties, colorAtomicProperties);
const normalizeResponsiveValue = createNormalizeValueFn(responsiveAtomicProperties);
const mapResponsiveValue = createMapValueFn(responsiveAtomicProperties);
const mapColorModeValue = createMapValueFn(colorAtomicProperties);
endFileScope();
export {
  colorModeSelectors,
  darkMode,
  mapColorModeValue,
  mapResponsiveValue,
  normalizeResponsiveValue,
  sprinkles
};
