@traefik-labs/faency 12.2.1 → 12.2.3

package/dist/styles/cssProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"cssProps.js","sources":["../../styles/cssProps.ts"],"sourcesContent":["import { FlexAlign, FlexJustify, SizeToken, SpacingToken } from './types';\n\nexport interface CSSProps {\n  css?: {\n    p?: SpacingToken;\n    pt?: SpacingToken;\n    pr?: SpacingToken;\n    pb?: SpacingToken;\n    pl?: SpacingToken;\n    px?: SpacingToken;\n    py?: SpacingToken;\n\n    m?: SpacingToken;\n    mt?: SpacingToken;\n    mr?: SpacingToken;\n    mb?: SpacingToken;\n    ml?: SpacingToken;\n    mx?: SpacingToken;\n    my?: SpacingToken;\n\n    ta?: 'left' | 'center' | 'right' | 'justify';\n    fd?: 'row' | 'column' | 'row-reverse' | 'column-reverse';\n    fw?: 'wrap' | 'nowrap' | 'wrap-reverse';\n    ai?: FlexAlign;\n    ac?: FlexAlign | 'space-between' | 'space-around' | 'space-evenly';\n    jc?: FlexJustify;\n    as?: 'auto' | FlexAlign;\n    fg?: 0 | 1;\n    fs?: 0 | 1;\n    fb?: SizeToken;\n\n    bc?: string;\n    br?: string;\n    btrr?: string;\n    bbrr?: string;\n    bblr?: string;\n    btlr?: string;\n    bs?: string;\n    c?: string;\n\n    width?: SizeToken;\n    height?: SizeToken;\n    size?: SizeToken;\n\n    ox?: 'visible' | 'hidden' | 'scroll' | 'auto';\n    oy?: 'visible' | 'hidden' | 'scroll' | 'auto';\n\n    pe?: 'auto' | 'none' | 'all';\n    us?: 'none' | 'auto' | 'text' | 'contain' | 'all';\n\n    fontSize?: string;\n    fontWeight?: string;\n    lh?: string | number;\n\n    [key: string]: any;\n  };\n}\n\n// HELPERS\nfunction processToken(value: string): string {\n  return value.startsWith('$') ? value.slice(1) : value;\n}\n\nfunction getSpaceValue(key: string): string {\n  const spaceMap: Record<string, string> = {\n    '1': '4px',\n    '2': '8px',\n    '3': '16px',\n    '4': '20px',\n    '5': '24px',\n    '6': '32px',\n    '7': '48px',\n    '8': '64px',\n    '9': '80px',\n  };\n  return spaceMap[key] || '0px';\n}\n\nfunction getSizeValue(key: string): string {\n  const sizeMap: Record<string, string> = {\n    '1': '4px',\n    '2': '8px',\n    '3': '16px',\n    '4': '20px',\n    '5': '24px',\n    '6': '32px',\n    '7': '40px',\n    '8': '48px',\n    '9': '64px',\n    '10': '80px',\n  };\n  return sizeMap[key] || key;\n}\n\nfunction getRadiiValue(key: string): string {\n  const radiiMap: Record<string, string> = {\n    '1': '4px',\n    '2': '6px',\n    '3': '8px',\n    '4': '12px',\n    round: '50%',\n    pill: '9999px',\n  };\n  return radiiMap[key] || '0px';\n}\n\nfunction getFontSizeValue(key: string): string {\n  const fontSizeMap: Record<string, string> = {\n    '0': '11px',\n    '1': '12px',\n    '2': '13px',\n    '3': '14px',\n    '4': '16px',\n    '5': '18px',\n    '6': '20px',\n    '7': '22px',\n    '8': '24px',\n    '9': '26px',\n    '10': '28px',\n    '11': '32px',\n    '12': '38px',\n  };\n  return fontSizeMap[key] || '16px';\n}\n\nfunction getFontWeightValue(key: string): string {\n  const fontWeightMap: Record<string, string> = {\n    light: '300',\n    regular: '400',\n    medium: '500',\n    semiBold: '600',\n    bold: '700',\n  };\n  return fontWeightMap[key] || '400';\n}\n\nfunction applySpacing(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const tokenValue = processToken(value);\n    const spaceValue = getSpaceValue(tokenValue);\n    if (spaceValue !== '0px') {\n      (style as any)[property] = spaceValue;\n    }\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\nfunction applyRadii(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const tokenValue = processToken(value);\n    const radiiValue = getRadiiValue(tokenValue);\n    if (radiiValue !== '0px') {\n      (style as any)[property] = radiiValue;\n    }\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\nfunction applyColor(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n  colors?: Record<string, any>,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const colorToken = value.slice(1);\n    if (colors && colorToken in colors) {\n      (style as any)[property] = colors[colorToken];\n    } else {\n      (style as any)[property] = value;\n    }\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\nfunction applySize(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const tokenValue = processToken(value);\n    const sizeValue = getSizeValue(tokenValue);\n    (style as any)[property] = sizeValue;\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\n// CSS PROCESSOR\nexport function processCSSProp(\n  css: CSSProps['css'] = {},\n  colors?: Record<string, any>,\n): {\n  style: React.CSSProperties;\n  vars: Record<string, string>;\n} {\n  const style: React.CSSProperties = {};\n  const vars: Record<string, string> = {};\n\n  Object.entries(css).forEach(([key, value]) => {\n    switch (key) {\n      case 'p':\n      case 'padding':\n        applySpacing(style, 'padding', value);\n        break;\n      case 'pt':\n      case 'paddingTop':\n        applySpacing(style, 'paddingTop', value);\n        break;\n      case 'pr':\n      case 'paddingRight':\n        applySpacing(style, 'paddingRight', value);\n        break;\n      case 'pb':\n      case 'paddingBottom':\n        applySpacing(style, 'paddingBottom', value);\n        break;\n      case 'pl':\n      case 'paddingLeft':\n        applySpacing(style, 'paddingLeft', value);\n        break;\n      case 'px':\n        applySpacing(style, 'paddingLeft', value);\n        applySpacing(style, 'paddingRight', value);\n        break;\n      case 'py':\n        applySpacing(style, 'paddingTop', value);\n        applySpacing(style, 'paddingBottom', value);\n        break;\n\n      case 'm':\n      case 'margin':\n        applySpacing(style, 'margin', value);\n        break;\n      case 'mt':\n      case 'marginTop':\n        applySpacing(style, 'marginTop', value);\n        break;\n      case 'mr':\n      case 'marginRight':\n        applySpacing(style, 'marginRight', value);\n        break;\n      case 'mb':\n      case 'marginBottom':\n        applySpacing(style, 'marginBottom', value);\n        break;\n      case 'ml':\n      case 'marginLeft':\n        applySpacing(style, 'marginLeft', value);\n        break;\n      case 'mx':\n        applySpacing(style, 'marginLeft', value);\n        applySpacing(style, 'marginRight', value);\n        break;\n      case 'my':\n        applySpacing(style, 'marginTop', value);\n        applySpacing(style, 'marginBottom', value);\n        break;\n\n      case 'ta':\n        style.textAlign = value as React.CSSProperties['textAlign'];\n        break;\n      case 'fd':\n        style.flexDirection = value as React.CSSProperties['flexDirection'];\n        break;\n      case 'fw':\n        style.flexWrap = value as React.CSSProperties['flexWrap'];\n        break;\n      case 'ai':\n        style.alignItems = value as React.CSSProperties['alignItems'];\n        break;\n      case 'ac':\n        style.alignContent = value as React.CSSProperties['alignContent'];\n        break;\n      case 'jc':\n        style.justifyContent = value as React.CSSProperties['justifyContent'];\n        break;\n      case 'as':\n        style.alignSelf = value as React.CSSProperties['alignSelf'];\n        break;\n      case 'fg':\n        style.flexGrow = value;\n        break;\n      case 'fs':\n        style.flexShrink = value;\n        break;\n      case 'fb':\n        applySize(style, 'flexBasis', value);\n        break;\n\n      case 'bc':\n      case 'backgroundColor':\n        applyColor(style, 'backgroundColor', value, colors);\n        break;\n      case 'br':\n      case 'borderRadius':\n        applyRadii(style, 'borderRadius', value);\n        break;\n      case 'btrr':\n      case 'borderTopRightRadius':\n        applyRadii(style, 'borderTopRightRadius', value);\n        break;\n      case 'bbrr':\n      case 'borderBottomRightRadius':\n        applyRadii(style, 'borderBottomRightRadius', value);\n        break;\n      case 'bblr':\n      case 'borderBottomLeftRadius':\n        applyRadii(style, 'borderBottomLeftRadius', value);\n        break;\n      case 'btlr':\n      case 'borderTopLeftRadius':\n        applyRadii(style, 'borderTopLeftRadius', value);\n        break;\n      case 'bs':\n      case 'boxShadow':\n        style.boxShadow = value;\n        break;\n      case 'c':\n      case 'color':\n        applyColor(style, 'color', value, colors);\n        break;\n\n      case 'fontSize':\n        if (typeof value === 'string') {\n          const fontSizeValue = getFontSizeValue(value);\n          if (fontSizeValue !== '16px') {\n            style.fontSize = fontSizeValue;\n          }\n        }\n        break;\n      case 'fontWeight':\n        if (typeof value === 'string') {\n          const fontWeightValue = getFontWeightValue(value);\n          if (fontWeightValue !== '400') {\n            style.fontWeight = fontWeightValue;\n          }\n        }\n        break;\n      case 'lh':\n        style.lineHeight = value;\n        break;\n\n      case 'width':\n      case 'w':\n        applySize(style, 'width', value);\n        break;\n      case 'height':\n      case 'h':\n        applySize(style, 'height', value);\n        break;\n\n      case 'size':\n        applySize(style, 'width', value);\n        applySize(style, 'height', value);\n        break;\n\n      case 'ox':\n        style.overflowX = value as React.CSSProperties['overflowX'];\n        break;\n      case 'oy':\n        style.overflowY = value as React.CSSProperties['overflowY'];\n        break;\n\n      case 'pe':\n        style.pointerEvents = value as React.CSSProperties['pointerEvents'];\n        break;\n      case 'us':\n        style.userSelect = value as React.CSSProperties['userSelect'];\n        break;\n\n      default:\n        // Handle token syntax for any property that falls through to default\n        if (typeof value === 'string' && value.startsWith('$')) {\n          const tokenValue = processToken(value);\n\n          // Try spacing tokens first (most common for gap, etc)\n          const spaceValue = getSpaceValue(tokenValue);\n          if (spaceValue !== '0px') {\n            (style as any)[key] = spaceValue;\n            break;\n          }\n\n          // Try size tokens\n          const sizeValue = getSizeValue(tokenValue);\n          if (sizeValue !== tokenValue) {\n            (style as any)[key] = sizeValue;\n            break;\n          }\n\n          // Try radii tokens\n          const radiiValue = getRadiiValue(tokenValue);\n          if (radiiValue !== '0px') {\n            (style as any)[key] = radiiValue;\n            break;\n          }\n\n          // Try color tokens\n          if (colors && tokenValue in colors) {\n            (style as any)[key] = colors[tokenValue];\n            break;\n          }\n\n          // If no token matches, pass through as-is\n          (style as any)[key] = value;\n        } else {\n          (style as any)[key] = value;\n        }\n        break;\n    }\n  });\n\n  return { style, vars };\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cssProps.js","names":[],"sources":["../../styles/cssProps.ts"],"sourcesContent":["import { FlexAlign, FlexJustify, SizeToken, SpacingToken } from './types';\n\nexport interface CSSProps {\n  css?: {\n    p?: SpacingToken;\n    pt?: SpacingToken;\n    pr?: SpacingToken;\n    pb?: SpacingToken;\n    pl?: SpacingToken;\n    px?: SpacingToken;\n    py?: SpacingToken;\n\n    m?: SpacingToken;\n    mt?: SpacingToken;\n    mr?: SpacingToken;\n    mb?: SpacingToken;\n    ml?: SpacingToken;\n    mx?: SpacingToken;\n    my?: SpacingToken;\n\n    ta?: 'left' | 'center' | 'right' | 'justify';\n    fd?: 'row' | 'column' | 'row-reverse' | 'column-reverse';\n    fw?: 'wrap' | 'nowrap' | 'wrap-reverse';\n    ai?: FlexAlign;\n    ac?: FlexAlign | 'space-between' | 'space-around' | 'space-evenly';\n    jc?: FlexJustify;\n    as?: 'auto' | FlexAlign;\n    fg?: 0 | 1;\n    fs?: 0 | 1;\n    fb?: SizeToken;\n\n    bc?: string;\n    br?: string;\n    btrr?: string;\n    bbrr?: string;\n    bblr?: string;\n    btlr?: string;\n    bs?: string;\n    c?: string;\n\n    width?: SizeToken;\n    height?: SizeToken;\n    size?: SizeToken;\n\n    ox?: 'visible' | 'hidden' | 'scroll' | 'auto';\n    oy?: 'visible' | 'hidden' | 'scroll' | 'auto';\n\n    pe?: 'auto' | 'none' | 'all';\n    us?: 'none' | 'auto' | 'text' | 'contain' | 'all';\n\n    fontSize?: string;\n    fontWeight?: string;\n    lh?: string | number;\n\n    [key: string]: any;\n  };\n}\n\n// HELPERS\nfunction processToken(value: string): string {\n  return value.startsWith('$') ? value.slice(1) : value;\n}\n\nfunction getSpaceValue(key: string): string {\n  const spaceMap: Record<string, string> = {\n    '1': '4px',\n    '2': '8px',\n    '3': '16px',\n    '4': '20px',\n    '5': '24px',\n    '6': '32px',\n    '7': '48px',\n    '8': '64px',\n    '9': '80px',\n  };\n  return spaceMap[key] || '0px';\n}\n\nfunction getSizeValue(key: string): string {\n  const sizeMap: Record<string, string> = {\n    '1': '4px',\n    '2': '8px',\n    '3': '16px',\n    '4': '20px',\n    '5': '24px',\n    '6': '32px',\n    '7': '40px',\n    '8': '48px',\n    '9': '64px',\n    '10': '80px',\n  };\n  return sizeMap[key] || key;\n}\n\nfunction getRadiiValue(key: string): string {\n  const radiiMap: Record<string, string> = {\n    '1': '4px',\n    '2': '6px',\n    '3': '8px',\n    '4': '12px',\n    round: '50%',\n    pill: '9999px',\n  };\n  return radiiMap[key] || '0px';\n}\n\nfunction getFontSizeValue(key: string): string {\n  const fontSizeMap: Record<string, string> = {\n    '0': '11px',\n    '1': '12px',\n    '2': '13px',\n    '3': '14px',\n    '4': '16px',\n    '5': '18px',\n    '6': '20px',\n    '7': '22px',\n    '8': '24px',\n    '9': '26px',\n    '10': '28px',\n    '11': '32px',\n    '12': '38px',\n  };\n  return fontSizeMap[key] || '16px';\n}\n\nfunction getFontWeightValue(key: string): string {\n  const fontWeightMap: Record<string, string> = {\n    light: '300',\n    regular: '400',\n    medium: '500',\n    semiBold: '600',\n    bold: '700',\n  };\n  return fontWeightMap[key] || '400';\n}\n\nfunction applySpacing(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const tokenValue = processToken(value);\n    const spaceValue = getSpaceValue(tokenValue);\n    if (spaceValue !== '0px') {\n      (style as any)[property] = spaceValue;\n    }\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\nfunction applyRadii(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const tokenValue = processToken(value);\n    const radiiValue = getRadiiValue(tokenValue);\n    if (radiiValue !== '0px') {\n      (style as any)[property] = radiiValue;\n    }\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\nfunction applyColor(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n  colors?: Record<string, any>,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const colorToken = value.slice(1);\n    if (colors && colorToken in colors) {\n      (style as any)[property] = colors[colorToken];\n    } else {\n      (style as any)[property] = value;\n    }\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\nfunction applySize(\n  style: React.CSSProperties,\n  property: keyof React.CSSProperties,\n  value: string,\n): void {\n  if (typeof value === 'string' && value.startsWith('$')) {\n    const tokenValue = processToken(value);\n    const sizeValue = getSizeValue(tokenValue);\n    (style as any)[property] = sizeValue;\n  } else {\n    (style as any)[property] = value;\n  }\n}\n\n// CSS PROCESSOR\nexport function processCSSProp(\n  css: CSSProps['css'] = {},\n  colors?: Record<string, any>,\n): {\n  style: React.CSSProperties;\n  vars: Record<string, string>;\n} {\n  const style: React.CSSProperties = {};\n  const vars: Record<string, string> = {};\n\n  Object.entries(css).forEach(([key, value]) => {\n    switch (key) {\n      case 'p':\n      case 'padding':\n        applySpacing(style, 'padding', value);\n        break;\n      case 'pt':\n      case 'paddingTop':\n        applySpacing(style, 'paddingTop', value);\n        break;\n      case 'pr':\n      case 'paddingRight':\n        applySpacing(style, 'paddingRight', value);\n        break;\n      case 'pb':\n      case 'paddingBottom':\n        applySpacing(style, 'paddingBottom', value);\n        break;\n      case 'pl':\n      case 'paddingLeft':\n        applySpacing(style, 'paddingLeft', value);\n        break;\n      case 'px':\n        applySpacing(style, 'paddingLeft', value);\n        applySpacing(style, 'paddingRight', value);\n        break;\n      case 'py':\n        applySpacing(style, 'paddingTop', value);\n        applySpacing(style, 'paddingBottom', value);\n        break;\n\n      case 'm':\n      case 'margin':\n        applySpacing(style, 'margin', value);\n        break;\n      case 'mt':\n      case 'marginTop':\n        applySpacing(style, 'marginTop', value);\n        break;\n      case 'mr':\n      case 'marginRight':\n        applySpacing(style, 'marginRight', value);\n        break;\n      case 'mb':\n      case 'marginBottom':\n        applySpacing(style, 'marginBottom', value);\n        break;\n      case 'ml':\n      case 'marginLeft':\n        applySpacing(style, 'marginLeft', value);\n        break;\n      case 'mx':\n        applySpacing(style, 'marginLeft', value);\n        applySpacing(style, 'marginRight', value);\n        break;\n      case 'my':\n        applySpacing(style, 'marginTop', value);\n        applySpacing(style, 'marginBottom', value);\n        break;\n\n      case 'ta':\n        style.textAlign = value as React.CSSProperties['textAlign'];\n        break;\n      case 'fd':\n        style.flexDirection = value as React.CSSProperties['flexDirection'];\n        break;\n      case 'fw':\n        style.flexWrap = value as React.CSSProperties['flexWrap'];\n        break;\n      case 'ai':\n        style.alignItems = value as React.CSSProperties['alignItems'];\n        break;\n      case 'ac':\n        style.alignContent = value as React.CSSProperties['alignContent'];\n        break;\n      case 'jc':\n        style.justifyContent = value as React.CSSProperties['justifyContent'];\n        break;\n      case 'as':\n        style.alignSelf = value as React.CSSProperties['alignSelf'];\n        break;\n      case 'fg':\n        style.flexGrow = value;\n        break;\n      case 'fs':\n        style.flexShrink = value;\n        break;\n      case 'fb':\n        applySize(style, 'flexBasis', value);\n        break;\n\n      case 'bc':\n      case 'backgroundColor':\n        applyColor(style, 'backgroundColor', value, colors);\n        break;\n      case 'br':\n      case 'borderRadius':\n        applyRadii(style, 'borderRadius', value);\n        break;\n      case 'btrr':\n      case 'borderTopRightRadius':\n        applyRadii(style, 'borderTopRightRadius', value);\n        break;\n      case 'bbrr':\n      case 'borderBottomRightRadius':\n        applyRadii(style, 'borderBottomRightRadius', value);\n        break;\n      case 'bblr':\n      case 'borderBottomLeftRadius':\n        applyRadii(style, 'borderBottomLeftRadius', value);\n        break;\n      case 'btlr':\n      case 'borderTopLeftRadius':\n        applyRadii(style, 'borderTopLeftRadius', value);\n        break;\n      case 'bs':\n      case 'boxShadow':\n        style.boxShadow = value;\n        break;\n      case 'c':\n      case 'color':\n        applyColor(style, 'color', value, colors);\n        break;\n\n      case 'fontSize':\n        if (typeof value === 'string') {\n          const fontSizeValue = getFontSizeValue(value);\n          if (fontSizeValue !== '16px') {\n            style.fontSize = fontSizeValue;\n          }\n        }\n        break;\n      case 'fontWeight':\n        if (typeof value === 'string') {\n          const fontWeightValue = getFontWeightValue(value);\n          if (fontWeightValue !== '400') {\n            style.fontWeight = fontWeightValue;\n          }\n        }\n        break;\n      case 'lh':\n        style.lineHeight = value;\n        break;\n\n      case 'width':\n      case 'w':\n        applySize(style, 'width', value);\n        break;\n      case 'height':\n      case 'h':\n        applySize(style, 'height', value);\n        break;\n\n      case 'size':\n        applySize(style, 'width', value);\n        applySize(style, 'height', value);\n        break;\n\n      case 'ox':\n        style.overflowX = value as React.CSSProperties['overflowX'];\n        break;\n      case 'oy':\n        style.overflowY = value as React.CSSProperties['overflowY'];\n        break;\n\n      case 'pe':\n        style.pointerEvents = value as React.CSSProperties['pointerEvents'];\n        break;\n      case 'us':\n        style.userSelect = value as React.CSSProperties['userSelect'];\n        break;\n\n      default:\n        // Handle token syntax for any property that falls through to default\n        if (typeof value === 'string' && value.startsWith('$')) {\n          const tokenValue = processToken(value);\n\n          // Try spacing tokens first (most common for gap, etc)\n          const spaceValue = getSpaceValue(tokenValue);\n          if (spaceValue !== '0px') {\n            (style as any)[key] = spaceValue;\n            break;\n          }\n\n          // Try size tokens\n          const sizeValue = getSizeValue(tokenValue);\n          if (sizeValue !== tokenValue) {\n            (style as any)[key] = sizeValue;\n            break;\n          }\n\n          // Try radii tokens\n          const radiiValue = getRadiiValue(tokenValue);\n          if (radiiValue !== '0px') {\n            (style as any)[key] = radiiValue;\n            break;\n          }\n\n          // Try color tokens\n          if (colors && tokenValue in colors) {\n            (style as any)[key] = colors[tokenValue];\n            break;\n          }\n\n          // If no token matches, pass through as-is\n          (style as any)[key] = value;\n        } else {\n          (style as any)[key] = value;\n        }\n        break;\n    }\n  });\n\n  return { style, vars };\n}\n"],"mappings":"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"}

