@atom-learning/components 6.4.2 → 6.5.0

package/dist/components/tree/TreeText.js

@@ -1,2 +1,14 @@
-import t from"clsx";import o from"react";import{Text as r}from"../text/Text.js";const s=e=>o.createElement(r,{as:"span",className:t("py-0.5","whitespace-nowrap","overflow-x-hidden","text-ellipsis",e.className),size:"md",...e});export{s as TreeText};
-//# sourceMappingURL=TreeText.js.map
+import { Text as e } from "../text/Text.js";
+import t from "clsx";
+import n from "react";
+//#region src/components/tree/TreeText.tsx
+var r = (r) => /* @__PURE__ */ n.createElement(e, {
+	as: "span",
+	className: t("py-0.5", "whitespace-nowrap", "overflow-x-hidden", "text-ellipsis", r.className),
+	size: "md",
+	...r
+});
+//#endregion
+export { r as TreeText };
+
+//# sourceMappingURL=TreeText.js.map

package/dist/components/tree/TreeText.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeText.js","sources":["../../../src/components/tree/TreeText.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Text } from '~/components/text/Text'\n\ntype TStyledTreeTextProps = React.ComponentProps<typeof Text>\n\nexport const TreeText = (props: TStyledTreeTextProps): JSX.Element => (\n  <Text\n    as=\"span\"\n    className={clsx(\n      'py-0.5',\n      'whitespace-nowrap',\n      'overflow-x-hidden',\n      'text-ellipsis',\n      props.className\n    )}\n    size=\"md\"\n    {...props}\n  />\n)\n"],"names":["TreeText","props","React","Text","clsx"],"mappings":"gFAOO,MAAMA,EAAYC,GACvBC,EAAA,cAACC,EAAA,CACC,GAAG,OACH,UAAWC,EACT,SACA,oBACA,oBACA,gBACAH,EAAM,SACR,EACA,KAAK,KACJ,GAAGA,CACN,CAAA"}
+{"version":3,"file":"TreeText.js","names":[],"sources":["../../../src/components/tree/TreeText.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Text } from '~/components/text/Text'\n\ntype TStyledTreeTextProps = React.ComponentProps<typeof Text>\n\nexport const TreeText = (props: TStyledTreeTextProps): JSX.Element => (\n  <Text\n    as=\"span\"\n    className={clsx(\n      'py-0.5',\n      'whitespace-nowrap',\n      'overflow-x-hidden',\n      'text-ellipsis',\n      props.className\n    )}\n    size=\"md\"\n    {...props}\n  />\n)\n"],"mappings":";;;;AAOA,IAAa,KAAY,MACvB,kBAAA,cAAC,GAAD;CACE,IAAG;CACH,WAAW,EACT,UACA,qBACA,qBACA,iBACA,EAAM,UACP;CACD,MAAK;CACL,GAAI;CACJ,CAAA"}

package/dist/components/video/Video.js

@@ -1,2 +1,21 @@
-import*as e from"react";import m from"react-player/vimeo";import{CSSWrapper as s}from"../../utilities/css-wrapper/CSSWrapper.js";const r=e.forwardRef(({id:t,ratio:o=9/16,className:a,...i},l)=>e.createElement(s,{className:a},e.createElement("div",{style:{"--ratio":`${o*100}%`},className:"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)"},e.createElement(m,{...i,role:"figure",url:`https://player.vimeo.com/video/${t}`,height:"100%",width:"100%",ref:l,className:"absolute top-0 left-0"}))));r.displayName="Video";export{r as Video};
-//# sourceMappingURL=Video.js.map
+import { CSSWrapper as e } from "../../utilities/css-wrapper/CSSWrapper.js";
+import * as t from "react";
+import n from "react-player/vimeo";
+//#region src/components/video/Video.tsx
+var r = t.forwardRef(({ id: r, ratio: i = 9 / 16, className: a, ...o }, s) => /* @__PURE__ */ t.createElement(e, { className: a }, /* @__PURE__ */ t.createElement("div", {
+	style: { "--ratio": `${i * 100}%` },
+	className: "relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)"
+}, /* @__PURE__ */ t.createElement(n, {
+	...o,
+	role: "figure",
+	url: `https://player.vimeo.com/video/${r}`,
+	height: "100%",
+	width: "100%",
+	ref: s,
+	className: "absolute top-0 left-0"
+}))));
+r.displayName = "Video";
+//#endregion
+export { r as Video };
+
+//# sourceMappingURL=Video.js.map

