pixelize-design-library 1.1.90 → 1.1.92

package/dist/Theme/Default/palette.js

@@ -2,68 +2,68 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var palette = {
     primary: {
-        50: "#e3f2f9",
-        100: "#c5e4f3",
-        200: "#a2d4ec",
-        300: "#7ac1e4",
-        400: "#47a9da",
-        500: "#0088cc",
-        600: "#007ab8",
-        700: "#006ba1",
-        800: "#005885",
-        900: "#003f5e",
+        50: "#ecddfb",
+        100: "#d6b7f6",
+        200: "#be8ef0",
+        300: "#aa6ae9",
+        400: "#944cde",
+        500: "#9A4FE5",
+        600: "#8b48d8",
+        700: "#7a3ccc",
+        800: "#6933b2",
+        900: "#59299a",
     },
     transparent: "transparent",
     black: "#000",
     white: "#fff",
     semantic: {
         success: {
-            50: "#e6f9f0",
-            100: "#c0f0d8",
-            200: "#8be6bb",
-            300: "#5bdb9e",
-            400: "#33d181",
-            500: "#00b768",
-            600: "#00a05a",
-            700: "#00854b",
-            800: "#006b3c",
-            900: "#004c28",
+            50: "#e9fdf1",
+            100: "#c8f7d8",
+            200: "#a5f1bd",
+            300: "#84e7a2",
+            400: "#60d987",
+            500: "#23B85C",
+            600: "#1dbb51",
+            700: "#189946",
+            800: "#14753a",
+            900: "#0f5b2f",
         },
         error: {
-            50: "#ffe6e6",
-            100: "#fbbcbc",
-            200: "#f28f8f",
-            300: "#e66060",
-            400: "#db3a3a",
-            500: "#c21e1e",
-            600: "#a01919",
-            700: "#7e1313",
-            800: "#5c0d0d",
-            900: "#3d0909",
+            50: "#fff5f2",
+            100: "#fee8e1",
+            200: "#fdd0c8",
+            300: "#fca9a0",
+            400: "#f9897c",
+            500: "#F2463A",
+            600: "#c32e23",
+            700: "#a6261d",
+            800: "#8a1f18",
+            900: "#701812",
         },
         warning: {
-            50: "#fff4e6",
-            100: "#ffe1b8",
-            200: "#ffcc85",
-            300: "#ffb653",
-            400: "#ffa31a",
-            500: "#ff8a00",
-            600: "#db7000",
-            700: "#b75800",
-            800: "#934300",
-            900: "#702f00",
+            50: "#fffaf5",
+            100: "#fff0e0",
+            200: "#fedcc0",
+            300: "#fec59e",
+            400: "#fdaf7c",
+            500: "#FB8F3D",
+            600: "#db6d1e",
+            700: "#b75d18",
+            800: "#924c13",
+            900: "#6e3b0e",
         },
         info: {
-            50: "#e3f5ff",
-            100: "#b8e4ff",
-            200: "#85d1ff",
-            300: "#52bdff",
-            400: "#1fa9ff",
-            500: "#008df5",
-            600: "#0077db",
-            700: "#005cb3",
-            800: "#004489",
-            900: "#002d5c",
+            50: "#f1fcfe",
+            100: "#dcf6fb",
+            200: "#c0ecf7",
+            300: "#9eddef",
+            400: "#7fd0e6",
+            500: "#5FC4DE",
+            600: "#3bbfd2",
+            700: "#309db0",
+            800: "#257d8d",
+            900: "#1a5d6c",
         },
     },
     gray: {
@@ -196,7 +196,19 @@ var palette = {
         accent: "#e5e5e5",
         subtle: "#f5f6f7",
         muted: "#dfe3e6",
-        neutral: "#ebedef", // Neutral grey with a balanced tone
+        neutral: "#ebedef",
+        base: "#FBFBFB",
+        tableHeader: "#F6F6F6",
+    },
+    text: {
+        heading: "#161B25",
+        body: "#555A64",
+        subtle: "#434853",
+        input: "#717680", // input default
+    },
+    border: {
+        default: "#D6D8DB",
+        light: "#E8E8E8",
     },
 };
 exports.default = palette;

package/dist/Theme/Default/theme.js

@@ -18,5 +18,5 @@ var react_1 = require("@chakra-ui/react");
 var palette_1 = __importDefault(require("./palette"));
 var common_1 = __importDefault(require("../common"));
 var fonts_1 = __importDefault(require("../fonts"));
-var skyline = __assign(__assign({ colors: palette_1.default }, fonts_1.default), common_1.default);
-exports.default = (0, react_1.extendTheme)(skyline);
+var lavender = __assign(__assign({ colors: palette_1.default }, fonts_1.default), common_1.default);
+exports.default = (0, react_1.extendTheme)(lavender);

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

@@ -0,0 +1,200 @@
+declare const palette: {
+    primary: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: 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;
+        };
+    };
+    gray: {
+        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;
+    };
+    backgroundColor: {
+        main: string;
+        secondary: string;
+        tertiary: string;
+        quaternary: string;
+        light: string;
+        medium: string;
+        accent: string;
+        subtle: string;
+        muted: string;
+        neutral: string;
+    };
+};
+export default palette;