package/dist/styles/themeContext.cjs

@@ -1,120 +1,115 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const index = require("../colors/index.cjs");
-const themes_css = require("./themes.css.cjs");
-const ThemeContext = React.createContext(void 0);
-function VanillaExtractThemeProvider({
-  children,
-  defaultTheme = "system",
-  primaryColor = "blue",
-  forcedTheme
-}) {
-  const [mode, setMode] = React.useState(defaultTheme);
-  const [appliedPrimaryColor, setPrimaryColor] = React.useState(primaryColor);
-  const [systemTheme, setSystemTheme] = React.useState(() => {
-    if (forcedTheme) {
-      return forcedTheme;
-    }
-    if (typeof window !== "undefined") {
-      return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-    }
-    return "light";
-  });
-  React.useEffect(() => {
-    setPrimaryColor(primaryColor);
-  }, [primaryColor]);
-  React.useEffect(() => {
-    if (forcedTheme) {
-      setSystemTheme(forcedTheme);
-      return;
-    }
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    setSystemTheme(mediaQuery.matches ? "dark" : "light");
-    const handler = (e) => {
-      setSystemTheme(e.matches ? "dark" : "light");
-    };
-    mediaQuery.addEventListener("change", handler);
-    return () => mediaQuery.removeEventListener("change", handler);
-  }, [forcedTheme]);
-  const resolvedTheme = forcedTheme || (mode === "system" ? systemTheme : mode);
-  const baseColors = resolvedTheme === "dark" ? index.darkColors : index.lightColors;
-  const semanticColors = resolvedTheme === "dark" ? {
-    primary: index.darkColors[`${appliedPrimaryColor}9`],
-    contentBg: index.darkColors["00dp"],
-    hiContrast: "white",
-    loContrast: index.darkColors.deepBlue2,
-    focusOutline: "hsl(216, 100%, 64%)",
-    divider: "hsl(209, 29%, 19%)",
-    background: "#0a0a0a",
-    foreground: "#ffffff",
-    muted: "#1a1a1a",
-    mutedForeground: "#b4b4b4",
-    card: "#1a1a1a",
-    cardForeground: "#ffffff",
-    popover: "#1a1a1a",
-    popoverForeground: "#ffffff",
-    border: "#3a3a3a",
-    input: "#3a3a3a",
-    accent: "#3b82f6",
-    accentForeground: "#ffffff",
-    destructive: "#dc2626",
-    destructiveForeground: "#ffffff",
-    ring: "#60a5fa"
-  } : {
-    primary: index.lightColors[`${appliedPrimaryColor}9`],
-    contentBg: index.lightColors["00dp"],
-    hiContrast: index.lightColors.deepBlue11,
-    loContrast: "white",
-    focusOutline: "hsl(216, 100%, 64%)",
-    divider: "hsl(207, 10%, 82%)",
-    background: "#fcfcfc",
-    foreground: "#1a1a1a",
-    muted: "#f4f4f4",
-    mutedForeground: "#646464",
-    card: "#ffffff",
-    cardForeground: "#1a1a1a",
-    popover: "#ffffff",
-    popoverForeground: "#1a1a1a",
-    border: "#e3e3e3",
-    input: "#e3e3e3",
-    accent: "#60a5fa",
-    accentForeground: "#ffffff",
-    destructive: "#dc2626",
-    destructiveForeground: "#ffffff",
-    ring: "#3b82f6"
-  };
-  const colors = {
-    ...baseColors,
-    ...semanticColors
-  };
-  React.useLayoutEffect(() => {
-    const themeClass = themes_css.themes[resolvedTheme][appliedPrimaryColor];
-    Object.values(themes_css.themes.light).forEach((cls) => document.body.classList.remove(cls));
-    Object.values(themes_css.themes.dark).forEach((cls) => document.body.classList.remove(cls));
-    document.body.classList.add(themeClass);
-    return () => {
-      document.body.classList.remove(themeClass);
-    };
-  }, [resolvedTheme, appliedPrimaryColor]);
-  const contextValue = {
-    mode,
-    resolvedTheme,
-    primaryColor: appliedPrimaryColor,
-    colors,
-    setMode,
-    setPrimaryColor
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: contextValue, children });
+const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
+const require_index = require("../colors/index.cjs");
+const require_themes_css = require("./themes.css.cjs");
+let react = require("react");
+react = require_runtime.__toESM(react, 1);
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region styles/themeContext.tsx
+var ThemeContext = (0, react.createContext)(void 0);
+function VanillaExtractThemeProvider({ children, defaultTheme = "system", primaryColor = "blue", forcedTheme }) {
+	const [mode, setMode] = (0, react.useState)(defaultTheme);
+	const [appliedPrimaryColor, setPrimaryColor] = (0, react.useState)(primaryColor);
+	const [systemTheme, setSystemTheme] = (0, react.useState)(() => {
+		if (forcedTheme) return forcedTheme;
+		if (typeof window !== "undefined") return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+		return "light";
+	});
+	(0, react.useEffect)(() => {
+		setPrimaryColor(primaryColor);
+	}, [primaryColor]);
+	(0, react.useEffect)(() => {
+		if (forcedTheme) {
+			setSystemTheme(forcedTheme);
+			return;
+		}
+		const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+		setSystemTheme(mediaQuery.matches ? "dark" : "light");
+		const handler = (e) => {
+			setSystemTheme(e.matches ? "dark" : "light");
+		};
+		mediaQuery.addEventListener("change", handler);
+		return () => mediaQuery.removeEventListener("change", handler);
+	}, [forcedTheme]);
+	const resolvedTheme = forcedTheme || (mode === "system" ? systemTheme : mode);
+	const baseColors = resolvedTheme === "dark" ? require_index.darkColors : require_index.lightColors;
+	const semanticColors = resolvedTheme === "dark" ? {
+		primary: require_index.darkColors[`${appliedPrimaryColor}9`],
+		contentBg: require_index.darkColors["00dp"],
+		hiContrast: "white",
+		loContrast: require_index.darkColors.deepBlue2,
+		focusOutline: "hsl(216, 100%, 64%)",
+		divider: "hsl(209, 29%, 19%)",
+		background: "#0a0a0a",
+		foreground: "#ffffff",
+		muted: "#1a1a1a",
+		mutedForeground: "#b4b4b4",
+		card: "#1a1a1a",
+		cardForeground: "#ffffff",
+		popover: "#1a1a1a",
+		popoverForeground: "#ffffff",
+		border: "#3a3a3a",
+		input: "#3a3a3a",
+		accent: "#3b82f6",
+		accentForeground: "#ffffff",
+		destructive: "#dc2626",
+		destructiveForeground: "#ffffff",
+		ring: "#60a5fa"
+	} : {
+		primary: require_index.lightColors[`${appliedPrimaryColor}9`],
+		contentBg: require_index.lightColors["00dp"],
+		hiContrast: require_index.lightColors.deepBlue11,
+		loContrast: "white",
+		focusOutline: "hsl(216, 100%, 64%)",
+		divider: "hsl(207, 10%, 82%)",
+		background: "#fcfcfc",
+		foreground: "#1a1a1a",
+		muted: "#f4f4f4",
+		mutedForeground: "#646464",
+		card: "#ffffff",
+		cardForeground: "#1a1a1a",
+		popover: "#ffffff",
+		popoverForeground: "#1a1a1a",
+		border: "#e3e3e3",
+		input: "#e3e3e3",
+		accent: "#60a5fa",
+		accentForeground: "#ffffff",
+		destructive: "#dc2626",
+		destructiveForeground: "#ffffff",
+		ring: "#3b82f6"
+	};
+	const colors = {
+		...baseColors,
+		...semanticColors
+	};
+	(0, react.useLayoutEffect)(() => {
+		const themeClass = require_themes_css.themes[resolvedTheme][appliedPrimaryColor];
+		Object.values(require_themes_css.themes.light).forEach((cls) => document.body.classList.remove(cls));
+		Object.values(require_themes_css.themes.dark).forEach((cls) => document.body.classList.remove(cls));
+		document.body.classList.add(themeClass);
+		return () => {
+			document.body.classList.remove(themeClass);
+		};
+	}, [resolvedTheme, appliedPrimaryColor]);
+	const contextValue = {
+		mode,
+		resolvedTheme,
+		primaryColor: appliedPrimaryColor,
+		colors,
+		setMode,
+		setPrimaryColor
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ThemeContext.Provider, {
+		value: contextValue,
+		children
+	});
 }
 function useVanillaExtractTheme() {
-  const context = React.useContext(ThemeContext);
-  if (context === void 0) {
-    throw new Error("useVanillaExtractTheme must be used within a VanillaExtractThemeProvider");
-  }
-  return context;
+	const context = (0, react.useContext)(ThemeContext);
+	if (context === void 0) throw new Error("useVanillaExtractTheme must be used within a VanillaExtractThemeProvider");
+	return context;
 }
