@optiaxiom/react 0.1.0-next.15 → 0.1.0-next.17

package/dist/index.d.ts

@@ -1,15 +1,20 @@
 import * as react from 'react';
 import { ReactNode, ComponentPropsWithoutRef, ReactElement, ElementType, ComponentPropsWithRef } from 'react';
 import * as RadixAccordion from '@radix-ui/react-accordion';
-import { S as Sprinkles, B as BoxProps, E as ExtendProps } from './PopoverContent-DHQm-nPQ.js';
-export { a as Box, L as Link, P as Popover, b as PopoverContent, m as mapResponsiveValue, s as sprinkles } from './PopoverContent-DHQm-nPQ.js';
+import { S as Sprinkles, B as BoxProps, E as ExtendProps } from './PopoverContent-CUYQy-H8.js';
+export { a as Box, L as Link, P as Popover, b as PopoverContent, m as mapResponsiveValue, s as sprinkles } from './PopoverContent-CUYQy-H8.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
 import * as RadixTooltip from '@radix-ui/react-tooltip';
+import { Portal } from '@radix-ui/react-portal';
+import * as RadixToast from '@radix-ui/react-toast';
+import { createToaster } from '@optiaxiom/globals';
+export { createToaster, toaster } from '@optiaxiom/globals';
 import * as RadixCheckbox from '@radix-ui/react-checkbox';
 import * as RadixDialog from '@radix-ui/react-dialog';
 import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import * as RadixHoverCard from '@radix-ui/react-hover-card';
+import * as RadixPopover from '@radix-ui/react-popover';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
 import * as RadixRadio from '@radix-ui/react-radio-group';
 import * as _vanilla_extract_sprinkles from '@vanilla-extract/sprinkles';
@@ -17,12 +22,7 @@ import * as RadixSeparator from '@radix-ui/react-separator';
 import * as RadixSwitch from '@radix-ui/react-switch';
 import * as RadixTabs from '@radix-ui/react-tabs';
 import TextareaAutosize from 'react-textarea-autosize';
-import * as RadixToast from '@radix-ui/react-toast';
-import { Portal } from '@radix-ui/react-portal';
-import * as jotai from 'jotai';
-import { getDefaultStore } from 'jotai';
 import * as RadixToggle from '@radix-ui/react-toggle';
-import '@radix-ui/react-popover';
 
 declare function extractSprinkles<S extends Record<string, unknown>>(props: S): {
     restProps: Omit<S, "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "animation" | "cursor" | "empty" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "overflow" | "rounded" | "shadow" | "tracking" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "h" | "leading" | "m" | "maxH" | "maxW" | "mb" | "ml" | "mr" | "mt" | "mx" | "my" | "p" | "pb" | "pl" | "pr" | "pt" | "px" | "py" | "w">;
@@ -979,8 +979,30 @@ declare const AvatarGroup: react.ForwardRefExoticComponent<Omit<Omit<react.Detai
     size?: ComponentPropsWithoutRef<typeof Avatar>["size"];
 } & react.RefAttributes<HTMLDivElement>>;
 
+declare const ToastProvider: react.ForwardRefExoticComponent<Omit<Omit<RadixToast.ToastViewportProps & react.RefAttributes<HTMLOListElement>, "ref">, "children" | "color" | "label" | "asChild" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & {
+    children?: never;
+    container?: ComponentPropsWithoutRef<typeof Portal>["container"];
+    /**
+     * An instance of toaster returned from the `createToaster` method.
+     */
+    toaster?: ReturnType<typeof createToaster>;
+} & RadixToast.ToastProviderProps & {
+    position?: "bottom" | "top" | "bottom-left" | "bottom-right" | "top-left" | "top-right" | undefined;
+} & react.RefAttributes<HTMLOListElement>>;
+
+interface ToastProviderProps extends ComponentPropsWithoutRef<typeof ToastProvider> {
+}
 type AxiomProviderProps = {
     children?: ReactNode;
+    /**
+     * Props for the `ToastProvider` component
+     *
+     * {@link https://optimizely-axiom.github.io/optiaxiom/components/toast/ Documentation}
+     */
+    toast?: Omit<ToastProviderProps, "children">;
     /**
      * Props for the `TooltipProvider` component
      *
@@ -988,7 +1010,7 @@ type AxiomProviderProps = {
      */
     tooltip?: Omit<ComponentPropsWithoutRef<typeof RadixTooltip.Provider>, "children">;
 };
-declare function AxiomProvider({ children, tooltip }: AxiomProviderProps): react_jsx_runtime.JSX.Element;
+declare function AxiomProvider({ children, toast, tooltip, }: AxiomProviderProps): react_jsx_runtime.JSX.Element;
 declare namespace AxiomProvider {
     var displayName: string;
 }
