pixelize-design-library 2.4.1 → 2.4.2-beta.1

package/dist/Theme/Slate/palette.d.ts

@@ -1,375 +0,0 @@
-declare const palette: {
-    gradient: {
-        from: string;
-        to: string;
-    };
-    primary: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-        opacity: {
-            4: string;
-            8: string;
-            16: string;
-            24: string;
-            32: string;
-            40: string;
-            48: string;
-        };
-    };
-    tertiary: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-        opacity: {
-            4: string;
-            8: string;
-            16: string;
-            24: string;
-            32: string;
-            40: string;
-            48: string;
-        };
-    };
-    gray: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    backgroundColor: {
-        main: string;
-        secondary: string;
-        tertiary: string;
-        quaternary: string;
-        light: string;
-        medium: string;
-        accent: string;
-        subtle: string;
-        muted: string;
-        neutral: string;
-        base: string;
-        tableHeader: string;
-    };
-    background: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    border: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    boxborder: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    table: {
-        hover: {
-            50: string;
-            100: string;
-            200: string;
-            300: string;
-            400: string;
-            500: string;
-            600: string;
-            700: string;
-            800: string;
-            900: string;
-        };
-    };
-    sidebar: {
-        background: {
-            50: string;
-            100: string;
-            200: string;
-            300: string;
-            400: string;
-            500: string;
-            600: string;
-            700: string;
-            800: string;
-            900: string;
-        };
-    };
-    boxShadow: {
-        primary: string;
-        error: string;
-        default: string;
-    };
-    secondary: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-        opacity: {
-            4: string;
-            8: string;
-            16: string;
-            24: string;
-            32: string;
-            40: string;
-            48: string;
-        };
-    };
-    transparent: string;
-    black: string;
-    white: string;
-    semantic: {
-        success: {
-            50: string;
-            100: string;
-            200: string;
-            300: string;
-            400: string;
-            500: string;
-            600: string;
-            700: string;
-            800: string;
-            900: string;
-        };
-        error: {
-            50: string;
-            100: string;
-            200: string;
-            300: string;
-            400: string;
-            500: string;
-            600: string;
-            700: string;
-            800: string;
-            900: string;
-        };
-        warning: {
-            50: string;
-            100: string;
-            200: string;
-            300: string;
-            400: string;
-            500: string;
-            600: string;
-            700: string;
-            800: string;
-            900: string;
-        };
-        info: {
-            50: string;
-            100: string;
-            200: string;
-            300: string;
-            400: string;
-            500: string;
-            600: string;
-            700: string;
-            800: string;
-            900: string;
-        };
-    };
-    red: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    orange: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    yellow: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    green: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    teal: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    blue: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    cyan: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    purple: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    pink: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    text: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    header: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    placeholder: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-    disabled: {
-        50: string;
-        100: string;
-        200: string;
-        300: string;
-        400: string;
-        500: string;
-        600: string;
-        700: string;
-        800: string;
-        900: string;
-    };
-};
-export default palette;
-//# sourceMappingURL=palette.d.ts.map

package/dist/Theme/Slate/palette.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"palette.d.ts","sourceRoot":"","sources":["../../../src/Theme/Slate/palette.ts"],"names":[],"mappings":"AAmBA,QAAA,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqGZ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/Theme/Slate/palette.js

