@optiaxiom/react 1.6.6 → 1.6.8

package/dist/index.d.ts

@@ -1,9 +1,9 @@
 import * as react from 'react';
 import { ComponentPropsWithRef, ReactNode, ComponentPropsWithoutRef, ElementType, RefObject, FocusEventHandler, ChangeEventHandler, ReactElement } from 'react';
-import { R as RecipeVariants, B as BoxProps, S as Sprinkles, a as ButtonProps, E as ExcludeProps, F as Flex, b as Button, c as ExtendProps, I as Input, C as Calendar, d as CalendarProps, e as Box, f as ResponsiveArray, P as PopoverContent, g as PopoverContentProps, h as PopoverTrigger, M as ModalListbox, i as ButtonRoot, j as InputControlProps, k as InputRoot } from './MenuTrigger-DhqiQtiJ.js';
-export { l as DialogContent, D as DialogContentProps, m as FlexProps, o as InputControl, n as InputProps, p as InputRootProps, q as ListboxItemized, L as ListboxItemizedProps, J as LonghandProps, t as Menu, v as MenuContent, u as MenuContentProps, r as MenuOption, s as MenuProps, x as MenuTrigger, w as MenuTriggerProps, y as PopoverTriggerProps, K as TableHeaderCell, T as TableHeaderCellProps, G as mapResponsiveValue, H as normalizeResponsiveValue, A as sprinkles, z as vars } from './MenuTrigger-DhqiQtiJ.js';
+import { R as RecipeVariants, B as BoxProps, S as Sprinkles, a as ButtonProps, E as ExcludeProps, F as Flex, b as Button, d as dialogkit, c as ExtendProps, I as Input, C as Calendar, e as CalendarProps, f as Box, g as ResponsiveArray, P as PopoverContent, h as PopoverContentProps, i as PopoverTrigger, M as ModalListbox, j as ButtonRoot, k as InputControlProps, l as InputRoot } from './MenuTrigger-BYIG1rXQ.js';
+export { m as DialogContent, D as DialogContentProps, n as FlexProps, p as InputControl, o as InputProps, q as InputRootProps, r as ListboxItemized, L as ListboxItemizedProps, K as LonghandProps, u as Menu, w as MenuContent, v as MenuContentProps, s as MenuOption, t as MenuProps, y as MenuTrigger, x as MenuTriggerProps, z as PopoverTriggerProps, N as TableHeaderCell, T as TableHeaderCellProps, H as mapResponsiveValue, J as normalizeResponsiveValue, G as sprinkles, A as vars } from './MenuTrigger-BYIG1rXQ.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as RadixAlertDialog from '@radix-ui/react-alert-dialog';
+import * as RadixDialog from '@radix-ui/react-dialog';
 import * as RadixTooltip from '@radix-ui/react-tooltip';
 import { createToaster } from '@optiaxiom/globals';
 export { createToaster, theme, toaster, tokens } from '@optiaxiom/globals';
@@ -11,7 +11,6 @@ import * as RadixToast from '@radix-ui/react-toast';
 import * as RadixPortal from '@radix-ui/react-portal';
 import { Table as Table$1 } from '@tanstack/table-core';
 import * as _radix_ui_react_popover from '@radix-ui/react-popover';
-import * as RadixDialog from '@radix-ui/react-dialog';
 import * as RadixCollapsible from '@radix-ui/react-collapsible';
 import * as RadixMenu from '@radix-ui/react-dropdown-menu';
 import * as RadixSeparator from '@radix-ui/react-separator';