package/dist/components/video/Video.js.map

@@ -1 +1 @@
-{"version":3,"file":"Video.js","sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size  https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo'\n\nimport { CSSWrapper } from '~/utilities/css-wrapper/CSSWrapper'\nimport { Override } from '~/utilities/types'\n\ntype VideoProps = Override<\n  React.ComponentProps<typeof ReactPlayer>,\n  {\n    id: string\n    ratio?: number\n    className?: string\n  }\n>\n\nexport const Video = React.forwardRef<any, VideoProps>(\n  ({ id, ratio = 9 / 16, className, ...remainingProps }, ref) => (\n    <CSSWrapper className={className}>\n      <div\n        style={{ '--ratio': `${ratio * 100}%` }}\n        className=\"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)\"\n      >\n        <ReactPlayer\n          {...remainingProps}\n          role=\"figure\"\n          url={`https://player.vimeo.com/video/${id}`}\n          height=\"100%\"\n          width=\"100%\"\n          ref={ref}\n          className=\"absolute top-0 left-0\"\n        />\n      </div>\n    </CSSWrapper>\n  )\n)\n\nVideo.displayName = 'Video'\n"],"names":["Video","React","id","ratio","className","remainingProps","ref","CSSWrapper","ReactPlayer"],"mappings":"iIAgBa,MAAAA,EAAQC,EAAM,WACzB,CAAC,CAAE,GAAAC,EAAI,MAAAC,EAAQ,EAAI,GAAI,UAAAC,EAAW,GAAGC,CAAe,EAAGC,IACrDL,EAAA,cAACM,EAAA,CAAW,UAAWH,GACrBH,EAAA,cAAC,MACC,CAAA,MAAO,CAAE,UAAW,GAAGE,EAAQ,GAAG,GAAI,EACtC,UAAU,6DAAA,EAEVF,EAAA,cAACO,EAAA,CACE,GAAGH,EACJ,KAAK,SACL,IAAK,kCAAkCH,CAAE,GACzC,OAAO,OACP,MAAM,OACN,IAAKI,EACL,UAAU,wBACZ,CACF,CACF,CAEJ,EAEAN,EAAM,YAAc"}
+{"version":3,"file":"Video.js","names":[],"sources":["../../../src/components/video/Video.tsx"],"sourcesContent":["import * as React from 'react'\n// Note: Only loading vimeo to reduce the bundle size  https://www.npmjs.com/package/react-player\nimport ReactPlayer from 'react-player/vimeo'\n\nimport { CSSWrapper } from '~/utilities/css-wrapper/CSSWrapper'\nimport { Override } from '~/utilities/types'\n\ntype VideoProps = Override<\n  React.ComponentProps<typeof ReactPlayer>,\n  {\n    id: string\n    ratio?: number\n    className?: string\n  }\n>\n\nexport const Video = React.forwardRef<any, VideoProps>(\n  ({ id, ratio = 9 / 16, className, ...remainingProps }, ref) => (\n    <CSSWrapper className={className}>\n      <div\n        style={{ '--ratio': `${ratio * 100}%` }}\n        className=\"relative h-0 w-full overflow-hidden rounded-sm pt-(--ratio)\"\n      >\n        <ReactPlayer\n          {...remainingProps}\n          role=\"figure\"\n          url={`https://player.vimeo.com/video/${id}`}\n          height=\"100%\"\n          width=\"100%\"\n          ref={ref}\n          className=\"absolute top-0 left-0\"\n        />\n      </div>\n    </CSSWrapper>\n  )\n)\n\nVideo.displayName = 'Video'\n"],"mappings":";;;;AAgBA,IAAa,IAAQ,EAAM,YACxB,EAAE,OAAI,WAAQ,IAAI,IAAI,cAAW,GAAG,KAAkB,MACrD,kBAAA,cAAC,GAAD,EAAuB,cAeV,EAdX,kBAAA,cAAC,OAAD;CACE,OAAO,EAAE,WAAW,GAAG,IAAQ,IAAI,IAAI;CACvC,WAAU;CAWN,EATJ,kBAAA,cAAC,GAAD;CACE,GAAI;CACJ,MAAK;CACL,KAAK,kCAAkC;CACvC,QAAO;CACP,OAAM;CACD;CACL,WAAU;CACV,CAAA,CACE,CACK,CAEhB;AAED,EAAM,cAAc"}

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

