@prismicio/editor-ui 0.4.50 → 0.4.52

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

@@ -1,11 +1,11 @@
 import type { KeyboardEvent, MouseEvent } from "react";
 import { type ProgressBarProps } from "../ProgressBar";
-interface Tag {
-    id: string;
+type Tag = {
+id: string;
     name: string;
 }
-interface MediaCardProps {
-    "aria-label"?: string;
+type MediaCardProps = {
+"aria-label"?: string;
     url: string;
     filename: string;
     filenameHighlight?: string;
@@ -50,8 +50,8 @@ interface MediaCardProps {
     onAddTagClick?: () => void;
 }
 export declare function MediaCard(props: MediaCardProps): JSX.Element;
-interface MediaCardPlaceholderProps {
-    filename: string;
+type MediaCardPlaceholderProps = {
+filename: string;
     kind?: string;
 }
 export declare function MediaCardPlaceholder(props: MediaCardPlaceholderProps): JSX.Element;

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

@@ -1,7 +1,7 @@
 import type { SX } from "../../theme";
 import type { BaseInputProps } from "../BaseInput/BaseInput";
-export interface NumberInputProps {
-    autoComplete?: string;
+export type NumberInputProps = {
+autoComplete?: string;
     id?: string;
     max?: number;
     min?: number;

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

@@ -1,8 +1,8 @@
 import { type ReactNode } from "react";
 import { type ThemeKeys } from "../../theme";
 type Gap = Extract<ThemeKeys<"space">, number>;
-interface OverflowContainerProps {
-    children: ReactNode[];
+type OverflowContainerProps = {
+children: ReactNode[];
     /**
      * simulates a gap by adding a right margin to each item,
      * required so that gap is included within width calculations
@@ -10,12 +10,13 @@ interface OverflowContainerProps {
     gap?: Gap;
 }
 export declare function OverflowContainer(props: OverflowContainerProps): JSX.Element;
-interface OverflowItemProps {
-    children: ReactNode;
+type OverflowItemProps = {
+children: ReactNode;
 }
 export declare function OverflowItem(props: OverflowItemProps): JSX.Element;
-interface OverflowAdornmentProps {
-    adornment: ({ numberOfVisibleItems }: {
+type OverflowAdornmentProps = {
+adornment: ({ numberOfVisibleItems
+}: {
         numberOfVisibleItems: number;
     }) => ReactNode;
 }

package/dist/components/Popover/Popover.d.ts

@@ -1,7 +1,7 @@
 import { type PopoverContentProps } from "@radix-ui/react-popover";
 import type { ReactNode } from "react";
-export interface PopoverProps {
-    anchor: ReactNode;
+export type PopoverProps = {
+anchor: ReactNode;
     children?: ReactNode;
     focusOnEnter?: boolean;
     open?: boolean;

package/dist/components/ProgressBar/ProgressBar.d.ts

@@ -1,6 +1,6 @@
 import { type SX, type ThemeKeys } from "../../theme";
-export interface ProgressBarProps {
-    /**
+export type ProgressBarProps = {
+/**
      * The current value of the progress.
      */
     value: number;

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

@@ -1,5 +1,5 @@
-export interface RadioButtonProps {
-    label?: string;
+export type RadioButtonProps = {
+label?: string;
     disabled?: boolean;
     /**
      * Whether this RadioButton is only included for decoration purposes

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

@@ -1,5 +1,5 @@
-export interface RadioCardProps {
-    title: string;
+export type RadioCardProps = {
+title: string;
     disabled?: boolean;
 }
 export declare function RadioCard(props: RadioCardProps): JSX.Element;

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

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 /** Private component */
-interface RadioItemProps {
-    disabled: boolean;
+type RadioItemProps = {
+disabled: boolean;
     children: ReactNode;
 }
 export declare function RadioItem(props: RadioItemProps): JSX.Element;

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

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

package/dist/components/SelectCard/SelectCard.d.ts

@@ -1,7 +1,8 @@
-import type { ReactNode } from "react";
+import type { MouseEventHandler, ReactNode } from "react";
 export interface SelectCardProps {
     selected: boolean;
-    onSelect: () => void;
+    onSelect?: MouseEventHandler<HTMLButtonElement>;
     children: ReactNode;
+    asChild?: boolean;
 }
 export declare function SelectCard(props: SelectCardProps): JSX.Element;

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

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { SX } from "../../theme";
-export interface SeparatorProps {
-    color?: "grey" | "purple" | "tomato";
+export type SeparatorProps = {
+color?: "grey" | "purple" | "tomato";
     /**
      * Either `vertical` or `horizontal`. Defaults to `horizontal`.
      */

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

@@ -11,30 +11,40 @@ export interface Props {
      */
     children?: ReactNode;
     sx?: SX;
+    /**
+     * Skeleton is creating a new stacking context because it's opacity is lower than 1 during animation.
+     * If you need to render an element which meets the following criteria:
+     * - precedes the Skeleton in the DOM
+     * - creates a new stacking context (ie. because of position: sticky)
+     * and you want the Skeleton to render behind it,
+     * you will need to set the zIndex to -1 on the Skeleton.
+     */
+    zIndex?: -1;
 }
 export declare function Skeleton(props: Props): import("react").DetailedReactHTMLElement<{
     className: string;
     style: {
         width: string | number | undefined;
         height: string | number | undefined;
+        zIndex: -1 | undefined;
         flexGrow?: 1 | undefined;
         flexShrink?: 0 | undefined;
         flexBasis?: 0 | undefined;
         flexWrap?: "wrap" | undefined;
-        order?: 0 | 2 | 1 | 3 | undefined;
-        alignSelf?: "center" | "stretch" | "start" | "end" | undefined;
-        justifySelf?: "center" | "stretch" | "start" | "end" | undefined;
+        order?: 0 | 1 | 2 | 3 | undefined;
+        alignSelf?: "center" | "end" | "start" | "stretch" | undefined;
+        justifySelf?: "center" | "end" | "start" | "stretch" | undefined;
         visibility?: "hidden" | "visible" | undefined;
         position?: "fixed" | "absolute" | "relative" | "sticky" | undefined;
-        marginLeft?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        marginRight?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        marginTop?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        marginBottom?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        marginInline?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        marginBlock?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        top?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        left?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        right?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
-        bottom?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        marginLeft?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        marginRight?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        marginTop?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        marginBottom?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        marginInline?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        marginBlock?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        top?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        left?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        right?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
+        bottom?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | undefined;
     };
 }, HTMLElement>;

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

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

package/dist/components/Slice/SliceCard.d.ts

@@ -1,6 +1,6 @@
 import type { KeyboardEvent, MouseEvent, ReactNode } from "react";
-export interface SliceCardProps {
-    id?: string;
+export type SliceCardProps = {
+id?: string;
     title: string;
     subTitle: string;
     index: number;

package/dist/components/Slice/SliceSelectCard.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
-export interface SliceSelectCardProps {
-    /**
+export type SliceSelectCardProps = {
+/**
      * Whether the card should have a fixed height or not. Defaults to `true`.
      */
     fixedHeight?: boolean;

package/dist/components/StoryCard.d.ts

@@ -3,8 +3,8 @@ import { type BoxFlexDisplayProps, type BoxProps } from "./Box/Box";
 /**
  * A basic card with a title for Storybook stories that showcase multiple component variants.
  */
-interface StoryCardProps {
-    title: string;
+type StoryCardProps = {
+title: string;
     children: ReactNode;
     box?: BoxProps & BoxFlexDisplayProps;
 }

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

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 import type { SX } from "../../theme";
-export interface TabProps {
-    children: ReactNode;
+export type TabProps = {
+children: ReactNode;
     asChild?: boolean;
     selected?: boolean;
     outline?: boolean;

package/dist/components/Table/Table.d.ts

@@ -1,6 +1,6 @@
 import { type ReactNode } from "react";
-export interface TableProps {
-    children: ReactNode;
+export type TableProps = {
+children: ReactNode;
     /** The number and size of columns. See [grid-template-columns](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns). */
     columnLayout: string;
     isLoading?: boolean;
@@ -13,32 +13,32 @@ export interface TableProps {
  * set the layout context.
  */
 export declare function Table(props: TableProps): JSX.Element;
-export interface TableHeadProps {
-    children: ReactNode;
+export type TableHeadProps = {
+children: ReactNode;
 }
 /**
  * Wrapper for the entire table header. This ensures any rows contained in it have the
  * header row style applied.
  */
 export declare function TableHead(props: TableHeadProps): JSX.Element;
-export interface TableBodyProps {
-    children: ReactNode;
+export type TableBodyProps = {
+children: ReactNode;
 }
 /**
  * Wrapper for the entire table body and its rows. This ensures any rows contained in
  * it have the body row style applied.
  */
 export declare function TableBody(props: TableBodyProps): JSX.Element;
-export interface ClickableTableRowProps {
-    children: ReactNode;
+export type ClickableTableRowProps = {
+children: ReactNode;
     /** Visibly disable the row */
     disabled?: boolean;
     /** Callback fired when the row is clicked */
     onClick?: () => void;
     renderLink?: never;
 }
-export interface LinkTableRowProps {
-    children: ReactNode;
+export type LinkTableRowProps = {
+children: ReactNode;
     /** Visibly disable the row */
     disabled?: boolean;
     onClick?: never;
@@ -55,8 +55,8 @@ type TableRowProps = ClickableTableRowProps | LinkTableRowProps;
  * - Given a renderLink: wraps the **entire** row in the given component. E.g. wrapping it in `react-router-dom` `<Link>`
  */
 export declare function TableRow(props: TableRowProps): JSX.Element;
-export interface TableCellProps {
-    children?: ReactNode;
+export type TableCellProps = {
+children?: ReactNode;
     /** How to align the content in the cell. Note that undefined defaults to start */
     align?: "center" | "end";
     /** Whether the content of the cell is interactive, this disables the link properties for that cell. Defaults to `false`. */

package/dist/components/Tag/Tag.d.ts

@@ -1,5 +1,5 @@
-export interface TagProps {
-    title: string;
+export type TagProps = {
+title: string;
     label?: string;
     active?: boolean;
     onClose?: () => void;

package/dist/components/TagField/TagFieldHeader.d.ts

@@ -1,7 +1,7 @@
 import { type RefObject } from "react";
 import { type LastItemLocation } from "./useTagFieldHeader";
-interface TagFieldHeaderProps {
-    selectedValues: Set<string>;
+type TagFieldHeaderProps = {
+selectedValues: Set<string>;
     searchText: string;
     setSearchText: (searchText: string) => void;
     open: boolean;
@@ -12,8 +12,8 @@ interface TagFieldHeaderProps {
     fieldRef: RefObject<HTMLDivElement>;
 }
 export declare function TagFieldHeader(props: TagFieldHeaderProps): JSX.Element;
-interface TagsContainerProps {
-    displayedTags: string[];
+type TagsContainerProps = {
+displayedTags: string[];
     extraTags: number;
     removeSelectedValue: (valueToDelete: string | LastItemLocation) => void;
     open: boolean;

package/dist/components/TagField/useTagField.d.ts

@@ -1,6 +1,6 @@
 import { type RefObject } from "react";
-interface UseTagFieldProps {
-    selectedValues: Set<string>;
+type UseTagFieldProps = {
+selectedValues: Set<string>;
     setOpen: (open: boolean) => void;
     fieldRef: RefObject<HTMLDivElement>;
     onSelectedValuesChange: (selectedValues: Set<string>) => void;

package/dist/components/TagField/useTagFieldHeader.d.ts

@@ -1,6 +1,6 @@
 import { type KeyboardEvent, type RefObject } from "react";
-interface UseTagFieldHeaderProps {
-    selectedValues: Set<string>;
+type UseTagFieldHeaderProps = {
+selectedValues: Set<string>;
     tagsContainerRef: RefObject<HTMLDivElement>;
     open: boolean;
     onSelectedValuesChange: (selectedValues: Set<string>) => void;
@@ -11,8 +11,8 @@ export declare function useTagFieldHeader(props: UseTagFieldHeaderProps): {
     extraTags: number;
 };
 export type LastItemLocation = -1;
-interface UseHandleKeyboardEntriesProps {
-    inputRef: RefObject<HTMLDivElement>;
+type UseHandleKeyboardEntriesProps = {
+inputRef: RefObject<HTMLDivElement>;
     searchText: string;
     setOpen: (open: boolean) => void;
     onCreateTag: () => void;

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

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 import type { SX } from "../../theme";
 import type { BaseInputProps } from "../BaseInput/BaseInput";
-export interface TextInputProps {
-    inputMode?: "text";
+export type TextInputProps = {
+inputMode?: "text";
     name?: string;
     id?: BaseInputProps["id"];
     placeholder?: BaseInputProps["placeholder"];

package/dist/components/ThemeProvider.d.ts

@@ -1,6 +1,6 @@
 import { type ReactNode } from "react";
-export interface ThemeProviderProps {
-    children?: ReactNode;
+export type ThemeProviderProps = {
+children?: ReactNode;
     mode?: "light" | "dark" | "system";
 }
 export declare function ThemeProvider(props: ThemeProviderProps): JSX.Element;

package/dist/components/TimeField/TimeField.d.ts

@@ -1,8 +1,8 @@
 import { ZonedDateTime } from "@internationalized/date";
 import { type TimeValue } from "@react-aria/datepicker";
 import type { SX } from "../../theme";
-interface TimeFieldProps {
-    defaultValue?: TimeValue | ZonedDateTime;
+type TimeFieldProps = {
+defaultValue?: TimeValue | ZonedDateTime;
     minValue?: "now";
     onChange: (value: TimeValue) => void;
     sx?: SX;

package/dist/components/Toast/Toast.d.ts

@@ -1,19 +1,19 @@
 import { type ReactNode } from "react";
 import { type IconName } from "../Icon";
-interface ToastAction {
-    title: string;
+type ToastAction = {
+title: string;
     onClick: () => void;
 }
-interface ToastCancel {
-    onClick: () => void;
+type ToastCancel = {
+onClick: () => void;
 }
-interface InlineToastProps {
-    variant?: "inline";
+type InlineToastProps = {
+variant?: "inline";
     icon?: IconName;
     loadingIndicator?: boolean;
 }
-interface CardToastProps {
-    variant: "card";
+type CardToastProps = {
+variant: "card";
     subtitle?: ReactNode;
 }
 export type ToastProps = {

package/dist/components/ToggleButtonGroup/ToggleButtonGroup.d.ts

@@ -18,8 +18,8 @@ type MultipleValueProps<Value extends string> = {
     onValueChange?: (value: Value[]) => void;
 };
 export declare function ToggleButtonGroup<Value extends string>(props: ToggleButtonGroupProps<Value>): JSX.Element;
-interface ToggleButtonGroupItemProps {
-    children?: ReactNode;
+type ToggleButtonGroupItemProps = {
+children?: ReactNode;
     disabled?: boolean;
     value: string;
     endIcon?: IconName;

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

@@ -2,43 +2,43 @@ import * as ToolbarPrimitive from "@radix-ui/react-toolbar";
 import { type MouseEvent, type ReactNode } from "react";
 import type { SX } from "../../theme";
 import type { IconName } from "../Icon";
-export interface ToolbarProps {
-    children?: ReactNode;
+export type ToolbarProps = {
+children?: ReactNode;
     sx?: SX;
 }
 export declare function Toolbar(props: ToolbarProps): JSX.Element;
-interface ToolbarButtonProps {
-    children?: ReactNode;
+type ToolbarButtonProps = {
+children?: ReactNode;
     disabled?: boolean;
     startIcon?: IconName;
     endIcon?: IconName;
     onClick?: (event: MouseEvent) => void;
 }
 export declare const ToolbarButton: (props: ToolbarButtonProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
-interface ToolbarButtonGroupProps {
-    children?: ReactNode;
+type ToolbarButtonGroupProps = {
+children?: ReactNode;
     density?: "regular" | "compact";
     disabled?: boolean;
 }
 export declare function ToolbarButtonGroup(props: ToolbarButtonGroupProps): JSX.Element;
-interface ToolbarSelectProps {
-    children?: ReactNode;
+type ToolbarSelectProps = {
+children?: ReactNode;
     placeholder?: string;
     disabled?: boolean;
     value?: string;
     onValueChange?: (value: string) => void;
 }
 export declare function ToolbarSelect(props: ToolbarSelectProps): JSX.Element;
-interface ToolbarSelectItemProps {
-    children?: ReactNode;
+type ToolbarSelectItemProps = {
+children?: ReactNode;
     disabled?: boolean;
     textValue?: string;
     value: string;
 }
 export declare function ToolbarSelectItem(props: ToolbarSelectItemProps): JSX.Element;
 export declare function ToolbarSeparator(): JSX.Element;
-interface ToolbarToggleButtonProps {
-    children?: ReactNode;
+type ToolbarToggleButtonProps = {
+children?: ReactNode;
     disabled?: boolean;
     startIcon?: IconName;
     endIcon?: IconName;
@@ -55,8 +55,8 @@ type ToolbarToggleButtonGroupProps = {
     density?: "regular" | "compact";
 } & GroupProps;
 export declare function ToolbarToggleButtonGroup(props: ToolbarToggleButtonGroupProps): JSX.Element;
-interface ToolbarToggleButtonGroupItemProps {
-    children?: ReactNode;
+type ToolbarToggleButtonGroupItemProps = {
+children?: ReactNode;
     disabled?: boolean;
     value: string;
     endIcon?: IconName;

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

@@ -1,8 +1,8 @@
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import { type ReactNode } from "react";
 export declare const TooltipProvider: import("react").FC<TooltipPrimitive.TooltipProviderProps>;
-interface BaseTooltipProps {
-    children: ReactNode;
+type BaseTooltipProps = {
+children: ReactNode;
     side?: Parameters<typeof TooltipPrimitive.Content>[0]["side"];
     sideOffset?: Parameters<typeof TooltipPrimitive.Content>[0]["sideOffset"];
     align?: Parameters<typeof TooltipPrimitive.Content>[0]["align"];
@@ -33,13 +33,13 @@ interface BaseTooltipProps {
      */
     animation?: "fade" | "none";
 }
-interface TextTooltipProps extends BaseTooltipProps {
-    variant?: "text";
+type TextTooltipProps = BaseTooltipProps & {
+variant?: "text";
     content: string;
     title?: string;
 }
-interface CustomTooltipProps extends BaseTooltipProps {
-    variant: "custom";
+type CustomTooltipProps = BaseTooltipProps & {
+variant: "custom";
     content: ReactNode;
     title?: never;
 }

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

@@ -1,6 +1,6 @@
 import { type SX } from "../../theme";
-export interface VideoProps {
-    src: string;
+export type VideoProps = {
+src: string;
     loop?: boolean;
     autoPlay?: boolean;
     sizing?: "contain" | "cover" | "none";

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

@@ -1,7 +1,7 @@
 import { type ReactNode } from "react";
 import type { SX } from "../../theme";
-interface WindowProps {
-    children: ReactNode;
+type WindowProps = {
+children: ReactNode;
     sx?: SX;
 }
 export declare function Window(props: WindowProps): JSX.Element;
@@ -9,26 +9,26 @@ type WindowFrameProps = {
     title?: ReactNode;
 };
 export declare function WindowFrame({ title }: WindowFrameProps): JSX.Element;
-interface WindowTabsProps {
-    children: ReactNode;
+type WindowTabsProps = {
+children: ReactNode;
     defaultValue?: string;
     onValueChange?: (value: string) => void;
     value?: string;
 }
 export declare function WindowTabs(props: WindowTabsProps): JSX.Element;
-interface WindowTabsListProps {
-    children: ReactNode;
+type WindowTabsListProps = {
+children: ReactNode;
     onAddNewTab?: () => void;
 }
 export declare function WindowTabsList(props: WindowTabsListProps): JSX.Element;
-interface WindowTabsTriggerProps {
-    children: ReactNode;
+type WindowTabsTriggerProps = {
+children: ReactNode;
     value: string;
     menu?: ReactNode;
 }
 export declare function WindowTabsTrigger(props: WindowTabsTriggerProps): JSX.Element;
-interface WindowTabsContentProps {
-    children: ReactNode;
+type WindowTabsContentProps = {
+children: ReactNode;
     value: string;
 }
 export declare function WindowTabsContent(props: WindowTabsContentProps): JSX.Element;