@implydata/stitches-react
Version:
The modern CSS-in-JS library
4 lines • 83 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../core/src/default/defaultThemeMap.js", "../../core/src/utility/createMemo.js", "../../core/src/utility/internal.js", "../../core/src/utility/define.js", "../../core/src/utility/hasNames.js", "../../core/src/utility/hasOwn.js", "../../core/src/convert/toCamelCase.js", "../../core/src/convert/toHyphenCase.js", "../../core/src/convert/toPolyfilledValue.js", "../../core/src/convert/toResolvedMediaQueryRanges.js", "../../core/src/convert/toResolvedSelectors.js", "../../core/src/convert/toSizingValue.js", "../../core/src/convert/toTailDashed.js", "../../core/src/convert/toTokenizedValue.js", "../../core/src/convert/toCssRules.js", "../../core/src/convert/toHash.js", "../../core/src/utility/getNonce.js", "../../core/src/sheet.js", "../../core/src/features/css.js", "../../core/src/features/globalCss.js", "../../core/src/features/keyframes.js", "../../core/src/ThemeToken.js", "../../core/src/features/createTheme.js", "../../core/src/createStitches.js", "../src/features/styled.js", "../src/createStitches.js", "../src/utility/getCachedConfig.js", "../src/index.js"],
"sourcesContent": ["const borderStyles = 'borderStyles'\nconst borderWidths = 'borderWidths'\nconst colors = 'colors'\nconst fonts = 'fonts'\nconst fontSizes = 'fontSizes'\nconst fontWeights = 'fontWeights'\nconst letterSpacings = 'letterSpacings'\nconst lineHeights = 'lineHeights'\nconst radii = 'radii'\nconst shadows = 'shadows'\nconst sizes = 'sizes'\nconst space = 'space'\nconst transitions = 'transitions'\nconst zIndices = 'zIndices'\n\n/** @type {DefaultThemeMap} */\nexport const defaultThemeMap = {\n\tgap: space,\n\tgridGap: space,\n\tcolumnGap: space,\n\tgridColumnGap: space,\n\trowGap: space,\n\tgridRowGap: space,\n\tinset: space,\n\tinsetBlock: space,\n\tinsetBlockEnd: space,\n\tinsetBlockStart: space,\n\tinsetInline: space,\n\tinsetInlineEnd: space,\n\tinsetInlineStart: space,\n\tmargin: space,\n\tmarginTop: space,\n\tmarginRight: space,\n\tmarginBottom: space,\n\tmarginLeft: space,\n\tmarginBlock: space,\n\tmarginBlockEnd: space,\n\tmarginBlockStart: space,\n\tmarginInline: space,\n\tmarginInlineEnd: space,\n\tmarginInlineStart: space,\n\tpadding: space,\n\tpaddingTop: space,\n\tpaddingRight: space,\n\tpaddingBottom: space,\n\tpaddingLeft: space,\n\tpaddingBlock: space,\n\tpaddingBlockEnd: space,\n\tpaddingBlockStart: space,\n\tpaddingInline: space,\n\tpaddingInlineEnd: space,\n\tpaddingInlineStart: space,\n\ttop: space,\n\tright: space,\n\tbottom: space,\n\tleft: space,\n\tscrollMargin: space,\n\tscrollMarginTop: space,\n\tscrollMarginRight: space,\n\tscrollMarginBottom: space,\n\tscrollMarginLeft: space,\n\tscrollMarginX: space,\n\tscrollMarginY: space,\n\tscrollMarginBlock: space,\n\tscrollMarginBlockEnd: space,\n\tscrollMarginBlockStart: space,\n\tscrollMarginInline: space,\n\tscrollMarginInlineEnd: space,\n\tscrollMarginInlineStart: space,\n\tscrollPadding: space,\n\tscrollPaddingTop: space,\n\tscrollPaddingRight: space,\n\tscrollPaddingBottom: space,\n\tscrollPaddingLeft: space,\n\tscrollPaddingX: space,\n\tscrollPaddingY: space,\n\tscrollPaddingBlock: space,\n\tscrollPaddingBlockEnd: space,\n\tscrollPaddingBlockStart: space,\n\tscrollPaddingInline: space,\n\tscrollPaddingInlineEnd: space,\n\tscrollPaddingInlineStart: space,\n\n\tfontSize: fontSizes,\n\n\tbackground: colors,\n\tbackgroundColor: colors,\n\tbackgroundImage: colors,\n\tborderImage: colors,\n\tborder: colors,\n\tborderBlock: colors,\n\tborderBlockEnd: colors,\n\tborderBlockStart: colors,\n\tborderBottom: colors,\n\tborderBottomColor: colors,\n\tborderColor: colors,\n\tborderInline: colors,\n\tborderInlineEnd: colors,\n\tborderInlineStart: colors,\n\tborderLeft: colors,\n\tborderLeftColor: colors,\n\tborderRight: colors,\n\tborderRightColor: colors,\n\tborderTop: colors,\n\tborderTopColor: colors,\n\tcaretColor: colors,\n\tcolor: colors,\n\tcolumnRuleColor: colors,\n\tfill: colors,\n\toutline: colors,\n\toutlineColor: colors,\n\tstroke: colors,\n\ttextDecorationColor: colors,\n\n\tfontFamily: fonts,\n\n\tfontWeight: fontWeights,\n\n\tlineHeight: lineHeights,\n\n\tletterSpacing: letterSpacings,\n\n\tblockSize: sizes,\n\tminBlockSize: sizes,\n\tmaxBlockSize: sizes,\n\tinlineSize: sizes,\n\tminInlineSize: sizes,\n\tmaxInlineSize: sizes,\n\twidth: sizes,\n\tminWidth: sizes,\n\tmaxWidth: sizes,\n\theight: sizes,\n\tminHeight: sizes,\n\tmaxHeight: sizes,\n\tflexBasis: sizes,\n\tgridTemplateColumns: sizes,\n\tgridTemplateRows: sizes,\n\n\tborderWidth: borderWidths,\n\tborderTopWidth: borderWidths,\n\tborderRightWidth: borderWidths,\n\tborderBottomWidth: borderWidths,\n\tborderLeftWidth: borderWidths,\n\n\tborderStyle: borderStyles,\n\tborderTopStyle: borderStyles,\n\tborderRightStyle: borderStyles,\n\tborderBottomStyle: borderStyles,\n\tborderLeftStyle: borderStyles,\n\n\tborderRadius: radii,\n\tborderTopLeftRadius: radii,\n\tborderTopRightRadius: radii,\n\tborderBottomRightRadius: radii,\n\tborderBottomLeftRadius: radii,\n\n\tboxShadow: shadows,\n\ttextShadow: shadows,\n\n\ttransition: transitions,\n\n\tzIndex: zIndices,\n}\n\n/**\n * @typedef {Object} DefaultThemeMap\n * @property {space} gap\n * @property {space} gridGap\n * @property {space} columnGap\n * @property {space} gridColumnGap\n * @property {space} rowGap\n * @property {space} gridRowGap\n * @property {space} inset\n * @property {space} insetBlock\n * @property {space} insetBlockEnd\n * @property {space} insetBlockStart\n * @property {space} insetInline\n * @property {space} insetInlineEnd\n * @property {space} insetInlineStart\n * @property {space} margin\n * @property {space} marginTop\n * @property {space} marginRight\n * @property {space} marginBottom\n * @property {space} marginLeft\n * @property {space} marginBlock\n * @property {space} marginBlockEnd\n * @property {space} marginBlockStart\n * @property {space} marginInline\n * @property {space} marginInlineEnd\n * @property {space} marginInlineStart\n * @property {space} padding\n * @property {space} paddingTop\n * @property {space} paddingRight\n * @property {space} paddingBottom\n * @property {space} paddingLeft\n * @property {space} paddingBlock\n * @property {space} paddingBlockEnd\n * @property {space} paddingBlockStart\n * @property {space} paddingInline\n * @property {space} paddingInlineEnd\n * @property {space} paddingInlineStart\n * @property {space} top\n * @property {space} right\n * @property {space} bottom\n * @property {space} left\n * @property {space} scrollMargin\n * @property {space} scrollMarginTop\n * @property {space} scrollMarginRight\n * @property {space} scrollMarginBottom\n * @property {space} scrollMarginLeft\n * @property {space} scrollMarginX\n * @property {space} scrollMarginY\n * @property {space} scrollMarginBlock\n * @property {space} scrollMarginBlockEnd\n * @property {space} scrollMarginBlockStart\n * @property {space} scrollMarginInline\n * @property {space} scrollMarginInlineEnd\n * @property {space} scrollMarginInlineStart\n * @property {space} scrollPadding\n * @property {space} scrollPaddingTop\n * @property {space} scrollPaddingRight\n * @property {space} scrollPaddingBottom\n * @property {space} scrollPaddingLeft\n * @property {space} scrollPaddingX\n * @property {space} scrollPaddingY\n * @property {space} scrollPaddingBlock\n * @property {space} scrollPaddingBlockEnd\n * @property {space} scrollPaddingBlockStart\n * @property {space} scrollPaddingInline\n * @property {space} scrollPaddingInlineEnd\n * @property {space} scrollPaddingInlineStart\n\n * @property {fontSizes} fontSize\n\n * @property {colors} background\n * @property {colors} backgroundColor\n * @property {colors} backgroundImage\n * @property {colors} border\n * @property {colors} borderBlock\n * @property {colors} borderBlockEnd\n * @property {colors} borderBlockStart\n * @property {colors} borderBottom\n * @property {colors} borderBottomColor\n * @property {colors} borderColor\n * @property {colors} borderInline\n * @property {colors} borderInlineEnd\n * @property {colors} borderInlineStart\n * @property {colors} borderLeft\n * @property {colors} borderLeftColor\n * @property {colors} borderRight\n * @property {colors} borderRightColor\n * @property {colors} borderTop\n * @property {colors} borderTopColor\n * @property {colors} caretColor\n * @property {colors} color\n * @property {colors} columnRuleColor\n * @property {colors} fill\n * @property {colors} outline\n * @property {colors} outlineColor\n * @property {colors} stroke\n * @property {colors} textDecorationColor\n\n * @property {fonts} fontFamily\n\n * @property {fontWeights} fontWeight\n\n * @property {lineHeights} lineHeight\n\n * @property {letterSpacings} letterSpacing\n\n * @property {sizes} blockSize\n * @property {sizes} minBlockSize\n * @property {sizes} maxBlockSize\n * @property {sizes} inlineSize\n * @property {sizes} minInlineSize\n * @property {sizes} maxInlineSize\n * @property {sizes} width\n * @property {sizes} minWidth\n * @property {sizes} maxWidth\n * @property {sizes} height\n * @property {sizes} minHeight\n * @property {sizes} maxHeight\n * @property {sizes} flexBasis\n * @property {sizes} gridTemplateColumns\n * @property {sizes} gridTemplateRows\n\n * @property {borderWidths} borderWidth\n * @property {borderWidths} borderTopWidth\n * @property {borderWidths} borderRightWidth\n * @property {borderWidths} borderBottomWidth\n * @property {borderWidths} borderLeftWidth\n\n * @property {borderStyles} borderStyle\n * @property {borderStyles} borderTopStyle\n * @property {borderStyles} borderRightStyle\n * @property {borderStyles} borderBottomStyle\n * @property {borderStyles} borderLeftStyle\n\n * @property {radii} borderRadius\n * @property {radii} borderTopLeftRadius\n * @property {radii} borderTopRightRadius\n * @property {radii} borderBottomRightRadius\n * @property {radii} borderBottomLeftRadius\n\n * @property {shadows} boxShadow\n * @property {shadows} textShadow\n\n * @property {transitions} transition\n\n * @property {zIndices} zIndex\n */\n", "const stringifyReplacer = (name, data) =>\n\ttypeof data === 'function' ? { '()': Function.prototype.toString.call(data) } : data\n\nconst stringify = (value) => JSON.stringify(value, stringifyReplacer)\n\nexport const createMemo = () => {\n\tconst cache = Object.create(null)\n\n\treturn (value, apply, ...args) => {\n\t\tconst vjson = stringify(value)\n\n\t\treturn vjson in cache ? cache[vjson] : (cache[vjson] = apply(value, ...args))\n\t}\n}\n", "export const internal = Symbol.for('sxs.internal')\n", "/** @type {<T>(target: T, source: any) => T} */\nexport const define = (target, source) => Object.defineProperties(target, Object.getOwnPropertyDescriptors(source))\n", "export const hasNames = (target) => {\n\tfor (const name in target) return true\n\treturn false\n}\n", "const { hasOwnProperty } = Object.prototype\n\nexport const hasOwn = (target, key) => hasOwnProperty.call(target, key)\n", "/** Returns the given value converted to camel-case. */\nexport const toCamelCase = (/** @type {string} */ value) =>\n\t!/[A-Z]/.test(value) ? value.replace(/-[^]/g, (capital) => capital[1].toUpperCase()) : value\n", "/** Returns the given value converted to kebab-case. */\nexport const toHyphenCase = (/** @type {string} */ value) =>\n\t// ignore kebab-like values\n\tvalue.includes('-')\n\t\t? value\n\t\t: // replace any upper-case letter with a dash and the lower-case variant\n\t\t\tvalue.replace(/[A-Z]/g, (capital) => '-' + capital.toLowerCase())\n", "const splitBySpace = /\\s+(?![^()]*\\))/\nconst split = (fn) => (data) => fn(...(typeof data === 'string' ? String(data).split(splitBySpace) : [data]))\n\nexport const toPolyfilledValue = {\n\t// prefixed properties\n\tappearance: (d) => ({ WebkitAppearance: d, appearance: d }),\n\tbackfaceVisibility: (d) => ({ WebkitBackfaceVisibility: d, backfaceVisibility: d }),\n\tbackdropFilter: (d) => ({ WebkitBackdropFilter: d, backdropFilter: d }),\n\tbackgroundClip: (d) => ({ WebkitBackgroundClip: d, backgroundClip: d }),\n\tboxDecorationBreak: (d) => ({ WebkitBoxDecorationBreak: d, boxDecorationBreak: d }),\n\tclipPath: (d) => ({ WebkitClipPath: d, clipPath: d }),\n\tcontent: (d) => ({\n\t\tcontent:\n\t\t\td.includes('\"') ||\n\t\t\td.includes(\"'\") ||\n\t\t\t/^([A-Za-z]+\\([^]*|[^]*-quote|inherit|initial|none|normal|revert|unset)$/.test(d)\n\t\t\t\t? d\n\t\t\t\t: `\"${d}\"`,\n\t}),\n\thyphens: (d) => ({ WebkitHyphens: d, hyphens: d }),\n\tmaskImage: (d) => ({ WebkitMaskImage: d, maskImage: d }),\n\tmaskSize: (d) => ({ WebkitMaskSize: d, maskSize: d }),\n\ttextSizeAdjust: (d) => ({ WebkitTextSizeAdjust: d, textSizeAdjust: d }),\n\tuserSelect: (d) => ({ WebkitUserSelect: d, userSelect: d }),\n\n\t// logical properties\n\tmarginBlock: split((s, e) => ({ marginBlockStart: s, marginBlockEnd: e || s })),\n\tmarginInline: split((s, e) => ({ marginInlineStart: s, marginInlineEnd: e || s })),\n\tmaxSize: split((b, i) => ({ maxBlockSize: b, maxInlineSize: i || b })),\n\tminSize: split((b, i) => ({ minBlockSize: b, minInlineSize: i || b })),\n\tpaddingBlock: split((s, e) => ({ paddingBlockStart: s, paddingBlockEnd: e || s })),\n\tpaddingInline: split((s, e) => ({ paddingInlineStart: s, paddingInlineEnd: e || s })),\n}\n", "const mqunit = /([\\d.]+)([^]*)/\n\n/** Returns a media query with polyfilled ranges. */\nexport const toResolvedMediaQueryRanges = (\n\t/** @type {string} */\n\tmedia,\n) =>\n\tmedia.replace(\n\t\t/\\(\\s*([\\w-]+)\\s*(=|<|<=|>|>=)\\s*([\\w-]+)\\s*(?:(<|<=|>|>=)\\s*([\\w-]+)\\s*)?\\)/g,\n\t\t(\n\t\t\t__,\n\t\t\t/** @type {string} 1st param, either the name or value in the query. */\n\t\t\tp1,\n\t\t\t/** @type {string} 1st operator. */\n\t\t\to1,\n\t\t\t/** @type {string} 2nd param, either the name or value in the query. */\n\t\t\tp2,\n\t\t\t/** @type {string} Optional 2nd operator. */\n\t\t\to2,\n\t\t\t/** @type {string} Optional 3rd param, always a value in the query.*/\n\t\t\tp3,\n\t\t) => {\n\t\t\t/** Whether the first param is a value. */\n\t\t\tconst isP1Value = mqunit.test(p1)\n\n\t\t\t/** Numeric shift applied to a value when an operator is `<` or `>`. */\n\t\t\tconst shift = 0.0625 * (isP1Value ? -1 : 1)\n\n\t\t\tconst [name, value] = isP1Value ? [p2, p1] : [p1, p2]\n\n\t\t\treturn (\n\t\t\t\t'(' +\n\t\t\t\t(o1[0] === '=' ? '' : (o1[0] === '>') === isP1Value ? 'max-' : 'min-') +\n\t\t\t\tname +\n\t\t\t\t':' +\n\t\t\t\t(o1[0] !== '=' && o1.length === 1\n\t\t\t\t\t? value.replace(mqunit, (_, v, u) => Number(v) + shift * (o1 === '>' ? 1 : -1) + u)\n\t\t\t\t\t: value) +\n\t\t\t\t(o2\n\t\t\t\t\t? ') and (' +\n\t\t\t\t\t\t((o2[0] === '>' ? 'min-' : 'max-') +\n\t\t\t\t\t\t\tname +\n\t\t\t\t\t\t\t':' +\n\t\t\t\t\t\t\t(o2.length === 1 ? p3.replace(mqunit, (_, v, u) => Number(v) + shift * (o2 === '>' ? -1 : 1) + u) : p3))\n\t\t\t\t\t: '') +\n\t\t\t\t')'\n\t\t\t)\n\t\t},\n\t)\n", "/** Returns selectors resolved from parent selectors and nested selectors. */\nexport const toResolvedSelectors = (\n\t/** @type {string[]} Parent selectors (e.g. `[\"a\", \"button\"]`). */\n\tparentSelectors,\n\t/** @type {string[]} Nested selectors (e.g. `[\"&:hover\", \"&:focus\"]`). */\n\tnestedSelectors,\n) =>\n\tparentSelectors.length\n\t\t? parentSelectors.reduce((resolvedSelectors, parentSelector) => {\n\t\t\t\tresolvedSelectors.push(\n\t\t\t\t\t...nestedSelectors.map((selector) =>\n\t\t\t\t\t\tselector.includes('&')\n\t\t\t\t\t\t\t? selector.replace(\n\t\t\t\t\t\t\t\t\t/&/g,\n\t\t\t\t\t\t\t\t\t/[ +>|~]/.test(parentSelector) && /&.*&/.test(selector) ? `:is(${parentSelector})` : parentSelector,\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t: parentSelector + ' ' + selector,\n\t\t\t\t\t),\n\t\t\t\t)\n\n\t\t\t\treturn resolvedSelectors\n\t\t\t}, [])\n\t\t: nestedSelectors\n", "import { toHyphenCase } from './toHyphenCase.js'\n\n/** Returns a declaration sizing value with polyfilled sizing keywords. */\nexport const toSizingValue = (/** @type {string} */ declarationName, /** @type {string} */ declarationValue) =>\n\tdeclarationName in sizeProps && typeof declarationValue === 'string'\n\t\t? declarationValue.replace(\n\t\t\t\t/^((?:[^]*[^\\w-])?)(fit-content|stretch)((?:[^\\w-][^]*)?)$/,\n\t\t\t\t(data, lead, main, tail) =>\n\t\t\t\t\tlead +\n\t\t\t\t\t(main === 'stretch'\n\t\t\t\t\t\t? `-moz-available${tail};${toHyphenCase(declarationName)}:${lead}-webkit-fill-available`\n\t\t\t\t\t\t: `-moz-fit-content${tail};${toHyphenCase(declarationName)}:${lead}fit-content`) +\n\t\t\t\t\ttail,\n\t\t\t)\n\t\t: String(declarationValue)\n\n/** CSS Properties whose value include a sizing keyword. */\nconst sizeProps = {\n\tblockSize: 1,\n\theight: 1,\n\tinlineSize: 1,\n\tmaxBlockSize: 1,\n\tmaxHeight: 1,\n\tmaxInlineSize: 1,\n\tmaxWidth: 1,\n\tminBlockSize: 1,\n\tminHeight: 1,\n\tminInlineSize: 1,\n\tminWidth: 1,\n\twidth: 1,\n}\n", "/** Returns a filled value with a dash prefix. */\nexport const toTailDashed = (/** @type {string} */ value) => (value ? value + '-' : '')\n", "import { toTailDashed } from './toTailDashed.js'\n\n/** Returns a declaration value with transformed token values. */\nexport const toTokenizedValue = (\n\t/** @type {string} */\n\tvalue,\n\t/** @type {string} */\n\tprefix,\n\t/** @type {string} */\n\tscale,\n) =>\n\tvalue.replace(\n\t\t/([+-])?((?:\\d+(?:\\.\\d*)?|\\.\\d+)(?:[Ee][+-]?\\d+)?)?(\\$|--)([$\\w-]+)/g,\n\t\t($0, direction, multiplier, separator, token) =>\n\t\t\t(separator == '$') == !!multiplier\n\t\t\t\t? $0\n\t\t\t\t: (direction || separator == '--' ? 'calc(' : '') +\n\t\t\t\t\t('var(--' +\n\t\t\t\t\t\t(separator === '$'\n\t\t\t\t\t\t\t? toTailDashed(prefix) + (!token.includes('$') ? toTailDashed(scale) : '') + token.replace(/\\$/g, '-')\n\t\t\t\t\t\t\t: token) +\n\t\t\t\t\t\t')' +\n\t\t\t\t\t\t(direction || separator == '--' ? '*' + (direction || '') + (multiplier || '1') + ')' : '')),\n\t)\n", "import { toCamelCase } from './toCamelCase.js'\nimport { toHyphenCase } from './toHyphenCase.js'\nimport { toPolyfilledValue } from './toPolyfilledValue.js'\nimport { toResolvedMediaQueryRanges } from './toResolvedMediaQueryRanges.js'\nimport { toResolvedSelectors } from './toResolvedSelectors.js'\nimport { toSizingValue } from './toSizingValue.js'\nimport { toTailDashed } from './toTailDashed.js'\nimport { toTokenizedValue } from './toTokenizedValue.js'\n\n/** Comma matcher outside rounded brackets. */\nconst comma = /\\s*,\\s*(?![^()]*\\))/\n\n/** Default toString method of Objects. */\nconst toStringOfObject = Object.prototype.toString\n\nexport const toCssRules = (style, selectors, conditions, config, onCssText) => {\n\t/** @type {[string[], string[], string[]]} CSSOM-compatible rule being created. */\n\tlet currentRule = undefined\n\n\t/** Last utility that was used, cached to prevent recursion. */\n\tlet lastUtil\n\n\t/** Last polyfill that was used, cached to prevent recursion. */\n\tlet lastPoly\n\n\t/** Walks CSS styles and converts them into CSSOM-compatible rules. */\n\tconst walk = (\n\t\t/** @type {Style} Set of CSS styles */ style,\n\t\t/** @type {string[]} Selectors that define the elements to which a set of CSS styles apply. */ selectors,\n\t\t/** @type {string[]} Conditions that define the queries to which a set of CSS styles apply. */ conditions,\n\t) => {\n\t\t/** @type {keyof style} Represents the left-side \"name\" for the property (the at-rule prelude, style-rule selector, or declaration name). */\n\t\tlet name\n\n\t\t/** @type {style[keyof style]} Represents the right-side \"data\" for the property (the rule block, or declaration value). */\n\t\tlet data\n\n\t\tconst each = (style) => {\n\t\t\tfor (name in style) {\n\t\t\t\t/** Whether the current name represents an at-rule. */\n\t\t\t\tconst isAtRuleLike = name.charCodeAt(0) === 64\n\n\t\t\t\tconst datas = isAtRuleLike && Array.isArray(style[name]) ? style[name] : [style[name]]\n\n\t\t\t\tfor (data of datas) {\n\t\t\t\t\tconst camelName = toCamelCase(name)\n\n\t\t\t\t\t/** Whether the current data represents a nesting rule, which is a plain object whose key is not already a util. */\n\t\t\t\t\tconst isRuleLike =\n\t\t\t\t\t\ttypeof data === 'object' &&\n\t\t\t\t\t\tdata &&\n\t\t\t\t\t\tdata.toString === toStringOfObject &&\n\t\t\t\t\t\t(!config.utils[camelName] || !selectors.length)\n\n\t\t\t\t\t// if the left-hand \"name\" matches a configured utility\n\t\t\t\t\t// conditionally transform the current data using the configured utility\n\t\t\t\t\tif (camelName in config.utils && !isRuleLike) {\n\t\t\t\t\t\tconst util = config.utils[camelName]\n\n\t\t\t\t\t\tif (util !== lastUtil) {\n\t\t\t\t\t\t\tlastUtil = util\n\n\t\t\t\t\t\t\teach(util(data))\n\n\t\t\t\t\t\t\tlastUtil = null\n\n\t\t\t\t\t\t\tcontinue\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t// otherwise, if the left-hand \"name\" matches a configured polyfill\n\t\t\t\t\t// conditionally transform the current data using the polyfill\n\t\t\t\t\telse if (camelName in toPolyfilledValue) {\n\t\t\t\t\t\tconst poly = toPolyfilledValue[camelName]\n\n\t\t\t\t\t\tif (poly !== lastPoly) {\n\t\t\t\t\t\t\tlastPoly = poly\n\n\t\t\t\t\t\t\teach(poly(data))\n\n\t\t\t\t\t\t\tlastPoly = null\n\n\t\t\t\t\t\t\tcontinue\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\t// if the left-hand \"name\" matches a configured at-rule\n\t\t\t\t\tif (isAtRuleLike) {\n\t\t\t\t\t\t// transform the current name with the configured media at-rule prelude\n\t\t\t\t\t\tname = toResolvedMediaQueryRanges(\n\t\t\t\t\t\t\tname.slice(1) in config.media ? '@media ' + config.media[name.slice(1)] : name,\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\n\t\t\t\t\tif (isRuleLike) {\n\t\t\t\t\t\t/** Next conditions, which may include one new condition (if this is an at-rule). */\n\t\t\t\t\t\tconst nextConditions = isAtRuleLike ? conditions.concat(name) : [...conditions]\n\n\t\t\t\t\t\t/** Next selectors, which may include one new selector (if this is not an at-rule). */\n\t\t\t\t\t\tconst nextSelections = isAtRuleLike ? [...selectors] : toResolvedSelectors(selectors, name.split(comma))\n\n\t\t\t\t\t\tif (currentRule !== undefined) {\n\t\t\t\t\t\t\tonCssText(toCssString(...currentRule))\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tcurrentRule = undefined\n\n\t\t\t\t\t\twalk(data, nextSelections, nextConditions)\n\t\t\t\t\t} else {\n\t\t\t\t\t\tif (currentRule === undefined) currentRule = [[], selectors, conditions]\n\n\t\t\t\t\t\t/** CSS left-hand side value, which may be a specially-formatted custom property. */\n\t\t\t\t\t\tname =\n\t\t\t\t\t\t\t!isAtRuleLike && name.charCodeAt(0) === 36\n\t\t\t\t\t\t\t\t? `--${toTailDashed(config.prefix)}${name.slice(1).replace(/\\$/g, '-')}`\n\t\t\t\t\t\t\t\t: name\n\n\t\t\t\t\t\t/** CSS right-hand side value, which may be a specially-formatted custom property. */\n\t\t\t\t\t\tdata =\n\t\t\t\t\t\t\t// preserve object-like data\n\t\t\t\t\t\t\tisRuleLike\n\t\t\t\t\t\t\t\t? data\n\t\t\t\t\t\t\t\t: // replace all non-unitless props that are not custom properties with pixel versions\n\t\t\t\t\t\t\t\t\ttypeof data === 'number'\n\t\t\t\t\t\t\t\t\t? data && !(camelName in unitlessProps) && !(name.charCodeAt(0) === 45)\n\t\t\t\t\t\t\t\t\t\t? String(data) + 'px'\n\t\t\t\t\t\t\t\t\t\t: String(data)\n\t\t\t\t\t\t\t\t\t: // replace tokens with stringified primitive values\n\t\t\t\t\t\t\t\t\t\ttoTokenizedValue(\n\t\t\t\t\t\t\t\t\t\t\ttoSizingValue(camelName, data == null ? '' : data),\n\t\t\t\t\t\t\t\t\t\t\tconfig.prefix,\n\t\t\t\t\t\t\t\t\t\t\tconfig.themeMap[camelName],\n\t\t\t\t\t\t\t\t\t\t)\n\n\t\t\t\t\t\tcurrentRule[0].push(`${isAtRuleLike ? `${name} ` : `${toHyphenCase(name)}:`}${data}`)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\teach(style)\n\n\t\tif (currentRule !== undefined) {\n\t\t\tonCssText(toCssString(...currentRule))\n\t\t}\n\t\tcurrentRule = undefined\n\t}\n\n\twalk(style, selectors, conditions)\n}\n\nconst toCssString = (declarations, selectors, conditions) =>\n\t`${conditions.map((condition) => `${condition}{`).join('')}${selectors.length ? `${selectors.join(',')}{` : ''}${declarations.join(';')}${selectors.length ? `}` : ''}${Array(conditions.length ? conditions.length + 1 : 0).join('}')}`\n\n/** CSS Properties whose number values should be unitless. */\nexport const unitlessProps = {\n\tanimationIterationCount: 1,\n\tborderImageOutset: 1,\n\tborderImageSlice: 1,\n\tborderImageWidth: 1,\n\tboxFlex: 1,\n\tboxFlexGroup: 1,\n\tboxOrdinalGroup: 1,\n\tcolumnCount: 1,\n\tcolumns: 1,\n\tflex: 1,\n\tflexGrow: 1,\n\tflexPositive: 1,\n\tflexShrink: 1,\n\tflexNegative: 1,\n\tflexOrder: 1,\n\tgridRow: 1,\n\tgridRowEnd: 1,\n\tgridRowSpan: 1,\n\tgridRowStart: 1,\n\tgridColumn: 1,\n\tgridColumnEnd: 1,\n\tgridColumnSpan: 1,\n\tgridColumnStart: 1,\n\tmsGridRow: 1,\n\tmsGridRowSpan: 1,\n\tmsGridColumn: 1,\n\tmsGridColumnSpan: 1,\n\tfontWeight: 1,\n\tlineHeight: 1,\n\topacity: 1,\n\torder: 1,\n\torphans: 1,\n\ttabSize: 1,\n\twidows: 1,\n\tzIndex: 1,\n\tzoom: 1,\n\tWebkitLineClamp: 1,\n\n\t// SVG-related properties\n\tfillOpacity: 1,\n\tfloodOpacity: 1,\n\tstopOpacity: 1,\n\tstrokeDasharray: 1,\n\tstrokeDashoffset: 1,\n\tstrokeMiterlimit: 1,\n\tstrokeOpacity: 1,\n\tstrokeWidth: 1,\n}\n", "const toAlphabeticChar = (/** @type {number} */ code) => String.fromCharCode(code + (code > 25 ? 39 : 97))\n\nconst toAlphabeticName = (/** @type {number} */ code) => {\n\tlet name = ''\n\tlet x\n\n\tfor (x = Math.abs(code); x > 52; x = (x / 52) | 0) name = toAlphabeticChar(x % 52) + name\n\n\treturn toAlphabeticChar(x % 52) + name\n}\n\nconst toPhash = (/** @type {number} */ h, /** @type {string} */ x) => {\n\tlet i = x.length\n\twhile (i) h = (h * 33) ^ x.charCodeAt(--i)\n\treturn h\n}\n\nexport const toHash = (/** @type {object} */ value) => toAlphabeticName(toPhash(5381, JSON.stringify(value)) >>> 0)\n", "export const getNonce = () => {\n\tif (typeof window.__webpack_nonce__ !== 'undefined') return window.__webpack_nonce__\n\tif (typeof window.nonce !== 'undefined') return window.nonce\n\treturn null\n}\n", "import { getNonce } from './utility/getNonce.js'\n\n/**\n * Rules in the sheet appear in this order:\n * 1. theme rules (themed)\n * 2. global rules (global)\n * 3. component rules (styled)\n * 4. non-responsive variants rules (onevar)\n * 5. responsive variants rules (resonevar)\n * 6. compound variants rules (allvar)\n * 7. inline rules (inline)\n */\n/** @type {RuleGroupNames} */\nexport const names = ['themed', 'global', 'styled', 'onevar', 'resonevar', 'allvar', 'inline']\n\nconst isSheetAccessible = (/** @type {CSSStyleSheet} */ sheet) => {\n\tif (sheet.href && !sheet.href.startsWith(location.origin)) {\n\t\treturn false\n\t}\n\n\ttry {\n\t\treturn !!sheet.cssRules\n\t} catch (e) {\n\t\treturn false\n\t}\n}\n\nexport const createSheet = (/** @type {DocumentOrShadowRoot} */ root) => {\n\t/** @type {SheetGroup} Object hosting the hydrated stylesheet. */\n\tlet groupSheet\n\n\tconst toString = () => {\n\t\tconst { cssRules } = groupSheet.sheet\n\t\treturn [].map\n\t\t\t.call(cssRules, (cssRule, cssRuleIndex) => {\n\t\t\t\tconst { cssText } = cssRule\n\n\t\t\t\tlet lastRuleCssText = ''\n\n\t\t\t\tif (cssText.startsWith('--sxs')) return ''\n\n\t\t\t\tif (cssRules[cssRuleIndex - 1] && (lastRuleCssText = cssRules[cssRuleIndex - 1].cssText).startsWith('--sxs')) {\n\t\t\t\t\tif (!cssRule.cssRules.length) return ''\n\n\t\t\t\t\tfor (const name in groupSheet.rules) {\n\t\t\t\t\t\tif (groupSheet.rules[name].group === cssRule) {\n\t\t\t\t\t\t\treturn `--sxs{--sxs:${[...groupSheet.rules[name].cache].join(' ')}}${cssText}`\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\n\t\t\t\t\treturn cssRule.cssRules.length ? `${lastRuleCssText}${cssText}` : ''\n\t\t\t\t}\n\n\t\t\t\treturn cssText\n\t\t\t})\n\t\t\t.join('')\n\t}\n\n\tconst reset = () => {\n\t\tif (groupSheet) {\n\t\t\tconst { rules, sheet } = groupSheet\n\n\t\t\tif (!sheet.deleteRule) {\n\t\t\t\twhile (Object(Object(sheet.cssRules)[0]).type === 3) sheet.cssRules.splice(0, 1)\n\n\t\t\t\tsheet.cssRules = []\n\t\t\t}\n\n\t\t\tfor (const groupName in rules) {\n\t\t\t\tdelete rules[groupName]\n\t\t\t}\n\t\t}\n\n\t\t/** @type {StyleSheetList} */\n\t\tconst sheets = Object(root).styleSheets || []\n\n\t\t// iterate all stylesheets until a hydratable stylesheet is found\n\t\tfor (const sheet of sheets) {\n\t\t\tif (!isSheetAccessible(sheet)) continue\n\n\t\t\tfor (let index = 0, rules = sheet.cssRules; rules[index]; ++index) {\n\t\t\t\t/** @type {CSSStyleRule} Possible indicator rule. */\n\t\t\t\tconst check = Object(rules[index])\n\n\t\t\t\t// a hydratable set of rules will start with a style rule (type: 1), ignore all others\n\t\t\t\tif (check.type !== 1) continue\n\n\t\t\t\t/** @type {CSSMediaRule} Possible styling group. */\n\t\t\t\tconst group = Object(rules[index + 1])\n\n\t\t\t\t// a hydratable set of rules will follow with a media rule (type: 4), ignore all others\n\t\t\t\tif (group.type !== 4) continue\n\n\t\t\t\t++index\n\n\t\t\t\tconst { cssText } = check\n\n\t\t\t\t// a hydratable style rule will have a selector of `--sxs`, ignore all others\n\t\t\t\tif (!cssText.startsWith('--sxs')) continue\n\n\t\t\t\tconst cache = cssText.slice(14, -3).trim().split(/\\s+/)\n\n\t\t\t\t/** @type {GroupName} Name of the group. */\n\t\t\t\tconst groupName = names[cache[0]]\n\n\t\t\t\t// a hydratable style rule will have a parsable group, ignore all others\n\t\t\t\tif (!groupName) continue\n\n\t\t\t\t// create a group sheet if one does not already exist\n\t\t\t\tif (!groupSheet) groupSheet = { sheet, reset, rules: {}, toString }\n\n\t\t\t\t// add the group to the group sheet\n\t\t\t\tgroupSheet.rules[groupName] = { group, index, cache: new Set(cache) }\n\t\t\t}\n\n\t\t\t// if a hydratable stylesheet is found, stop looking\n\t\t\tif (groupSheet) break\n\t\t}\n\n\t\t// if no hydratable stylesheet is found\n\t\tif (!groupSheet) {\n\t\t\tconst createCSSMediaRule = (/** @type {string} */ sourceCssText, type) => {\n\t\t\t\treturn /** @type {CSSMediaRule} */ ({\n\t\t\t\t\ttype,\n\t\t\t\t\tcssRules: [],\n\t\t\t\t\tinsertRule(cssText, index) {\n\t\t\t\t\t\tthis.cssRules.splice(\n\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t\tcreateCSSMediaRule(\n\t\t\t\t\t\t\t\tcssText,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\timport: 3,\n\t\t\t\t\t\t\t\t\tundefined: 1,\n\t\t\t\t\t\t\t\t}[(cssText.toLowerCase().match(/^@([a-z]+)/) || [])[1]] || 4,\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t)\n\t\t\t\t\t},\n\t\t\t\t\tget cssText() {\n\t\t\t\t\t\treturn sourceCssText === '@media{}'\n\t\t\t\t\t\t\t? `@media{${[].map.call(this.cssRules, (cssRule) => cssRule.cssText).join('')}}`\n\t\t\t\t\t\t\t: sourceCssText\n\t\t\t\t\t},\n\t\t\t\t})\n\t\t\t}\n\n\t\t\tconst createSheet = () => {\n\t\t\t\tif (!root) {\n\t\t\t\t\treturn createCSSMediaRule('', 'text/css')\n\t\t\t\t}\n\t\t\t\tconst styleEl = document.createElement('style')\n\t\t\t\tconst nonce = getNonce()\n\t\t\t\tif (nonce) {\n\t\t\t\t\tstyleEl.setAttribute('nonce', nonce)\n\t\t\t\t}\n\t\t\t\treturn (root.head || root).appendChild(styleEl).sheet\n\t\t\t}\n\n\t\t\tgroupSheet = {\n\t\t\t\tsheet: createSheet(),\n\t\t\t\trules: {},\n\t\t\t\treset,\n\t\t\t\ttoString,\n\t\t\t}\n\t\t}\n\n\t\tconst { sheet, rules } = groupSheet\n\t\tfor (let i = names.length - 1; i >= 0; --i) {\n\t\t\t// name of group on current index\n\t\t\tconst name = names[i]\n\t\t\tif (!rules[name]) {\n\t\t\t\t// name of prev group\n\t\t\t\tconst prevName = names[i + 1]\n\t\t\t\t// get the index of that prev group or else get the length of the whole sheet\n\t\t\t\tconst index = rules[prevName] ? rules[prevName].index : sheet.cssRules.length\n\t\t\t\t// insert the grouping & the sxs rule\n\t\t\t\tsheet.insertRule('@media{}', index)\n\t\t\t\tsheet.insertRule(`--sxs{--sxs:${i}}`, index)\n\t\t\t\t// add the group to the group sheet\n\t\t\t\trules[name] = { group: sheet.cssRules[index + 1], index, cache: new Set([i]) }\n\t\t\t}\n\t\t\taddApplyToGroup(rules[name])\n\t\t}\n\t}\n\n\treset()\n\n\treturn groupSheet\n}\n\nconst addApplyToGroup = (/** @type {RuleGroup} */ group) => {\n\tconst groupingRule = group.group\n\n\tlet index = groupingRule.cssRules.length\n\n\tgroup.apply = (cssText) => {\n\t\ttry {\n\t\t\tgroupingRule.insertRule(cssText, index)\n\n\t\t\t++index\n\t\t} catch (__) {\n\t\t\t// do nothing and continue\n\t\t}\n\t}\n}\n/** Pending rules for injection */\nconst $pr = Symbol()\n\n/**\n * When a stitches component is extending some other random react component,\n * it\u2019s gonna create a react component (Injector) using this function and then render it after the children,\n * this way, we would force the styles of the wrapper to be injected after the wrapped component\n */\nexport const createRulesInjectionDeferrer = (globalSheet) => {\n\t// the injection deferrer\n\tfunction injector() {\n\t\tfor (let i = 0; i < injector[$pr].length; i++) {\n\t\t\tconst [sheet, cssString] = injector[$pr][i]\n\t\t\tglobalSheet.rules[sheet].apply(cssString)\n\t\t}\n\t\tinjector[$pr] = []\n\t\treturn null\n\t}\n\t// private prop to store pending rules\n\tinjector[$pr] = []\n\t// mocking the rules.apply api used on the sheet\n\tinjector.rules = {}\n\t// creating the apply methods under rules[something]\n\tnames.forEach((sheetName) => (injector.rules[sheetName] = { apply: (rule) => injector[$pr].push([sheetName, rule]) }))\n\treturn injector\n}\n", "import { internal } from '../utility/internal.js'\nimport { createMemo } from '../utility/createMemo.js'\nimport { define } from '../utility/define.js'\nimport { hasNames } from '../utility/hasNames.js'\nimport { hasOwn } from '../utility/hasOwn.js'\n\nimport { toCssRules } from '../convert/toCssRules.js'\nimport { toHash } from '../convert/toHash.js'\nimport { toTailDashed } from '../convert/toTailDashed.js'\nimport { createRulesInjectionDeferrer } from '../sheet.js'\n\nconst createCssFunctionMap = createMemo()\n\n/** Returns a function that applies component styles. */\nexport const createCssFunction = (config, sheet) =>\n\tcreateCssFunctionMap(config, () => {\n\t\tconst _css = (args, componentConfig = {}) => {\n\t\t\tlet internals = {\n\t\t\t\ttype: null,\n\t\t\t\tcomposers: new Set(),\n\t\t\t}\n\n\t\t\tfor (const arg of args) {\n\t\t\t\t// skip any void argument\n\t\t\t\tif (arg == null) continue\n\n\t\t\t\t// conditionally extend the component\n\t\t\t\tif (arg[internal]) {\n\t\t\t\t\tif (internals.type == null) internals.type = arg[internal].type\n\n\t\t\t\t\tfor (const composer of arg[internal].composers) {\n\t\t\t\t\t\tinternals.composers.add(composer)\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\t// otherwise, conditionally define the component type\n\t\t\t\telse if (arg.constructor !== Object || arg.$$typeof) {\n\t\t\t\t\tif (internals.type == null) internals.type = arg\n\t\t\t\t}\n\n\t\t\t\t// otherwise, add a new composer to this component\n\t\t\t\telse {\n\t\t\t\t\tinternals.composers.add(createComposer(arg, config, componentConfig))\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// set the component type if none was set\n\t\t\tif (internals.type == null) internals.type = 'span'\n\t\t\tif (!internals.composers.size) internals.composers.add(['PJLV', {}, [], [], {}, []])\n\n\t\t\treturn createRenderer(config, internals, sheet, componentConfig)\n\t\t}\n\n\t\tconst css = (...args) => _css(args)\n\n\t\tcss.withConfig =\n\t\t\t(componentConfig) =>\n\t\t\t(...args) =>\n\t\t\t\t_css(args, componentConfig)\n\n\t\treturn css\n\t})\n\n/** Creates a composer from a configuration object. */\nconst createComposer = (\n\t{\n\t\tvariants: initSingularVariants,\n\t\tcompoundVariants: initCompoundVariants,\n\t\tdefaultVariants: initDefaultVariants,\n\t\t...style\n\t},\n\tconfig,\n\t{ componentId, displayName },\n) => {\n\t/** @type {string} Composer Unique Identifier. @see `{CONFIG_PREFIX}-?c-{STYLE_HASH}` */\n\tconst hash = componentId || toHash(style)\n\tconst componentNamePrefix = displayName ? 'c-' + displayName + '' : 'c'\n\tconst className = `${toTailDashed(config.prefix)}${componentNamePrefix}-${hash}`\n\n\tconst singularVariants = []\n\n\tconst compoundVariants = []\n\n\tconst prefilledVariants = Object.create(null)\n\n\tconst undefinedVariants = []\n\n\tfor (const variantName in initDefaultVariants) {\n\t\tprefilledVariants[variantName] = String(initDefaultVariants[variantName])\n\t}\n\n\t// add singular variants\n\tif (typeof initSingularVariants === 'object' && initSingularVariants) {\n\t\tfor (const name in initSingularVariants) {\n\t\t\tif (!hasOwn(prefilledVariants, name)) prefilledVariants[name] = 'undefined'\n\n\t\t\tconst variantPairs = initSingularVariants[name]\n\n\t\t\tfor (const pair in variantPairs) {\n\t\t\t\tconst vMatch = { [name]: String(pair) }\n\n\t\t\t\tif (String(pair) === 'undefined') undefinedVariants.push(name)\n\n\t\t\t\tconst vStyle = variantPairs[pair]\n\n\t\t\t\tconst variant = [vMatch, vStyle, !hasNames(vStyle)]\n\n\t\t\t\tsingularVariants.push(variant)\n\t\t\t}\n\t\t}\n\t}\n\n\t// add compound variants\n\tif (typeof initCompoundVariants === 'object' && initCompoundVariants) {\n\t\tfor (const compoundVariant of initCompoundVariants) {\n\t\t\tlet { css: vStyle, ...vMatch } = compoundVariant\n\n\t\t\tvStyle = (typeof vStyle === 'object' && vStyle) || {}\n\n\t\t\t// serialize all compound variant pairs\n\t\t\tfor (const name in vMatch) vMatch[name] = String(vMatch[name])\n\n\t\t\tconst variant = [vMatch, vStyle, !hasNames(vStyle)]\n\n\t\t\tcompoundVariants.push(variant)\n\t\t}\n\t}\n\n\treturn [className, style, singularVariants, compoundVariants, prefilledVariants, undefinedVariants]\n}\n\nconst createRenderer = (config, internals, sheet, { shouldForwardStitchesProp }) => {\n\tconst [baseClassName, baseClassNames, prefilledVariants, undefinedVariants] = getPreparedDataFromComposers(\n\t\tinternals.composers,\n\t)\n\n\tconst deferredInjector =\n\t\ttypeof internals.type === 'function' || !!internals.type.$$typeof ? createRulesInjectionDeferrer(sheet) : null\n\tconst injectionTarget = (deferredInjector || sheet).rules\n\n\tconst selector = `.${baseClassName}${baseClassNames.length > 1 ? `:where(.${baseClassNames.slice(1).join('.')})` : ``}`\n\n\tconst render = (props) => {\n\t\tprops = (typeof props === 'object' && props) || empty\n\n\t\t// 1. we cannot mutate `props`\n\t\t// 2. we delete variant props\n\t\t// 3. we delete `css` prop\n\t\t// therefore: we must create a new props & css variables\n\t\tconst { ...forwardProps } = props\n\n\t\tconst variantProps = {}\n\n\t\tfor (const name in prefilledVariants) {\n\t\t\tif (name in props) {\n\t\t\t\tif (!shouldForwardStitchesProp?.(name)) delete forwardProps[name]\n\t\t\t\tlet data = props[name]\n\n\t\t\t\tif (typeof data === 'object' && data) {\n\t\t\t\t\tvariantProps[name] = {\n\t\t\t\t\t\t'@initial': prefilledVariants[name],\n\t\t\t\t\t\t...data,\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tdata = String(data)\n\n\t\t\t\t\tvariantProps[name] = data === 'undefined' && !undefinedVariants.has(name) ? prefilledVariants[name] : data\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tvariantProps[name] = prefilledVariants[name]\n\t\t\t}\n\t\t}\n\n\t\tconst classSet = new Set([...baseClassNames])\n\n\t\t// 1. builds up the variants (fills in defaults, calculates @initial on responsive, etc.)\n\t\t// 2. iterates composers\n\t\t// 2.1. add their base class\n\t\t// 2.2. iterate their variants, add their variant classes\n\t\t// 2.2.1. orders regular variants before responsive variants\n\t\t// 2.3. iterate their compound variants, add their compound variant classes\n\n\t\tfor (const [composerBaseClass, composerBaseStyle, singularVariants, compoundVariants] of internals.composers) {\n\t\t\tif (!sheet.rules.styled.cache.has(composerBaseClass)) {\n\t\t\t\tsheet.rules.styled.cache.add(composerBaseClass)\n\n\t\t\t\ttoCssRules(composerBaseStyle, [`.${composerBaseClass}`], [], config, (cssText) => {\n\t\t\t\t\tinjectionTarget.styled.apply(cssText)\n\t\t\t\t})\n\t\t\t}\n\n\t\t\tconst singularVariantsToAdd = getTargetVariantsToAdd(singularVariants, variantProps, config.media)\n\t\t\tconst compoundVariantsToAdd = getTargetVariantsToAdd(compoundVariants, variantProps, config.media, true)\n\n\t\t\tfor (const variantToAdd of singularVariantsToAdd) {\n\t\t\t\tif (variantToAdd === undefined) continue\n\n\t\t\t\tfor (const [vClass, vStyle, isResponsive] of variantToAdd) {\n\t\t\t\t\tconst variantClassName = `${composerBaseClass}-${toHash(vStyle)}-${vClass}`\n\n\t\t\t\t\tclassSet.add(variantClassName)\n\n\t\t\t\t\tconst groupCache = (isResponsive ? sheet.rules.resonevar : sheet.rules.onevar).cache\n\t\t\t\t\t/*\n\t\t\t\t\t * make sure that normal variants are injected before responsive ones\n\t\t\t\t\t * @see {@link https://github.com/stitchesjs/stitches/issues/737|github}\n\t\t\t\t\t */\n\t\t\t\t\tconst targetInjectionGroup = isResponsive ? injectionTarget.resonevar : injectionTarget.onevar\n\n\t\t\t\t\tif (!groupCache.has(variantClassName)) {\n\t\t\t\t\t\tgroupCache.add(variantClassName)\n\t\t\t\t\t\ttoCssRules(vStyle, [`.${variantClassName}`], [], config, (cssText) => {\n\t\t\t\t\t\t\ttargetInjectionGroup.apply(cssText)\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tfor (const variantToAdd of compoundVariantsToAdd) {\n\t\t\t\tif (variantToAdd === undefined) continue\n\n\t\t\t\tfor (const [vClass, vStyle] of variantToAdd) {\n\t\t\t\t\tconst variantClassName = `${composerBaseClass}-${toHash(vStyle)}-${vClass}`\n\n\t\t\t\t\tclassSet.add(variantClassName)\n\n\t\t\t\t\tif (!sheet.rules.allvar.cache.has(variantClassName)) {\n\t\t\t\t\t\tsheet.rules.allvar.cache.add(variantClassName)\n\n\t\t\t\t\t\ttoCssRules(vStyle, [`.${variantClassName}`], [], config, (cssText) => {\n\t\t\t\t\t\t\tinjectionTarget.allvar.apply(cssText)\n\t\t\t\t\t\t})\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// apply css property styles\n\t\tconst css = forwardProps.css\n\t\tif (typeof css === 'object' && css) {\n\t\t\tif (!shouldForwardStitchesProp?.('css')) delete forwardProps.css\n\t\t\t/** @type {string} Inline Class Unique Identifier. @see `{COMPOSER_UUID}-i{VARIANT_UUID}-css` */\n\t\t\tconst iClass = `${baseClassName}-i${toHash(css)}-css`\n\n\t\t\tclassSet.add(iClass)\n\n\t\t\tif (!sheet.rules.inline.cache.has(iClass)) {\n\t\t\t\tsheet.rules.inline.cache.add(iClass)\n\n\t\t\t\ttoCssRules(css, [`.${iClass}`], [], config, (cssText) => {\n\t\t\t\t\tinjectionTarget.inline.apply(cssText)\n\t\t\t\t})\n\t\t\t}\n\t\t}\n\n\t\tfor (const propClassName of String(props.className || '')\n\t\t\t.trim()\n\t\t\t.split(/\\s+/)) {\n\t\t\tif (propClassName) classSet.add(propClassName)\n\t\t}\n\n\t\tconst renderedClassName = (forwardProps.className = [...classSet].join(' '))\n\n\t\tconst renderedToString = () => renderedClassName\n\n\t\treturn {\n\t\t\ttype: internals.type,\n\t\t\tclassName: renderedClassName,\n\t\t\tselector,\n\t\t\tprops: forwardProps,\n\t\t\ttoString: renderedToString,\n\t\t\tdeferredInjector,\n\t\t}\n\t}\n\n\tconst toString = () => {\n\t\tif (!sheet.rules.styled.cache.has(baseClassName)) render()\n\n\t\treturn baseClassName\n\t}\n\n\treturn define(render, {\n\t\tclassName: baseClassName,\n\t\tselector,\n\t\t[internal]: internals,\n\t\ttoString,\n\t})\n}\n\n/** Returns useful data that can be known before rendering. */\nconst getPreparedDataFromComposers = (composers) => {\n\t/** Class name of the first composer. */\n\tlet baseClassName = ''\n\n\t/** @type {string[]} Combined class names for all composers. */\n\tconst baseClassNames = []\n\n\t/** @type {PrefilledVariants} Combined variant pairings for all composers. */\n\tconst combinedPrefilledVariants = {}\n\n\t/** @type {UndefinedVariants} List of variant names that can have an \"undefined\" pairing. */\n\tconst combinedUndefinedVariants = []\n\n\tfor (const [className, , , , prefilledVariants, undefinedVariants] of composers) {\n\t\tif (baseClassName === '') baseClassName = className\n\n\t\tbaseClassNames.push(className)\n\n\t\tcombinedUndefinedVariants.push(...undefinedVariants)\n\n\t\tfor (const name in prefilledVariants) {\n\t\t\tconst data = prefilledVariants[name]\n\t\t\tif (combinedPrefilledVariants[name] === undefined || data !== 'undefined' || undefinedVariants.includes(data))\n\t\t\t\tcombinedPrefilledVariants[name] = data\n\t\t}\n\t}\n\n\tconst preparedData = [baseClassName, baseClassNames, combinedPrefilledVariants, new Set(combinedUndefinedVariants)]\n\n\treturn preparedData\n}\n\nconst getTargetVariantsToAdd = (targetVariants, variantProps, media, isCompoundVariant) => {\n\tconst targetVariantsToAdd = []\n\n\ttargetVariants: for (let [vMatch, vStyle, vEmpty] of targetVariants) {\n\t\t// skip empty variants\n\t\tif (vEmpty) continue\n\n\t\t/** Position the variant should be inserted into. */\n\t\tlet vOrder = 0\n\n\t\tlet vName\n\n\t\tlet isResponsive = false\n\t\tfor (vName in vMatch) {\n\t\t\tconst vPair = vMatch[vName]\n\n\t\t\tlet pPair = variantProps[vName]\n\n\t\t\t// exact matches\n\t\t\tif (pPair === vPair) continue\n\t\t\t// responsive matches\n\t\t\telse if (typeof pPair === 'object' && pPair) {\n\t\t\t\t/** @type {boolean} Whether the responsive variant is matched. */\n\t\t\t\tlet didMatch\n\n\t\t\t\tlet qOrder = 0\n\t\t\t\t// media queries matching the same variant\n\t\t\t\tlet matchedQueries\n\t\t\t\tfor (const query in pPair) {\n\t\t\t\t\tif (vPair === String(pPair[query])) {\n\t\t\t\t\t\tif (query !== '@initial') {\n\t\t\t\t\t\t\t// check if the cleanQuery is in the media config and then we push the resulting media query to the matchedQueries array,\n\t\t\t\t\t\t\t// if not, we remove the @media from the beginning and push it to the matched queries which then will be resolved a few lines down\n\t\t\t\t\t\t\t// when we finish working on this variant and want wrap the vStyles with the matchedQueries\n\t\t\t\t\t\t\tconst cleanQuery = query.slice(1)\n\t\t\t\t\t\t\t;(matchedQueries = matchedQueries || []).push(\n\t\t\t\t\t\t\t\tcleanQuery in media ? media[cleanQuery] : query.replace(/^@media ?/, ''),\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\tisResponsive = true\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tvOrder += qOrder\n\t\t\t\t\t\tdidMatch = true\n\t\t\t\t\t}\n\n\t\t\t\t\t++qOrder\n\t\t\t\t}\n\t\t\t\tif (matchedQueries && matchedQueries.length) {\n\t\t\t\t\tvStyle = {\n\t\t\t\t\t\t['@media ' + matchedQueries.join(', ')]: vStyle,\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (!didMatch) continue targetVariants\n\t\t\t}\n\n\t\t\t// non-matches\n\t\t\telse continue targetVariants\n\t\t}\n\t\t;(targetVariantsToAdd[vOrder] = targetVariantsToAdd[vOrder] || []).push([\n\t\t\tisCompoundVariant ? `cv` : `${vName}-${vMatch[vName]}`,\n\t\t\tvStyle,\n\t\t\tisResponsive,\n\t\t])\n\t}\n\n\treturn targetVariantsToAdd\n}\n\n/** Fallback props object used when no props are passed. */\nconst empty = {}\n", "import { createMemo } from '../utility/createMemo.js'\nimport { define } from '../utility/define.js'\n\nimport { toCssRules } from '../convert/toCssRules.js'\nimport { toHash } from '../convert/toHash.js'\n\nconst createGlobalCssFunctionMap = createMemo()\n\n/** Returns a function that applies global styles. */\nexport const createGlobalCssFunction = (config, sheet) =>\n\tcreateGlobalCssFunctionMap(config, () => (...styles) => {\n\t\tconst render = () => {\n\t\t\tfor (let style of styles) {\n\t\t\t\tstyle = (typeof style === 'object' && style) || {}\n\n\t\t\t\tlet uuid = toHash(style)\n\n\t\t\t\tif (!sheet.rules.global.cache.has(uuid)) {\n\t\t\t\t\tsheet.rules.global.cache.add(uuid)\n\n\t\t\t\t\t// support @import rules\n\t\t\t\t\tif ('@import' in style) {\n\t\t\t\t\t\tlet importIndex = [].indexOf.call(sheet.sheet.cssRules, sheet.rules.themed.group) - 1\n\n\t\t\t\t\t\t// wrap import in quotes as a convenience\n\t\t\t\t\t\tfor (let importValue of /** @type {string[]} */ ([].concat(style['@import']))) {\n\t\t\t\t\t\t\timportValue = importValue.includes('\"') || importValue.includes(\"'\") ? importValue : `\"${importValue}\"`\n\n\t\t\t\t\t\t\tsheet.sheet.insertRule(`@import ${importValue};`, importIndex++)\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tdelete style['@import']\n\t\t\t\t\t}\n\n\t\t\t\t\ttoCssRules(style, [], [], config, (cssText) => {\n\t\t\t\t\t\tsheet.rules.global.apply(cssText)\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\n\t\t\treturn ''\n\t\t}\n\n\t\treturn define(render, {\n\t\t\ttoString: render,\n\t\t})\n\t})\n", "import { createMemo } from '../utility/createMemo.js'\nimport { define } from '../utility/define.js'\n\nimport { toCssRules } from '../convert/toCssRules.js'\nimport { toHash } from '../convert/toHash.js'\nimport { toTailDashed } from '../convert/toTailDashed.js'\n\n/** @typedef {import('..').Config} Config */\n/** @typedef {import('..').Style} Style */\n/** @typedef {import('..').GroupSheet} GroupSheet */\n\nconst createKeyframesFunctionMap = createMemo()\n\n/** Returns a function that applies a keyframes rule. */\nexport const createKeyframesFunction = (/** @type {Config} */ config, /** @type {GroupSheet} */ sheet) =>\n\tcreateKeyframesFunctionMap(config, () => (style) => {\n\t\t/** @type {string} Keyframes Unique Identifier. @see `{CONFIG_PREFIX}-?k-{KEYFRAME_UUID}` */\n\t\tconst name = `${toTailDashed(config.prefix)}k-${toHash(style)}`\n\n\t\tconst render = () => {\n\t\t\tif (!sheet.rules.global.cache.has(name)) {\n\t\t\t\tsheet.rules.global.cache.add(name)\n\n\t\t\t\tconst cssRules = []\n\n\t\t\t\ttoCssRules(style, [], [], config, (cssText) => cssRules.push(cssText))\n\n\t\t\t\tconst cssText = `@keyframes ${name}{${cssRules.join('')}}`\n\n\t\t\t\tsheet.rules.global.apply(cssText)\n\t\t\t}\n\n\t\t\treturn name\n\t\t}\n\n\t\treturn define(render, {\n\t\t\tget name() {\n\t\t\t\treturn render()\n\t\t\t},\n\t\t\ttoString: render,\n\t\t})\n\t})\n", "import { toTailDashed } from './convert/toTailDashed.js'\n\nexport class ThemeToken {\n\tconstructor(token, value, scale, prefix) {\n\t\tthis.token = token == null ? '' : String(token)\n\t\tthis.value = value == null ? '' : String(value)\n\t\tthis.scale = scale == null ? '' : String(scale)\n\t\tthis.prefix = prefix == null ? '' : String(prefix)\n\t}\n\n\tget computedValue() {\n\t\treturn 'var(' + this.variable + ')'\n\t}\n\n\tget variable() {\n\t\treturn '--' + toTailDashed(this.prefix) + toTailDashed(this.scale) + this.token\n\t}\n\n\ttoString() {\n\t\treturn this.computedValue\n\t}\n}\n", "import { ThemeToken } from '../ThemeToken.js'\nimport { createMemo } from '../utility/createMemo.js'\n\nimport { toHash } from '../convert/toHash.js'\nimport { t