npm - oneslash-design-system - Versions diffs - 2.0.4 → 2.1.0 - Mend

oneslash-design-system 2.0.4 → 2.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/README.md +1 -0
package/dist/components/textField.jsx +3 -3
package/dist/components/textarea.jsx +3 -3
package/dist/designTokens.d.ts +918 -0
package/dist/designTokens.js +47 -2
package/dist/themes/clay-auto.css +251 -0
package/dist/themes/clay.css +167 -0
package/dist/themes/indigo-auto.css +251 -0
package/dist/themes/indigo.css +167 -0
package/dist/themes/wine-auto.css +251 -0
package/dist/themes/wine.css +167 -0
package/package.json +1 -1

package/dist/designTokens.d.ts CHANGED Viewed

@@ -613,6 +613,924 @@ declare const forestSets: {
 export { defaultSets as colors };
 export declare namespace themes {
     export { forestSets as forest };
+    export let clay: {
+        light: {
+            text: {
+                primary: string;
+                secondary: string;
+                disabled: string;
+                contrast: string;
+            };
+            accent: {
+                main: string;
+                dark: string;
+                light: string;
+                contrast: string;
+            };
+            primary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            error: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            background: {
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            action: {
+                active: string;
+                hover: string;
+                selected: string;
+                disabledBackground: string;
+                disabled: string;
+            };
+            actionBackground: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            actionOutlinedBorder: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            misc: {
+                divider: string;
+                scrim: string;
+                tooltipBg: string;
+                tooltipText: string;
+            };
+        } & {
+            primary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            background: {
+                elevated: string;
+                overlay: string;
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            error: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+        };
+        dark: {
+            text: {
+                primary: string;
+                secondary: string;
+                disabled: string;
+                contrast: string;
+            };
+            accent: {
+                main: string;
+                dark: string;
+                light: string;
+                contrast: string;
+            };
+            primary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            error: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            background: {
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            action: {
+                active: string;
+                hover: string;
+                selected: string;
+                disabledBackground: string;
+                disabled: string;
+            };
+            actionBackground: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            actionOutlinedBorder: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            misc: {
+                divider: string;
+                scrim: string;
+                tooltipBg: string;
+                tooltipText: string;
+            };
+        } & {
+            primary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            background: {
+                elevated: string;
+                overlay: string;
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            error: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+        };
+    };
+    export let indigo: {
+        light: {
+            text: {
+                primary: string;
+                secondary: string;
+                disabled: string;
+                contrast: string;
+            };
+            accent: {
+                main: string;
+                dark: string;
+                light: string;
+                contrast: string;
+            };
+            primary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            error: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            background: {
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            action: {
+                active: string;
+                hover: string;
+                selected: string;
+                disabledBackground: string;
+                disabled: string;
+            };
+            actionBackground: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            actionOutlinedBorder: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            misc: {
+                divider: string;
+                scrim: string;
+                tooltipBg: string;
+                tooltipText: string;
+            };
+        } & {
+            primary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            background: {
+                elevated: string;
+                overlay: string;
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            error: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+        };
+        dark: {
+            text: {
+                primary: string;
+                secondary: string;
+                disabled: string;
+                contrast: string;
+            };
+            accent: {
+                main: string;
+                dark: string;
+                light: string;
+                contrast: string;
+            };
+            primary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            error: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            background: {
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            action: {
+                active: string;
+                hover: string;
+                selected: string;
+                disabledBackground: string;
+                disabled: string;
+            };
+            actionBackground: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            actionOutlinedBorder: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            misc: {
+                divider: string;
+                scrim: string;
+                tooltipBg: string;
+                tooltipText: string;
+            };
+        } & {
+            primary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            background: {
+                elevated: string;
+                overlay: string;
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            error: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+        };
+    };
+    export let wine: {
+        light: {
+            text: {
+                primary: string;
+                secondary: string;
+                disabled: string;
+                contrast: string;
+            };
+            accent: {
+                main: string;
+                dark: string;
+                light: string;
+                contrast: string;
+            };
+            primary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            error: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            background: {
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            action: {
+                active: string;
+                hover: string;
+                selected: string;
+                disabledBackground: string;
+                disabled: string;
+            };
+            actionBackground: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            actionOutlinedBorder: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            misc: {
+                divider: string;
+                scrim: string;
+                tooltipBg: string;
+                tooltipText: string;
+            };
+        } & {
+            primary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            background: {
+                elevated: string;
+                overlay: string;
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            error: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+        };
+        dark: {
+            text: {
+                primary: string;
+                secondary: string;
+                disabled: string;
+                contrast: string;
+            };
+            accent: {
+                main: string;
+                dark: string;
+                light: string;
+                contrast: string;
+            };
+            primary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                main: string;
+                dark: string;
+                light: string;
+            };
+            error: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            background: {
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            action: {
+                active: string;
+                hover: string;
+                selected: string;
+                disabledBackground: string;
+                disabled: string;
+            };
+            actionBackground: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            actionOutlinedBorder: {
+                enabled: string;
+                hovered: string;
+                selected: string;
+                disabled: string;
+            };
+            misc: {
+                divider: string;
+                scrim: string;
+                tooltipBg: string;
+                tooltipText: string;
+            };
+        } & {
+            primary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            secondary: {
+                contrast: string;
+                main: string;
+                dark: string;
+                light: string;
+            };
+            background: {
+                elevated: string;
+                overlay: string;
+                default: string;
+                accent100: string;
+                accent200: string;
+                accent300: string;
+            };
+            error: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            warning: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            info: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+            success: {
+                fill: string;
+                onFill: string;
+                text: string;
+                textHover: string;
+                tint: string;
+                main: string;
+                dark: string;
+                light: string;
+                alertBg: string;
+                contrast: string;
+            };
+        };
+    };
 }
 export declare namespace spacing {
     let small: string;