@@ -1083,7 +1105,7 @@ declare const Checkbox: react.ForwardRefExoticComponent<Omit<Omit<RadixCheckbox.
     asChild?: boolean;
     className?: string;
 } & Sprinkles, never> & {
-    endDecorator?: ReactNode;
+    description?: ReactNode;
 } & react.RefAttributes<HTMLDivElement>>;
 
 declare const Code: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLElement>, HTMLElement>, "ref">, "color" | "className"> & Omit<{
@@ -1228,12 +1250,13 @@ declare const DropdownMenuContent: react.ForwardRefExoticComponent<Omit<Omit<Rad
 declare const DropdownMenuItem: react.ForwardRefExoticComponent<Omit<Omit<RadixMenu.DropdownMenuItemProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
     asChild?: boolean;
     className?: string;
-} & Sprinkles, never> & {
-    endDecorator?: ReactNode;
-    startDecorator?: ReactNode;
+} & Sprinkles, never> & Omit<{
+    description?: react.ReactNode;
+    endDecorator?: react.ReactNode;
+    startDecorator?: react.ReactNode;
 } & {
     colorScheme?: "danger" | "neutral" | undefined;
-} & react.RefAttributes<HTMLDivElement>>;
+}, never> & react.RefAttributes<HTMLDivElement>>;
 
 declare const DropdownMenuLabel: react.ForwardRefExoticComponent<Omit<Omit<RadixMenu.DropdownMenuLabelProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
     asChild?: boolean;
@@ -1365,12 +1388,10 @@ declare const Indicator: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<rea
     position?: "bottom-right" | "top-right";
 } & react.RefAttributes<HTMLDivElement>>;
 
-declare const Input: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "children" | "size" | "color" | "className" | "disabled"> & Omit<{
+declare const Input: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "size" | "color" | "className" | "disabled"> & Omit<{
     asChild?: boolean;
     className?: string;
-} & Sprinkles, "size" | "asChild"> & Omit<{
-    asChild?: never;
-    children: react.ReactElement;
+} & Sprinkles, "size"> & Omit<{
     decoratorPointerEvents?: "auto" | "none";
     disabled?: boolean;
     endDecorator?: react.ReactNode;
@@ -1378,9 +1399,7 @@ declare const Input: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTM
     startDecorator?: react.ReactNode;
 } & {
     size?: "md" | "lg" | undefined;
-}, "children"> & {
-    children?: never;
-} & {
+}, never> & {
     appearance?: "number" | "default" | undefined;
 } & react.RefAttributes<HTMLInputElement>>;
 
@@ -1408,6 +1427,19 @@ declare const Kbd: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLP
     variant?: "outline" | "subtle" | undefined;
 } & react.RefAttributes<HTMLElement>>;
 
+declare const axiom: string;
+declare const base: string;
+declare const reset: string;
+declare const components: string;
+
+declare const layers_css_axiom: typeof axiom;
+declare const layers_css_base: typeof base;
+declare const layers_css_components: typeof components;
+declare const layers_css_reset: typeof reset;
+declare namespace layers_css {
+  export { layers_css_axiom as axiom, layers_css_base as base, layers_css_components as components, layers_css_reset as reset };
+}
+
 type PaginationProps = BoxProps<"nav", {
     boundaries?: number;
     defaultPage?: number;
@@ -1430,6 +1462,11 @@ declare const Pagination: react.ForwardRefExoticComponent<Omit<Omit<react.Detail
     total: number;
 } & react.RefAttributes<HTMLElement>>;
 
+declare const PopoverAnchor: react.ForwardRefExoticComponent<Omit<Omit<RadixPopover.PopoverAnchorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
+
 declare const PopoverTrigger: react.ForwardRefExoticComponent<Omit<Omit<Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "color" | "className" | "disabled"> & Omit<{
     asChild?: boolean;
     className?: string;
@@ -1463,15 +1500,13 @@ declare const RadioGroupItem: react.ForwardRefExoticComponent<Omit<Omit<RadixRad
     asChild?: boolean;
     className?: string;
 } & Sprinkles, never> & {
-    endDecorator?: ReactNode;
+    description?: ReactNode;
 } & react.RefAttributes<HTMLDivElement>>;
 
