@atom-learning/components 6.16.0-beta.3 → 6.16.0

package/dist/experiments/color-scheme/ColorScheme.config.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorScheme.config.js","names":[],"sources":["../../../src/experiments/color-scheme/ColorScheme.config.ts"],"sourcesContent":["type ColorSchemeKeys = 'interactive' | 'base' | 'accent' | 'foreground'\n\n// ColorScheme is a partial record, but values are always strings (never undefined)\ntype ColorScheme = Partial<\n  Record<`--${ColorSchemeKeys}` | `--${ColorSchemeKeys}-${string}`, string>\n>\n\ntype ColorSchemeConfig = { colorName: string; color0?: string }\n\nconst generateColors = ({\n  prefix,\n  colorName,\n  color0 = ''\n}: {\n  prefix: ColorSchemeKeys\n  colorName: string\n  color0?: string\n}): ColorScheme => {\n  const colors: Record<string, string> = {}\n  let i = 1\n  if (color0) {\n    colors[`--${prefix}-${i}`] = `var(--color-${color0})`\n    i++\n  }\n  let k = 1\n  for (i; i <= 11; i++) {\n    colors[`--${prefix}-${i}`] = `var(--color-${colorName}-${k * 100})`\n    k++\n  }\n  return colors as ColorScheme\n}\n\nexport const colorSchemes: Record<string, ColorScheme> = {} as Record<\n  string,\n  ColorScheme\n>\n\ncolorSchemes['interactive-loContrast'] = {\n  '--interactive-foreground': 'var(--foreground)',\n  '--interactive-1': 'var(--accent-1)',\n  '--interactive-2': 'var(--accent-2)',\n  '--interactive-3': 'var(--accent-3)'\n}\n\ncolorSchemes['interactive-hiContrast'] = {\n  '--interactive-foreground': 'var(--foreground-7-plus)',\n  '--interactive-1': 'var(--accent-9)',\n  '--interactive-2': 'var(--accent-10)',\n  '--interactive-3': 'var(--accent-11)'\n}\n\nconst colorNames = [\n  'primary',\n  'grey',\n  'blue',\n  'pink',\n  'purple',\n  'cyan',\n  'green',\n  'magenta',\n  'red',\n  'teal',\n  'orange',\n  'yellow',\n  'lime'\n]\n\nconst createVariants = () =>\n  Object.fromEntries(\n    colorNames.flatMap((c) => [\n      [`${c}1`, { colorName: c, color0: 'white' }],\n      [`${c}2`, { colorName: c }]\n    ])\n  ) as Record<string, ColorSchemeConfig>\n\nexport const bases = createVariants()\nexport const accents = bases\n;(() => {\n  Object.entries(bases).forEach(\n    ([name, config]: [string, ColorSchemeConfig]) => {\n      const themeName = `base-${name}`\n      colorSchemes[themeName] = {\n        '--foreground': 'var(--color-grey-1000)',\n        '--foreground-7-plus': 'var(--color-white)',\n        ...generateColors({\n          prefix: 'base',\n          colorName: config.colorName,\n          color0: config.color0\n        })\n      }\n    }\n  )\n\n  Object.entries(accents).forEach(\n    ([name, config]: [string, ColorSchemeConfig]) => {\n      colorSchemes[`accent-${name}`] = generateColors({\n        prefix: 'accent',\n        colorName: config.colorName,\n        color0: config.color0\n      })\n    }\n  )\n})()\n"],"mappings":";AASA,IAAM,kBAAkB,EACtB,QACA,WACA,SAAS,SAKQ;CACjB,MAAM,SAAiC,CAAC;CACxC,IAAI,IAAI;CACR,IAAI,QAAQ;EACV,OAAO,KAAK,OAAO,GAAG,OAAO,eAAe,OAAO;EACnD;CACF;CACA,IAAI,IAAI;CACR,OAAQ,KAAK,IAAI,KAAK;EACpB,OAAO,KAAK,OAAO,GAAG,OAAO,eAAe,UAAU,GAAG,IAAI,IAAI;EACjE;CACF;CACA,OAAO;AACT;AAEA,IAAa,eAA4C,CAAC;AAK1D,aAAa,4BAA4B;CACvC,4BAA4B;CAC5B,mBAAmB;CACnB,mBAAmB;CACnB,mBAAmB;AACrB;AAEA,aAAa,4BAA4B;CACvC,4BAA4B;CAC5B,mBAAmB;CACnB,mBAAmB;CACnB,mBAAmB;AACrB;AAEA,IAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,IAAM,uBACJ,OAAO,YACL,WAAW,SAAS,MAAM,CACxB,CAAC,GAAG,EAAE,IAAI;CAAE,WAAW;CAAG,QAAQ;AAAQ,CAAC,GAC3C,CAAC,GAAG,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAC5B,CAAC,CACH;AAEF,IAAa,QAAQ,eAAe;AACpC,IAAa,UAAU;OACf;CACN,OAAO,QAAQ,KAAK,EAAE,SACnB,CAAC,MAAM,YAAyC;EAC/C,MAAM,YAAY,QAAQ;EAC1B,aAAa,aAAa;GACxB,gBAAgB;GAChB,uBAAuB;GACvB,GAAG,eAAe;IAChB,QAAQ;IACR,WAAW,OAAO;IAClB,QAAQ,OAAO;GACjB,CAAC;EACH;CACF,CACF;CAEA,OAAO,QAAQ,OAAO,EAAE,SACrB,CAAC,MAAM,YAAyC;EAC/C,aAAa,UAAU,UAAU,eAAe;GAC9C,QAAQ;GACR,WAAW,OAAO;GAClB,QAAQ,OAAO;EACjB,CAAC;CACH,CACF;AACF,GAAG"}
+{"version":3,"file":"ColorScheme.config.js","names":[],"sources":["../../../src/experiments/color-scheme/ColorScheme.config.ts"],"sourcesContent":["type ColorSchemeKeys = 'interactive' | 'base' | 'accent' | 'foreground'\n\n// ColorScheme is a partial record, but values are always strings (never undefined)\ntype ColorScheme = Partial<\n  Record<`--${ColorSchemeKeys}` | `--${ColorSchemeKeys}-${string}`, string>\n>\n\ntype ColorSchemeConfig = { colorName: string; color0?: string }\n\nconst generateColors = ({\n  prefix,\n  colorName,\n  color0 = ''\n}: {\n  prefix: ColorSchemeKeys\n  colorName: string\n  color0?: string\n}): ColorScheme => {\n  const colors: Record<string, string> = {}\n  let i = 1\n  if (color0) {\n    colors[`--${prefix}-${i}`] = `var(--color-${color0})`\n    i++\n  }\n  let k = 1\n  for (i; i <= 11; i++) {\n    colors[`--${prefix}-${i}`] = `var(--color-${colorName}-${k * 100})`\n    k++\n  }\n  return colors as ColorScheme\n}\n\nexport const colorSchemes: Record<string, ColorScheme> = {} as Record<\n  string,\n  ColorScheme\n>\n\ncolorSchemes['interactive-loContrast'] = {\n  '--interactive-foreground': 'var(--foreground)',\n  '--interactive-1': 'var(--accent-1)',\n  '--interactive-2': 'var(--accent-2)',\n  '--interactive-3': 'var(--accent-3)'\n}\n\ncolorSchemes['interactive-hiContrast'] = {\n  '--interactive-foreground': 'var(--foreground-7-plus)',\n  '--interactive-1': 'var(--accent-9)',\n  '--interactive-2': 'var(--accent-10)',\n  '--interactive-3': 'var(--accent-11)'\n}\n\nconst colorNames = [\n  'primary',\n  'grey',\n  'blue',\n  'pink',\n  'purple',\n  'cyan',\n  'green',\n  'magenta',\n  'red',\n  'teal',\n  'orange',\n  'yellow',\n  'lime'\n]\n\nconst createVariants = () =>\n  Object.fromEntries(\n    colorNames.flatMap((c) => [\n      [`${c}1`, { colorName: c, color0: 'white' }],\n      [`${c}2`, { colorName: c }]\n    ])\n  ) as Record<string, ColorSchemeConfig>\n\nexport const bases = createVariants()\nexport const accents = bases\n;(() => {\n  Object.entries(bases).forEach(\n    ([name, config]: [string, ColorSchemeConfig]) => {\n      const themeName = `base-${name}`\n      colorSchemes[themeName] = {\n        '--foreground': 'var(--color-grey-1000)',\n        '--foreground-7-plus': 'var(--color-white)',\n        ...generateColors({\n          prefix: 'base',\n          colorName: config.colorName,\n          color0: config.color0\n        })\n      }\n    }\n  )\n\n  Object.entries(accents).forEach(\n    ([name, config]: [string, ColorSchemeConfig]) => {\n      colorSchemes[`accent-${name}`] = generateColors({\n        prefix: 'accent',\n        colorName: config.colorName,\n        color0: config.color0\n      })\n    }\n  )\n})()\n"],"mappings":";AASA,IAAM,kBAAkB,EACtB,QACA,WACA,SAAS,SAKQ;CACjB,MAAM,SAAiC,EAAE;CACzC,IAAI,IAAI;AACR,KAAI,QAAQ;AACV,SAAO,KAAK,OAAO,GAAG,OAAO,eAAe,OAAO;AACnD;;CAEF,IAAI,IAAI;AACR,QAAQ,KAAK,IAAI,KAAK;AACpB,SAAO,KAAK,OAAO,GAAG,OAAO,eAAe,UAAU,GAAG,IAAI,IAAI;AACjE;;AAEF,QAAO;;AAGT,IAAa,eAA4C,EAAE;AAK3D,aAAa,4BAA4B;CACvC,4BAA4B;CAC5B,mBAAmB;CACnB,mBAAmB;CACnB,mBAAmB;CACpB;AAED,aAAa,4BAA4B;CACvC,4BAA4B;CAC5B,mBAAmB;CACnB,mBAAmB;CACnB,mBAAmB;CACpB;AAED,IAAM,aAAa;CACjB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,IAAM,uBACJ,OAAO,YACL,WAAW,SAAS,MAAM,CACxB,CAAC,GAAG,EAAE,IAAI;CAAE,WAAW;CAAG,QAAQ;CAAS,CAAC,EAC5C,CAAC,GAAG,EAAE,IAAI,EAAE,WAAW,GAAG,CAAC,CAC5B,CAAC,CACH;AAEH,IAAa,QAAQ,gBAAgB;AACrC,IAAa,UAAU;OACf;AACN,QAAO,QAAQ,MAAM,CAAC,SACnB,CAAC,MAAM,YAAyC;EAC/C,MAAM,YAAY,QAAQ;AAC1B,eAAa,aAAa;GACxB,gBAAgB;GAChB,uBAAuB;GACvB,GAAG,eAAe;IAChB,QAAQ;IACR,WAAW,OAAO;IAClB,QAAQ,OAAO;IAChB,CAAC;GACH;GAEJ;AAED,QAAO,QAAQ,QAAQ,CAAC,SACrB,CAAC,MAAM,YAAyC;AAC/C,eAAa,UAAU,UAAU,eAAe;GAC9C,QAAQ;GACR,WAAW,OAAO;GAClB,QAAQ,OAAO;GAChB,CAAC;GAEL;IACC"}