@@ -1,123 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const palette_1 = __importDefault(require("../Default/palette"));
-const buildBrandTokens_1 = require("../buildBrandTokens");
-const PRIMARY_500 = "#6b7280"; // was #475569 — pure neutral gray, no blue cast
-const primary = {
-    50: "#f9fafb",
-    100: "#f3f4f6",
-    200: "#e5e7eb",
-    300: "#d1d5db",
-    400: "#9ca3af",
-    500: PRIMARY_500, // #6b7280
-    600: "#4b5563",
-    700: "#374151",
-    800: "#1f2937",
-    900: "#111827",
-    opacity: (0, buildBrandTokens_1.buildPrimaryOpacity)(PRIMARY_500),
-};
-const palette = {
-    ...palette_1.default,
-    gradient: { from: "#6b7280", to: "#818cf8" }, // slate gray → indigo
-    primary,
-    tertiary: { ...primary },
-    gray: {
-        50: "#f9fafb",
-        100: "#f3f4f6",
-        200: "#e5e7eb",
-        300: "#d1d5db",
-        400: "#9ca3af",
-        500: "#6b7280",
-        600: "#4b5563",
-        700: "#374151",
-        800: "#1f2937",
-        900: "#111827",
-    },
-    backgroundColor: {
-        main: "#f9fafb",
-        secondary: "#f3f4f6",
-        tertiary: "#edeef1",
-        quaternary: "#e5e7eb",
-        light: "#fcfcfd",
-        medium: "#eaebee",
-        accent: "#e1e3e7",
-        subtle: "#f5f6f7",
-        muted: "#d8dadf",
-        neutral: "#eeeef1",
-        base: "#fafafa",
-        tableHeader: "#f3f4f6",
-    },
-    background: {
-        50: "#ffffff",
-        100: "#fafafa",
-        200: "#f4f4f5",
-        300: "#f0f0f1",
-        400: "#eaeaec",
-        500: "#e4e4e7",
-        600: "#cdced2",
-        700: "#9a9ba1",
-        800: "#6b6d75",
-        900: "#4f5057",
-    },
-    border: {
-        50: "#fafafa",
-        100: "#f4f4f5",
-        200: "#ececee",
-        300: "#e4e4e7",
-        400: "#dcdcdf",
-        500: "#d4d4d8",
-        600: "#bebebf",
-        700: "#909096",
-        800: "#6b6b70",
-        900: "#505054",
-    },
-    boxborder: {
-        50: "#fafafa",
-        100: "#f3f3f4",
-        200: "#eaeaec",
-        300: "#e1e1e4",
-        400: "#d9d9dc",
-        500: "#d0d0d4",
-        600: "#bcbcc0",
-        700: "#8e8e93",
-        800: "#6a6a6e",
-        900: "#4f4f52",
-    },
-    table: {
-        hover: {
-            50: "#fefefe",
-            100: "#f7f7f8",
-            200: "#f1f1f3",
-            300: "#ebebed",
-            400: "#e5e5e8",
-            500: "#dfdfе2",
-            600: "#cbcbcf",
-            700: "#a0a0a5",
-            800: "#787880",
-            900: "#5a5a60",
-        },
-    },
-    sidebar: {
-        background: {
-            50: "#d4d4d8",
-            100: "#a1a1aa",
-            200: "#71717a", // hover surface
-            300: "#52525b",
-            400: "#3f3f46",
-            500: "#18181b", // ← near-black charcoal, pure gray no blue
-            600: "#141417",
-            700: "#101013",
-            800: "#0c0c0e",
-            900: "#08080a",
-        },
-    },
-    boxShadow: {
-        primary: (0, buildBrandTokens_1.buildPrimaryShadowTint)(PRIMARY_500),
-        error: palette_1.default.boxShadow.error,
-        default: palette_1.default.boxShadow.default,
-    },
-};
-exports.default = palette;

package/dist/Theme/Slate/theme.d.ts

@@ -1,3 +0,0 @@
-declare const _default: Record<string, any>;
-export default _default;
-//# sourceMappingURL=theme.d.ts.map

package/dist/Theme/Slate/theme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/Theme/Slate/theme.ts"],"names":[],"mappings":";AAaA,wBAGG"}

package/dist/Theme/Slate/theme.js

@@ -1,19 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("@chakra-ui/react");
-const palette_1 = __importDefault(require("./palette"));
-const fonts_1 = __importDefault(require("../fonts"));
-const common_1 = __importDefault(require("../common"));
-const componentStyles_1 = require("../componentStyles");
-const slate = {
-    ...fonts_1.default,
-    colors: palette_1.default,
-    ...common_1.default,
-};
-exports.default = (0, react_1.extendTheme)({
-    ...slate,
-    components: componentStyles_1.componentStyles,
-});

package/dist/Theme/buildBrandTokens.d.ts

@@ -1,16 +0,0 @@
-/**
- * Builds 8-digit hex alpha tokens from a 6-digit brand color (Chakra primary.500).
- */
-export declare function normalizeHex(hex: string): string;
-export declare function buildPrimaryOpacity(primary500: string): {
-    4: string;
-    8: string;
-    16: string;
-    24: string;
-    32: string;
-    40: string;
-    48: string;
-};
-/** Tint used for focus rings / primary-tinted shadows (matches ~28% alpha pattern). */
-export declare function buildPrimaryShadowTint(primary500: string): string;
-//# sourceMappingURL=buildBrandTokens.d.ts.map

package/dist/Theme/buildBrandTokens.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"buildBrandTokens.d.ts","sourceRoot":"","sources":["../../src/Theme/buildBrandTokens.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAOhD;AAED,wBAAgB,mBAAmB,CAAC,UAAU,EAAE,MAAM;;;;;;;;EAWrD;AAED,uFAAuF;AACvF,wBAAgB,sBAAsB,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAGjE"}

package/dist/Theme/buildBrandTokens.js

@@ -1,33 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.normalizeHex = normalizeHex;
-exports.buildPrimaryOpacity = buildPrimaryOpacity;
-exports.buildPrimaryShadowTint = buildPrimaryShadowTint;
-/**
- * Builds 8-digit hex alpha tokens from a 6-digit brand color (Chakra primary.500).
- */
-function normalizeHex(hex) {
-    const trimmed = hex.trim();
-    const withHash = trimmed.startsWith("#") ? trimmed : `#${trimmed}`;
-    if (!/^#[0-9a-fA-F]{6}$/.test(withHash)) {
-        throw new Error(`Invalid hex color (expected #RRGGBB): ${hex}`);
-    }
-    return withHash.toLowerCase();
-}
-function buildPrimaryOpacity(primary500) {
-    const h = normalizeHex(primary500);
-    return {
-        4: `${h}0a`,
-        8: `${h}14`,
-        16: `${h}29`,
-        24: `${h}3d`,
-        32: `${h}52`,
-        40: `${h}66`,
-        48: `${h}7a`,
-    };
-}
-/** Tint used for focus rings / primary-tinted shadows (matches ~28% alpha pattern). */
-function buildPrimaryShadowTint(primary500) {
-    const h = normalizeHex(primary500);
-    return `${h}47`;
-}