@@ -28,8 +27,8 @@ import 'react-day-picker';
 declare const sprinklesMerge: (...classNames: Array<string | undefined>) => string;
 
 declare function extractBoxProps<S extends Record<string, unknown>>(props: S): {
-    boxProps: Pick<S, ("animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "styles" | "className") & keyof S>;
-    restProps: Omit<S, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "styles" | "className">;
+    boxProps: Pick<S, ("animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "styles" | "className") & keyof S>;
+    restProps: Omit<S, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "styles" | "className">;
 };
 
 declare const alert: (props?: {
@@ -72,7 +71,7 @@ type AlertDialogProps = {
      */
     open?: boolean;
 };
-declare function AlertDialog({ children, defaultOpen, onOpenChange, open: openProp, ...props }: AlertDialogProps): react_jsx_runtime.JSX.Element;
+declare function AlertDialog(props: AlertDialogProps): react_jsx_runtime.JSX.Element;
 declare namespace AlertDialog {
     var displayName: string;
 }
@@ -93,7 +92,7 @@ declare const ButtonGroup: react.ForwardRefExoticComponent<{
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
-type AlertDialogActionProps = ButtonProps<typeof RadixAlertDialog.Action>;
+type AlertDialogActionProps = ButtonProps<typeof RadixDialog.Close>;
 declare const AlertDialogAction: react.ForwardRefExoticComponent<Omit<{
     addonAfter?: react.ReactNode;
     addonBefore?: react.ReactNode;
@@ -103,23 +102,23 @@ declare const AlertDialogAction: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, "size"> & Omit<Omit<RadixAlertDialog.AlertDialogActionProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "disabled" | "asChild" | "className"> & react.RefAttributes<HTMLButtonElement>>;
+}>, "size"> & Omit<Omit<RadixDialog.DialogCloseProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "disabled" | "asChild" | "className"> & react.RefAttributes<HTMLButtonElement>>;
 
-type AlertDialogBodyProps = BoxProps<typeof RadixAlertDialog.Description>;
+type AlertDialogBodyProps = BoxProps<typeof RadixDialog.Description>;
 declare const AlertDialogBody: react.ForwardRefExoticComponent<Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<RadixAlertDialog.AlertDialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref">, "color" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
+}>, never> & Omit<Omit<RadixDialog.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>, "ref">, "color" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
-type AlertDialogCancelProps = ButtonProps<typeof RadixAlertDialog.Cancel>;
+type AlertDialogCancelProps = ButtonProps<typeof RadixDialog.Close>;
 declare const AlertDialogCancel: react.ForwardRefExoticComponent<Omit<{
     addonAfter?: react.ReactNode;
     addonBefore?: react.ReactNode;
@@ -129,15 +128,15 @@ declare const AlertDialogCancel: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, "size"> & Omit<Omit<RadixAlertDialog.AlertDialogCancelProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "disabled" | "asChild" | "className"> & react.RefAttributes<HTMLButtonElement>>;
+}>, "size"> & Omit<Omit<RadixDialog.DialogCloseProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "disabled" | "asChild" | "className"> & react.RefAttributes<HTMLButtonElement>>;
 
 declare const content: (props?: {
     size?: "sm" | "md" | "lg" | undefined;
@@ -146,7 +145,7 @@ declare const content: (props?: {
 };
 type DialogVariants = RecipeVariants<typeof content>;
 
-type AlertDialogContentProps = ExcludeProps<BoxProps<typeof RadixAlertDialog.Content, DialogVariants>, "forceMount">;
+type AlertDialogContentProps = ExcludeProps<BoxProps<typeof RadixDialog.Content, DialogVariants>, "forceMount">;
 declare const AlertDialogContent: react.ForwardRefExoticComponent<AlertDialogContentProps & react.RefAttributes<HTMLDivElement>>;
 
 type AlertDialogFooterProps = ComponentPropsWithRef<typeof Flex>;
@@ -175,7 +174,7 @@ declare const AlertDialogHeader: react.ForwardRefExoticComponent<{
     className?: string;
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLHeadingElement>>;
 
-type AlertDialogTriggerProps = ButtonProps<typeof RadixAlertDialog.Trigger>;
+type AlertDialogTriggerProps = ButtonProps<typeof RadixDialog.Trigger>;
 declare const AlertDialogTrigger: react.ForwardRefExoticComponent<Omit<{
     addonAfter?: react.ReactNode;
     addonBefore?: react.ReactNode;
@@ -185,15 +184,15 @@ declare const AlertDialogTrigger: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, "size"> & Omit<Omit<RadixAlertDialog.AlertDialogTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "disabled" | "asChild" | "className"> & react.RefAttributes<HTMLButtonElement>>;
+}>, "size"> & Omit<Omit<RadixDialog.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>, "ref">, "color" | "disabled" | "asChild" | "className"> & react.RefAttributes<HTMLButtonElement>>;
 
 type AngleMenuButtonProps = ComponentPropsWithoutRef<typeof Button>;
 declare const AngleMenuButton: react.ForwardRefExoticComponent<Omit<Omit<{
@@ -205,9 +204,9 @@ declare const AngleMenuButton: react.ForwardRefExoticComponent<Omit<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -305,6 +304,17 @@ declare const AvatarGroup: react.ForwardRefExoticComponent<{
     className?: string;
 }>, "size"> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
+type DialogKitProviderProps$1 = {
+    /**
+     * An instance of dialogkit returned from the `createDialogKit` method.
+     */
+    kit?: typeof dialogkit;
+};
+declare function DialogKitProvider({ kit }: DialogKitProviderProps$1): ReactNode;
+declare namespace DialogKitProvider {
+    var displayName: string;
+}
+
 declare const root: (props?: {
     intent?: "information" | "success" | "warning" | "danger" | "neutral" | undefined;
 } | undefined, className?: string) => {
@@ -325,9 +335,9 @@ declare const ToastAction: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -448,6 +458,12 @@ declare const TooltipTrigger: react.ForwardRefExoticComponent<Omit<RadixTooltip.
 
 type AxiomProviderProps = {
     children?: ReactNode;
+    /**
+     * Props for the `DialogKitProvider` component
+     *
+     * {@link https://optimizely-axiom.github.io/optiaxiom/components/dialog/ Documentation}
+     */
+    dialog?: Omit<DialogKitProviderProps, "children">;
     /**
      * Props for the `ToastProvider` component
      *
@@ -461,11 +477,13 @@ type AxiomProviderProps = {
      */
     tooltip?: Omit<TooltipProviderProps, "children">;
 };
+interface DialogKitProviderProps extends ComponentPropsWithoutRef<typeof DialogKitProvider> {
+}
 interface ToastProviderProps extends ComponentPropsWithoutRef<typeof ToastProvider> {
 }
 interface TooltipProviderProps extends ComponentPropsWithoutRef<typeof TooltipProvider> {
 }
-declare function AxiomProvider({ children, toast, tooltip, }: AxiomProviderProps): react_jsx_runtime.JSX.Element;
+declare function AxiomProvider({ children, dialog, toast, tooltip, }: AxiomProviderProps): react_jsx_runtime.JSX.Element;
 declare namespace AxiomProvider {
     var displayName: string;
 }
@@ -631,7 +649,7 @@ declare const CheckboxControl: react.ForwardRefExoticComponent<{
 }>, never> & Omit<Omit<Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>>;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>>;
 
 type CheckboxProps = BoxProps<typeof ToggleInputHiddenInput, Pick<ComponentPropsWithoutRef<typeof CheckboxContent>, "description"> & Pick<ComponentPropsWithoutRef<typeof CheckboxControl>, "indeterminate">>;
 declare const Checkbox: react.ForwardRefExoticComponent<Pick<Omit<{
@@ -650,7 +668,7 @@ declare const Checkbox: react.ForwardRefExoticComponent<Pick<Omit<{
 }>, never> & Omit<Omit<Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>, "ref">, "indeterminate"> & Omit<NonNullable<Sprinkles & {
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>, "ref">, "indeterminate"> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
 }>, never> & Omit<Omit<{
@@ -721,7 +739,7 @@ type LinkProps = BoxProps<"a", LinkVariants & {
      */
     disabled?: boolean;
     /**
-     * Show an external link icon and sets the correct rel/target attributes.
+     * Shows an external link icon and sets the correct rel/target attributes.
      */
     external?: boolean;
 }>;
@@ -737,7 +755,7 @@ declare const Link: react.ForwardRefExoticComponent<{
      */
     disabled?: boolean;
     /**
-     * Show an external link icon and sets the correct rel/target attributes.
+     * Shows an external link icon and sets the correct rel/target attributes.
      */
     external?: boolean;
 } & Omit<NonNullable<Sprinkles & {
@@ -860,7 +878,7 @@ declare const TableAction: react.ForwardRefExoticComponent<Omit<NonNullable<Spri
 } & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
 type TableBodyProps = BoxProps<"tbody">;
 declare const TableBody: react.ForwardRefExoticComponent<Omit<NonNullable<Sprinkles & {
@@ -926,7 +944,7 @@ declare const DataTableAction: react.ForwardRefExoticComponent<{
 } & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
 type DataTableBodyProps = BoxProps<"div", {
     /**
@@ -969,7 +987,7 @@ declare const DataTableCheckbox: react.ForwardRefExoticComponent<Omit<Pick<Omit<
 }>, never> & Omit<Omit<Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>, "ref">, "indeterminate"> & Omit<NonNullable<Sprinkles & {
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>, "ref">, "indeterminate"> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
 }>, never> & Omit<Omit<{
@@ -987,7 +1005,7 @@ declare const DataTableCheckbox: react.ForwardRefExoticComponent<Omit<Pick<Omit<
 } & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "visible"> & react.RefAttributes<HTMLInputElement>>;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "visible"> & react.RefAttributes<HTMLInputElement>>;
 
 type DataTableFooterProps = BoxProps<"div", {
     /**
@@ -1204,7 +1222,7 @@ declare const ListboxCheckboxItem: react.ForwardRefExoticComponent<Omit<Omit<Non
 }>, never> & Omit<Omit<Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>, "ref">, "indeterminate"> & Omit<NonNullable<Sprinkles & {
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLInputElement>, "ref">, "indeterminate"> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
 }>, never> & Omit<Omit<{
@@ -1296,7 +1314,7 @@ declare const ListboxSeparator: react.ForwardRefExoticComponent<Omit<NonNullable
 } & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<RadixSeparator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className" | "orientation"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
+}>, never> & Omit<Omit<RadixSeparator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className" | "orientation"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
 declare const thumb: (props?: {
     size?: "md" | "lg" | undefined;
@@ -1414,9 +1432,9 @@ declare const DateRangePickerTrigger: react.ForwardRefExoticComponent<Omit<Omit<
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -1471,9 +1489,9 @@ declare const DialogClose: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -1531,9 +1549,9 @@ declare const DialogTrigger: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -1739,9 +1757,9 @@ declare const DropdownMenuTrigger: react.ForwardRefExoticComponent<Omit<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -1759,9 +1777,9 @@ declare const EllipsisMenuButton: react.ForwardRefExoticComponent<Omit<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -1937,7 +1955,7 @@ declare const Indicator: react.ForwardRefExoticComponent<{
 }, never> & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLSpanElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className" | "content"> & react.RefAttributes<HTMLDivElement>>;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLSpanElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className" | "content"> & react.RefAttributes<HTMLDivElement>>;
 
 declare const key: (props?: {
     variant?: "outline" | "subtle" | undefined;
@@ -1992,9 +2010,9 @@ declare const LabelMenuButton: react.ForwardRefExoticComponent<Omit<Omit<NonNull
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -2218,7 +2236,7 @@ declare const NavSeparator: react.ForwardRefExoticComponent<Omit<NonNullable<Spr
 } & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<RadixSeparator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className" | "orientation"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
+}>, never> & Omit<Omit<RadixSeparator.SeparatorProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className" | "orientation"> & react.RefAttributes<HTMLDivElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
 type PaginationProps = BoxProps<"nav", {
     /**
@@ -2284,7 +2302,7 @@ declare const Paper: react.ForwardRefExoticComponent<{
 }>, never> & Omit<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLDivElement>>;
 
 declare const indicator: (props?: {
-    intent?: "success" | "danger" | "primary" | undefined;
+    intent?: "success" | "danger" | "opal" | "primary" | undefined;
 } | undefined, className?: string) => {
     className: string;
 };
@@ -2295,7 +2313,7 @@ declare const Progress: react.ForwardRefExoticComponent<Omit<NonNullable<Sprinkl
     asChild?: boolean;
     className?: string;
 }>, never> & Omit<Omit<ProgressPrimitive.ProgressProps & react.RefAttributes<HTMLDivElement>, "ref">, "color" | "asChild" | "className"> & {
-    intent?: "success" | "danger" | "primary" | undefined;
+    intent?: "success" | "danger" | "opal" | "primary" | undefined;
 } & react.RefAttributes<HTMLDivElement>>;
 
 type RadioProps = BoxProps<typeof ToggleInputHiddenInput, {
@@ -2423,9 +2441,9 @@ declare const SegmentedControlItem: react.ForwardRefExoticComponent<Omit<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, never> & Omit<NonNullable<Sprinkles & {
@@ -2724,7 +2742,7 @@ declare const Textarea: react.ForwardRefExoticComponent<Pick<Omit<Pick<{
 } & Omit<NonNullable<Sprinkles & {
     asChild?: boolean;
     className?: string;
-}>, never> & Omit<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLTextAreaElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "disabled" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className" | "maxRows" | "resize"> & react.RefAttributes<HTMLTextAreaElement>>;
+}>, never> & Omit<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">, "color" | "className"> & react.RefAttributes<HTMLTextAreaElement>, "ref">, "animation" | "fontFamily" | "fontSize" | "size" | "backgroundImage" | "borderColor" | "color" | "cursor" | "fontWeight" | "objectFit" | "overflowX" | "overflowY" | "pointerEvents" | "textAlign" | "textTransform" | "transition" | "whiteSpace" | "bg" | "border" | "borderB" | "borderL" | "borderR" | "borderT" | "m" | "mx" | "my" | "mb" | "ml" | "mr" | "mt" | "overflow" | "p" | "px" | "py" | "pb" | "pl" | "pr" | "pt" | "rounded" | "shadow" | "z" | "disabled" | "gap" | "alignItems" | "alignSelf" | "display" | "flex" | "flexDirection" | "flexWrap" | "gridColumn" | "gridTemplateColumns" | "justifyContent" | "justifyItems" | "placeItems" | "maxH" | "maxW" | "h" | "w" | "asChild" | "className" | "maxRows" | "resize"> & react.RefAttributes<HTMLTextAreaElement>>;
 
 type ThemeProviderProps = {
     children?: ReactNode;
@@ -2754,9 +2772,9 @@ declare const ToggleButton: react.ForwardRefExoticComponent<{
     intent?: "danger" | "neutral" | "primary" | undefined;
     size?: "sm" | "md" | "lg" | undefined;
     square?: boolean | undefined;
-    variant?: "strong" | "opal" | "outline" | "subtle" | undefined;
+    variant?: "strong" | "outline" | "outline-opal" | "strong-opal" | "subtle" | undefined;
 }, "intent" | "variant"> & {
-    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "inverse" | "primary-opal";
+    appearance?: "default" | "danger" | "primary" | "subtle" | "danger-outline" | "default-opal" | "inverse" | "primary-opal";
     disabled?: boolean;
     loading?: boolean;
 }>, "appearance"> & Omit<NonNullable<Sprinkles & {