@prismicio/editor-ui 0.4.27 → 0.4.29

package/README.md

@@ -5,10 +5,6 @@
 - When passing a React Node as children to a radix primitive that has the `asChild` prop, you must spread all unused props into that React Node, even if at the type level there doesn't seem to be any remaining props. This is because radix secretly set a lot of extra props on the React Node you gave it. For an example of this, see BaseInput's `otherProps`.
   We favor using `asChild` to reduce the number of DOM nodes and make it easy to size children.
 
-## vanilla-extract GOTCHAS
-
-- You can not reference a parent selector that is made of ONLY `sprinkles` generated classNames. See Field.css.ts -> labelPosition to see a workaround: An empty object is passed to `styleVariant` which is equivalent to having an empty className generated with `style({})`.
-
 ## How to add a new SVG icon
 
 1. Export the SVG icon from [Figma](https://www.figma.com/file/V5pub1BwPMJGY52YHmhTmX/Prismic---Design-System?node-id=46%3A2811). It should always be the variant with a viewbox of 24x24.

package/dist/components/AnimatedElement/AnimatedElement.d.ts

@@ -1,5 +1,5 @@
 import { type ReactElement } from "react";
-import { type SX, type ThemeKeys } from "../../theme/new";
+import { type SX, type ThemeKeys } from "../../theme";
 export interface AnimatedElementProps {
     children: OnlyChild;
     animation?: {

package/dist/components/AnimatedElement/AnimatedElement.stories.d.ts

@@ -16,7 +16,7 @@ export declare const Default: {
         } | undefined;
         enterDuration?: 0 | 100 | 75 | 150 | 200 | 250 | 300 | 400 | undefined;
         exitDuration?: 0 | 100 | 75 | 150 | 200 | 250 | 300 | 400 | undefined;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
     }) => JSX.Element;
     args: {
         children: null;

package/dist/components/AnimatedList/AnimatedList.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 import { type RenderDragPreview, type RenderDropIndicator } from "./dnd";
 import { type State } from "./layout";
 export interface AnimatedListProps<ITEM> {

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

@@ -1,5 +1,5 @@
 import { type MouseEvent, type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import { type IconName } from "../Icon";
 export interface BadgeProps {
     title: ReactNode;
@@ -14,6 +14,6 @@ export interface BadgeProps {
     onMouseEnter?: () => void;
     onMouseLeave?: () => void;
     /** Makes the badge content editable, fires onBlur when the value has changed */
-    onEdit?: (newTitle: string) => void;
+    onEdit?: (newTitle: string) => void | Promise<void>;
 }
 export declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/BaseInput/BaseInput.d.ts

@@ -1,5 +1,5 @@
 import { type AriaRole, type ClipboardEventHandler, type FocusEvent, type KeyboardEvent, type ReactNode } from "react";
-import type { SX, ThemeKeys } from "../../theme/new";
+import type { SX, ThemeKeys } from "../../theme";
 /**
  * Flexible base Input, provided with no height or block padding.
  */

package/dist/components/BlankSlate/BlankSlate.d.ts

@@ -1,5 +1,5 @@
 import type { CSSProperties, ReactNode } from "react";
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 import { type IconName } from "../Icon";
 export interface BlankSlateProps {
     style?: CSSProperties;

package/dist/components/Box/Box.d.ts

@@ -1,5 +1,5 @@
 import { type CSSProperties, type ReactNode } from "react";
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 export type BoxProps = {
     as?: "div" | "nav" | "ul" | "ol" | "article" | "header" | "form" | "span";
     children?: ReactNode;

package/dist/components/Box/Box.stories.d.ts

@@ -60,7 +60,7 @@ export declare const Default: {
         }) | undefined;
         borderStyle?: "none" | "dashed" | "solid" | undefined;
         borderColor?: "inherit" | "currentColor" | "transparent" | "white" | "black" | "grey1" | "grey2" | "grey3" | "grey4" | "grey5" | "grey6" | "grey7" | "grey8" | "grey9" | "grey10" | "grey11" | "grey12" | "dark12" | "indigo2" | "indigo4" | "indigo7" | "indigo10" | "indigo11" | "indigo12" | "green3" | "green4" | "green9" | "green10" | "green11" | "green12" | "amber3" | "amber4" | "amber9" | "amber10" | "amber11" | "amber12" | "tomato1" | "tomato2" | "tomato3" | "tomato4" | "tomato6" | "tomato7" | "tomato9" | "tomato10" | "tomato11" | "tomato12" | "purple1" | "purple2" | "purple3" | "purple4" | "purple5" | "purple6" | "purple7" | "purple8" | "purple9" | "purple10" | "purple11" | "purple12" | "greyAlpha1" | undefined;
-        boxShadow?: "1" | "2" | "4" | "none" | "3" | "-1" | "purpleFocus" | "ghostFocus" | "greenFocus" | "amberFocus" | "tomatoFocus" | "gradient" | "greyFocus" | "cropper" | "windowTabs" | undefined;
+        boxShadow?: "1" | "2" | "4" | "none" | "3" | "-1" | "purpleFocus" | "ghostFocus" | "greenFocus" | "amberFocus" | "tomatoFocus" | "gradient" | "greyFocus" | "cropper" | undefined;
         backgroundColor?: "inherit" | "currentColor" | "transparent" | "white" | "black" | "grey1" | "grey2" | "grey3" | "grey4" | "grey5" | "grey6" | "grey7" | "grey8" | "grey9" | "grey10" | "grey11" | "grey12" | "dark12" | "indigo2" | "indigo4" | "indigo7" | "indigo10" | "indigo11" | "indigo12" | "green3" | "green4" | "green9" | "green10" | "green11" | "green12" | "amber3" | "amber4" | "amber9" | "amber10" | "amber11" | "amber12" | "tomato1" | "tomato2" | "tomato3" | "tomato4" | "tomato6" | "tomato7" | "tomato9" | "tomato10" | "tomato11" | "tomato12" | "purple1" | "purple2" | "purple3" | "purple4" | "purple5" | "purple6" | "purple7" | "purple8" | "purple9" | "purple10" | "purple11" | "purple12" | "greyAlpha1" | undefined;
         opacity?: 0 | 1 | 0.1 | 0.3 | 0.4 | 0.5 | 0.6 | 0.8 | 0.9 | undefined;
         visibility?: "hidden" | "visible" | undefined;
@@ -126,7 +126,7 @@ export declare const Default: {
         }) | undefined;
         borderStyle?: "none" | "dashed" | "solid" | undefined;
         borderColor?: "inherit" | "currentColor" | "transparent" | "white" | "black" | "grey1" | "grey2" | "grey3" | "grey4" | "grey5" | "grey6" | "grey7" | "grey8" | "grey9" | "grey10" | "grey11" | "grey12" | "dark12" | "indigo2" | "indigo4" | "indigo7" | "indigo10" | "indigo11" | "indigo12" | "green3" | "green4" | "green9" | "green10" | "green11" | "green12" | "amber3" | "amber4" | "amber9" | "amber10" | "amber11" | "amber12" | "tomato1" | "tomato2" | "tomato3" | "tomato4" | "tomato6" | "tomato7" | "tomato9" | "tomato10" | "tomato11" | "tomato12" | "purple1" | "purple2" | "purple3" | "purple4" | "purple5" | "purple6" | "purple7" | "purple8" | "purple9" | "purple10" | "purple11" | "purple12" | "greyAlpha1" | undefined;
-        boxShadow?: "1" | "2" | "4" | "none" | "3" | "-1" | "purpleFocus" | "ghostFocus" | "greenFocus" | "amberFocus" | "tomatoFocus" | "gradient" | "greyFocus" | "cropper" | "windowTabs" | undefined;
+        boxShadow?: "1" | "2" | "4" | "none" | "3" | "-1" | "purpleFocus" | "ghostFocus" | "greenFocus" | "amberFocus" | "tomatoFocus" | "gradient" | "greyFocus" | "cropper" | undefined;
         backgroundColor?: "inherit" | "currentColor" | "transparent" | "white" | "black" | "grey1" | "grey2" | "grey3" | "grey4" | "grey5" | "grey6" | "grey7" | "grey8" | "grey9" | "grey10" | "grey11" | "grey12" | "dark12" | "indigo2" | "indigo4" | "indigo7" | "indigo10" | "indigo11" | "indigo12" | "green3" | "green4" | "green9" | "green10" | "green11" | "green12" | "amber3" | "amber4" | "amber9" | "amber10" | "amber11" | "amber12" | "tomato1" | "tomato2" | "tomato3" | "tomato4" | "tomato6" | "tomato7" | "tomato9" | "tomato10" | "tomato11" | "tomato12" | "purple1" | "purple2" | "purple3" | "purple4" | "purple5" | "purple6" | "purple7" | "purple8" | "purple9" | "purple10" | "purple11" | "purple12" | "greyAlpha1" | undefined;
         opacity?: 0 | 1 | 0.1 | 0.3 | 0.4 | 0.5 | 0.6 | 0.8 | 0.9 | undefined;
         visibility?: "hidden" | "visible" | undefined;

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

@@ -1,5 +1,5 @@
 import { type MouseEvent, type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import { type IconName } from "../Icon";
 export interface ButtonProps {
     children?: ReactNode;

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

@@ -23,7 +23,7 @@ export declare const Default: {
         textColor?: "placeholder" | undefined;
         flexContent?: boolean | undefined;
         textWeight?: "bold" | "normal" | undefined;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
         startIcon?: "visibility" | "search" | "link" | "description" | "code" | "add" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "autoFixHigh" | "biToggle" | "block" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "chevronLeft" | "chevronRight" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "database" | "dateRange" | "delete" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "expandLess" | "expandMore" | "firstPage" | "folder" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "hideImage" | "image" | "imageSearch" | "insertDriveFile" | "inventory" | "keyboardArrowDown" | "keyboardArrowUp" | "label" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "migrationRelease" | "moreVert" | "multipleStop" | "musicNote" | "notes" | "openInFull" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "playCircle" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "smartDisplay" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "upload" | "viewDay" | "zoomOutMap" | undefined;
         endIcon?: "visibility" | "search" | "link" | "description" | "code" | "add" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "autoFixHigh" | "biToggle" | "block" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "chevronLeft" | "chevronRight" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "database" | "dateRange" | "delete" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "expandLess" | "expandMore" | "firstPage" | "folder" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "hideImage" | "image" | "imageSearch" | "insertDriveFile" | "inventory" | "keyboardArrowDown" | "keyboardArrowUp" | "label" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "migrationRelease" | "moreVert" | "multipleStop" | "musicNote" | "notes" | "openInFull" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "playCircle" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "smartDisplay" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "upload" | "viewDay" | "zoomOutMap" | undefined;
         renderStartIcon?: ((icon: import("react").ReactNode) => import("react").ReactNode) | undefined;

package/dist/components/ButtonGroup/ButtonGroup.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface ButtonGroupProps {
     children?: ReactNode;
     disabled?: boolean;

package/dist/components/ButtonGroup/ButtonGroup.stories.d.ts

@@ -36,7 +36,7 @@ export declare const Default: {
         size?: "small" | "medium" | "large" | undefined;
         color?: "dark" | "grey" | "purple" | undefined;
         density?: "regular" | "compact" | undefined;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
         ref?: import("react").Ref<HTMLDivElement> | undefined;
         key?: import("react").Key | null | undefined;
     }) => JSX.Element;

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

@@ -1,5 +1,5 @@
 import type { KeyboardEvent, MouseEvent, ReactNode } from "react";
-import { type SX } from "../../theme/new";
+import { type SX } from "../../theme";
 import { type TextProps } from "../Text";
 export interface CardProps {
     children?: ReactNode;

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

@@ -39,7 +39,7 @@ export declare const Default: {
         paddingBlock?: 0 | 8 | 16 | 28 | undefined;
         paddingInline?: 16 | 24 | undefined;
         onSelect?: ((event: import("react").MouseEvent<Element, MouseEvent> | import("react").KeyboardEvent<Element>) => void) | undefined;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
     }) => JSX.Element;
     args: {
         color: "grey1";

package/dist/components/ComboBox/ComboBox.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 type Variant = "attached" | "detached";
 export interface ComboBoxProps {
     children: ReactNode;
@@ -17,9 +17,10 @@ interface ComboBoxContentProps {
 }
 export declare const ComboBoxContent: import("react").ForwardRefExoticComponent<ComboBoxContentProps & import("react").RefAttributes<HTMLDivElement>>;
 type ComboBoxItemProps = {
-    onSelect: () => void;
+    value: string;
+    checked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
     disabled?: boolean;
-    selected?: boolean;
     children: ReactNode;
 };
 export declare const ComboBoxItem: import("react").ForwardRefExoticComponent<ComboBoxItemProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/ComboBox/useComboBox.d.ts

@@ -17,5 +17,16 @@ export declare function useInternalSelection(props: UseInternalSelectionProps):
     onItemPicked: () => void;
     cleanupInternalState: () => void;
 };
+export declare function getValidItems(contentInnerRef: RefObject<HTMLDivElement>): Element[];
 export declare function getSelectedItem(contentInnerRef: RefObject<HTMLDivElement>): Element | null | undefined;
+interface UseSelectFirstArgs {
+    listIsOpen: boolean;
+    contentInnerRef: RefObject<HTMLDivElement>;
+    onChangeInternalSelection: (value: string | undefined) => void;
+}
+/**
+ * Selects first option if there is no selected option or the selected option is not available anymore
+ * @private
+ */
+export declare function useSelectFirst(args: UseSelectFirstArgs): void;
 export {};

package/dist/components/DateInput/DateInput.d.ts

@@ -1,5 +1,5 @@
 import { Time } from "@internationalized/date";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export type DateInputProps = {
     value?: Date;
     mode: Mode;

package/dist/components/DateInput/DateInput.stories.d.ts

@@ -24,7 +24,7 @@ export declare const Default: {
         disabled?: boolean | undefined;
         minValue?: "today" | undefined;
         "aria-labelledby": string;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
         onValueChange: (value?: Date | undefined) => void;
     }) => JSX.Element;
     args: {

package/dist/components/Dialog/Options/DialogOptions.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import type { SX } from "../../../theme/new";
+import type { SX } from "../../../theme";
 import { type IconName } from "../../Icon";
 export interface DialogOptionsProps {
     value?: string;

package/dist/components/EditableText/EditableText.d.ts

@@ -1,4 +1,4 @@
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 import { textVariantMapping } from "../Text";
 export interface EditableTextProps {
     "aria-label": string;

package/dist/components/ErrorBoundary/DefaultErrorMessage.d.ts

@@ -1,4 +1,4 @@
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface DefaultErrorMessageProps {
     title: string;
     description?: string;

package/dist/components/Form/Form.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface FormProps {
     children?: ReactNode;
     sx?: SX;

package/dist/components/Form/Form.stories.d.ts

@@ -15,7 +15,7 @@ export default meta;
 export declare const Default: {
     render: (args: {
         children?: import("react").ReactNode;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
         onSubmit: () => void;
     }) => JSX.Element;
     args: {};

package/dist/components/Form/FormDateInput.d.ts

@@ -1,5 +1,5 @@
 import { Time } from "@internationalized/date";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import type { DateInputProps } from "../DateInput/DateInput";
 export interface FormDateInputProps {
     label: string;

package/dist/components/Form/FormField.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export type FormFieldProps = {
     children?: ReactNode;
     disabled?: boolean;

package/dist/components/Form/FormInput.d.ts

@@ -1,5 +1,5 @@
 import { type ClipboardEventHandler, type KeyboardEvent, type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import { type IconName } from "../Icon";
 export interface FormInputProps {
     type?: "text" | "email" | "password" | "number";

package/dist/components/Form/FormSearchInput.d.ts

@@ -1,5 +1,5 @@
 import { type AriaRole, type FocusEvent } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface FormSearchInputProps {
     label?: string;
     placeholder?: string;
@@ -13,5 +13,6 @@ export interface FormSearchInputProps {
     onFocus?: (event: FocusEvent<HTMLInputElement, Element>) => void;
     onBlur?: (event: FocusEvent<HTMLInputElement, Element>) => void;
     endAdornment?: boolean;
+    autoFocus?: boolean;
 }
 export declare const FormSearchInput: import("react").ForwardRefExoticComponent<FormSearchInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/Gradient/Gradient.d.ts

@@ -1,4 +1,4 @@
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface GradientProps {
     sx?: SX;
 }

package/dist/components/HairlineButton/HairlineButton.d.ts

@@ -1,5 +1,5 @@
 import { type MouseEvent } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import { type IconName } from "../Icon";
 export interface HairlineButtonProps {
     icon: IconName;

package/dist/components/Icon/Icon.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { type SX, type ThemeKeys } from "../../theme/new";
+import { type SX, type ThemeKeys } from "../../theme";
 import type { IconName } from "./iconNames";
 export interface IconProps {
     className?: string;

package/dist/components/Image/Image.d.ts

@@ -1,4 +1,4 @@
-import { type SX } from "../../theme/new";
+import { type SX } from "../../theme";
 export interface ImageProps {
     "aria-label"?: string;
     src: string;

package/dist/components/LazyRender/LazyRender.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 /**
  * Lazily renders a child the first time it intersects with the viewport.
  * Works with any vertical scrolling ancestor (direct or not).

package/dist/components/List/UnorderedList.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface UnorderedListProps {
     children?: ReactNode;
     sx?: SX;

package/dist/components/List/UnorderedList.stories.d.ts

@@ -16,7 +16,7 @@ export declare const Default: {
     name: string;
     render: (args: {
         children?: import("react").ReactNode;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
     }) => JSX.Element;
     args: {
         children: JSX.Element;

package/dist/components/MediaCard/MediaCard.d.ts

@@ -41,6 +41,11 @@ interface MediaCardProps {
      * @param checked - The new checked state of the checkbox
      */
     onCheckedChange?: (checked: boolean) => void;
+    /**
+     * Function called when Add a tag is clicked
+     * @description This only affects the Add a tag button, not the card
+     */
+    onAddTagClick?: () => void;
 }
 export declare function MediaCard(props: MediaCardProps): JSX.Element;
 interface MediaCardPlaceholderProps {

package/dist/components/NumberInput/NumberInput.d.ts

@@ -1,4 +1,4 @@
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import type { BaseInputProps } from "../BaseInput/BaseInput";
 export interface NumberInputProps {
     autoComplete?: string;

package/dist/components/OverflowContainer/OverflowContainer.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 type Gap = Extract<ThemeKeys<"space">, number>;
 interface OverflowContainerProps {
     children: ReactNode[];

package/dist/components/ProgressCircle/ProgressCircle.d.ts

@@ -1,4 +1,4 @@
-import { type ThemeKeys } from "../../theme/new";
+import { type ThemeKeys } from "../../theme";
 export interface ProgressCircleProps {
     color?: ThemeKeys<"color">;
 }

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

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface RadioGroupProps<VALUE extends string> {
     values: readonly VALUE[];
     selectedValue: VALUE;

package/dist/components/SearchInput/SearchInput.d.ts

@@ -1,5 +1,5 @@
 import { type AriaRole, type FocusEvent } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface SearchInputProps {
     value: string;
     onValueChange: (value: string) => void;

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

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import { type SX } from "../../theme/new";
+import { type SX } from "../../theme";
 import { type IconName } from "../Icon";
 export interface SelectProps<VALUE extends string> {
     disabled?: boolean;

package/dist/components/SelectButton/SelectButton.d.ts

@@ -1,4 +1,4 @@
-import type { ThemeKeys } from "../../theme/new";
+import type { ThemeKeys } from "../../theme";
 import { type IconName } from "../Icon";
 export interface SelectButtonProps {
     textContent: string;

package/dist/components/Separator/Separator.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface SeparatorProps {
     /**
      * Either `vertical` or `horizontal`. Defaults to `horizontal`.

package/dist/components/Separator/Separator.stories.d.ts

@@ -24,7 +24,7 @@ export declare const Default: {
         orientation?: "horizontal" | "vertical" | undefined;
         decorative?: boolean | undefined;
         style?: "dashed" | "solid" | undefined;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
         ref?: import("react").Ref<HTMLDivElement> | undefined;
         key?: import("react").Key | null | undefined;
     }) => JSX.Element;

package/dist/components/Skeleton/Skeleton.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import type { SX, ThemeKeys } from "../../theme/new";
+import type { SX, ThemeKeys } from "../../theme";
 export interface Props {
     component?: "span";
     borderRadius?: ThemeKeys<"borderRadius", 0 | 4 | 6 | 12 | "100%">;

package/dist/components/Skeleton/Skeleton.stories.d.ts

@@ -42,7 +42,7 @@ export declare const Default: {
         width?: string | number | undefined;
         height?: string | number | undefined;
         children?: import("react").ReactNode;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
     }) => JSX.Element;
     args: {
         width: number;

package/dist/components/Suspense/AnimatedSuspense.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import type { ThemeKeys } from "../../theme/new";
+import type { ThemeKeys } from "../../theme";
 interface AnimatedSuspenseProps {
     children: ReactNode;
     fallback?: ReactNode;

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

@@ -1,4 +1,4 @@
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface SwitchProps {
     id?: string;
     size?: "small" | "medium";

package/dist/components/Tab/Tab.d.ts

@@ -1,4 +1,4 @@
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 export interface TabProps {
     title: string;
     selected?: boolean;

package/dist/components/Text/Text.d.ts

@@ -1,5 +1,5 @@
 import { type AnchorHTMLAttributes, type ReactNode } from "react";
-import { type SX, type ThemeKeys } from "../../theme/new";
+import { type SX, type ThemeKeys } from "../../theme";
 interface BaseTextProps {
     align?: "inherit" | "start" | "center" | "end";
     children?: ReactNode;

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

@@ -1,4 +1,4 @@
-import type { SX, ThemeKeys } from "../../theme/new";
+import type { SX, ThemeKeys } from "../../theme";
 export interface TextAreaProps {
     autoComplete?: string;
     id?: string;

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import type { BaseInputProps } from "../BaseInput/BaseInput";
 export interface TextInputProps {
     inputMode?: "text";

package/dist/components/ThemeProvider.d.ts

@@ -1,7 +1,6 @@
-import { type FC, type ReactNode } from "react";
-import * as styles from "../theme/mode.css";
+import { type ReactNode } from "react";
 export interface ThemeProviderProps {
     children?: ReactNode;
-    mode?: keyof typeof styles.mode | "system";
+    mode?: "light" | "dark" | "system";
 }
-export declare const ThemeProvider: FC<ThemeProviderProps>;
+export declare function ThemeProvider(props: ThemeProviderProps): JSX.Element;

package/dist/components/Toolbar/Toolbar.d.ts

@@ -1,6 +1,6 @@
 import * as ToolbarPrimitive from "@radix-ui/react-toolbar";
 import { type MouseEvent, type ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 import type { IconName } from "../Icon";
 export interface ToolbarProps {
     children?: ReactNode;

package/dist/components/Video/Video.d.ts

@@ -1,4 +1,4 @@
-import { type SX } from "../../theme/new";
+import { type SX } from "../../theme";
 export interface VideoProps {
     src: string;
     loop?: boolean;

package/dist/components/Video/Video.stories.d.ts

@@ -27,7 +27,7 @@ export declare const Default: {
         boxShadow?: "3" | undefined;
         animateOnLoad?: boolean | undefined;
         withControls?: boolean | undefined;
-        sx?: import("../../theme/new").SX | undefined;
+        sx?: import("../../theme").SX | undefined;
         onLoad?: (() => void) | undefined;
     }) => JSX.Element;
     args: {

package/dist/components/Window/Window.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import type { SX } from "../../theme/new";
+import type { SX } from "../../theme";
 interface WindowProps {
     children: ReactNode;
     sx?: SX;