package/dist/Theme/Skyline/palette.js

@@ -0,0 +1,202 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var palette = {
+    primary: {
+        50: "#e3f2f9",
+        100: "#c5e4f3",
+        200: "#a2d4ec",
+        300: "#7ac1e4",
+        400: "#47a9da",
+        500: "#0088cc",
+        600: "#007ab8",
+        700: "#006ba1",
+        800: "#005885",
+        900: "#003f5e",
+    },
+    transparent: "transparent",
+    black: "#000",
+    white: "#fff",
+    semantic: {
+        success: {
+            50: "#e6f9f0",
+            100: "#c0f0d8",
+            200: "#8be6bb",
+            300: "#5bdb9e",
+            400: "#33d181",
+            500: "#00b768",
+            600: "#00a05a",
+            700: "#00854b",
+            800: "#006b3c",
+            900: "#004c28",
+        },
+        error: {
+            50: "#ffe6e6",
+            100: "#fbbcbc",
+            200: "#f28f8f",
+            300: "#e66060",
+            400: "#db3a3a",
+            500: "#c21e1e",
+            600: "#a01919",
+            700: "#7e1313",
+            800: "#5c0d0d",
+            900: "#3d0909",
+        },
+        warning: {
+            50: "#fff4e6",
+            100: "#ffe1b8",
+            200: "#ffcc85",
+            300: "#ffb653",
+            400: "#ffa31a",
+            500: "#ff8a00",
+            600: "#db7000",
+            700: "#b75800",
+            800: "#934300",
+            900: "#702f00",
+        },
+        info: {
+            50: "#e3f5ff",
+            100: "#b8e4ff",
+            200: "#85d1ff",
+            300: "#52bdff",
+            400: "#1fa9ff",
+            500: "#008df5",
+            600: "#0077db",
+            700: "#005cb3",
+            800: "#004489",
+            900: "#002d5c",
+        },
+    },
+    gray: {
+        50: "#f7fafc",
+        100: "#edf2f7",
+        200: "#e2e8f0",
+        300: "#cbd5e0",
+        400: "#a0aec0",
+        500: "#718096",
+        600: "#4a5568",
+        700: "#2d3748",
+        800: "#1a202c",
+        900: "#171923",
+    },
+    red: {
+        50: "#fff5f5",
+        100: "#fed7d7",
+        200: "#feb2b2",
+        300: "#fc8181",
+        400: "#f56565",
+        500: "#e53e3e",
+        600: "#c53030",
+        700: "#9b2c2c",
+        800: "#822727",
+        900: "#63171b",
+    },
+    orange: {
+        50: "#fffaf0",
+        100: "#feebc8",
+        200: "#fbd38d",
+        300: "#f6ad55",
+        400: "#ed8936",
+        500: "#dd6b20",
+        600: "#c05621",
+        700: "#9c4221",
+        800: "#7b341e",
+        900: "#652b19",
+    },
+    yellow: {
+        50: "#fffff0",
+        100: "#fefcbf",
+        200: "#faf089",
+        300: "#f6e05e",
+        400: "#ecc94b",
+        500: "#d69e2e",
+        600: "#b7791f",
+        700: "#975a16",
+        800: "#744210",
+        900: "#5f370e",
+    },
+    green: {
+        50: "#f0fff4",
+        100: "#c6f6d5",
+        200: "#9ae6b4",
+        300: "#68d391",
+        400: "#48bb78",
+        500: "#38a169",
+        600: "#2f855a",
+        700: "#276749",
+        800: "#22543d",
+        900: "#1c4532",
+    },
+    teal: {
+        50: "#e6fffa",
+        100: "#b2f5ea",
+        200: "#81e6d9",
+        300: "#4fd1c5",
+        400: "#38b2ac",
+        500: "#319795",
+        600: "#2c7a7b",
+        700: "#285e61",
+        800: "#234e52",
+        900: "#1d4044",
+    },
+    blue: {
+        50: "#ebf8ff",
+        100: "#bee3f8",
+        200: "#90cdf4",
+        300: "#63b3ed",
+        400: "#4299e1",
+        500: "#3182ce",
+        600: "#2b6cb0",
+        700: "#2c5282",
+        800: "#2a4365",
+        900: "#1a365d",
+    },
+    cyan: {
+        50: "#edfdfd",
+        100: "#c4f1f9",
+        200: "#9decf9",
+        300: "#76e4f7",
+        400: "#0bc5ea",
+        500: "#00b5d8",
+        600: "#00a3c4",
+        700: "#0987a0",
+        800: "#086f83",
+        900: "#065666",
+    },
+    purple: {
+        50: "#faf5ff",
+        100: "#e9d8fd",
+        200: "#d6bcfa",
+        300: "#b794f4",
+        400: "#9f7aea",
+        500: "#805ad5",
+        600: "#6b46c1",
+        700: "#553c9a",
+        800: "#44337a",
+        900: "#322659",
+    },
+    pink: {
+        50: "#fff5f7",
+        100: "#fed7e2",
+        200: "#fbb6ce",
+        300: "#f687b3",
+        400: "#ed64a6",
+        500: "#d53f8c",
+        600: "#b83280",
+        700: "#97266d",
+        800: "#702459",
+        900: "#521b41",
+    },
+    backgroundColor: {
+        main: "#f8f9fa",
+        secondary: "#f1f1f1",
+        tertiary: "#ececec",
+        quaternary: "#e2e6ea",
+        light: "#fafafa",
+        medium: "#eaeaea",
+        accent: "#e5e5e5",
+        subtle: "#f5f6f7",
+        muted: "#dfe3e6",
+        neutral: "#ebedef", // Neutral grey with a balanced tone
+    },
+};
+exports.default = palette;

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

