@atom-learning/components 2.29.1 → 2.31.0-beta.0

package/dist/experiments/color-scheme/stitches.colorscheme.config.d.ts

@@ -0,0 +1,256 @@
+export declare const colorSchemes: {};
+export declare const styled: {
+    withConfig: (config: {
+        componentId?: string | undefined;
+        displayName?: string | undefined;
+        shouldForwardStitchesProp?: ((prop: "css" | (string & {})) => boolean | void) | undefined;
+    }) => import("@stitches/react/types/stitches").StyledFunctionType<{
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        reducedMotion: string;
+        allowMotion: string;
+        hover: string;
+    }, {
+        colors: {
+            slate1: any;
+            slate2: any;
+            slate3: any;
+            slate4: any;
+            slate5: any;
+            slate6: any;
+            slate7: any;
+            slate8: any;
+            slate9: any;
+            slate10: any;
+            blue1: any;
+            blue2: any;
+            blue3: any;
+            blue4: any;
+            blue5: any;
+            blue6: any;
+            blue7: any;
+            blue8: any;
+            blue9: any;
+            blue10: any;
+            background: any;
+            foreground: any;
+            foreground6plus: any;
+        };
+    }, import("@stitches/react/types/config").DefaultThemeMap, {
+        bg: (value: import("@stitches/react/types/css-util").WithPropertyValue<"background">) => {
+            background: import("@stitches/react/types/css-util").WithPropertyValue<"background">;
+        };
+        size: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"size">) => {
+            height: string | number | import("@stitches/react/types/css-util").WithScaleValue<"size">;
+            width: string | number | import("@stitches/react/types/css-util").WithScaleValue<"size">;
+        };
+        p: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            padding: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        pt: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            paddingTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        pr: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            paddingRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        pb: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            paddingBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        pl: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            paddingLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        px: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            paddingLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+            paddingRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        py: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            paddingTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+            paddingBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        m: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            margin: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        mt: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            marginTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        mr: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            marginRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        mb: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        ml: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            marginLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        mx: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            marginLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+            marginRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+        my: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+            marginTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+            marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        };
+    }>;
+} & import("@stitches/react/types/stitches").StyledFunctionType<{
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    reducedMotion: string;
+    allowMotion: string;
+    hover: string;
+}, {
+    colors: {
+        slate1: any;
+        slate2: any;
+        slate3: any;
+        slate4: any;
+        slate5: any;
+        slate6: any;
+        slate7: any;
+        slate8: any;
+        slate9: any;
+        slate10: any;
+        blue1: any;
+        blue2: any;
+        blue3: any;
+        blue4: any;
+        blue5: any;
+        blue6: any;
+        blue7: any;
+        blue8: any;
+        blue9: any;
+        blue10: any;
+        background: any;
+        foreground: any;
+        foreground6plus: any;
+    };
+}, import("@stitches/react/types/config").DefaultThemeMap, {
+    bg: (value: import("@stitches/react/types/css-util").WithPropertyValue<"background">) => {
+        background: import("@stitches/react/types/css-util").WithPropertyValue<"background">;
+    };
+    size: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"size">) => {
+        height: string | number | import("@stitches/react/types/css-util").WithScaleValue<"size">;
+        width: string | number | import("@stitches/react/types/css-util").WithScaleValue<"size">;
+    };
+    p: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        padding: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    pt: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        paddingTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    pr: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        paddingRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    pb: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        paddingBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    pl: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        paddingLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    px: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        paddingLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        paddingRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    py: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        paddingTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        paddingBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    m: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        margin: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    mt: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        marginTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    mr: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        marginRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    mb: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    ml: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        marginLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    mx: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        marginLeft: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        marginRight: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+    my: (value: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">) => {
+        marginTop: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+        marginBottom: string | number | import("@stitches/react/types/css-util").WithScaleValue<"space">;
+    };
+}>, createTheme: <Argument0 extends string | ({
+    colors?: {
+        slate1?: string | number | boolean | undefined;
+        slate2?: string | number | boolean | undefined;
+        slate3?: string | number | boolean | undefined;
+        slate4?: string | number | boolean | undefined;
+        slate5?: string | number | boolean | undefined;
+        slate6?: string | number | boolean | undefined;
+        slate7?: string | number | boolean | undefined;
+        slate8?: string | number | boolean | undefined;
+        slate9?: string | number | boolean | undefined;
+        slate10?: string | number | boolean | undefined;
+        blue1?: string | number | boolean | undefined;
+        blue2?: string | number | boolean | undefined;
+        blue3?: string | number | boolean | undefined;
+        blue4?: string | number | boolean | undefined;
+        blue5?: string | number | boolean | undefined;
+        blue6?: string | number | boolean | undefined;
+        blue7?: string | number | boolean | undefined;
+        blue8?: string | number | boolean | undefined;
+        blue9?: string | number | boolean | undefined;
+        blue10?: string | number | boolean | undefined;
+        background?: string | number | boolean | undefined;
+        foreground?: string | number | boolean | undefined;
+        foreground6plus?: string | number | boolean | undefined;
+    } | undefined;
+} & {
+    [x: string]: {
+        [x: string]: string | number | boolean;
+        [x: number]: string | number | boolean;
+    };
+}), Argument1 extends string | ({
+    colors?: {
+        slate1?: string | number | boolean | undefined;
+        slate2?: string | number | boolean | undefined;
+        slate3?: string | number | boolean | undefined;
+        slate4?: string | number | boolean | undefined;
+        slate5?: string | number | boolean | undefined;
+        slate6?: string | number | boolean | undefined;
+        slate7?: string | number | boolean | undefined;
+        slate8?: string | number | boolean | undefined;
+        slate9?: string | number | boolean | undefined;
+        slate10?: string | number | boolean | undefined;
+        blue1?: string | number | boolean | undefined;
+        blue2?: string | number | boolean | undefined;
+        blue3?: string | number | boolean | undefined;
+        blue4?: string | number | boolean | undefined;
+        blue5?: string | number | boolean | undefined;
+        blue6?: string | number | boolean | undefined;
+        blue7?: string | number | boolean | undefined;
+        blue8?: string | number | boolean | undefined;
+        blue9?: string | number | boolean | undefined;
+        blue10?: string | number | boolean | undefined;
+        background?: string | number | boolean | undefined;
+        foreground?: string | number | boolean | undefined;
+        foreground6plus?: string | number | boolean | undefined;
+    } | undefined;
+} & {
+    [x: string]: {
+        [x: string]: string | number | boolean;
+        [x: number]: string | number | boolean;
+    };
+})>(nameOrScalesArg0: Argument0, nameOrScalesArg1?: Argument1 | undefined) => string & {
+    className: string;
+    selector: string;
+} & (Argument0 extends string ? import("@stitches/react/types/stitches").ThemeTokens<Argument1, ""> : import("@stitches/react/types/stitches").ThemeTokens<Argument0, "">);
+export declare const bases: {
+    slate: string;
+};
+export declare const accents: {
+    slate: string;
+    blue: string;
+};