@@ -1,2 +1,172 @@
-const m=({prefix:e,colorName:o,color0:a=""})=>{const c={};let r=1;a&&(c[`--${e}-${r}`]=`var(--color-${a})`,r++);let t=1;for(r;r<=11;r++)c[`--${e}-${r}`]=`var(--color-${o}-${t*100})`,t++;return c},l={};l["interactive-loContrast"]={"--interactive-foreground":"var(--foreground)","--interactive-1":"var(--accent-1)","--interactive-2":"var(--accent-2)","--interactive-3":"var(--accent-3)"},l["interactive-hiContrast"]={"--interactive-foreground":"var(--foreground-7-plus)","--interactive-1":"var(--accent-9)","--interactive-2":"var(--accent-10)","--interactive-3":"var(--accent-11)"};const i={primary1:{colorName:"primary",color0:"white"},primary2:{colorName:"primary"},grey1:{colorName:"grey",color0:"white"},grey2:{colorName:"grey"},blue1:{colorName:"blue",color0:"white"},blue2:{colorName:"blue"},pink1:{colorName:"pink",color0:"white"},pink2:{colorName:"pink"},purple1:{colorName:"purple",color0:"white"},purple2:{colorName:"purple"},cyan1:{colorName:"cyan",color0:"white"},cyan2:{colorName:"cyan"},green1:{colorName:"green",color0:"white"},green2:{colorName:"green"},magenta1:{colorName:"magenta",color0:"white"},magenta2:{colorName:"magenta"},red1:{colorName:"red",color0:"white"},red2:{colorName:"red"},teal1:{colorName:"teal",color0:"white"},teal2:{colorName:"teal"},orange1:{colorName:"orange",color0:"white"},orange2:{colorName:"orange"},yellow1:{colorName:"yellow",color0:"white"},yellow2:{colorName:"yellow"},lime1:{colorName:"lime",color0:"white"},lime2:{colorName:"lime"}},n={primary1:{colorName:"primary",color0:"white"},primary2:{colorName:"primary"},grey1:{colorName:"grey",color0:"white"},grey2:{colorName:"grey"},blue1:{colorName:"blue",color0:"white"},blue2:{colorName:"blue"},pink1:{colorName:"pink",color0:"white"},pink2:{colorName:"pink"},purple1:{colorName:"purple",color0:"white"},purple2:{colorName:"purple"},cyan1:{colorName:"cyan",color0:"white"},cyan2:{colorName:"cyan"},green1:{colorName:"green",color0:"white"},green2:{colorName:"green"},magenta1:{colorName:"magenta",color0:"white"},magenta2:{colorName:"magenta"},red1:{colorName:"red",color0:"white"},red2:{colorName:"red"},teal1:{colorName:"teal",color0:"white"},teal2:{colorName:"teal"},orange1:{colorName:"orange",color0:"white"},orange2:{colorName:"orange"},yellow1:{colorName:"yellow",color0:"white"},yellow2:{colorName:"yellow"},lime1:{colorName:"lime",color0:"white"},lime2:{colorName:"lime"}};Object.entries(i).forEach(([e,o])=>{const a=`base-${e}`;l[a]={"--foreground":"var(--color-grey-1000)","--foreground-7-plus":"var(--color-white)",...m({prefix:"base",colorName:o.colorName,color0:o.color0})}}),Object.entries(n).forEach(([e,o])=>{l[`accent-${e}`]=m({prefix:"accent",colorName:o.colorName,color0:o.color0})});export{n as accents,i as bases,l as colorSchemes};
-//# sourceMappingURL=ColorScheme.config.js.map
+//#region src/experiments/color-scheme/ColorScheme.config.ts
+var e = ({ prefix: e, colorName: t, color0: n = "" }) => {
+	let r = {}, i = 1;
+	n && (r[`--${e}-${i}`] = `var(--color-${n})`, i++);
+	let a = 1;
+	for (; i <= 11; i++) r[`--${e}-${i}`] = `var(--color-${t}-${a * 100})`, a++;
+	return r;
+}, t = {};
+t["interactive-loContrast"] = {
+	"--interactive-foreground": "var(--foreground)",
+	"--interactive-1": "var(--accent-1)",
+	"--interactive-2": "var(--accent-2)",
+	"--interactive-3": "var(--accent-3)"
+}, t["interactive-hiContrast"] = {
+	"--interactive-foreground": "var(--foreground-7-plus)",
+	"--interactive-1": "var(--accent-9)",
+	"--interactive-2": "var(--accent-10)",
+	"--interactive-3": "var(--accent-11)"
+}, Object.entries({
+	primary1: {
+		colorName: "primary",
+		color0: "white"
+	},
+	primary2: { colorName: "primary" },
+	grey1: {
+		colorName: "grey",
+		color0: "white"
+	},
+	grey2: { colorName: "grey" },
+	blue1: {
+		colorName: "blue",
+		color0: "white"
+	},
+	blue2: { colorName: "blue" },
+	pink1: {
+		colorName: "pink",
+		color0: "white"
+	},
+	pink2: { colorName: "pink" },
+	purple1: {
+		colorName: "purple",
+		color0: "white"
+	},
+	purple2: { colorName: "purple" },
+	cyan1: {
+		colorName: "cyan",
+		color0: "white"
+	},
+	cyan2: { colorName: "cyan" },
+	green1: {
+		colorName: "green",
+		color0: "white"
+	},
+	green2: { colorName: "green" },
+	magenta1: {
+		colorName: "magenta",
+		color0: "white"
+	},
+	magenta2: { colorName: "magenta" },
+	red1: {
+		colorName: "red",
+		color0: "white"
+	},
+	red2: { colorName: "red" },
+	teal1: {
+		colorName: "teal",
+		color0: "white"
+	},
+	teal2: { colorName: "teal" },
+	orange1: {
+		colorName: "orange",
+		color0: "white"
+	},
+	orange2: { colorName: "orange" },
+	yellow1: {
+		colorName: "yellow",
+		color0: "white"
+	},
+	yellow2: { colorName: "yellow" },
+	lime1: {
+		colorName: "lime",
+		color0: "white"
+	},
+	lime2: { colorName: "lime" }
+}).forEach(([n, r]) => {
+	let i = `base-${n}`;
+	t[i] = {
+		"--foreground": "var(--color-grey-1000)",
+		"--foreground-7-plus": "var(--color-white)",
+		...e({
+			prefix: "base",
+			colorName: r.colorName,
+			color0: r.color0
+		})
+	};
+}), Object.entries({
+	primary1: {
+		colorName: "primary",
+		color0: "white"
+	},
+	primary2: { colorName: "primary" },
+	grey1: {
+		colorName: "grey",
+		color0: "white"
+	},
+	grey2: { colorName: "grey" },
+	blue1: {
+		colorName: "blue",
+		color0: "white"
+	},
+	blue2: { colorName: "blue" },
+	pink1: {
+		colorName: "pink",
+		color0: "white"
+	},
+	pink2: { colorName: "pink" },
+	purple1: {
+		colorName: "purple",
+		color0: "white"
+	},
+	purple2: { colorName: "purple" },
+	cyan1: {
+		colorName: "cyan",
+		color0: "white"
+	},
+	cyan2: { colorName: "cyan" },
+	green1: {
+		colorName: "green",
+		color0: "white"
+	},
+	green2: { colorName: "green" },
+	magenta1: {
+		colorName: "magenta",
+		color0: "white"
+	},
+	magenta2: { colorName: "magenta" },
+	red1: {
+		colorName: "red",
+		color0: "white"
+	},
+	red2: { colorName: "red" },
+	teal1: {
+		colorName: "teal",
+		color0: "white"
+	},
+	teal2: { colorName: "teal" },
+	orange1: {
+		colorName: "orange",
+		color0: "white"
+	},
+	orange2: { colorName: "orange" },
+	yellow1: {
+		colorName: "yellow",
+		color0: "white"
+	},
+	yellow2: { colorName: "yellow" },
+	lime1: {
+		colorName: "lime",
+		color0: "white"
+	},
+	lime2: { colorName: "lime" }
+}).forEach(([n, r]) => {
+	t[`accent-${n}`] = e({
+		prefix: "accent",
+		colorName: r.colorName,
+		color0: r.color0
+	});
+});
+//#endregion
+export { t as colorSchemes };
+
+//# sourceMappingURL=ColorScheme.config.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ColorScheme.config.js","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\nexport const bases = {\n  primary1: { colorName: 'primary', color0: 'white' },\n  primary2: { colorName: 'primary' },\n  grey1: { colorName: 'grey', color0: 'white' },\n  grey2: { colorName: 'grey' },\n  blue1: { colorName: 'blue', color0: 'white' },\n  blue2: { colorName: 'blue' },\n  pink1: { colorName: 'pink', color0: 'white' },\n  pink2: { colorName: 'pink' },\n  purple1: { colorName: 'purple', color0: 'white' },\n  purple2: { colorName: 'purple' },\n  cyan1: { colorName: 'cyan', color0: 'white' },\n  cyan2: { colorName: 'cyan' },\n  green1: { colorName: 'green', color0: 'white' },\n  green2: { colorName: 'green' },\n  magenta1: { colorName: 'magenta', color0: 'white' },\n  magenta2: { colorName: 'magenta' },\n  red1: { colorName: 'red', color0: 'white' },\n  red2: { colorName: 'red' },\n  teal1: { colorName: 'teal', color0: 'white' },\n  teal2: { colorName: 'teal' },\n  orange1: { colorName: 'orange', color0: 'white' },\n  orange2: { colorName: 'orange' },\n  yellow1: { colorName: 'yellow', color0: 'white' },\n  yellow2: { colorName: 'yellow' },\n  lime1: { colorName: 'lime', color0: 'white' },\n  lime2: { colorName: 'lime' }\n} satisfies Record<string, ColorSchemeConfig>\n\nexport const accents = {\n  primary1: { colorName: 'primary', color0: 'white' },\n  primary2: { colorName: 'primary' },\n  grey1: { colorName: 'grey', color0: 'white' },\n  grey2: { colorName: 'grey' },\n  blue1: { colorName: 'blue', color0: 'white' },\n  blue2: { colorName: 'blue' },\n  pink1: { colorName: 'pink', color0: 'white' },\n  pink2: { colorName: 'pink' },\n  purple1: { colorName: 'purple', color0: 'white' },\n  purple2: { colorName: 'purple' },\n  cyan1: { colorName: 'cyan', color0: 'white' },\n  cyan2: { colorName: 'cyan' },\n  green1: { colorName: 'green', color0: 'white' },\n  green2: { colorName: 'green' },\n  magenta1: { colorName: 'magenta', color0: 'white' },\n  magenta2: { colorName: 'magenta' },\n  red1: { colorName: 'red', color0: 'white' },\n  red2: { colorName: 'red' },\n  teal1: { colorName: 'teal', color0: 'white' },\n  teal2: { colorName: 'teal' },\n  orange1: { colorName: 'orange', color0: 'white' },\n  orange2: { colorName: 'orange' },\n  yellow1: { colorName: 'yellow', color0: 'white' },\n  yellow2: { colorName: 'yellow' },\n  lime1: { colorName: 'lime', color0: 'white' },\n  lime2: { colorName: 'lime' }\n} satisfies Record<string, ColorSchemeConfig>\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"],"names":["generateColors","prefix","colorName","color0","colors","i","k","colorSchemes","bases","accents","name","config","themeName"],"mappings":"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"}
+{"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\nexport const bases = {\n  primary1: { colorName: 'primary', color0: 'white' },\n  primary2: { colorName: 'primary' },\n  grey1: { colorName: 'grey', color0: 'white' },\n  grey2: { colorName: 'grey' },\n  blue1: { colorName: 'blue', color0: 'white' },\n  blue2: { colorName: 'blue' },\n  pink1: { colorName: 'pink', color0: 'white' },\n  pink2: { colorName: 'pink' },\n  purple1: { colorName: 'purple', color0: 'white' },\n  purple2: { colorName: 'purple' },\n  cyan1: { colorName: 'cyan', color0: 'white' },\n  cyan2: { colorName: 'cyan' },\n  green1: { colorName: 'green', color0: 'white' },\n  green2: { colorName: 'green' },\n  magenta1: { colorName: 'magenta', color0: 'white' },\n  magenta2: { colorName: 'magenta' },\n  red1: { colorName: 'red', color0: 'white' },\n  red2: { colorName: 'red' },\n  teal1: { colorName: 'teal', color0: 'white' },\n  teal2: { colorName: 'teal' },\n  orange1: { colorName: 'orange', color0: 'white' },\n  orange2: { colorName: 'orange' },\n  yellow1: { colorName: 'yellow', color0: 'white' },\n  yellow2: { colorName: 'yellow' },\n  lime1: { colorName: 'lime', color0: 'white' },\n  lime2: { colorName: 'lime' }\n} satisfies Record<string, ColorSchemeConfig>\n\nexport const accents = {\n  primary1: { colorName: 'primary', color0: 'white' },\n  primary2: { colorName: 'primary' },\n  grey1: { colorName: 'grey', color0: 'white' },\n  grey2: { colorName: 'grey' },\n  blue1: { colorName: 'blue', color0: 'white' },\n  blue2: { colorName: 'blue' },\n  pink1: { colorName: 'pink', color0: 'white' },\n  pink2: { colorName: 'pink' },\n  purple1: { colorName: 'purple', color0: 'white' },\n  purple2: { colorName: 'purple' },\n  cyan1: { colorName: 'cyan', color0: 'white' },\n  cyan2: { colorName: 'cyan' },\n  green1: { colorName: 'green', color0: 'white' },\n  green2: { colorName: 'green' },\n  magenta1: { colorName: 'magenta', color0: 'white' },\n  magenta2: { colorName: 'magenta' },\n  red1: { colorName: 'red', color0: 'white' },\n  red2: { colorName: 'red' },\n  teal1: { colorName: 'teal', color0: 'white' },\n  teal2: { colorName: 'teal' },\n  orange1: { colorName: 'orange', color0: 'white' },\n  orange2: { colorName: 'orange' },\n  yellow1: { colorName: 'yellow', color0: 'white' },\n  yellow2: { colorName: 'yellow' },\n  lime1: { colorName: 'lime', color0: 'white' },\n  lime2: { colorName: 'lime' }\n} satisfies Record<string, ColorSchemeConfig>\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":"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"}

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