-declare const SearchInput: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "children" | "size" | "color" | "className" | "disabled"> & Omit<{
+declare const SearchInput: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<react.DetailedHTMLProps<react.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">, "size" | "color" | "className" | "disabled"> & Omit<{
     asChild?: boolean;
     className?: string;
-} & Sprinkles, "size" | "asChild"> & Omit<{
-    asChild?: never;
-    children: react.ReactElement;
+} & Sprinkles, "size"> & Omit<{
     decoratorPointerEvents?: "auto" | "none";
     disabled?: boolean;
     endDecorator?: react.ReactNode;
@@ -1479,9 +1514,7 @@ declare const SearchInput: react.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<r
     startDecorator?: react.ReactNode;
 } & {
     size?: "md" | "lg" | undefined;
-}, "children"> & {
-    children?: never;
-} & {
+}, never> & {
     appearance?: "number" | "default" | undefined;
 } & react.RefAttributes<HTMLInputElement>, "ref"> & {
     ref?: ((instance: HTMLInputElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLInputElement> | null | undefined;
@@ -1521,509 +1554,503 @@ declare const Spinner: react.ForwardRefExoticComponent<Omit<Omit<react.SVGProps<
     colorScheme?: "default" | "inverse";
 } & react.RefAttributes<SVGSVGElement>>;
 
-declare const axiom: string;
-declare const base: string;
-declare const reset: string;
-declare const components: string;
+declare const Switch: react.ForwardRefExoticComponent<Omit<Omit<RadixSwitch.SwitchProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, "size"> & {
+    description?: ReactNode;
+} & {
+    size?: "md" | "lg" | undefined;
+} & react.RefAttributes<HTMLDivElement>>;
 
-declare const layers_css_axiom: typeof axiom;
-declare const layers_css_base: typeof base;
-declare const layers_css_components: typeof components;
-declare const layers_css_reset: typeof reset;
-declare namespace layers_css {
-  export { layers_css_axiom as axiom, layers_css_base as base, layers_css_components as components, layers_css_reset as reset };
-}
+declare const Tabs: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & {
+    appearance?: "primary" | "secondary";
+} & react.RefAttributes<HTMLDivElement>>;
+
+declare const TabsContent: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsContentProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
+
+declare const TabsList: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsListProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
+
+declare const TabsTrigger: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref">, "children" | "color" | "asChild" | "className" | "disabled"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, "size"> & Omit<{
+    appearance?: "primary" | "secondary" | "default" | "inverse" | "danger" | "danger-outline";
+    children?: react.ReactNode;
+    disabled?: boolean;
+    endDecorator?: react.ReactNode;
+    icon?: react.ReactNode;
+    iconPosition?: "end" | "start";
+    loading?: boolean;
+    startDecorator?: react.ReactNode;
+} & Omit<{
+    colorScheme?: "primary" | "danger" | "neutral" | undefined;
+    iconOnly?: boolean | undefined;
+    size?: "sm" | "md" | "lg" | undefined;
+    variant?: "outline" | "solid" | "subtle" | undefined;
+}, "colorScheme" | "iconOnly" | "variant">, never> & react.RefAttributes<HTMLButtonElement>>;
+
+declare const text: (props?: {
+    lineClamp?: "2" | "4" | "1" | "3" | undefined;
+    truncate?: boolean | undefined;
+} | undefined, className?: string) => {
+    className: string;
+};
+type TextVariants = RecipeVariants<typeof text>;
+
+type TextProps<T extends ElementType = "p", P = unknown> = BoxProps<T, ExtendProps<{
+    as?: "p" | "span";
+} & TextVariants, P>>;
+declare const Text: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, "color" | "className"> & Omit<{
+    asChild?: boolean;
+    className?: string;
+} & Sprinkles, never> & Omit<{
+    as?: "p" | "span";
+} & {
+    lineClamp?: "2" | "4" | "1" | "3" | undefined;
+    truncate?: boolean | undefined;
+}, never> & react.RefAttributes<HTMLParagraphElement>>;
+
+declare const input: (props?: {
+    size?: "md" | "lg" | undefined;
+} | undefined, className?: string) => {
+    className: string;
+};
+type InputVariants = RecipeVariants<typeof input>;
+
+type InputBaseProps<T extends ElementType = "input" | "textarea", P = unknown> = BoxProps<T, ExtendProps<{
+    /**
+     * When this prop is set to `none` clicking empty space inside the
+     * decorator will focus the input box.
+     */
+    decoratorPointerEvents?: "auto" | "none";
+    disabled?: boolean;
+    endDecorator?: ReactNode;
+    error?: boolean;
+    startDecorator?: ReactNode;
+} & InputVariants, P>>;
+
+type TextareaProps = ({
+    resize: "auto";
+} & InputBaseProps<typeof TextareaAutosize, {
+    children?: never;
+    rows?: never;
+    size?: never;
+}>) | ({
+    resize?: "none" | "vertical";
+} & InputBaseProps<"textarea", {
+    children?: never;
+    size?: never;
+}>);
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
 
 declare const theme: {
     readonly borderRadius: {
-        readonly xs: "2px";
-        readonly sm: "4px";
-        readonly md: "6px";
-        readonly lg: "8px";
-        readonly xl: "12px";
-        readonly full: "9999px";
-        readonly none: "0";
+        readonly xs: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xl: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly full: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly none: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly borderWidth: {
-        "0": string;
-        "1": string;
-        "2": string;
-        "4": string;
+        "0": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly boxShadow: {
-        readonly xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
-        readonly sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
-        readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
-        readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
-        readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
-        readonly inner: "inset 0 0 6px 0 rgb(0 0 0 / 0.1);";
-        readonly none: "0 0 #0000";
+        readonly xs: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xl: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly inner: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly none: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly colors: {
-        readonly "bg.brand": "#F0F3FF";
-        readonly "bg.brand.solid": "#0037FF";
-        readonly "bg.brand.solid.hover": "#002CCC";
-        readonly "bg.disabled": "#091E422E";
-        readonly "bg.discovery": "#F1ECF8";
-        readonly "bg.error": "#FFF7F7";
-        readonly "bg.error.solid": "#CC1616";
-        readonly "bg.error.solid.hover": "#B21313";
-        readonly "bg.information": "#E7F3FE";
-        readonly "bg.information.solid": "#1668AC";
-        readonly "bg.input.disabled": "#091E420A";
-        readonly "bg.neutral": "#F5F6FA";
-        readonly "bg.neutral.inverse": "#2E3442";
-        readonly "bg.neutral.inverse.hover": "#262B37";
-        readonly "bg.neutral.solid": "#CACFDC";
-        readonly "bg.neutral.solid.hover": "#b8becb";
-        readonly "bg.success": "#E9F7F1";
-        readonly "bg.success.solid": "#03A65D";
-        readonly "bg.success.solid.hover": "#038047";
-        readonly "bg.warning": "#FFFAEA";
-        readonly "bg.warning.solid": "#F79008";
-        readonly "bg.warning.solid.hover": "#DC6903";
-        readonly "border.active": "#868FA4";
-        readonly "border.active.hover": "#626A81";
-        readonly "border.brand": "#0037FF";
-        readonly "border.default": "#CACFDC";
-        readonly "border.disabled": "#F5F6FA";
-        readonly "border.error": "#CC1616";
-        readonly "border.secondary": "#DADFEB";
-        readonly "border.success": "#03A65D";
-        readonly "border.tertiary": "#E9EDF5";
-        readonly "border.warning": "#F79008";
-        readonly "fg.accent.blue": "#2094F3";
-        readonly "fg.accent.magenta": "#81046A";
-        readonly "fg.accent.purple": "#4A297F";
-        readonly "fg.accent.red": "#CC1616";
-        readonly "fg.brand": "#002894";
-        readonly "fg.default": "#2E3442";
-        readonly "fg.default.inverse": "#FFFFFF";
-        readonly "fg.disabled": "#091E4252";
-        readonly "fg.error": "#911D1D";
-        readonly "fg.information": "#1668AC";
-        readonly "fg.link": "#0037FF";
-        readonly "fg.link.hover": "#002CCC";
-        readonly "fg.link.visited": "#693AB6";
-        readonly "fg.secondary": "#4F576E";
-        readonly "fg.success": "#24663E";
-        readonly "fg.tertiary": "#626A81";
-        readonly "fg.warning": "#B54707";
-        readonly "outline.brand": "#6A8FFC";
-        readonly overlay: "#091E4252";
-        readonly surface: "#FFFFFF";
-        readonly current: "currentColor";
-        readonly transparent: "transparent";
-        readonly black: "#000000";
-        readonly white: "#FFFFFF";
-        readonly "aqua.50": "#E5F7FB";
-        readonly "aqua.200": "#9AE5EF";
-        readonly "aqua.500": "#00BDD6";
-        readonly "aqua.600": "#007A8A";
-        readonly "blue.50": "#E7F3FE";
-        readonly "blue.200": "#A8D5FA";
-        readonly "blue.500": "#2094F3";
-        readonly "blue.600": "#1668AC";
-        readonly "blue.900": "#1C2B41";
-        readonly "brand.50": "#F0F3FF";
-        readonly "brand.100": "#CDD8FC";
-        readonly "brand.200": "#B3C3FF";
-        readonly "brand.300": "#6A8FFC";
-        readonly "brand.400": "#2E66F7";
-        readonly "brand.500": "#0037FF";
-        readonly "brand.600": "#002CCC";
-        readonly "brand.700": "#002894";
-        readonly "brand.800": "#001666";
-        readonly "brand.900": "#000B33";
-        readonly "dark.50": "#d9d9d9";
-        readonly "dark.200": "#9e9e9e";
-        readonly "dark.500": "#707070";
-        readonly "dark.600": "#080736";
-        readonly "gray.50": "#f9fafb";
-        readonly "gray.100": "#f3f4f6";
-        readonly "gray.200": "#e5e7eb";
-        readonly "gray.300": "#d1d5db";
-        readonly "gray.400": "#9ca3af";
-        readonly "gray.500": "#6b7280";
-        readonly "gray.600": "#4b5563";
-        readonly "gray.700": "#374151";
-        readonly "gray.800": "#1f2937";
-        readonly "gray.900": "#111827";
-        readonly "green.50": "#E9F7F1";
-        readonly "green.100": "#D1F0E1";
-        readonly "green.200": "#A5E1C3";
-        readonly "green.300": "#7CD2A7";
-        readonly "green.400": "#5AC58A";
-        readonly "green.500": "#03A65D";
-        readonly "green.600": "#038047";
-        readonly "green.700": "#24663E";
-        readonly "green.800": "#17492B";
-        readonly "green.900": "#082415";
-        readonly "magenta.50": "#F8E7F5";
-        readonly "magenta.200": "#E39CD6";
-        readonly "magenta.500": "#B80597";
-        readonly "magenta.600": "#81046A";
-        readonly "neutral.50": "#F9FAFC";
-        readonly "neutral.75": "#F5F6FA";
-        readonly "neutral.100": "#E9EDF5";
-        readonly "neutral.150": "#DADFEB";
-        readonly "neutral.200": "#CACFDC";
-        readonly "neutral.300": "#b8becb";
-        readonly "neutral.500": "#868FA4";
-        readonly "neutral.600": "#626A81";
-        readonly "neutral.700": "#4F576E";
-        readonly "neutral.800": "#2E3442";
-        readonly "neutral.900": "#262B37";
-        readonly "neutral.1000": "#1C2029";
-        readonly "neutral.1100": "#171A23";
-        readonly "neutral.1200": "#091E42";
-        readonly "neutral.50/6": "#F9FAFC0F";
-        readonly "neutral.50/32": "#F9FAFC52";
-        readonly "neutral.1200/4": "#091E420A";
-        readonly "neutral.1200/12": "#091E421F";
-        readonly "neutral.1200/18": "#091E422E";
-        readonly "neutral.1200/22": "#091E4238";
-        readonly "neutral.1200/32": "#091E4252";
-        readonly "orange.50": "#fff5e5";
-        readonly "orange.200": "#ffd699";
-        readonly "orange.500": "#ff9900";
-        readonly "orange.600": "#a36200";
-        readonly "purple.50": "#F1ECF8";
-        readonly "purple.200": "#C4B1E2";
-        readonly "purple.500": "#693AB6";
-        readonly "purple.600": "#4A297F";
-        readonly "purple.900": "#2B273F";
-        readonly "red.50": "#FFF7F7";
-        readonly "red.100": "#FCD6D6";
-        readonly "red.200": "#F9ACAC";
-        readonly "red.300": "#FC8B8B";
-        readonly "red.400": "#E31818";
-        readonly "red.500": "#CC1616";
-        readonly "red.600": "#B21313";
-        readonly "red.700": "#911D1D";
-        readonly "red.800": "#601313";
-        readonly "red.900": "#300A0A";
-        readonly "slate.50": "#f8fafc";
-        readonly "slate.100": "#f1f5f9";
-        readonly "slate.200": "#e2e8f0";
-        readonly "slate.300": "#cbd5e1";
-        readonly "slate.400": "#94a3b8";
-        readonly "slate.500": "#64748b";
-        readonly "slate.600": "#475569";
-        readonly "slate.700": "#334155";
-        readonly "slate.800": "#1e293b";
-        readonly "slate.900": "#0f172a";
-        readonly "slate.950": "#020617";
-        readonly "yellow.50": "#FFFAEA";
-        readonly "yellow.100": "#FEF1C6";
-        readonly "yellow.200": "#FEDF88";
-        readonly "yellow.300": "#FFC84B";
-        readonly "yellow.400": "#FDB022";
-        readonly "yellow.500": "#F79008";
-        readonly "yellow.600": "#DC6903";
-        readonly "yellow.700": "#B54707";
-        readonly "yellow.800": "#7A2E0D";
-        readonly "yellow.900": "#4E1D09";
+        readonly "bg.brand": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.brand.solid": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.brand.solid.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.disabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.discovery": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.error": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.error.solid": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.error.solid.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.information": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.information.solid": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.input.disabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.neutral": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.neutral.inverse": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.neutral.inverse.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.neutral.solid": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.neutral.solid.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.success": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.success.solid": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.success.solid.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.warning": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.warning.solid": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "bg.warning.solid.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.active": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.active.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.brand": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.default": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.disabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.error": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.secondary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.success": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.tertiary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "border.warning": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.accent.blue": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.accent.magenta": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.accent.purple": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.accent.red": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.brand": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.default": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.default.inverse": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.disabled": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.error": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.information": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.link": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.link.hover": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.link.visited": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.secondary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.success": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.tertiary": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "fg.warning": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "outline.brand": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly overlay: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly surface: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly current: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly transparent: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly black: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly white: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "aqua.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "aqua.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "aqua.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "aqua.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "blue.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "blue.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "blue.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "blue.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "blue.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "brand.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "dark.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "dark.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "dark.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "dark.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "gray.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "green.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "magenta.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "magenta.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "magenta.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "magenta.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.75": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.150": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1000": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.50/6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.50/32": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1200/4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1200/12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1200/18": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1200/22": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "neutral.1200/32": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "orange.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "orange.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "orange.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "orange.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "purple.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "purple.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "purple.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "purple.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "purple.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "red.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "slate.950": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.100": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.200": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.300": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.400": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.500": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.600": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.700": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.800": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "yellow.900": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly fontFamily: {
-        readonly mono: "Fira Code Variable, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace";
-        readonly sans: "InterVariable, system-ui, sans-serif";
+        readonly mono: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sans: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly fontSize: {
         readonly xs: {
-            readonly fontSize: "10px";
-            readonly lineHeight: "14px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly sm: {
-            readonly fontSize: "12px";
-            readonly lineHeight: "16px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly md: {
-            readonly fontSize: "14px";
-            readonly lineHeight: "20px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly lg: {
-            readonly fontSize: "16px";
-            readonly lineHeight: "24px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly xl: {
-            readonly fontSize: "18px";
-            readonly lineHeight: "28px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly "2xl": {
-            readonly fontSize: "20px";
-            readonly lineHeight: "28px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly "3xl": {
-            readonly fontSize: "24px";
-            readonly lineHeight: "32px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly "4xl": {
-            readonly fontSize: "30px";
-            readonly lineHeight: "36px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly "5xl": {
-            readonly fontSize: "36px";
-            readonly lineHeight: "40px";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly "6xl": {
-            readonly fontSize: "48px";
-            readonly lineHeight: "1";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
         readonly "7xl": {
-            readonly fontSize: "60px";
-            readonly lineHeight: "1";
+            readonly fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+            readonly lineHeight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
         };
     };
     readonly letterSpacing: {
-        readonly tighter: "-0.05em";
-        readonly tight: "-0.025em";
-        readonly normal: "0";
-        readonly wide: "0.025em";
-        readonly wider: "0.05em";
-        readonly widest: "0.1em";
+        readonly tighter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly tight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly normal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly wide: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly wider: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly widest: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly lineHeight: {
-        readonly none: "1";
-        readonly tight: "1.25";
-        readonly normal: "1.5";
-        readonly loose: "2";
+        readonly none: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly tight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly normal: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly loose: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly margins: {
-        readonly "-xs": "-8px";
-        readonly "-sm": "-12px";
-        readonly "-md": "-16px";
-        readonly "-lg": "-24px";
-        readonly "-xl": "-32px";
-        readonly "-2": "-2px";
-        readonly "-4": "-4px";
-        readonly "-6": "-6px";
-        readonly "-8": "-8px";
-        readonly "-10": "-10px";
-        readonly "-12": "-12px";
-        readonly "-16": "-16px";
-        readonly "-24": "-24px";
-        readonly "-32": "-32px";
-        readonly "-48": "-48px";
-        readonly "-64": "-64px";
-        readonly "-80": "-80px";
-        readonly xs: "8px";
-        readonly sm: "12px";
-        readonly md: "16px";
-        readonly lg: "24px";
-        readonly xl: "32px";
-        readonly "0": "0";
-        readonly "2": "2px";
-        readonly "4": "4px";
-        readonly "6": "6px";
-        readonly "8": "8px";
-        readonly "10": "10px";
-        readonly "12": "12px";
-        readonly "16": "16px";
-        readonly "20": "20px";
-        readonly "24": "24px";
-        readonly "32": "32px";
-        readonly "48": "48px";
-        readonly "64": "64px";
-        readonly "80": "80px";
+        readonly "-xs": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-sm": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-md": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-lg": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-xl": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-24": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-32": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-48": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-64": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "-80": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xs: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xl: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "0": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "24": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "32": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "48": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "64": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "80": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly maxSize: {
-        readonly xs: "320px";
-        readonly sm: "384px";
-        readonly md: "448px";
-        readonly lg: "512px";
-        readonly xl: "576px";
-        readonly "2xl": "672px";
-        readonly full: "100%";
+        readonly xs: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xl: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "2xl": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly full: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly screens: {
-        readonly sm: "600px";
-        readonly md: "900px";
-        readonly lg: "1200px";
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly size: {
-        readonly xs: "20px";
-        readonly sm: "24px";
-        readonly md: "32px";
-        readonly lg: "40px";
-        readonly xl: "48px";
-        readonly "5xl": "80px";
-        readonly "0": "0";
-        readonly "1": "1px";
-        readonly "2": "2px";
-        readonly "4": "4px";
-        readonly "6": "6px";
-        readonly "8": "8px";
-        readonly "12": "12px";
-        readonly "16": "16px";
-        readonly "20": "20px";
-        readonly "24": "24px";
-        readonly "32": "32px";
-        readonly "40": "40px";
-        readonly "48": "48px";
-        readonly "56": "56px";
-        readonly "64": "64px";
-        readonly "80": "80px";
-        readonly "96": "96px";
-        readonly "112": "112px";
-        readonly "128": "128px";
-        readonly "144": "144px";
-        readonly "160": "160px";
-        readonly "176": "176px";
-        readonly "192": "192px";
-        readonly "208": "208px";
-        readonly "224": "224px";
-        readonly "240": "240px";
-        readonly "256": "256px";
-        readonly "288": "288px";
-        readonly "320": "320px";
-        readonly "384": "384px";
-        readonly "1/2": "50%";
-        readonly "1/3": "33.333333%";
-        readonly "2/3": "66.666666%";
-        readonly "1/4": "25%";
-        readonly "2/4": "50%";
-        readonly "3/4": "75%";
-        readonly auto: "auto";
-        readonly fit: "fit-content";
-        readonly full: "100%";
-        readonly max: "max-content";
-        readonly min: "min-content";
+        readonly xs: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xl: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "5xl": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "0": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "1": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "24": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "32": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "40": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "48": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "56": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "64": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "80": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "96": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "112": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "128": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "144": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "160": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "176": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "192": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "208": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "224": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "240": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "256": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "288": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "320": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "384": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "1/2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "1/3": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "2/3": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "1/4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "2/4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "3/4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly auto: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly fit: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly full: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly max: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly min: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly spacing: {
-        readonly xs: "8px";
-        readonly sm: "12px";
-        readonly md: "16px";
-        readonly lg: "24px";
-        readonly xl: "32px";
-        readonly "0": "0";
-        readonly "2": "2px";
-        readonly "4": "4px";
-        readonly "6": "6px";
-        readonly "8": "8px";
-        readonly "10": "10px";
-        readonly "12": "12px";
-        readonly "16": "16px";
-        readonly "20": "20px";
-        readonly "24": "24px";
-        readonly "32": "32px";
-        readonly "48": "48px";
-        readonly "64": "64px";
-        readonly "80": "80px";
+        readonly xs: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly sm: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly md: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly lg: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly xl: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "0": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "2": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "4": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "6": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "8": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "12": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "16": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "24": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "32": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "48": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "64": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "80": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
     readonly zIndex: {
-        readonly "0": "0";
-        readonly "10": "10";
-        readonly "20": "20";
-        readonly "30": "30";
-        readonly "40": "40";
-        readonly "50": "50";
-        readonly auto: "auto";
-        readonly popover: "3000";
-        readonly toast: "3010";
+        readonly "0": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "10": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "20": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "30": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "40": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly "50": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly auto: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly popover: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
+        readonly toast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
     };
 };
 
-declare const Switch: react.ForwardRefExoticComponent<Omit<Omit<RadixSwitch.SwitchProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, "size"> & {
-    endDecorator?: ReactNode;
-} & {
-    size?: "md" | "lg" | undefined;
-} & react.RefAttributes<HTMLDivElement>>;
-
-declare const Tabs: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, never> & {
-    appearance: "primary" | "secondary";
-} & react.RefAttributes<HTMLDivElement>>;
-
-declare const TabsContent: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsContentProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
-
-declare const TabsList: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsListProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, never> & react.RefAttributes<HTMLDivElement>>;
-
-declare const TabsTrigger: react.ForwardRefExoticComponent<Omit<Omit<RadixTabs.TabsTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref">, "children" | "color" | "asChild" | "className" | "disabled"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, "size"> & Omit<{
-    appearance?: "primary" | "secondary" | "default" | "inverse" | "danger" | "danger-outline";
-    children?: react.ReactNode;
-    disabled?: boolean;
-    endDecorator?: react.ReactNode;
-    icon?: react.ReactNode;
-    iconPosition?: "end" | "start";
-    loading?: boolean;
-    startDecorator?: react.ReactNode;
-} & Omit<{
-    colorScheme?: "primary" | "danger" | "neutral" | undefined;
-    iconOnly?: boolean | undefined;
-    size?: "sm" | "md" | "lg" | undefined;
-    variant?: "outline" | "solid" | "subtle" | undefined;
-}, "colorScheme" | "iconOnly" | "variant">, never> & react.RefAttributes<HTMLButtonElement>>;
-
-declare const text: (props?: {
-    lineClamp?: "2" | "4" | "1" | "3" | undefined;
-    truncate?: boolean | undefined;
-} | undefined, className?: string) => {
-    className: string;
-};
-type TextVariants = RecipeVariants<typeof text>;
-
-type TextProps<T extends ElementType = "p", P = unknown> = BoxProps<T, ExtendProps<{
-    as?: "p" | "span";
-} & TextVariants, P>>;
-declare const Text: react.ForwardRefExoticComponent<Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, "color" | "className"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, never> & Omit<{
-    as?: "p" | "span";
-} & {
-    lineClamp?: "2" | "4" | "1" | "3" | undefined;
-    truncate?: boolean | undefined;
-}, never> & react.RefAttributes<HTMLParagraphElement>>;
-
-declare const input: (props?: {
-    size?: "md" | "lg" | undefined;
-} | undefined, className?: string) => {
-    className: string;
+type ThemeProviderProps = {
+    children?: ReactNode;
+    selector?: string;
 };
-type InputVariants = RecipeVariants<typeof input>;
-
-type InputBaseProps<T extends ElementType = "input" | "textarea", P = unknown> = BoxProps<T, ExtendProps<{
-    asChild?: never;
-    children: ReactElement;
-    /**
-     * When this prop is set to `none` clicking empty space inside the
-     * decorator will focus the input box.
-     */
-    decoratorPointerEvents?: "auto" | "none";
-    disabled?: boolean;
-    endDecorator?: ReactNode;
-    error?: boolean;
-    startDecorator?: ReactNode;
-} & InputVariants, P>>;
-
-type TextareaProps = ({
-    resize: "auto";
-} & InputBaseProps<typeof TextareaAutosize, {
-    children?: never;
-    rows?: never;
-    size?: never;
-}>) | ({
-    resize?: "none" | "vertical";
-} & InputBaseProps<"textarea", {
-    children?: never;
-    size?: never;
-}>);
-declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+declare function ThemeProvider({ children, selector, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+declare namespace ThemeProvider {
+    var displayName: string;
+}
 
 declare const Toast: react.ForwardRefExoticComponent<Omit<Omit<RadixToast.ToastProps & react.RefAttributes<HTMLLIElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
     asChild?: boolean;
@@ -2051,35 +2078,6 @@ declare const ToastAction: react.ForwardRefExoticComponent<Omit<Omit<RadixToast.
     variant?: "outline" | "solid" | "subtle" | undefined;
 }, "colorScheme" | "iconOnly" | "variant">, never> & react.RefAttributes<HTMLButtonElement>>;
 
-type ToastElement = ReactElement<ComponentPropsWithoutRef<typeof Toast>>;
-type Store = ReturnType<typeof getDefaultStore>;
-declare const createToaster: (store?: Store) => {
-    atom: jotai.PrimitiveAtom<{
-        id: string;
-        open: boolean;
-        toast: ToastElement;
-    }[]> & {
-        init: {
-            id: string;
-            open: boolean;
-            toast: ToastElement;
-        }[];
-    };
-    create: (toast: ToastElement) => string;
-    remove: (id: string) => void;
-};
-
-declare const ToastProvider: react.ForwardRefExoticComponent<Omit<Omit<RadixToast.ToastViewportProps & react.RefAttributes<HTMLOListElement>, "ref">, "children" | "color" | "label" | "asChild" | "className"> & Omit<{
-    asChild?: boolean;
-    className?: string;
-} & Sprinkles, never> & {
-    children?: never;
-    container?: ComponentPropsWithoutRef<typeof Portal>["container"];
-    toaster: ReturnType<typeof createToaster>;
-} & RadixToast.ToastProviderProps & {
-    position?: "bottom" | "top" | "bottom-right" | "top-right" | "bottom-left" | "top-left" | undefined;
-} & react.RefAttributes<HTMLOListElement>>;
-
 declare const ToastTitle: react.ForwardRefExoticComponent<Omit<Omit<RadixToast.ToastTitleProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & Omit<{
     asChild?: boolean;
     className?: string;
@@ -2135,4 +2133,4 @@ declare const Transition: react.ForwardRefExoticComponent<{
     type?: "pop" | "fade" | undefined;
 } & react.RefAttributes<HTMLDivElement>>;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AnimatePresence, Avatar, AvatarGroup, AxiomProvider, Badge, BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, Code, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerFooter, DrawerTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Field, Flex, Grid, Heading, HoverCard, HoverCardContent, HoverCardTrigger, Indicator, Input, Kbd, Pagination, type PaginationProps, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, SearchInput, Separator, Skeleton, Spinner, Sprinkles, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Text, type TextProps, Textarea, Toast, ToastAction, ToastProvider, ToastTitle, Toggle, Tooltip, Transition, createToaster, extractSprinkles, layers_css as layers, theme, tokens, tokensDark, usePresence };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AnimatePresence, Avatar, AvatarGroup, AxiomProvider, Badge, BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, Code, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogTitle, DialogTrigger, Drawer, DrawerBody, DrawerFooter, DrawerTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Field, Flex, Grid, Heading, HoverCard, HoverCardContent, HoverCardTrigger, Indicator, Input, Kbd, Pagination, type PaginationProps, PopoverAnchor, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, SearchInput, Separator, Skeleton, Spinner, Sprinkles, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Text, type TextProps, Textarea, ThemeProvider, Toast, ToastAction, ToastProvider, ToastTitle, Toggle, Tooltip, Transition, extractSprinkles, layers_css as layers, theme, tokens, tokensDark, usePresence };