+//#endregion
 exports.VanillaExtractThemeProvider = VanillaExtractThemeProvider;
 exports.useVanillaExtractTheme = useVanillaExtractTheme;
-//# sourceMappingURL=themeContext.cjs.map
+
+//# sourceMappingURL=themeContext.cjs.map

package/dist/styles/themeContext.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"themeContext.cjs","sources":["../../styles/themeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useLayoutEffect, useState } from 'react';\n\nimport { darkColors, lightColors } from '../colors';\nimport { PrimaryColor, themes } from './themes.css';\n\nexport type ThemeMode = 'light' | 'dark' | 'system';\nexport type { PrimaryColor };\n\ninterface ThemeContextValue {\n  mode: ThemeMode;\n  resolvedTheme: 'light' | 'dark';\n  primaryColor: PrimaryColor;\n  colors: typeof lightColors | typeof darkColors;\n  setMode: (mode: ThemeMode) => void;\n  setPrimaryColor: (color: PrimaryColor) => void;\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\ninterface VanillaExtractThemeProviderProps {\n  children: React.ReactNode;\n  defaultTheme?: ThemeMode;\n  primaryColor?: PrimaryColor;\n  forcedTheme?: 'light' | 'dark';\n}\n\nexport function VanillaExtractThemeProvider({\n  children,\n  defaultTheme = 'system',\n  primaryColor = 'blue',\n  forcedTheme,\n}: VanillaExtractThemeProviderProps) {\n  const [mode, setMode] = useState<ThemeMode>(defaultTheme);\n  const [appliedPrimaryColor, setPrimaryColor] = useState<PrimaryColor>(primaryColor);\n  const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>(() => {\n    if (forcedTheme) {\n      return forcedTheme;\n    }\n    if (typeof window !== 'undefined') {\n      return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n    }\n    return 'light';\n  });\n\n  useEffect(() => {\n    setPrimaryColor(primaryColor);\n  }, [primaryColor]);\n\n  useEffect(() => {\n    if (forcedTheme) {\n      setSystemTheme(forcedTheme);\n      return;\n    }\n\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n    setSystemTheme(mediaQuery.matches ? 'dark' : 'light');\n\n    const handler = (e: MediaQueryListEvent) => {\n      setSystemTheme(e.matches ? 'dark' : 'light');\n    };\n\n    mediaQuery.addEventListener('change', handler);\n    return () => mediaQuery.removeEventListener('change', handler);\n  }, [forcedTheme]);\n\n  const resolvedTheme: 'light' | 'dark' = forcedTheme || (mode === 'system' ? systemTheme : mode);\n\n  const baseColors = resolvedTheme === 'dark' ? darkColors : lightColors;\n\n  const semanticColors =\n    resolvedTheme === 'dark'\n      ? {\n          primary: darkColors[`${appliedPrimaryColor}9`],\n          contentBg: darkColors['00dp'],\n          hiContrast: 'white',\n          loContrast: darkColors.deepBlue2,\n          focusOutline: 'hsl(216, 100%, 64%)',\n          divider: 'hsl(209, 29%, 19%)',\n          background: '#0a0a0a',\n          foreground: '#ffffff',\n          muted: '#1a1a1a',\n          mutedForeground: '#b4b4b4',\n          card: '#1a1a1a',\n          cardForeground: '#ffffff',\n          popover: '#1a1a1a',\n          popoverForeground: '#ffffff',\n          border: '#3a3a3a',\n          input: '#3a3a3a',\n          accent: '#3b82f6',\n          accentForeground: '#ffffff',\n          destructive: '#dc2626',\n          destructiveForeground: '#ffffff',\n          ring: '#60a5fa',\n        }\n      : {\n          primary: lightColors[`${appliedPrimaryColor}9`],\n          contentBg: lightColors['00dp'],\n          hiContrast: lightColors.deepBlue11,\n          loContrast: 'white',\n          focusOutline: 'hsl(216, 100%, 64%)',\n          divider: 'hsl(207, 10%, 82%)',\n          background: '#fcfcfc',\n          foreground: '#1a1a1a',\n          muted: '#f4f4f4',\n          mutedForeground: '#646464',\n          card: '#ffffff',\n          cardForeground: '#1a1a1a',\n          popover: '#ffffff',\n          popoverForeground: '#1a1a1a',\n          border: '#e3e3e3',\n          input: '#e3e3e3',\n          accent: '#60a5fa',\n          accentForeground: '#ffffff',\n          destructive: '#dc2626',\n          destructiveForeground: '#ffffff',\n          ring: '#3b82f6',\n        };\n\n  const colors = {\n    ...baseColors,\n    ...semanticColors,\n  };\n\n  // Use useLayoutEffect to apply theme class synchronously before paint\n  useLayoutEffect(() => {\n    const themeClass = themes[resolvedTheme][appliedPrimaryColor];\n\n    Object.values(themes.light).forEach((cls) => document.body.classList.remove(cls));\n    Object.values(themes.dark).forEach((cls) => document.body.classList.remove(cls));\n\n    document.body.classList.add(themeClass);\n\n    return () => {\n      document.body.classList.remove(themeClass);\n    };\n  }, [resolvedTheme, appliedPrimaryColor]);\n\n  const contextValue: ThemeContextValue = {\n    mode,\n    resolvedTheme,\n    primaryColor: appliedPrimaryColor,\n    colors,\n    setMode,\n    setPrimaryColor,\n  };\n\n  return <ThemeContext.Provider value={contextValue}>{children}</ThemeContext.Provider>;\n}\n\nexport function useVanillaExtractTheme() {\n  const context = useContext(ThemeContext);\n  if (context === undefined) {\n    throw new Error('useVanillaExtractTheme must be used within a VanillaExtractThemeProvider');\n  }\n  return context;\n}\n"],"names":["createContext","useState","useEffect","darkColors","lightColors","useLayoutEffect","themes","useContext"],"mappings":"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"}
+{"version":3,"file":"themeContext.cjs","names":[],"sources":["../../styles/themeContext.tsx"],"sourcesContent":["import React, { createContext, useContext, useEffect, useLayoutEffect, useState } from 'react';\n\nimport { darkColors, lightColors } from '../colors';\nimport { PrimaryColor, themes } from './themes.css';\n\nexport type ThemeMode = 'light' | 'dark' | 'system';\nexport type { PrimaryColor };\n\ninterface ThemeContextValue {\n  mode: ThemeMode;\n  resolvedTheme: 'light' | 'dark';\n  primaryColor: PrimaryColor;\n  colors: typeof lightColors | typeof darkColors;\n  setMode: (mode: ThemeMode) => void;\n  setPrimaryColor: (color: PrimaryColor) => void;\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\ninterface VanillaExtractThemeProviderProps {\n  children: React.ReactNode;\n  defaultTheme?: ThemeMode;\n  primaryColor?: PrimaryColor;\n  forcedTheme?: 'light' | 'dark';\n}\n\nexport function VanillaExtractThemeProvider({\n  children,\n  defaultTheme = 'system',\n  primaryColor = 'blue',\n  forcedTheme,\n}: VanillaExtractThemeProviderProps) {\n  const [mode, setMode] = useState<ThemeMode>(defaultTheme);\n  const [appliedPrimaryColor, setPrimaryColor] = useState<PrimaryColor>(primaryColor);\n  const [systemTheme, setSystemTheme] = useState<'light' | 'dark'>(() => {\n    if (forcedTheme) {\n      return forcedTheme;\n    }\n    if (typeof window !== 'undefined') {\n      return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n    }\n    return 'light';\n  });\n\n  useEffect(() => {\n    setPrimaryColor(primaryColor);\n  }, [primaryColor]);\n\n  useEffect(() => {\n    if (forcedTheme) {\n      setSystemTheme(forcedTheme);\n      return;\n    }\n\n    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');\n    setSystemTheme(mediaQuery.matches ? 'dark' : 'light');\n\n    const handler = (e: MediaQueryListEvent) => {\n      setSystemTheme(e.matches ? 'dark' : 'light');\n    };\n\n    mediaQuery.addEventListener('change', handler);\n    return () => mediaQuery.removeEventListener('change', handler);\n  }, [forcedTheme]);\n\n  const resolvedTheme: 'light' | 'dark' = forcedTheme || (mode === 'system' ? systemTheme : mode);\n\n  const baseColors = resolvedTheme === 'dark' ? darkColors : lightColors;\n\n  const semanticColors =\n    resolvedTheme === 'dark'\n      ? {\n          primary: darkColors[`${appliedPrimaryColor}9`],\n          contentBg: darkColors['00dp'],\n          hiContrast: 'white',\n          loContrast: darkColors.deepBlue2,\n          focusOutline: 'hsl(216, 100%, 64%)',\n          divider: 'hsl(209, 29%, 19%)',\n          background: '#0a0a0a',\n          foreground: '#ffffff',\n          muted: '#1a1a1a',\n          mutedForeground: '#b4b4b4',\n          card: '#1a1a1a',\n          cardForeground: '#ffffff',\n          popover: '#1a1a1a',\n          popoverForeground: '#ffffff',\n          border: '#3a3a3a',\n          input: '#3a3a3a',\n          accent: '#3b82f6',\n          accentForeground: '#ffffff',\n          destructive: '#dc2626',\n          destructiveForeground: '#ffffff',\n          ring: '#60a5fa',\n        }\n      : {\n          primary: lightColors[`${appliedPrimaryColor}9`],\n          contentBg: lightColors['00dp'],\n          hiContrast: lightColors.deepBlue11,\n          loContrast: 'white',\n          focusOutline: 'hsl(216, 100%, 64%)',\n          divider: 'hsl(207, 10%, 82%)',\n          background: '#fcfcfc',\n          foreground: '#1a1a1a',\n          muted: '#f4f4f4',\n          mutedForeground: '#646464',\n          card: '#ffffff',\n          cardForeground: '#1a1a1a',\n          popover: '#ffffff',\n          popoverForeground: '#1a1a1a',\n          border: '#e3e3e3',\n          input: '#e3e3e3',\n          accent: '#60a5fa',\n          accentForeground: '#ffffff',\n          destructive: '#dc2626',\n          destructiveForeground: '#ffffff',\n          ring: '#3b82f6',\n        };\n\n  const colors = {\n    ...baseColors,\n    ...semanticColors,\n  };\n\n  // Use useLayoutEffect to apply theme class synchronously before paint\n  useLayoutEffect(() => {\n    const themeClass = themes[resolvedTheme][appliedPrimaryColor];\n\n    Object.values(themes.light).forEach((cls) => document.body.classList.remove(cls));\n    Object.values(themes.dark).forEach((cls) => document.body.classList.remove(cls));\n\n    document.body.classList.add(themeClass);\n\n    return () => {\n      document.body.classList.remove(themeClass);\n    };\n  }, [resolvedTheme, appliedPrimaryColor]);\n\n  const contextValue: ThemeContextValue = {\n    mode,\n    resolvedTheme,\n    primaryColor: appliedPrimaryColor,\n    colors,\n    setMode,\n    setPrimaryColor,\n  };\n\n  return <ThemeContext.Provider value={contextValue}>{children}</ThemeContext.Provider>;\n}\n\nexport function useVanillaExtractTheme() {\n  const context = useContext(ThemeContext);\n  if (context === undefined) {\n    throw new Error('useVanillaExtractTheme must be used within a VanillaExtractThemeProvider');\n  }\n  return context;\n}\n"],"mappings":";;;;;;;AAiBA,IAAM,gBAAA,GAAA,MAAA,eAA4D,KAAA,EAAU;AAS5E,SAAgB,4BAA4B,EAC1C,UACA,eAAe,UACf,eAAe,QACf,eACmC;CACnC,MAAM,CAAC,MAAM,YAAA,GAAA,MAAA,UAA+B,aAAa;CACzD,MAAM,CAAC,qBAAqB,oBAAA,GAAA,MAAA,UAA0C,aAAa;CACnF,MAAM,CAAC,aAAa,mBAAA,GAAA,MAAA,gBAAmD;AACrE,MAAI,YACF,QAAO;AAET,MAAI,OAAO,WAAW,YACpB,QAAO,OAAO,WAAW,+BAA+B,CAAC,UAAU,SAAS;AAE9E,SAAO;GACP;AAEF,EAAA,GAAA,MAAA,iBAAgB;AACd,kBAAgB,aAAa;IAC5B,CAAC,aAAa,CAAC;AAElB,EAAA,GAAA,MAAA,iBAAgB;AACd,MAAI,aAAa;AACf,kBAAe,YAAY;AAC3B;;EAGF,MAAM,aAAa,OAAO,WAAW,+BAA+B;AACpE,iBAAe,WAAW,UAAU,SAAS,QAAQ;EAErD,MAAM,WAAW,MAA2B;AAC1C,kBAAe,EAAE,UAAU,SAAS,QAAQ;;AAG9C,aAAW,iBAAiB,UAAU,QAAQ;AAC9C,eAAa,WAAW,oBAAoB,UAAU,QAAQ;IAC7D,CAAC,YAAY,CAAC;CAEjB,MAAM,gBAAkC,gBAAgB,SAAS,WAAW,cAAc;CAE1F,MAAM,aAAa,kBAAkB,SAAS,cAAA,aAAa,cAAA;CAE3D,MAAM,iBACJ,kBAAkB,SACd;EACE,SAAS,cAAA,WAAW,GAAG,oBAAoB;EAC3C,WAAW,cAAA,WAAW;EACtB,YAAY;EACZ,YAAY,cAAA,WAAW;EACvB,cAAc;EACd,SAAS;EACT,YAAY;EACZ,YAAY;EACZ,OAAO;EACP,iBAAiB;EACjB,MAAM;EACN,gBAAgB;EAChB,SAAS;EACT,mBAAmB;EACnB,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,kBAAkB;EAClB,aAAa;EACb,uBAAuB;EACvB,MAAM;EACP,GACD;EACE,SAAS,cAAA,YAAY,GAAG,oBAAoB;EAC5C,WAAW,cAAA,YAAY;EACvB,YAAY,cAAA,YAAY;EACxB,YAAY;EACZ,cAAc;EACd,SAAS;EACT,YAAY;EACZ,YAAY;EACZ,OAAO;EACP,iBAAiB;EACjB,MAAM;EACN,gBAAgB;EAChB,SAAS;EACT,mBAAmB;EACnB,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,kBAAkB;EAClB,aAAa;EACb,uBAAuB;EACvB,MAAM;EACP;CAEP,MAAM,SAAS;EACb,GAAG;EACH,GAAG;EACJ;AAGD,EAAA,GAAA,MAAA,uBAAsB;EACpB,MAAM,aAAa,mBAAA,OAAO,eAAe;AAEzC,SAAO,OAAO,mBAAA,OAAO,MAAM,CAAC,SAAS,QAAQ,SAAS,KAAK,UAAU,OAAO,IAAI,CAAC;AACjF,SAAO,OAAO,mBAAA,OAAO,KAAK,CAAC,SAAS,QAAQ,SAAS,KAAK,UAAU,OAAO,IAAI,CAAC;AAEhF,WAAS,KAAK,UAAU,IAAI,WAAW;AAEvC,eAAa;AACX,YAAS,KAAK,UAAU,OAAO,WAAW;;IAE3C,CAAC,eAAe,oBAAoB,CAAC;CAExC,MAAM,eAAkC;EACtC;EACA;EACA,cAAc;EACd;EACA;EACA;EACD;AAED,QAAO,iBAAA,GAAA,kBAAA,KAAC,aAAa,UAAd;EAAuB,OAAO;EAAe;EAAiC,CAAA;;AAGvF,SAAgB,yBAAyB;CACvC,MAAM,WAAA,GAAA,MAAA,YAAqB,aAAa;AACxC,KAAI,YAAY,KAAA,EACd,OAAM,IAAI,MAAM,2EAA2E;AAE7F,QAAO"}

