vinola-cg-uikit 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Vinola Pinto
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,75 @@
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+
+      // Remove tseslint.configs.recommended and replace with this
+      tseslint.configs.recommendedTypeChecked,
+      // Alternatively, use this for stricter rules
+      tseslint.configs.strictTypeChecked,
+      // Optionally, add this for stylistic rules
+      tseslint.configs.stylisticTypeChecked,
+
+      // Other configs...
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+      // Enable lint rules for React
+      reactX.configs['recommended-typescript'],
+      // Enable lint rules for React DOM
+      reactDom.configs.recommended,
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
+
+```

package/dist/App.d.ts

@@ -0,0 +1,2 @@
+declare function App(): import("react").JSX.Element;
+export default App;

package/dist/components/Accordion/Accordion.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { AccordionProps } from './Accordion.types';
+export declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Accordion/Accordion.types.d.ts

@@ -0,0 +1,15 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface AccordionItem {
+    id: string;
+    title: string;
+    content: ReactNode;
+    disabled?: boolean;
+}
+export interface AccordionProps extends HTMLAttributes<HTMLDivElement> {
+    items: AccordionItem[];
+    expandedItemIds?: string[];
+    onExpandedChange?: (expandedIds: string[]) => void;
+    allowMultiple?: boolean;
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "danger";
+    size?: "sm" | "md" | "lg";
+}

package/dist/components/Accordion/index.d.ts

@@ -0,0 +1,2 @@
+export { Accordion } from './Accordion';
+export type { AccordionProps, AccordionItem } from './Accordion.types';

package/dist/components/Badge/Badge.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { BadgeProps } from './Badge.types';
+export declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLSpanElement>>;

package/dist/components/Badge/Badge.types.d.ts

@@ -0,0 +1,27 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export type BadgeVariant = "filled" | "subtle";
+export type BadgeStatus = "success" | "error" | "warning" | "info" | "neutral";
+export type BadgeSize = "sm" | "lg";
+export interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    /**
+     * Determines if this is a Notification badge.
+     * If true, it renders as a circular indicator or count bubble (ignores standard layout).
+     */
+    isNotification?: boolean;
+    /**
+     * For standard badges.
+     */
+    variant?: BadgeVariant;
+    status?: BadgeStatus;
+    size?: BadgeSize;
+    /** Shows a status dot (defaults to true for standard badges). */
+    showDot?: boolean;
+    /** Custom icon node that replaces the dot. */
+    icon?: ReactNode;
+    /**
+     * For notification badges: the number to display.
+     * If undefined, renders as a simple active indicator dot.
+     */
+    count?: number;
+    children?: ReactNode;
+}

package/dist/components/Badge/index.d.ts

@@ -0,0 +1,2 @@
+export { Badge } from './Badge';
+export type { BadgeProps } from './Badge.types';

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { ButtonProps } from './Button.types';
+export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/Button/Button.types.d.ts

@@ -0,0 +1,7 @@
+import { ButtonHTMLAttributes, ReactNode } from 'react';
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: "filled" | "outlined" | "neutral" | "text" | "link";
+    size?: "sm" | "md" | "lg";
+    fullWidth?: boolean;
+    children?: ReactNode;
+}

package/dist/components/Button/index.d.ts

@@ -0,0 +1,2 @@
+export { Button } from './Button';
+export type { ButtonProps } from './Button.types';

package/dist/components/Card/Card.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { CardProps } from './Card.types';
+export declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Card/Card.types.d.ts

@@ -0,0 +1,6 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface CardProps extends HTMLAttributes<HTMLDivElement> {
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "danger";
+    size?: "sm" | "md" | "lg";
+    children?: ReactNode;
+}

package/dist/components/Card/index.d.ts

@@ -0,0 +1,2 @@
+export { Card } from './Card';
+export type { CardProps } from './Card.types';

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { InputProps } from './Input.types';
+export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/Input/Input.types.d.ts

@@ -0,0 +1,10 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
+    label?: string;
+    supportingText?: string;
+    errorText?: string;
+    status?: "default" | "error";
+    size?: "sm" | "lg";
+    leadingIcon?: ReactNode;
+    trailingIcon?: ReactNode;
+}

package/dist/components/Input/index.d.ts

@@ -0,0 +1,2 @@
+export { Input } from './Input';
+export type { InputProps } from './Input.types';

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+import { TabsProps } from './Tabs.types';
+export declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Tabs/Tabs.types.d.ts

@@ -0,0 +1,14 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface TabItem {
+    id: string;
+    label: string;
+    content: ReactNode;
+    disabled?: boolean;
+    icon?: ReactNode;
+}
+export interface TabsProps extends HTMLAttributes<HTMLDivElement> {
+    items: TabItem[];
+    activeTabId?: string;
+    onTabChange?: (tabId: string) => void;
+    variant?: "default" | "border" | "pill" | "neutral";
+}

package/dist/components/Tabs/index.d.ts

@@ -0,0 +1,2 @@
+export { Tabs } from './Tabs';
+export type { TabsProps, TabItem } from './Tabs.types';

package/dist/components/index.d.ts

@@ -0,0 +1,6 @@
+export * from './Button';
+export * from './Input';
+export * from './Card';
+export * from './Badge';
+export * from './Tabs';
+export * from './Accordion';

package/dist/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="48" height="46" fill="none" viewBox="0 0 48 46"><path fill="#863bff" d="M25.946 44.938c-.664.845-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.287c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.497 0-3.578-1.842-3.578H1.237c-.92 0-1.456-1.04-.92-1.788L10.013.474c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.579 1.842 3.579h11.377c.943 0 1.473 1.088.89 1.83L25.947 44.94z" style="fill:#863bff;fill:color(display-p3 .5252 .23 1);fill-opacity:1"/><mask id="a" width="48" height="46" x="0" y="0" maskUnits="userSpaceOnUse" style="mask-type:alpha"><path fill="#000" d="M25.842 44.938c-.664.844-2.021.375-2.021-.698V33.937a2.26 2.26 0 0 0-2.262-2.262H10.183c-.92 0-1.456-1.04-.92-1.788l7.48-10.471c1.07-1.498 0-3.579-1.842-3.579H1.133c-.92 0-1.456-1.04-.92-1.787L9.91.473c.214-.297.556-.474.92-.474h28.894c.92 0 1.456 1.04.92 1.788l-7.48 10.471c-1.07 1.498 0 3.578 1.842 3.578h11.377c.943 0 1.473 1.088.89 1.832L25.843 44.94z" style="fill:#000;fill-opacity:1"/></mask><g mask="url(#a)"><g filter="url(#b)"><ellipse cx="5.508" cy="14.704" fill="#ede6ff" rx="5.508" ry="14.704" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -4.47 31.516)"/></g><g filter="url(#c)"><ellipse cx="10.399" cy="29.851" fill="#ede6ff" rx="10.399" ry="29.851" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -39.328 7.883)"/></g><g filter="url(#d)"><ellipse cx="5.508" cy="30.487" fill="#7e14ff" rx="5.508" ry="30.487" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -25.913 -14.639)scale(1 -1)"/></g><g filter="url(#e)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.814 -32.644 -3.334)scale(1 -1)"/></g><g filter="url(#f)"><ellipse cx="5.508" cy="30.599" fill="#7e14ff" rx="5.508" ry="30.599" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="matrix(.00324 1 1 -.00324 -34.34 30.47)"/></g><g filter="url(#g)"><ellipse cx="14.072" cy="22.078" fill="#ede6ff" rx="14.072" ry="22.078" style="fill:#ede6ff;fill:color(display-p3 .9275 .9033 1);fill-opacity:1" transform="rotate(93.35 24.506 48.493)scale(-1 1)"/></g><g filter="url(#h)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#i)"><ellipse cx="3.47" cy="21.501" fill="#7e14ff" rx="3.47" ry="21.501" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(89.009 28.708 47.59)scale(-1 1)"/></g><g filter="url(#j)"><ellipse cx=".387" cy="8.972" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(39.51 .387 8.972)"/></g><g filter="url(#k)"><ellipse cx="47.523" cy="-6.092" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 47.523 -6.092)"/></g><g filter="url(#l)"><ellipse cx="41.412" cy="6.333" fill="#47bfff" rx="5.971" ry="9.665" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 41.412 6.333)"/></g><g filter="url(#m)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#n)"><ellipse cx="-1.879" cy="38.332" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 -1.88 38.332)"/></g><g filter="url(#o)"><ellipse cx="35.651" cy="29.907" fill="#7e14ff" rx="4.407" ry="29.108" style="fill:#7e14ff;fill:color(display-p3 .4922 .0767 1);fill-opacity:1" transform="rotate(37.892 35.651 29.907)"/></g><g filter="url(#p)"><ellipse cx="38.418" cy="32.4" fill="#47bfff" rx="5.971" ry="15.297" style="fill:#47bfff;fill:color(display-p3 .2799 .748 1);fill-opacity:1" transform="rotate(37.892 38.418 32.4)"/></g></g><defs><filter id="b" width="60.045" height="41.654" x="-19.77" y="16.149" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="c" width="90.34" height="51.437" x="-54.613" y="-7.533" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="d" width="79.355" height="29.4" x="-49.64" y="2.03" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="e" width="79.579" height="29.4" x="-45.045" y="20.029" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="f" width="79.579" height="29.4" x="-43.513" y="21.178" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="g" width="74.749" height="58.852" x="15.756" y="-17.901" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="7.659"/></filter><filter id="h" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="i" width="61.377" height="25.362" x="23.548" y="2.284" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="j" width="56.045" height="63.649" x="-27.636" y="-22.853" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="k" width="54.814" height="64.646" x="20.116" y="-38.415" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="l" width="33.541" height="35.313" x="24.641" y="-11.323" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="m" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="n" width="54.814" height="64.646" x="-29.286" y="6.009" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="o" width="54.814" height="64.646" x="8.244" y="-2.416" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter><filter id="p" width="39.409" height="43.623" x="18.713" y="10.588" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_2002_17158" stdDeviation="4.596"/></filter></defs></svg>

package/dist/foundations/colors.d.ts

@@ -0,0 +1,306 @@
+/**
+ * This file is auto-generated from the design-tokens JSON files.
+ * Do not edit this file directly.
+ */
+export declare const primitiveColors: {
+    readonly primaryColors: {
+        readonly "100": "#F5F5F6";
+        readonly "150": "#EFEFFF";
+        readonly "200": "#C9C9DD";
+        readonly "300": "#8080A4";
+        readonly "400": "#525283";
+        readonly "500": "#252562";
+        readonly "600": "#0D0D4A";
+        readonly "700": "#0A0A3B";
+        readonly "800": "#07072B";
+        readonly "900": "#05051C";
+        readonly "1000": "#02020C";
+    };
+    readonly secondaryColors: {
+        readonly "100": "#D9E7FF";
+        readonly "200": "#A9CAFF";
+        readonly "300": "#78ACFF";
+        readonly "400": "#488EFF";
+        readonly "500": "#1871FF";
+        readonly "600": "#0059E7";
+        readonly "700": "#0046B7";
+        readonly "800": "#003487";
+        readonly "900": "#002156";
+        readonly "1000": "#000F26";
+    };
+    readonly tertiaryColors: {
+        readonly "100": "#F3FAD9";
+        readonly "200": "#E4F4A9";
+        readonly "300": "#D5EF78";
+        readonly "400": "#C6E948";
+        readonly "500": "#B7E318";
+        readonly "600": "#9FCB00";
+        readonly "700": "#7EA100";
+        readonly "800": "#5D7600";
+        readonly "900": "#3C4C00";
+        readonly "1000": "#1A2200";
+    };
+    readonly neutralColors: {
+        readonly "100": "#FFFFFF";
+        readonly "200": "#F8F8F8";
+        readonly "250": "#EDEDED";
+        readonly "300": "#D1D5DB";
+        readonly "400": "#9CA3AF";
+        readonly "500": "#6B7280";
+        readonly "600": "#4B5563";
+        readonly "700": "#374151";
+        readonly "800": "#1F2937";
+        readonly "900": "#111827";
+        readonly "1000": "#030712";
+    };
+    readonly states: {
+        readonly darkOverlay: {
+            readonly opacity08: "#000000";
+            readonly opacity10: "#000000";
+            readonly opacity16: "#000000";
+        };
+        readonly lightOverlay: {
+            readonly opacity08: "#FFFFFF";
+            readonly opacity10: "#FFFFFF";
+            readonly opacity16: "#FFFFFF";
+        };
+    };
+    readonly statusColors: {
+        readonly error: {
+            readonly "100": "#FEF2F2";
+            readonly "200": "#FEE2E2";
+            readonly "300": "#FECACA";
+            readonly "400": "#FCA5A5";
+            readonly "500": "#F87171";
+            readonly "600": "#EF4444";
+            readonly "700": "#DC2626";
+            readonly "800": "#B91C1C";
+            readonly "900": "#991B1B";
+            readonly "1000": "#7F1D1D";
+        };
+        readonly success: {
+            readonly "100": "#F0FDF4";
+            readonly "200": "#DCFCE7";
+            readonly "300": "#BBF7D0";
+            readonly "400": "#86EFAC";
+            readonly "500": "#4ADE80";
+            readonly "600": "#22C55E";
+            readonly "700": "#16A34A";
+            readonly "800": "#15803D";
+            readonly "900": "#166534";
+            readonly "1000": "#14532D";
+        };
+        readonly warning: {
+            readonly "100": "#FFFBEB";
+            readonly "200": "#FEF3C7";
+            readonly "300": "#FDE68A";
+            readonly "400": "#FCD34D";
+            readonly "500": "#FBBF24";
+            readonly "600": "#F59E0B";
+            readonly "700": "#D97706";
+            readonly "800": "#B45309";
+            readonly "900": "#92400E";
+            readonly "1000": "#78350F";
+        };
+        readonly info: {
+            readonly "100": "#EFF6FF";
+            readonly "200": "#DBEAFE";
+            readonly "300": "#BFDBFE";
+            readonly "400": "#93C5FD";
+            readonly "500": "#60A5FA";
+            readonly "600": "#3B82F6";
+            readonly "700": "#2563EB";
+            readonly "800": "#1D4ED8";
+            readonly "900": "#1E40AF";
+            readonly "1000": "#1E3A8A";
+        };
+    };
+};
+export declare const semanticColors: {
+    readonly light: {
+        readonly brand: {
+            readonly primary: "#252562";
+            readonly onPrimary: "#F5F5F6";
+            readonly onPrimaryVariant2: "#EFEFFF";
+            readonly primaryVariant: "#C9C9DD";
+            readonly onPrimaryVariant: "#05051C";
+            readonly secondary: "#0059E7";
+            readonly onSecondary: "#D9E7FF";
+            readonly secondaryVariant: "#A9CAFF";
+            readonly onSecondaryVariant: "#002156";
+            readonly tertiary: "#B7E318";
+            readonly onTertiary: "#1A2200";
+            readonly tertiaryVariant: "#3C4C00";
+            readonly onTertiaryVariant: "#F3FAD9";
+        };
+        readonly background: {
+            readonly background: "#FFFFFF";
+            readonly surface: {
+                readonly default: "#FFFFFF";
+                readonly high: "#F8F8F8";
+                readonly highest: "#D1D5DB";
+                readonly low: "#374151";
+                readonly lowest: "#111827";
+                readonly variant1: "#F0FDF4";
+                readonly variant2: "#FEF2F2";
+            };
+        };
+        readonly textColor: {
+            readonly default: "#374151";
+            readonly high: "#1F2937";
+            readonly highest: "#1F2937";
+            readonly low: "#6B7280";
+            readonly lowest: "#FFFFFF";
+            readonly variant1: "#166534";
+            readonly variant2: "#991B1B";
+            readonly variant3: "#0046B7";
+        };
+        readonly borderColor: {
+            readonly border: "#000000";
+            readonly borderVariant: "#000000";
+            readonly borderVariant2: "#0046B7";
+            readonly borderVariant3: "#16A34A";
+            readonly borderVariant4: "#FCA5A5";
+            readonly borderVariant5: "#6B7280";
+            readonly borderVariant6: "#D1D5DB";
+        };
+        readonly iconColor: {
+            readonly default: "#6B7280";
+            readonly primary: "#252562";
+            readonly secondary: "#0046B7";
+            readonly light: "#FFFFFF";
+            readonly dark: "#000000";
+            readonly varient1: "#C9C9DD";
+            readonly variant2: "#166534";
+            readonly variant3: "#991B1B";
+        };
+        readonly disable: {
+            readonly disable: "#D1D5DB";
+            readonly onDisable: "#9CA3AF";
+        };
+        readonly status: {
+            readonly success: {
+                readonly success: "#16A34A";
+                readonly onSuccess: "#F0FDF4";
+                readonly successVariant: "#166534";
+                readonly onSuccessVariant: "#DCFCE7";
+            };
+            readonly info: {
+                readonly info: "#1D4ED8";
+                readonly onInfo: "#EFF6FF";
+                readonly infoVariant: "#1E3A8A";
+                readonly onInfoVariant: "#DBEAFE";
+            };
+            readonly warning: {
+                readonly warning: "#D97706";
+                readonly onWarning: "#FFFBEB";
+                readonly warningVariant: "#92400E";
+                readonly onWarningVariant: "#FEF3C7";
+            };
+            readonly error: {
+                readonly error: "#DC2626";
+                readonly onError: "#FEF2F2";
+                readonly errorVariant: "#991B1B";
+                readonly onErrorVariant: "#FEE2E2";
+            };
+        };
+        readonly fixed: {
+            readonly black: "#000000";
+            readonly white: "#FFFFFF";
+        };
+    };
+    readonly dark: {
+        readonly brand: {
+            readonly primary: "#8080A4";
+            readonly onPrimary: "#F5F5F6";
+            readonly onPrimaryVariant2: "#EFEFFF";
+            readonly primaryVariant: "#525283";
+            readonly onPrimaryVariant: "#05051C";
+            readonly secondary: "#0059E7";
+            readonly onSecondary: "#D9E7FF";
+            readonly secondaryVariant: "#A9CAFF";
+            readonly onSecondaryVariant: "#002156";
+            readonly tertiary: "#B7E318";
+            readonly onTertiary: "#F3FAD9";
+            readonly tertiaryVariant: "#C6E948";
+            readonly onTertiaryVariant: "#3C4C00";
+        };
+        readonly background: {
+            readonly background: "#111827";
+            readonly surface: {
+                readonly default: "#111827";
+                readonly high: "#374151";
+                readonly highest: "#1F2937";
+                readonly low: "#F8F8F8";
+                readonly lowest: "#FFFFFF";
+                readonly variant1: "#F0FDF4";
+                readonly variant2: "#FEF2F2";
+            };
+        };
+        readonly textColor: {
+            readonly default: "#D1D5DB";
+            readonly high: "#F8F8F8";
+            readonly highest: "#FFFFFF";
+            readonly low: "#4B5563";
+            readonly lowest: "#111827";
+            readonly variant1: "#166534";
+            readonly variant2: "#991B1B";
+            readonly variant3: "#991B1B";
+        };
+        readonly borderColor: {
+            readonly border: "#000000";
+            readonly borderVariant: "#000000";
+            readonly borderVariant2: "#000000";
+            readonly borderVariant3: "#16A34A";
+            readonly borderVariant4: "#FCA5A5";
+            readonly borderVariant5: "#000000";
+            readonly borderVariant6: "#000000";
+        };
+        readonly iconColor: {
+            readonly default: "#1F2937";
+            readonly primary: "#252562";
+            readonly secondary: "#0046B7";
+            readonly light: "#FFFFFF";
+            readonly dark: "#FFFFFF";
+            readonly varient1: "#FFFFFF";
+            readonly variant2: "#166534";
+            readonly variant3: "#991B1B";
+        };
+        readonly disable: {
+            readonly disable: "#F8F8F8";
+            readonly onDisable: "#9CA3AF";
+        };
+        readonly status: {
+            readonly success: {
+                readonly success: "#4ADE80";
+                readonly onSuccess: "#4ADE80";
+                readonly successVariant: "#BBF7D0";
+                readonly onSuccessVariant: "#BBF7D0";
+            };
+            readonly info: {
+                readonly info: "#1D4ED8";
+                readonly onInfo: "#DBEAFE";
+                readonly infoVariant: "#60A5FA";
+                readonly onInfoVariant: "#1E40AF";
+            };
+            readonly warning: {
+                readonly warning: "#FBBF24";
+                readonly onWarning: "#FBBF24";
+                readonly warningVariant: "#FDE68A";
+                readonly onWarningVariant: "#FDE68A";
+            };
+            readonly error: {
+                readonly error: "#F87171";
+                readonly onError: "#F87171";
+                readonly errorVariant: "#FEF2F2";
+                readonly onErrorVariant: "#07072B";
+            };
+        };
+        readonly fixed: {
+            readonly black: "#000000";
+            readonly white: "#FFFFFF";
+        };
+    };
+};
+export type PrimitiveColors = typeof primitiveColors;
+export type SemanticColors = typeof semanticColors;

package/dist/foundations/index.d.ts

@@ -0,0 +1,4 @@
+export * from './colors';
+export * from './typography';
+export * from './radius';
+export * from './spacing';

package/dist/foundations/radius.d.ts

@@ -0,0 +1,15 @@
+/**
+ * This file is auto-generated from the design-tokens JSON files.
+ * Do not edit this file directly.
+ */
+export declare const radius: {
+    readonly rdXxs: 0;
+    readonly rdXs: 2;
+    readonly rdSm: 4;
+    readonly rdMd: 6;
+    readonly rdLg: 8;
+    readonly rdXl: 10;
+    readonly rdXl2: 16;
+    readonly full: 1000;
+};
+export type Radius = typeof radius;

package/dist/foundations/shadow.d.ts

@@ -0,0 +1 @@
+export {};