package/dist/experiments/color-scheme/ColorScheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorScheme.js","names":[],"sources":["../../../src/experiments/color-scheme/ColorScheme.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { accents, bases, colorSchemes } from './ColorScheme.config'\n\nexport type TcolorScheme = {\n  base?: keyof typeof bases\n  accent?: keyof typeof accents\n  interactive?: 'loContrast' | 'hiContrast'\n}\n\ntype TColorSchemeOwnProps = TcolorScheme & {\n  asChild?: boolean\n}\n\ntype TColorSchemeProps = React.HTMLAttributes<HTMLDivElement> &\n  TColorSchemeOwnProps\n\n/**\n * @experimental Component has not been finalised. Further design input required. Use with caution.\n */\nexport const ColorScheme = React.forwardRef<HTMLDivElement, TColorSchemeProps>(\n  (\n    { base = '', accent = '', interactive = '', asChild = false, ...rest },\n    ref\n  ) => {\n    const Component = asChild ? Slot : 'div'\n\n    // Build style object - config ensures values are always strings (never undefined)\n    const style = {\n      ...(interactive && colorSchemes[`interactive-${interactive}`]),\n      ...(accent && colorSchemes[`accent-${accent}`]),\n      ...(base && colorSchemes[`base-${base}`])\n    } as React.CSSProperties\n\n    return <Component {...rest} ref={ref} style={style} />\n  }\n)\n\nColorScheme.displayName = 'ColorScheme'\n"],"mappings":";;;;;;;AAqBA,IAAa,cAAc,QAAM,YAE7B,EAAE,OAAO,IAAI,SAAS,IAAI,cAAc,IAAI,UAAU,OAAO,GAAG,QAChE,QACG;CACH,MAAM,YAAY,UAAU,OAAO;CAGnC,MAAM,QAAQ;EACZ,GAAI,eAAe,aAAa,eAAe;EAC/C,GAAI,UAAU,aAAa,UAAU;EACrC,GAAI,QAAQ,aAAa,QAAQ;CACnC;CAEA,OAAO,wBAAA,cAAC,WAAD;EAAW,GAAI;EAAW;EAAY;CAAQ,CAAA;AACvD,CACF;AAEA,YAAY,cAAc"}
+{"version":3,"file":"ColorScheme.js","names":[],"sources":["../../../src/experiments/color-scheme/ColorScheme.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot'\nimport * as React from 'react'\n\nimport { accents, bases, colorSchemes } from './ColorScheme.config'\n\nexport type TcolorScheme = {\n  base?: keyof typeof bases\n  accent?: keyof typeof accents\n  interactive?: 'loContrast' | 'hiContrast'\n}\n\ntype TColorSchemeOwnProps = TcolorScheme & {\n  asChild?: boolean\n}\n\ntype TColorSchemeProps = React.HTMLAttributes<HTMLDivElement> &\n  TColorSchemeOwnProps\n\n/**\n * @experimental Component has not been finalised. Further design input required. Use with caution.\n */\nexport const ColorScheme = React.forwardRef<HTMLDivElement, TColorSchemeProps>(\n  (\n    { base = '', accent = '', interactive = '', asChild = false, ...rest },\n    ref\n  ) => {\n    const Component = asChild ? Slot : 'div'\n\n    // Build style object - config ensures values are always strings (never undefined)\n    const style = {\n      ...(interactive && colorSchemes[`interactive-${interactive}`]),\n      ...(accent && colorSchemes[`accent-${accent}`]),\n      ...(base && colorSchemes[`base-${base}`])\n    } as React.CSSProperties\n\n    return <Component {...rest} ref={ref} style={style} />\n  }\n)\n\nColorScheme.displayName = 'ColorScheme'\n"],"mappings":";;;;;;;AAqBA,IAAa,cAAc,QAAM,YAE7B,EAAE,OAAO,IAAI,SAAS,IAAI,cAAc,IAAI,UAAU,OAAO,GAAG,QAChE,QACG;CACH,MAAM,YAAY,UAAU,OAAO;CAGnC,MAAM,QAAQ;EACZ,GAAI,eAAe,aAAa,eAAe;EAC/C,GAAI,UAAU,aAAa,UAAU;EACrC,GAAI,QAAQ,aAAa,QAAQ;EAClC;AAED,QAAO,wBAAA,cAAC,WAAD;EAAW,GAAI;EAAW;EAAY;EAAS,CAAA;EAEzD;AAED,YAAY,cAAc"}