@@ -0,0 +1,2 @@
+declare const _default: Record<string, any>;
+export default _default;

package/dist/Theme/Skyline/theme.js

@@ -0,0 +1,22 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = require("@chakra-ui/react");
+var palette_1 = __importDefault(require("./palette"));
+var common_1 = __importDefault(require("../common"));
+var fonts_1 = __importDefault(require("../fonts"));
+var skyline = __assign(__assign({ colors: palette_1.default }, fonts_1.default), common_1.default);
+exports.default = (0, react_1.extendTheme)(skyline);

package/dist/Theme/index.d.ts

@@ -1,9 +1,11 @@
-import skyline from "./Default/theme";
+import lavender from "./Default/theme";
 import meadow from "./Meadow/theme";
 import radiant from "./Radiant/theme";
-export { skyline, meadow, radiant };
+import skyline from "./Skyline/theme";
+export { skyline, meadow, radiant, lavender };
 export declare const ThemesList: {
     skyline: Record<string, any>;
     meadow: Record<string, any>;
     radiant: Record<string, any>;
+    lavender: Record<string, any>;
 };

package/dist/Theme/index.js

@@ -3,15 +3,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ThemesList = exports.radiant = exports.meadow = exports.skyline = void 0;
+exports.ThemesList = exports.lavender = exports.radiant = exports.meadow = exports.skyline = void 0;
 var theme_1 = __importDefault(require("./Default/theme"));
-exports.skyline = theme_1.default;
+exports.lavender = theme_1.default;
 var theme_2 = __importDefault(require("./Meadow/theme"));
 exports.meadow = theme_2.default;
 var theme_3 = __importDefault(require("./Radiant/theme"));
 exports.radiant = theme_3.default;
+var theme_4 = __importDefault(require("./Skyline/theme"));
+exports.skyline = theme_4.default;
 exports.ThemesList = {
-    skyline: theme_1.default,
+    skyline: theme_4.default,
     meadow: theme_2.default,
     radiant: theme_3.default,
+    lavender: theme_1.default,
 };

package/dist/Theme/theme.d.ts

@@ -0,0 +1,2 @@
+export type ThemeName = 'skyline' | 'midnight' | 'sunset' | 'lavender';
+export declare const themes: Record<ThemeName, string>;

package/dist/Theme/theme.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.themes = void 0;
+exports.themes = {
+    skyline: 'skyline',
+    midnight: 'midnight',
+    sunset: 'sunset',
+    lavender: 'lavender',
+};

package/dist/bootstrap.d.ts

@@ -1 +1 @@
-export {};
+import './index.css';

package/dist/bootstrap.js

@@ -7,6 +7,7 @@ var react_1 = __importDefault(require("react"));
 var client_1 = __importDefault(require("react-dom/client"));
 var App_1 = __importDefault(require("./App"));
 var withTheme_1 = __importDefault(require("./withTheme"));
+require("./index.css");
 var root = client_1.default.createRoot(document.getElementById("root"));
 var ThemeApp = (0, withTheme_1.default)(App_1.default);
 root.render(react_1.default.createElement(react_1.default.StrictMode, null,