package/dist/Theme/chakra/common.web.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"common.web.d.ts","sourceRoot":"","sources":["../../../src/Theme/chakra/common.web.ts"],"names":[],"mappings":"AAWA;;;GAGG;AACH,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYX,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/dist/Theme/chakra/componentStyles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"componentStyles.d.ts","sourceRoot":"","sources":["../../../src/Theme/chakra/componentStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAsB,MAAM,kBAAkB,CAAC;AA2E5E,eAAO,MAAM,eAAe;;;;;;;;;;CAU3B,CAAC"}

package/dist/Theme/chakra/createBrandTheme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"createBrandTheme.d.ts","sourceRoot":"","sources":["../../../src/Theme/chakra/createBrandTheme.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAMvE,MAAM,WAAW,uBAAuB;IACtC,gEAAgE;IAChE,SAAS,CAAC,EAAE,iBAAiB,CAAC;CAC/B;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,gBAAgB,GAC3B,SAAS,YAAY,EACrB,UAAS,uBAA4B,wBAwDtC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/Theme/chakra/fonts.web.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fonts.web.d.ts","sourceRoot":"","sources":["../../../src/Theme/chakra/fonts.web.ts"],"names":[],"mappings":"AAAA,qGAAqG;AACrG,OAAO,sCAAsC,CAAC;AAG9C;;;;GAIG;AACH,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAa,CAAC;AAEzB,eAAe,KAAK,CAAC"}

package/dist/Theme/chartColorsFromTheme.d.ts

@@ -1,19 +0,0 @@
-import type { CustomThemeProps } from "./themeProps";
-export type ThemeColorPalette = CustomThemeProps["colors"];
-/** Default multi-series palette for Apex charts (strings required by ApexCharts). */
-export declare function getDefaultSeriesColors(colors: ThemeColorPalette): string[];
-export declare function mergeChartTitleStyle(colors: ThemeColorPalette, titleStyle?: {
-    color?: string;
-    fontSize?: string;
-    fontWeight?: number | string;
-    fontFamily?: string;
-}): {
-    color: string;
-    fontSize: string;
-    fontWeight: number | string;
-    fontFamily: string;
-};
-export declare function chartAxisLabelColor(colors: ThemeColorPalette): string;
-export declare function chartTooltipBackground(colors: ThemeColorPalette): string;
-export declare function chartTooltipForeground(colors: ThemeColorPalette): string;
-//# sourceMappingURL=chartColorsFromTheme.d.ts.map

package/dist/Theme/chartColorsFromTheme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"chartColorsFromTheme.d.ts","sourceRoot":"","sources":["../../src/Theme/chartColorsFromTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAErD,MAAM,MAAM,iBAAiB,GAAG,gBAAgB,CAAC,QAAQ,CAAC,CAAC;AAE3D,qFAAqF;AACrF,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,iBAAiB,GAAG,MAAM,EAAE,CAO1E;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,iBAAiB,EACzB,UAAU,CAAC,EAAE;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;WAJS,MAAM;cACH,MAAM;gBACJ,MAAM,GAAG,MAAM;gBACf,MAAM;EAUtB;AAED,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,iBAAiB,GAAG,MAAM,CAErE;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,iBAAiB,GAAG,MAAM,CAExE;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,iBAAiB,GAAG,MAAM,CAExE"}

package/dist/Theme/chartColorsFromTheme.js

@@ -1,34 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getDefaultSeriesColors = getDefaultSeriesColors;
-exports.mergeChartTitleStyle = mergeChartTitleStyle;
-exports.chartAxisLabelColor = chartAxisLabelColor;
-exports.chartTooltipBackground = chartTooltipBackground;
-exports.chartTooltipForeground = chartTooltipForeground;
-/** Default multi-series palette for Apex charts (strings required by ApexCharts). */
-function getDefaultSeriesColors(colors) {
-    return [
-        colors.primary[500],
-        colors.semantic.error[500],
-        colors.semantic.success[500],
-        colors.orange[500],
-    ];
-}
-function mergeChartTitleStyle(colors, titleStyle) {
-    return {
-        fontSize: "16px",
-        fontWeight: 600,
-        fontFamily: "Arial",
-        color: colors.primary[500],
-        ...titleStyle,
-    };
-}
-function chartAxisLabelColor(colors) {
-    return colors.gray[700];
-}
-function chartTooltipBackground(colors) {
-    return colors.gray[700];
-}
-function chartTooltipForeground(colors) {
-    return colors.white;
-}