@wavv/ui 2.3.0-alpha.1 → 2.3.1

package/build/theme/eighties/light/light.js

@@ -1,561 +0,0 @@
-import common, { button as index_js_button } from "../../common/index.js";
-import colors from "../colors.js";
-import lightScale from "./lightScale.js";
-const white = '#FFFFFF';
-const light = {
-    ...common,
-    ...lightScale,
-    name: 'light',
-    button: {
-        ...index_js_button,
-        primary: {
-            color: {
-                default: white,
-                hover: white,
-                active: white
-            },
-            outlineColor: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.brand,
-                hover: colors.brandShade1,
-                active: colors.brandShade2
-            },
-            outlineBackground: {
-                default: colors.brandTint0,
-                hover: colors.brandTint1,
-                active: colors.brandTint2
-            },
-            border: {
-                default: colors.brand,
-                hover: colors.brandShade1,
-                active: colors.brandShade2
-            },
-            divider: lightScale.scale2
-        },
-        secondary: {
-            color: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            outlineColor: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: lightScale.scale1,
-                hover: lightScale.scale2,
-                active: lightScale.scale3
-            },
-            outlineBackground: {
-                default: lightScale.scale1,
-                hover: lightScale.scale2,
-                active: lightScale.scale3
-            },
-            border: {
-                default: lightScale.scale2,
-                hover: lightScale.scale2,
-                active: lightScale.scale2
-            },
-            divider: lightScale.scale2
-        },
-        positive: {
-            color: {
-                default: white,
-                hover: white,
-                active: white
-            },
-            outlineColor: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.success,
-                hover: colors.successShade1,
-                active: colors.successShade2
-            },
-            outlineBackground: {
-                default: colors.successTint0,
-                hover: colors.successTint1,
-                active: colors.successTint2
-            },
-            border: {
-                default: colors.success,
-                hover: colors.successShade1,
-                active: colors.successShade2
-            },
-            divider: lightScale.scale2
-        },
-        negative: {
-            color: {
-                default: white,
-                hover: white,
-                active: white
-            },
-            outlineColor: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.error,
-                hover: colors.errorShade1,
-                active: colors.errorShade2
-            },
-            outlineBackground: {
-                default: colors.errorTint0,
-                hover: colors.errorTint1,
-                active: colors.errorTint2
-            },
-            border: {
-                default: colors.error,
-                hover: colors.errorShade1,
-                active: colors.errorShade2
-            },
-            divider: lightScale.scale2
-        },
-        caution: {
-            color: {
-                default: white,
-                hover: white,
-                active: white
-            },
-            outlineColor: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.warning,
-                hover: colors.warningShade1,
-                active: colors.warningShade2
-            },
-            outlineBackground: {
-                default: colors.warningTint0,
-                hover: colors.warningTint1,
-                active: colors.warningTint2
-            },
-            border: {
-                default: colors.warning,
-                hover: colors.warningShade1,
-                active: colors.warningShade2
-            },
-            divider: lightScale.scale2
-        },
-        subtle: {
-            color: {
-                default: colors.brand,
-                hover: colors.brand,
-                active: colors.brand
-            },
-            outlineColor: {
-                default: colors.brand,
-                hover: colors.brand,
-                active: colors.brand
-            },
-            secondaryColor: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            positiveColor: {
-                default: colors.success,
-                hover: colors.success,
-                active: colors.success
-            },
-            negativeColor: {
-                default: colors.error,
-                hover: colors.error,
-                active: colors.error
-            },
-            cautionColor: {
-                default: colors.warning,
-                hover: colors.warning,
-                active: colors.warning
-            },
-            background: {
-                default: 'transparent',
-                hover: lightScale.scale1,
-                active: lightScale.scale2
-            },
-            outlineBackground: {
-                default: 'transparent',
-                hover: lightScale.scale1,
-                active: lightScale.scale2
-            },
-            border: {
-                default: 'transparent',
-                hover: lightScale.scale2,
-                active: lightScale.scale2
-            },
-            divider: lightScale.scale2
-        },
-        link: {
-            color: {
-                default: colors.brand,
-                hover: colors.brandShade1,
-                active: colors.brandShade2
-            },
-            outlineColor: {
-                default: colors.brand,
-                hover: colors.brandShade1,
-                active: colors.brandShade2
-            },
-            secondaryColor: {
-                default: lightScale.scale8,
-                hover: lightScale.scale9,
-                active: lightScale.scale10
-            },
-            positiveColor: {
-                default: colors.success,
-                hover: colors.successShade1,
-                active: colors.successShade2
-            },
-            negativeColor: {
-                default: colors.error,
-                hover: colors.errorShade1,
-                active: colors.errorShade2
-            },
-            cautionColor: {
-                default: colors.warning,
-                hover: colors.warningShade1,
-                active: colors.warningShade2
-            },
-            background: {
-                default: 'transparent',
-                hover: 'transparent',
-                active: 'transparent'
-            },
-            outlineBackground: {
-                default: 'transparent',
-                hover: 'transparent',
-                active: 'transparent'
-            },
-            border: {
-                default: 'transparent',
-                hover: 'transparent',
-                active: 'transparent'
-            },
-            divider: 'transparent'
-        },
-        disabled: {
-            color: {
-                default: lightScale.scale4,
-                hover: lightScale.scale4,
-                active: lightScale.scale4
-            },
-            outlineColor: {
-                default: lightScale.scale4,
-                hover: lightScale.scale4,
-                active: lightScale.scale4
-            },
-            background: {
-                default: lightScale.scale1,
-                hover: lightScale.scale1,
-                active: lightScale.scale1
-            },
-            outlineBackground: {
-                default: lightScale.scale0,
-                hover: lightScale.scale0,
-                active: lightScale.scale0
-            },
-            border: {
-                default: lightScale.scale1,
-                hover: lightScale.scale1,
-                active: lightScale.scale1
-            },
-            divider: lightScale.scale1
-        },
-        color: {
-            default: white
-        }
-    },
-    toggleButton: {
-        ...index_js_button,
-        primary: {
-            color: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.brandTint0,
-                hover: colors.brandTint2,
-                active: colors.brandTint4
-            },
-            border: {
-                default: colors.brand,
-                hover: colors.brand,
-                active: colors.brand
-            }
-        },
-        secondary: {
-            color: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: lightScale.scale0,
-                hover: lightScale.scale1,
-                active: lightScale.scale3
-            },
-            border: {
-                default: lightScale.background5,
-                hover: lightScale.background5,
-                active: lightScale.background5
-            }
-        },
-        negative: {
-            color: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.errorTint0,
-                hover: colors.errorTint2,
-                active: colors.errorTint4
-            },
-            border: {
-                default: colors.error,
-                hover: colors.error,
-                active: colors.error
-            }
-        },
-        positive: {
-            color: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.successTint0,
-                hover: colors.successTint2,
-                active: colors.successTint4
-            },
-            border: {
-                default: colors.success,
-                hover: colors.success,
-                active: colors.success
-            }
-        },
-        caution: {
-            color: {
-                default: lightScale.scale10,
-                hover: lightScale.scale10,
-                active: lightScale.scale10
-            },
-            background: {
-                default: colors.warningTint0,
-                hover: colors.warningTint2,
-                active: colors.warningTint4
-            },
-            border: {
-                default: colors.warning,
-                hover: colors.warning,
-                active: colors.warning
-            }
-        },
-        disabled: {
-            color: {
-                default: lightScale.scale4,
-                hover: lightScale.scale4,
-                active: lightScale.scale4
-            },
-            background: {
-                default: lightScale.scale0,
-                hover: lightScale.scale0,
-                active: lightScale.scale0
-            },
-            border: {
-                default: lightScale.scale1,
-                hover: lightScale.scale1,
-                active: lightScale.scale1
-            }
-        }
-    },
-    calendar: {
-        background: {
-            container: colors.contrast10,
-            hover: lightScale.scale1,
-            active: colors.brand,
-            activeHover: colors.brandShade1,
-            activeRange: colors.brandTint4
-        },
-        color: {
-            disabled: lightScale.scale4,
-            default: lightScale.scale10,
-            active: colors.contrast10,
-            current: colors.brand,
-            outside: lightScale.scale6,
-            weekday: lightScale.scale8,
-            monthYear: lightScale.scale8,
-            iconDefault: lightScale.scale6,
-            iconDisabled: lightScale.scale2,
-            iconHover: lightScale.scale10
-        }
-    },
-    defaultBorder: `1px solid ${lightScale.scale1}`,
-    formControl: {
-        color: {
-            default: lightScale.scale8,
-            hover: lightScale.scale10,
-            active: colors.brand,
-            activeHover: colors.brandShade1,
-            disabled: lightScale.scale4
-        }
-    },
-    input: {
-        borderRadius: 4,
-        background: {
-            default: lightScale.scale0,
-            hover: lightScale.scale1,
-            focused: lightScale.scale1,
-            disabled: lightScale.scale0,
-            invalid: colors.errorTint2,
-            invalidHover: colors.errorTint1
-        },
-        color: {
-            default: lightScale.scale10,
-            disabled: lightScale.scale4,
-            placeholder: lightScale.scale6,
-            description: lightScale.scale6,
-            descriptionError: colors.error
-        },
-        borderColor: {
-            default: lightScale.scale6,
-            hover: lightScale.scale8,
-            focused: colors.brand,
-            disabled: lightScale.scale4,
-            error: colors.error
-        },
-        labelColor: {
-            default: lightScale.scale8,
-            hover: lightScale.scale8,
-            filled: lightScale.scale6,
-            focused: colors.brand,
-            disabled: lightScale.scale4
-        }
-    },
-    menu: {
-        background: white
-    },
-    menuItem: {
-        borderColor: colors.brand,
-        background: {
-            active: lightScale.scale0,
-            hover: lightScale.scale1,
-            inactive: 'transparent'
-        },
-        color: {
-            active: lightScale.scale10,
-            hover: lightScale.scale10,
-            inactive: lightScale.scale6
-        }
-    },
-    modal: {
-        background: colors.contrast10,
-        color: {
-            header: lightScale.scale10,
-            body: lightScale.scale6
-        }
-    },
-    options: {
-        background: colors.contrast10,
-        backdropFilter: void 0
-    },
-    optionItem: {
-        background: {
-            hover: lightScale.scale0,
-            active: lightScale.scale1,
-            inactive: 'transparent'
-        },
-        color: {
-            active: lightScale.scale10,
-            inactive: lightScale.scale10,
-            accent: colors.brand
-        }
-    },
-    table: {
-        color: {
-            header: lightScale.scale6,
-            body: lightScale.scale10
-        },
-        backgroundLevel: {
-            0: lightScale.background0,
-            1: lightScale.background1,
-            2: lightScale.background2,
-            3: lightScale.background3,
-            4: lightScale.background4,
-            5: lightScale.background5
-        },
-        borderColor: lightScale.scale1
-    },
-    tag: {
-        default: {
-            background: lightScale.scale1,
-            backgroundHover: lightScale.scale2,
-            backgroundDisabled: lightScale.scale0
-        },
-        error: {
-            background: colors.errorTint2,
-            backgroundHover: colors.error,
-            backgroundDisabled: colors.errorTint1
-        },
-        success: {
-            background: colors.successTint2,
-            backgroundHover: colors.success,
-            backgroundDisabled: colors.successTint1
-        },
-        warning: {
-            background: colors.warningTint2,
-            backgroundHover: colors.warning,
-            backgroundDisabled: colors.warningTint1
-        }
-    },
-    toast: {
-        color: lightScale.scale10,
-        background: {
-            default: '#FFE6F5',
-            info: '#E0F9FF',
-            success: '#E4FFE0',
-            warning: '#FFF5CC',
-            error: '#FFD6E0'
-        },
-        border: {
-            default: lightScale.scale8,
-            info: colors.brand,
-            success: colors.success,
-            warning: colors.warning,
-            error: colors.error
-        }
-    },
-    toggle: {
-        slider: colors.contrast10
-    },
-    tooltip: {
-        background: '#FFF',
-        color: {
-            default: lightScale.scale10,
-            subtext: lightScale.scale6
-        }
-    },
-    editor: {
-        highlight: {
-            yellow: colors.alert,
-            blue: colors.brandDarkShade1,
-            red: colors.error,
-            green: colors.success,
-            orange: colors.warning
-        }
-    }
-};
-const light_light = light;
-export { light_light as default };