@@ -1,2 +1,21 @@
-import{Slot as f}from"@radix-ui/react-slot";import*as c from"react";import{colorSchemes as e}from"./ColorScheme.config.js";const a=c.forwardRef(({base:r="",accent:o="",interactive:t="",asChild:m=!1,...i},n)=>{const s=m?f:"div",l={...t&&e[`interactive-${t}`],...o&&e[`accent-${o}`],...r&&e[`base-${r}`]};return c.createElement(s,{...i,ref:n,style:l})});a.displayName="ColorScheme";export{a as ColorScheme};
-//# sourceMappingURL=ColorScheme.js.map
+import { colorSchemes as e } from "./ColorScheme.config.js";
+import * as t from "react";
+import { Slot as n } from "@radix-ui/react-slot";
+//#region src/experiments/color-scheme/ColorScheme.tsx
+var r = t.forwardRef(({ base: r = "", accent: i = "", interactive: a = "", asChild: o = !1, ...s }, c) => {
+	let l = o ? n : "div", u = {
+		...a && e[`interactive-${a}`],
+		...i && e[`accent-${i}`],
+		...r && e[`base-${r}`]
+	};
+	return /* @__PURE__ */ t.createElement(l, {
+		...s,
+		ref: c,
+		style: u
+	});
+});
+r.displayName = "ColorScheme";
+//#endregion
+export { r as ColorScheme };
+
+//# sourceMappingURL=ColorScheme.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ColorScheme.js","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"],"names":["ColorScheme","React","base","accent","interactive","asChild","rest","ref","Component","Slot","style","colorSchemes"],"mappings":"iIAqBaA,EAAcC,EAAM,WAC/B,CACE,CAAE,KAAAC,EAAO,GAAI,OAAAC,EAAS,GAAI,YAAAC,EAAc,GAAI,QAAAC,EAAU,GAAO,GAAGC,CAAK,EACrEC,IACG,CACH,MAAMC,EAAYH,EAAUI,EAAO,MAG7BC,EAAQ,CACZ,GAAIN,GAAeO,EAAa,eAAeP,CAAW,EAAE,EAC5D,GAAID,GAAUQ,EAAa,UAAUR,CAAM,EAAE,EAC7C,GAAID,GAAQS,EAAa,QAAQT,CAAI,EAAE,CACzC,EAEA,OAAOD,EAAA,cAACO,EAAA,CAAW,GAAGF,EAAM,IAAKC,EAAK,MAAOG,CAAAA,CAAO,CACtD,CACF,EAEAV,EAAY,YAAc"}
+{"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,IAAc,EAAM,YAE7B,EAAE,UAAO,IAAI,YAAS,IAAI,iBAAc,IAAI,aAAU,IAAO,GAAG,KAChE,MACG;CACH,IAAM,IAAY,IAAU,IAAO,OAG7B,IAAQ;EACZ,GAAI,KAAe,EAAa,eAAe;EAC/C,GAAI,KAAU,EAAa,UAAU;EACrC,GAAI,KAAQ,EAAa,QAAQ;EAClC;AAED,QAAO,kBAAA,cAAC,GAAD;EAAW,GAAI;EAAW;EAAY;EAAS,CAAA;EAEzD;AAED,EAAY,cAAc"}