@epilot/volt-ui 0.1.1 → 1.0.0-alpha.1

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

@@ -1,8 +1,33 @@
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
-import type { ComponentPropsWithoutRef } from "react";
+import type { ComponentPropsWithoutRef, ReactNode } from "react";
+import { type ValidationVariant } from "../Validation/Validation";
 export type RadioTone = "accent" | "error";
-export interface RadioProps extends Omit<ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, "children"> {
+export type RadioProps = Omit<ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, "children"> & {
     tone?: RadioTone;
     indicatorClassName?: string;
-}
-export declare const Radio: import("react").ForwardRefExoticComponent<RadioProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export declare const Radio: import("react").ForwardRefExoticComponent<Omit<Omit<RadioGroupPrimitive.RadioGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref">, "children"> & {
+    tone?: RadioTone;
+    indicatorClassName?: string;
+} & import("react").RefAttributes<HTMLButtonElement>>;
+export type RadioFieldState = "default" | "error";
+export type RadioFieldRootProps = {
+    id: string;
+    children: ReactNode;
+    className?: string;
+    state?: RadioFieldState;
+    disabled?: boolean;
+    tone?: RadioTone;
+};
+export declare const RadioField: {
+    Root: import("react").ForwardRefExoticComponent<RadioFieldRootProps & import("react").RefAttributes<HTMLLabelElement>>;
+    Radio: import("react").ForwardRefExoticComponent<Omit<Omit<RadioGroupPrimitive.RadioGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "ref">, "children"> & {
+        tone?: RadioTone;
+        indicatorClassName?: string;
+    } & import("react").RefAttributes<HTMLButtonElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    HelperText: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        tone?: ValidationVariant;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+};

package/dist/types/components/Radio/RadioGroup.d.ts