package/dist/styles/themeContext.js

@@ -1,120 +1,112 @@
-import { jsx } from "react/jsx-runtime";
-import { useContext, createContext, useState, useEffect, useLayoutEffect } from "react";
 import { darkColors, lightColors } from "../colors/index.js";
 import { themes } from "./themes.css.js";
-const ThemeContext = createContext(void 0);
-function VanillaExtractThemeProvider({
-  children,
-  defaultTheme = "system",
-  primaryColor = "blue",
-  forcedTheme
-}) {
-  const [mode, setMode] = useState(defaultTheme);
-  const [appliedPrimaryColor, setPrimaryColor] = useState(primaryColor);
-  const [systemTheme, setSystemTheme] = useState(() => {
-    if (forcedTheme) {
-      return forcedTheme;
-    }
-    if (typeof window !== "undefined") {
-      return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-    }
-    return "light";
-  });
-  useEffect(() => {
-    setPrimaryColor(primaryColor);
-  }, [primaryColor]);
-  useEffect(() => {
-    if (forcedTheme) {
-      setSystemTheme(forcedTheme);
-      return;
-    }
-    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    setSystemTheme(mediaQuery.matches ? "dark" : "light");
-    const handler = (e) => {
-      setSystemTheme(e.matches ? "dark" : "light");
-    };
-    mediaQuery.addEventListener("change", handler);
-    return () => mediaQuery.removeEventListener("change", handler);
-  }, [forcedTheme]);
-  const resolvedTheme = forcedTheme || (mode === "system" ? systemTheme : mode);
-  const baseColors = resolvedTheme === "dark" ? darkColors : lightColors;
-  const semanticColors = resolvedTheme === "dark" ? {
-    primary: darkColors[`${appliedPrimaryColor}9`],
-    contentBg: darkColors["00dp"],
-    hiContrast: "white",
-    loContrast: darkColors.deepBlue2,
-    focusOutline: "hsl(216, 100%, 64%)",
-    divider: "hsl(209, 29%, 19%)",
-    background: "#0a0a0a",
-    foreground: "#ffffff",
-    muted: "#1a1a1a",
-    mutedForeground: "#b4b4b4",
-    card: "#1a1a1a",
-    cardForeground: "#ffffff",
-    popover: "#1a1a1a",
-    popoverForeground: "#ffffff",
-    border: "#3a3a3a",
-    input: "#3a3a3a",
-    accent: "#3b82f6",
-    accentForeground: "#ffffff",
-    destructive: "#dc2626",
-    destructiveForeground: "#ffffff",
-    ring: "#60a5fa"
-  } : {
-    primary: lightColors[`${appliedPrimaryColor}9`],
-    contentBg: lightColors["00dp"],
-    hiContrast: lightColors.deepBlue11,
-    loContrast: "white",
-    focusOutline: "hsl(216, 100%, 64%)",
-    divider: "hsl(207, 10%, 82%)",
-    background: "#fcfcfc",
-    foreground: "#1a1a1a",
-    muted: "#f4f4f4",
-    mutedForeground: "#646464",
-    card: "#ffffff",
-    cardForeground: "#1a1a1a",
-    popover: "#ffffff",
-    popoverForeground: "#1a1a1a",
-    border: "#e3e3e3",
-    input: "#e3e3e3",
-    accent: "#60a5fa",
-    accentForeground: "#ffffff",
-    destructive: "#dc2626",
-    destructiveForeground: "#ffffff",
-    ring: "#3b82f6"
-  };
-  const colors = {
-    ...baseColors,
-    ...semanticColors
-  };
-  useLayoutEffect(() => {
-    const themeClass = themes[resolvedTheme][appliedPrimaryColor];
-    Object.values(themes.light).forEach((cls) => document.body.classList.remove(cls));
-    Object.values(themes.dark).forEach((cls) => document.body.classList.remove(cls));
-    document.body.classList.add(themeClass);
-    return () => {
-      document.body.classList.remove(themeClass);
-    };
-  }, [resolvedTheme, appliedPrimaryColor]);
-  const contextValue = {
-    mode,
-    resolvedTheme,
-    primaryColor: appliedPrimaryColor,
-    colors,
-    setMode,
-    setPrimaryColor
-  };
-  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: contextValue, children });
+import { createContext, useContext, useEffect, useLayoutEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region styles/themeContext.tsx
+var ThemeContext = createContext(void 0);
+function VanillaExtractThemeProvider({ children, defaultTheme = "system", primaryColor = "blue", forcedTheme }) {
+	const [mode, setMode] = useState(defaultTheme);
+	const [appliedPrimaryColor, setPrimaryColor] = useState(primaryColor);
+	const [systemTheme, setSystemTheme] = useState(() => {
+		if (forcedTheme) return forcedTheme;
+		if (typeof window !== "undefined") return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+		return "light";
+	});
+	useEffect(() => {
+		setPrimaryColor(primaryColor);
+	}, [primaryColor]);
+	useEffect(() => {
+		if (forcedTheme) {
+			setSystemTheme(forcedTheme);
+			return;
+		}
+		const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+		setSystemTheme(mediaQuery.matches ? "dark" : "light");
+		const handler = (e) => {
+			setSystemTheme(e.matches ? "dark" : "light");
+		};
+		mediaQuery.addEventListener("change", handler);
+		return () => mediaQuery.removeEventListener("change", handler);
+	}, [forcedTheme]);
+	const resolvedTheme = forcedTheme || (mode === "system" ? systemTheme : mode);
+	const baseColors = resolvedTheme === "dark" ? darkColors : lightColors;
+	const semanticColors = resolvedTheme === "dark" ? {
+		primary: darkColors[`${appliedPrimaryColor}9`],
+		contentBg: darkColors["00dp"],
+		hiContrast: "white",
+		loContrast: darkColors.deepBlue2,
+		focusOutline: "hsl(216, 100%, 64%)",
+		divider: "hsl(209, 29%, 19%)",
+		background: "#0a0a0a",
+		foreground: "#ffffff",
+		muted: "#1a1a1a",
+		mutedForeground: "#b4b4b4",
+		card: "#1a1a1a",
+		cardForeground: "#ffffff",
+		popover: "#1a1a1a",
+		popoverForeground: "#ffffff",
+		border: "#3a3a3a",
+		input: "#3a3a3a",
+		accent: "#3b82f6",
+		accentForeground: "#ffffff",
+		destructive: "#dc2626",
+		destructiveForeground: "#ffffff",
+		ring: "#60a5fa"
+	} : {
+		primary: lightColors[`${appliedPrimaryColor}9`],
+		contentBg: lightColors["00dp"],
+		hiContrast: lightColors.deepBlue11,
+		loContrast: "white",
+		focusOutline: "hsl(216, 100%, 64%)",
+		divider: "hsl(207, 10%, 82%)",
+		background: "#fcfcfc",
+		foreground: "#1a1a1a",
+		muted: "#f4f4f4",
+		mutedForeground: "#646464",
+		card: "#ffffff",
+		cardForeground: "#1a1a1a",
+		popover: "#ffffff",
+		popoverForeground: "#1a1a1a",
+		border: "#e3e3e3",
+		input: "#e3e3e3",
+		accent: "#60a5fa",
+		accentForeground: "#ffffff",
+		destructive: "#dc2626",
+		destructiveForeground: "#ffffff",
+		ring: "#3b82f6"
+	};
+	const colors = {
+		...baseColors,
+		...semanticColors
+	};
+	useLayoutEffect(() => {
+		const themeClass = themes[resolvedTheme][appliedPrimaryColor];
+		Object.values(themes.light).forEach((cls) => document.body.classList.remove(cls));
+		Object.values(themes.dark).forEach((cls) => document.body.classList.remove(cls));
+		document.body.classList.add(themeClass);
+		return () => {
+			document.body.classList.remove(themeClass);
+		};
+	}, [resolvedTheme, appliedPrimaryColor]);
+	const contextValue = {
+		mode,
+		resolvedTheme,
+		primaryColor: appliedPrimaryColor,
+		colors,
+		setMode,
+		setPrimaryColor
+	};
+	return /* @__PURE__ */ jsx(ThemeContext.Provider, {
+		value: contextValue,
+		children
+	});
 }
 function useVanillaExtractTheme() {
-  const context = useContext(ThemeContext);
-  if (context === void 0) {
-    throw new Error("useVanillaExtractTheme must be used within a VanillaExtractThemeProvider");
-  }
-  return context;
+	const context = useContext(ThemeContext);
+	if (context === void 0) throw new Error("useVanillaExtractTheme must be used within a VanillaExtractThemeProvider");
+	return context;
 }
-export {
-  VanillaExtractThemeProvider,
-  useVanillaExtractTheme
-};
-//# sourceMappingURL=themeContext.js.map
+//#endregion
+export { VanillaExtractThemeProvider, useVanillaExtractTheme };
+
+//# sourceMappingURL=themeContext.js.map