package/dist/experiments/color-scheme/stitches.colorscheme.config.js

@@ -0,0 +1 @@
+import{createStitches as u}from"@stitches/react";import a from"./blue.json.js";import i from"./slate.json.js";import{generateAlphaColors as s}from"./generateAlphaColors.js";import{utils as m,media as d}from"../../stitches.js";const e={},l=(c,o)=>{const t={};for(let n=1;n<=10;n++)t[`${c}${n}`]=`$${o}${n}`,t[`${c}A${n}`]=`$${o}A${n}`;return t},{styled:f,createTheme:r}=u({theme:{colors:{background:"white",foreground:i.slate9,foreground6plus:"white",...a,...s("blue",a),...i,...s("slate",i)}},utils:m,media:d});e["interactive-loContrast1"]=r("interactive-loContrast1",{colors:{interactiveForeground:"$foreground",interactive1:"white",interactive2:"$accent1",interactive3:"$accent2"}}),e["interactive-loContrast2"]=r("interactive-loContrast2",{colors:{interactiveForeground:"$foreground",interactive1:"$accent1",interactive2:"$accent2",interactive3:"$accent3"}}),e["interactive-hiContrast1"]=r("interactive-hiContrast1",{colors:{interactiveForeground:"$foreground6plus",interactive1:"$accent7",interactive2:"$accent8",interactive3:"$accent9"}}),e["interactive-hiContrast2"]=r("interactive-hiContrast2",{colors:{interactiveForeground:"$foreground6plus",interactive1:"$accent8",interactive2:"$accent9",interactive3:"$accent10"}});const $={slate:"slate"},h=()=>{Object.entries($).forEach(([c,o])=>{const t=`base-${c}`;e[t]=r(t,{colors:l("base",o)})})},v={slate:"slate",blue:"blue"},g=()=>{Object.entries(v).forEach(([c,o])=>{const t=`accent-${c}`;e[t]=r(t,{colors:l("accent",o)})})};h(),g();export{v as accents,$ as bases,e as colorSchemes,r as createTheme,f as styled};