@@ -1,6 +1,8 @@
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 import type { ComponentPropsWithoutRef } from "react";
-export interface RadioGroupProps extends ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {
+export type RadioGroupProps = ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> & {
     orientation?: "vertical" | "horizontal";
-}
-export declare const RadioGroup: import("react").ForwardRefExoticComponent<RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+};
+export declare const RadioGroup: import("react").ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    orientation?: "vertical" | "horizontal";
+} & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,56 @@
+import * as RadixSelect from "@radix-ui/react-select";
+import type { ComponentPropsWithoutRef, HTMLAttributes, ReactNode } from "react";
+import { type ValidationVariant } from "../Validation/Validation";
+export type SelectState = "default" | "highlighted" | "error";
+export type SelectRootProps = {
+    id: string;
+    children: ReactNode;
+    className?: string;
+    state?: SelectState;
+    disabled?: boolean;
+    readOnly?: boolean;
+};
+export type SelectTriggerProps = Omit<ComponentPropsWithoutRef<typeof RadixSelect.Trigger>, "id" | "disabled"> & {
+    className?: string;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    actions?: ReactNode;
+};
+export type SelectContentProps = Omit<ComponentPropsWithoutRef<typeof RadixSelect.Content>, "position" | "align" | "sideOffset"> & {
+    position?: "item-aligned" | "popper";
+    align?: "start" | "center" | "end";
+    sideOffset?: number;
+};
+export type SelectItemProps = ComponentPropsWithoutRef<typeof RadixSelect.Item>;
+export type SelectHelperTextProps = HTMLAttributes<HTMLDivElement> & {
+    tone?: ValidationVariant;
+};
+export declare const Select: {
+    Root: {
+        ({ id, children, className, state, disabled, readOnly, }: SelectRootProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Container: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+        visuallyHidden?: boolean;
+    } & import("react").RefAttributes<HTMLLabelElement>>;
+    Trigger: import("react").ForwardRefExoticComponent<Omit<Omit<RadixSelect.SelectTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref">, "disabled" | "id"> & {
+        className?: string;
+        prefix?: ReactNode;
+        suffix?: ReactNode;
+        actions?: ReactNode;
+    } & import("react").RefAttributes<HTMLButtonElement>>;
+    Value: import("react").ForwardRefExoticComponent<Omit<RadixSelect.SelectValueProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Content: import("react").ForwardRefExoticComponent<Omit<Omit<RadixSelect.SelectContentProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "sideOffset" | "align" | "position"> & {
+        position?: "item-aligned" | "popper";
+        align?: "start" | "center" | "end";
+        sideOffset?: number;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<RadixSelect.SelectItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Group: import("react").ForwardRefExoticComponent<Omit<RadixSelect.SelectGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    GroupLabel: import("react").ForwardRefExoticComponent<Omit<RadixSelect.SelectLabelProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+    HelperText: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+        tone?: ValidationVariant;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+};

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

@@ -1,7 +1,26 @@
 import * as SwitchPrimitive from "@radix-ui/react-switch";
-import type { ComponentPropsWithoutRef } from "react";
+import type { ComponentPropsWithoutRef, ReactNode } from "react";
+import { type ValidationVariant } from "../Validation/Validation";
 export type SwitchTone = "accent" | "error";
 export interface SwitchProps extends Omit<ComponentPropsWithoutRef<typeof SwitchPrimitive.Root>, "children"> {
     tone?: SwitchTone;
 }
 export declare const Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLButtonElement>>;
+export type SwitchFieldState = "default" | "error";
+export type SwitchFieldRootProps = {
+    id: string;
+    children: ReactNode;
+    className?: string;
+    state?: SwitchFieldState;
+    disabled?: boolean;
+    tone?: SwitchTone;
+};
+export declare const SwitchField: {
+    Root: import("react").ForwardRefExoticComponent<SwitchFieldRootProps & import("react").RefAttributes<HTMLLabelElement>>;
+    Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLButtonElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    HelperText: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        tone?: ValidationVariant;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+};

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

@@ -1,18 +1,43 @@
-import type { ReactNode, TextareaHTMLAttributes } from "react";
-import { type InputFieldState } from "../InputField/InputField";
-import type { ValidationVariant } from "../Validation/Validation";
-export interface TextAreaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "prefix"> {
+import type { HTMLAttributes, ReactNode, TextareaHTMLAttributes } from "react";
+import { type ValidationVariant } from "../Validation/Validation";
+export type TextAreaState = "default" | "highlighted" | "error";
+export type TextAreaRootProps = {
     id: string;
-    label?: ReactNode;
-    labelHidden?: boolean;
-    description?: ReactNode;
-    helperText?: ReactNode;
-    helperTextTone?: ValidationVariant;
-    state?: InputFieldState;
-    prefix?: ReactNode;
-    suffix?: ReactNode;
-    actions?: ReactNode;
-    fieldClassName?: string;
-    controlClassName?: string;
-}
-export declare const TextArea: import("react").ForwardRefExoticComponent<TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+    children: ReactNode;
+    className?: string;
+    state?: TextAreaState;
+    disabled?: boolean;
+    readOnly?: boolean;
+    value?: TextareaHTMLAttributes<HTMLTextAreaElement>["value"];
+    defaultValue?: TextareaHTMLAttributes<HTMLTextAreaElement>["defaultValue"];
+};
+export type TextAreaControlProps = {
+    children: ReactNode;
+    className?: string;
+};
+export type TextAreaTextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "id" | "disabled" | "readOnly">;
+export type TextAreaHelperTextProps = HTMLAttributes<HTMLDivElement> & {
+    tone?: ValidationVariant;
+};
+export declare const TextArea: {
+    Root: {
+        ({ id, children, className, state, disabled, readOnly, value: valueProp, defaultValue, }: TextAreaRootProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Container: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+        visuallyHidden?: boolean;
+    } & import("react").RefAttributes<HTMLLabelElement>>;
+    Control: {
+        ({ children, className }: TextAreaControlProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Textarea: import("react").ForwardRefExoticComponent<TextAreaTextareaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+    Prefix: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Suffix: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Actions: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+    HelperText: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+        tone?: ValidationVariant;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+};

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

@@ -1,20 +1,52 @@
-import type { InputHTMLAttributes, ReactNode } from "react";
-import { type InputFieldState } from "../InputField/InputField";
-import type { ValidationVariant } from "../Validation/Validation";
-export interface TextInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "prefix"> {
+import type { HTMLAttributes, InputHTMLAttributes, ReactNode } from "react";
+import { type ValidationVariant } from "../Validation/Validation";
+export type TextInputState = "default" | "highlighted" | "error";
+export type TextInputRootProps = {
     id: string;
-    label?: ReactNode;
-    labelHidden?: boolean;
-    description?: ReactNode;
-    helperText?: ReactNode;
-    helperTextTone?: ValidationVariant;
-    state?: InputFieldState;
-    prefix?: ReactNode;
-    suffix?: ReactNode;
-    actions?: ReactNode;
+    children: ReactNode;
+    className?: string;
+    state?: TextInputState;
+    disabled?: boolean;
+    readOnly?: boolean;
     clearable?: boolean;
     onClear?: () => void;
-    fieldClassName?: string;
-    controlClassName?: string;
-}
-export declare const TextInput: import("react").ForwardRefExoticComponent<TextInputProps & import("react").RefAttributes<HTMLInputElement>>;
+    value?: InputHTMLAttributes<HTMLInputElement>["value"];
+    defaultValue?: InputHTMLAttributes<HTMLInputElement>["defaultValue"];
+};
+export type TextInputControlProps = {
+    children: ReactNode;
+    className?: string;
+};
+export type TextInputInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "id" | "disabled" | "readOnly">;
+export type TextInputActionsProps = {
+    children?: ReactNode;
+    showClearButton?: boolean;
+};
+export type TextInputHelperTextProps = HTMLAttributes<HTMLDivElement> & {
+    tone?: ValidationVariant;
+};
+export declare const TextInput: {
+    Root: {
+        ({ id, children, className, state, disabled, readOnly, clearable, onClear, value: valueProp, defaultValue, }: TextInputRootProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Container: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Label: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+        visuallyHidden?: boolean;
+    } & import("react").RefAttributes<HTMLLabelElement>>;
+    Control: {
+        ({ children, className }: TextInputControlProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Input: import("react").ForwardRefExoticComponent<TextInputInputProps & import("react").RefAttributes<HTMLInputElement>>;
+    Prefix: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Suffix: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Actions: {
+        ({ children, showClearButton }: TextInputActionsProps): import("react/jsx-runtime").JSX.Element | null;
+        displayName: string;
+    };
+    Description: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
+    HelperText: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+        tone?: ValidationVariant;
+    } & import("react").RefAttributes<HTMLDivElement>>;
+};

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

@@ -1,19 +1,11 @@
-import type { ReactNode } from "react";
-export interface TooltipProps {
-    children: ReactNode;
-    content: ReactNode;
-    open?: boolean;
-    defaultOpen?: boolean;
-    onOpenChange?: (open: boolean) => void;
-    delayDuration?: number;
-    side?: "top" | "right" | "bottom" | "left";
-    align?: "start" | "center" | "end";
-    className?: string;
-}
-type TooltipProviderProps = {
-    children: ReactNode;
-    delayDuration?: number;
+import * as RadixTooltip from "@radix-ui/react-tooltip";
+import type { FC } from "react";
+export declare const Tooltip: {
+    Provider: FC<RadixTooltip.TooltipProviderProps>;
+    Root: FC<RadixTooltip.TooltipProps>;
+    Trigger: import("react").ForwardRefExoticComponent<Omit<RadixTooltip.TooltipTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
+        asChild?: boolean;
+    } & import("react").RefAttributes<HTMLButtonElement>>;
+    Content: import("react").ForwardRefExoticComponent<Omit<RadixTooltip.TooltipContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Arrow: import("react").ForwardRefExoticComponent<Omit<RadixTooltip.TooltipArrowProps & import("react").RefAttributes<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
 };
-export declare const TooltipProvider: ({ children, delayDuration, }: TooltipProviderProps) => import("react/jsx-runtime").JSX.Element;
-export declare const Tooltip: import("react").ForwardRefExoticComponent<TooltipProps & import("react").RefAttributes<HTMLDivElement>>;
-export {};

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

@@ -2,9 +2,10 @@ import { type VariantProps } from 'class-variance-authority';
 import type { HTMLAttributes } from 'react';
 export type ValidationVariant = 'error' | 'success' | 'default';
 declare const validationStyles: (props?: ({
-    variant?: "error" | "default" | "success" | null | undefined;
+    variant?: "error" | "success" | "default" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
-export interface ValidationProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof validationStyles> {
-}
-export declare const Validation: import("react").ForwardRefExoticComponent<ValidationProps & import("react").RefAttributes<HTMLDivElement>>;
+export type ValidationProps = HTMLAttributes<HTMLDivElement> & VariantProps<typeof validationStyles>;
+export declare const Validation: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "error" | "success" | "default" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string> & import("react").RefAttributes<HTMLDivElement>>;
 export {};

package/dist/types/index.d.ts

@@ -1,24 +1,19 @@
 import cx from "classnames";
 export { Button } from "./components/Button/Button";
 export { IconButton } from "./components/Button/IconButton";
-export { Checkbox } from "./components/Checkbox/Checkbox";
-export { CheckboxField } from "./components/Checkbox/CheckboxField";
+export { Checkbox, CheckboxField } from "./components/Checkbox/Checkbox";
 export { Heading } from "./components/Heading/Heading";
 export { Popover } from "./components/Popover/Popover";
-export { Switch } from "./components/Switch/Switch";
-export { SwitchField } from "./components/Switch/SwitchField";
+export { Switch, SwitchField } from "./components/Switch/Switch";
 export { Tabs } from "./components/Tabs/Tabs";
 export { Text } from "./components/Text/Text";
 export { Tooltip } from "./components/Tooltip/Tooltip";
-export { TooltipProvider } from "./components/Tooltip/Tooltip";
 export { Badge } from "./components/Badge/Badge";
 export { Accordion } from "./components/Accordion/Accordion";
-export { Radio } from "./components/Radio/Radio";
-export { RadioField } from "./components/Radio/RadioField";
+export { Radio, RadioField } from "./components/Radio/Radio";
 export { RadioGroup } from "./components/Radio/RadioGroup";
 export { TextArea } from "./components/TextArea/TextArea";
-export { SelectInput } from "./components/SelectInput/SelectInput";
-export { InputField } from "./components/InputField/InputField";
+export { Select } from "./components/Select/Select";
 export { TextInput } from "./components/TextInput/TextInput";
 export { Dialog } from "./components/Dialog/Dialog";
 export { Separator } from "./components/Separator/Separator";

package/dist/types/tokens/colors.d.ts

@@ -1427,6 +1427,98 @@ export declare const orangeNormalized: {
         };
     };
 };
+export declare const eblueNormalized: {
+    light: {
+        1: string;
+        2: string;
+        3: string;
+        4: string;
+        5: string;
+        6: string;
+        7: string;
+        8: string;
+        9: string;
+        10: string;
+        11: string;
+        12: string;
+        a1: string;
+        a2: string;
+        a3: string;
+        a4: string;
+        a5: string;
+        a6: string;
+        a7: string;
+        a8: string;
+        a9: string;
+        a10: string;
+        a11: string;
+        a12: string;
+        contrast: string;
+        surface: string;
+        indicator: string;
+        track: string;
+    };
+    dark: {
+        1: string;
+        2: string;
+        3: string;
+        4: string;
+        5: string;
+        6: string;
+        7: string;
+        8: string;
+        9: string;
+        10: string;
+        11: string;
+        12: string;
+        a1: string;
+        a2: string;
+        a3: string;
+        a4: string;
+        a5: string;
+        a6: string;
+        a7: string;
+        a8: string;
+        a9: string;
+        a10: string;
+        a11: string;
+        a12: string;
+        contrast: string;
+        surface: string;
+        indicator: string;
+        track: string;
+    };
+    p3: {
+        light: {
+            1: string;
+            2: string;
+            3: string;
+            4: string;
+            5: string;
+            6: string;
+            7: string;
+            8: string;
+            9: string;
+            10: string;
+            11: string;
+            12: string;
+        };
+        dark: {
+            1: string;
+            2: string;
+            3: string;
+            4: string;
+            5: string;
+            6: string;
+            7: string;
+            8: string;
+            9: string;
+            10: string;
+            11: string;
+            12: string;
+        };
+    };
+};
 /**
  * Complete color palette for the design system
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epilot/volt-ui",
-  "version": "0.1.1",
+  "version": "1.0.0-alpha.1",
   "description": "A clean, lightweight, and tree-shakeable design system library for React applications. Built with Tailwind CSS v4, Radix UI primitives, and TypeScript.",
   "keywords": [
     "react",
@@ -19,7 +19,7 @@
   },
   "homepage": "https://main--68f5f302db3229e0eb83856e.chromatic.com/",
   "publishConfig": {
-    "tag": "latest"
+    "tag": "alpha"
   },
   "author": {
     "name": "epilot GmbH",
@@ -56,10 +56,6 @@
       "import": "./dist/index.js",
       "types": "./dist/types/index.d.ts"
     },
-    "./icons/*": {
-      "import": "./dist/components/Icons/components/*.js",
-      "types": "./dist/types/components/Icons/components/*.d.ts"
-    },
     "./package.json": "./package.json",
     "./volt-ui.theme.css": "./dist/styles/volt-ui.theme.css",
     "./volt-ui.css": "./dist/styles/volt-ui.css",
@@ -98,12 +94,11 @@
     "test": "vitest run --reporter=verbose",
     "test:watch": "vitest",
     "coverage": "vitest run --coverage",
-    "build:icons": "npx tsx scripts/generate-icons.ts",
     "build:colors": "npx tsx scripts/generate-colors.ts",
     "build:color-utilities": "npx tsx scripts/generate-colors-utilities.ts",
     "build:semantic-color": "npx tsx scripts/generate-colors-semantic-utilities.ts",
     "build:style-utilities": "npx tsx scripts/generate-colors-style-utilities.ts",
-    "build:all": "yarn build:icons && yarn build:colors && yarn build:color-utilities && yarn build:semantic-color && yarn build:style-utilities"
+    "build:all": "yarn build:colors && yarn build:color-utilities && yarn build:semantic-color && yarn build:style-utilities"
   },
   "lint-staged": {
     "src/**/*.{js,jsx,ts,tsx}": [
@@ -111,10 +106,17 @@
     ]
   },
   "peerDependencies": {
+    "@epilot360/icons": "^1.0.0",
     "react": ">=16",
     "react-dom": ">=16"
   },
+  "peerDependenciesMeta": {
+    "@epilot360/icons": {
+      "optional": true
+    }
+  },
   "dependencies": {
+    "@hookform/resolvers": "^5.2.2",
     "@radix-ui/react-accordion": "^1.2.11",
     "@radix-ui/react-checkbox": "^1.3.2",
     "@radix-ui/react-dialog": "^1.1.15",
@@ -130,7 +132,9 @@
     "@radix-ui/react-tooltip": "^1.1.6",
     "@tailwindcss/vite": "^4.1.13",
     "class-variance-authority": "^0.7.1",
-    "classnames": "^2.5.1"
+    "classnames": "^2.5.1",
+    "react-hook-form": "^7.65.0",
+    "zod": "^4.1.12"
   },
   "devDependencies": {
     "@epilot/eslint-config-react": "latest",

package/dist/components/Checkbox/CheckboxField.d.ts

@@ -1,14 +0,0 @@
-import type { ReactNode } from 'react';
-import type { ValidationVariant } from '../Validation/Validation';
-import { type CheckboxProps } from './Checkbox';
-export interface CheckboxFieldProps extends CheckboxProps {
-    label?: ReactNode;
-    description?: ReactNode;
-    helperText?: ReactNode;
-    helperTextTone?: ValidationVariant;
-    wrapperClassName?: string;
-    labelClassName?: string;
-    descriptionClassName?: string;
-    helperTextClassName?: string;
-}
-export declare const CheckboxField: import("react").ForwardRefExoticComponent<CheckboxFieldProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/components/Checkbox/CheckboxField.js

@@ -1,2 +0,0 @@
-import{jsx as e,jsxs as a}from"react/jsx-runtime";import{cx as l}from"class-variance-authority";import{forwardRef as t,useId as r}from"react";import{Checkbox as d}from"./Checkbox.js";const s=(e,a,t)=>l("text-base","accent"===e?"text-accent-default":"text-error-default",a&&"text-gray-disabled",t),i=(e,a)=>l("text-sm text-gray-default",e&&"text-gray-disabled",a),o=(e,a,t)=>l("text-sm","accent"===e?"text-gray-default":"text-error-light",a&&"text-gray-disabled",t),c=t(({id:t,label:c,description:n,helperText:m,helperTextTone:x="default",tone:p="accent",wrapperClassName:b,labelClassName:f,descriptionClassName:h,helperTextClassName:u,className:N,indicatorClassName:g,...v},y)=>{const C=r(),T=t??C,j=c?`${T}-label`:void 0,w=n?`${T}-description`:void 0,B=m?`${T}-helper`:void 0,{"aria-invalid":$,...k}=v,F=[w,B].filter(e=>Boolean(e)).join(" "),q=F.length>0?F:void 0,z=Boolean(k.disabled),A="error"===x&&Boolean(m);return e("div",{className:l("flex flex-col gap-2",b),"data-disabled":z,children:a("label",{className:l("flex select-none items-start gap-2","text-left",z&&"cursor-not-allowed"),"data-disabled":z,htmlFor:T,children:[e(d,{...k,"aria-describedby":q,"aria-invalid":$??(!!A||void 0),"aria-labelledby":j,className:N,id:T,indicatorClassName:g,ref:y,tone:p}),a("span",{className:"flex min-w-0 flex-col gap-1","data-disabled":z,children:[c?e("span",{className:s(p,z,f),"data-disabled":z,id:j,children:c}):null,n?e("span",{className:i(z,h),"data-disabled":z,id:w,children:n}):null,m?e("span",{className:l(o(p,z,u),"error"===x&&"text-error-default","success"===x&&"text-green-default"),"data-disabled":z,id:B,children:m}):null]})]})})});c.displayName="CheckboxField";export{c as CheckboxField};
-//# sourceMappingURL=CheckboxField.js.map

package/dist/components/Checkbox/CheckboxField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CheckboxField.js","sources":["../../../src/components/Checkbox/CheckboxField.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport type { ReactNode } from 'react'\nimport { forwardRef, useId } from 'react'\n\nimport type { ValidationVariant } from '../Validation/Validation'\n\nimport { Checkbox, type CheckboxProps, type CheckboxTone } from './Checkbox'\n\nconst labelStyles = (\n  tone: CheckboxTone,\n  disabled?: boolean,\n  className?: string\n) =>\n  cx(\n    'text-base',\n    tone === 'accent' ? 'text-accent-default' : 'text-error-default',\n    disabled && 'text-gray-disabled',\n    className\n  )\n\nconst descriptionStyles = (disabled?: boolean, className?: string) =>\n  cx('text-sm text-gray-default', disabled && 'text-gray-disabled', className)\n\nconst helperTextStyles = (\n  tone: CheckboxTone,\n  disabled?: boolean,\n  className?: string\n) =>\n  cx(\n    'text-sm',\n    tone === 'accent' ? 'text-gray-default' : 'text-error-light',\n    disabled && 'text-gray-disabled',\n    className\n  )\n\nexport interface CheckboxFieldProps extends CheckboxProps {\n  label?: ReactNode\n  description?: ReactNode\n  helperText?: ReactNode\n  helperTextTone?: ValidationVariant\n  wrapperClassName?: string\n  labelClassName?: string\n  descriptionClassName?: string\n  helperTextClassName?: string\n}\n\nexport const CheckboxField = forwardRef<HTMLButtonElement, CheckboxFieldProps>(\n  (\n    {\n      id,\n      label,\n      description,\n      helperText,\n      helperTextTone = 'default',\n      tone = 'accent',\n      wrapperClassName,\n      labelClassName,\n      descriptionClassName,\n      helperTextClassName,\n      className,\n      indicatorClassName,\n      ...restProps\n    },\n    ref\n  ) => {\n    const generatedId = useId()\n    const checkboxId = id ?? generatedId\n    const labelId = label ? `${checkboxId}-label` : undefined\n    const descriptionId = description ? `${checkboxId}-description` : undefined\n    const helperId = helperText ? `${checkboxId}-helper` : undefined\n\n    const { ['aria-invalid']: ariaInvalidProp, ...checkboxProps } = restProps\n\n    const describedBy = [descriptionId, helperId]\n      .filter((value): value is string => Boolean(value))\n      .join(' ')\n    const ariaDescribedBy = describedBy.length > 0 ? describedBy : undefined\n\n    const isDisabled = Boolean(checkboxProps.disabled)\n    const hasErrorState = helperTextTone === 'error' && Boolean(helperText)\n\n    return (\n      <div\n        className={cx('flex flex-col gap-2', wrapperClassName)}\n        data-disabled={isDisabled}\n      >\n        <label\n          className={cx(\n            'flex select-none items-start gap-2',\n            'text-left',\n            isDisabled && 'cursor-not-allowed'\n          )}\n          data-disabled={isDisabled}\n          htmlFor={checkboxId}\n        >\n          <Checkbox\n            {...checkboxProps}\n            aria-describedby={ariaDescribedBy}\n            aria-invalid={ariaInvalidProp ?? (hasErrorState ? true : undefined)}\n            aria-labelledby={labelId}\n            className={className}\n            id={checkboxId}\n            indicatorClassName={indicatorClassName}\n            ref={ref}\n            tone={tone}\n          />\n          <span\n            className=\"flex min-w-0 flex-col gap-1\"\n            data-disabled={isDisabled}\n          >\n            {label ? (\n              <span\n                className={labelStyles(tone, isDisabled, labelClassName)}\n                data-disabled={isDisabled}\n                id={labelId}\n              >\n                {label}\n              </span>\n            ) : null}\n            {description ? (\n              <span\n                className={descriptionStyles(isDisabled, descriptionClassName)}\n                data-disabled={isDisabled}\n                id={descriptionId}\n              >\n                {description}\n              </span>\n            ) : null}\n            {helperText ? (\n              <span\n                className={cx(\n                  helperTextStyles(tone, isDisabled, helperTextClassName),\n                  helperTextTone === 'error' && 'text-error-default',\n                  helperTextTone === 'success' && 'text-green-default'\n                )}\n                data-disabled={isDisabled}\n                id={helperId}\n              >\n                {helperText}\n              </span>\n            ) : null}\n          </span>\n        </label>\n      </div>\n    )\n  }\n)\n\nCheckboxField.displayName = 'CheckboxField'\n"],"names":["labelStyles","tone","disabled","className","cx","descriptionStyles","helperTextStyles","CheckboxField","forwardRef","id","label","description","helperText","helperTextTone","wrapperClassName","labelClassName","descriptionClassName","helperTextClassName","indicatorClassName","restProps","ref","generatedId","useId","checkboxId","labelId","undefined","descriptionId","helperId","ariaInvalidProp","checkboxProps","describedBy","filter","value","Boolean","join","ariaDescribedBy","length","isDisabled","hasErrorState","_jsx","children","_jsxs","htmlFor","Checkbox","displayName"],"mappings":"uLAQA,MAAMA,EAAc,CAClBC,EACAC,EACAC,IAEAC,EACE,YACS,WAATH,EAAoB,sBAAwB,qBAC5CC,GAAY,qBACZC,GAGEE,EAAoB,CAACH,EAAoBC,IAC7CC,EAAG,4BAA6BF,GAAY,qBAAsBC,GAE9DG,EAAmB,CACvBL,EACAC,EACAC,IAEAC,EACE,UACS,WAATH,EAAoB,oBAAsB,mBAC1CC,GAAY,qBACZC,GAcSI,EAAgBC,EAC3B,EAEIC,KACAC,QACAC,cACAC,aACAC,iBAAiB,UACjBZ,OAAO,SACPa,mBACAC,iBACAC,uBACAC,sBACAd,YACAe,wBACGC,GAELC,KAEA,MAAMC,EAAcC,IACdC,EAAad,GAAMY,EACnBG,EAAUd,EAAQ,GAAGa,eAAqBE,EAC1CC,EAAgBf,EAAc,GAAGY,qBAA2BE,EAC5DE,EAAWf,EAAa,GAAGW,gBAAsBE,GAE/C,eAAkBG,KAAoBC,GAAkBV,EAE1DW,EAAc,CAACJ,EAAeC,GACjCI,OAAQC,GAA2BC,QAAQD,IAC3CE,KAAK,KACFC,EAAkBL,EAAYM,OAAS,EAAIN,OAAcL,EAEzDY,EAAaJ,QAAQJ,EAAc3B,UACnCoC,EAAmC,UAAnBzB,GAA8BoB,QAAQrB,GAE5D,OACE2B,SACEpC,UAAWC,EAAG,sBAAuBU,mBACtBuB,EAAUG,SAEzBC,WACEtC,UAAWC,EACT,qCACA,YACAiC,GAAc,sBACf,gBACcA,EACfK,QAASnB,EAAUiB,SAAA,CAEnBD,EAACI,EAAQ,IACHd,qBACcM,EAAe,eACnBP,MAAoBU,QAAuBb,qBACxCD,EACjBrB,UAAWA,EACXM,GAAIc,EACJL,mBAAoBA,EACpBE,IAAKA,EACLnB,KAAMA,IAERwC,UACEtC,UAAU,8BAA6B,gBACxBkC,YAEd3B,EACC6B,UACEpC,UAAWH,EAAYC,EAAMoC,EAAYtB,GAAe,gBACzCsB,EACf5B,GAAIe,EAAOgB,SAEV9B,IAED,KACHC,EACC4B,UACEpC,UAAWE,EAAkBgC,EAAYrB,mBAC1BqB,EACf5B,GAAIiB,WAEHf,IAED,KACHC,EACC2B,EAAA,OAAA,CACEpC,UAAWC,EACTE,EAAiBL,EAAMoC,EAAYpB,GAChB,UAAnBJ,GAA8B,qBACX,YAAnBA,GAAgC,sBACjC,gBACcwB,EACf5B,GAAIkB,EAAQa,SAEX5B,IAED,eAQhBL,EAAcqC,YAAc"}

package/dist/components/Icons/IconBase.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-export type IconBaseProps = {
-    viewBox: string;
-    paths: string[];
-    size?: number;
-    className?: string;
-    color?: string;
-} & Omit<React.SVGProps<SVGSVGElement>, "viewBox" | "color">;
-export declare const IconBase: React.MemoExoticComponent<({ viewBox, paths, size, className, color, ...props }: IconBaseProps) => import("react/jsx-runtime").JSX.Element>;

package/dist/components/Icons/IconBase.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import cx from "classnames";
-import { memo } from "react";
-const Base = ({ viewBox, paths, size = 24, className, color = "currentColor", ...props }) => {
-    const ariaLabel = props["aria-label"];
-    const ariaLabelledBy = props["aria-labelledby"];
-    const hasAccessibleName = Boolean(ariaLabel || ariaLabelledBy);
-    const defaultRole = props.role ?? (hasAccessibleName ? "img" : undefined);
-    const defaultAriaHidden = props["aria-hidden"] ??
-        (!hasAccessibleName ? true : undefined);
-    return (_jsx("svg", { "aria-hidden": defaultAriaHidden, className: cx(className), color: color, height: size, role: defaultRole, viewBox: viewBox, width: size, xmlns: "http://www.w3.org/2000/svg", ...props, children: paths.map((p, i) => (_jsx("g", { dangerouslySetInnerHTML: { __html: p } }, i))) }));
-};
-export const IconBase = memo(Base);
-//# sourceMappingURL=IconBase.js.map

package/dist/components/Icons/IconBase.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconBase.js","sourceRoot":"","sources":["../../../src/components/Icons/IconBase.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAc,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAUpC,MAAM,IAAI,GAAG,CAAC,EACZ,OAAO,EACP,KAAK,EACL,IAAI,GAAG,EAAE,EACT,SAAS,EACT,KAAK,GAAG,cAAc,EACtB,GAAG,KAAK,EACM,EAAE,EAAE;IAClB,MAAM,SAAS,GAAI,KAA+C,CAChE,YAAY,CACb,CAAC;IACF,MAAM,cAAc,GAAI,KAA+C,CACrE,iBAAiB,CAClB,CAAC;IACF,MAAM,iBAAiB,GAAG,OAAO,CAAC,SAAS,IAAI,cAAc,CAAC,CAAC;IAE/D,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAC1E,MAAM,iBAAiB,GACpB,KAAgD,CAAC,aAAa,CAAC;QAChE,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAE1C,OAAO,CACL,6BACe,iBAAiB,EAC9B,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,EACxB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,IAAI,EACZ,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,EACX,KAAK,EAAC,4BAA4B,KAC9B,KAAK,YAER,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACnB,YAAG,uBAAuB,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,IAAO,CAAC,CAAI,CACtD,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC"}

package/dist/components/Icons/components/accessibility_new.d.ts

@@ -1,6 +0,0 @@
-export type AccessibilityNewIconProps = {
-    size?: number;
-    color?: string;
-    className?: string;
-};
-export declare const AccessibilityNewIcon: (props: AccessibilityNewIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Icons/components/accessibility_new.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-// AUTO-GENERATED FILE. DO NOT EDIT MANUALLY.
-/* eslint-disable react/jsx-sort-props */
-import { IconBase } from "../IconBase";
-export const AccessibilityNewIcon = (props) => (_jsx(IconBase, { viewBox: "0 0 24 24", paths: [
-        "<path fill='currentColor' d='M11.75 5.78a1.78 1.78 0 0 1-1.306-.54 1.78 1.78 0 0 1-.54-1.306q0-.768.54-1.307.54-.54 1.306-.54.768 0 1.307.54.54.54.54 1.307t-.54 1.306q-.54.54-1.306.54M9.155 20.876V8.587a50 50 0 0 1-2.595-.284 28 28 0 0 1-2.484-.45.92.92 0 0 1-.533-.36.65.65 0 0 1-.109-.598.74.74 0 0 1 .4-.476.95.95 0 0 1 .648-.066 30 30 0 0 0 3.585.56q1.825.174 3.685.174t3.684-.175a30 30 0 0 0 3.585-.559.95.95 0 0 1 .648.066.74.74 0 0 1 .4.476.65.65 0 0 1-.109.598.92.92 0 0 1-.534.36q-1.2.274-2.483.45-1.284.175-2.595.284v12.289a.73.73 0 0 1-.216.534.73.73 0 0 1-.534.216.73.73 0 0 1-.535-.216.73.73 0 0 1-.215-.534V15.51h-2.193v5.366a.73.73 0 0 1-.215.534.73.73 0 0 1-.535.216.73.73 0 0 1-.534-.216.73.73 0 0 1-.216-.534'/>"
-    ], ...props }));
-//# sourceMappingURL=accessibility_new.js.map

package/dist/components/Icons/components/accessibility_new.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"accessibility_new.js","sourceRoot":"","sources":["../../../../src/components/Icons/components/accessibility_new.tsx"],"names":[],"mappings":";AAAA,6CAA6C;AAC7C,yCAAyC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAIvC,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,KAAgC,EAAE,EAAE,CAAC,CACxE,KAAC,QAAQ,IAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAE;QACnC,2tBAA2tB;KAC5tB,KAAM,KAAK,GAAI,CACjB,CAAC"}

package/dist/components/Icons/components/accessible_forward.d.ts

@@ -1,6 +0,0 @@
-export type AccessibleForwardIconProps = {
-    size?: number;
-    color?: string;
-    className?: string;
-};
-export declare const AccessibleForwardIcon: (props: AccessibleForwardIconProps) => import("react/jsx-runtime").JSX.Element;