package/build/theme/eighties/light/lightScale.d.ts

@@ -1,22 +0,0 @@
-declare const lightScale: {
-    scale0: string;
-    scale1: string;
-    scale2: string;
-    scale3: string;
-    scale4: string;
-    scale5: string;
-    scale6: string;
-    scale7: string;
-    scale8: string;
-    scale9: string;
-    scale10: string;
-    accent: string;
-    accentShade: string;
-    background0: string;
-    background1: string;
-    background2: string;
-    background3: string;
-    background4: string;
-    background5: string;
-};
-export default lightScale;

package/build/theme/eighties/light/lightScale.js

@@ -1,35 +0,0 @@
-import colors from "../colors.js";
-const scale0 = colors.grayscale0;
-const scale1 = colors.grayscale1;
-const scale2 = colors.grayscale2;
-const scale3 = colors.grayscale3;
-const scale4 = colors.grayscale4;
-const scale5 = colors.grayscale5;
-const scale6 = colors.grayscale6;
-const scale7 = colors.grayscale7;
-const scale8 = colors.grayscale8;
-const scale9 = colors.grayscale9;
-const scale10 = colors.grayscale10;
-const lightScale = {
-    scale0,
-    scale1,
-    scale2,
-    scale3,
-    scale4,
-    scale5,
-    scale6,
-    scale7,
-    scale8,
-    scale9,
-    scale10,
-    accent: colors.brand,
-    accentShade: colors.brandShade1,
-    background0: '#FFFDF2',
-    background1: '#F0EEE3',
-    background2: '#E1E5DC',
-    background3: '#D2D8CF',
-    background4: '#C3CBC2',
-    background5: '#B4BEB5'
-};
-const light_lightScale = lightScale;
-export { light_lightScale as default };