@prismicio/editor-ui 0.4.57 → 0.4.58-alpha.repeatable-link-base.0

package/dist/components/ActionList/ActionList.d.ts

@@ -1,22 +1,22 @@
 import { type MouseEvent, type PropsWithChildren, type ReactNode } from "react";
+import type { SX } from "../../theme";
 import { type IconName } from "../Icon";
 import { textVariantMapping } from "../Text";
 export type ActionListVariant = "borderless" | "bordered" | "compact";
 export interface ActionListProps extends PropsWithChildren {
     variant?: ActionListVariant;
     gap?: 0 | 4 | 8;
+    sx?: SX;
 }
 export declare function ActionList(props: ActionListProps): JSX.Element;
 type Color = "grey" | "tomato";
-export interface ActionListItemProps {
+export type ActionListItemProps = {
     children: ReactNode;
     color?: Color;
     backgroundColor?: "grey" | "transparent";
     description?: ReactNode;
     disabled?: boolean;
     selected?: boolean;
-    endAdornment?: ReactNode;
-    endIcon?: IconName;
     onClick?: (event: MouseEvent) => void;
     renderEndIcon?: (icon: ReactNode) => ReactNode;
     renderStartIcon?: (icon: ReactNode) => ReactNode;
@@ -28,7 +28,45 @@ export interface ActionListItemProps {
      * mandatory to pass the boolean value for each item, even if `false`.
      */
     completed?: boolean;
-}
+    /**
+     * Change the default rendered element for the one passed as a child,
+     * merging their props and behavior.
+     * @default false
+     */
+    asChild?: boolean;
+    /**
+     * Override the variant from ActionList
+     */
+    variant?: ActionListVariant;
+} & ActionListItemEndProps;
+export type ActionListItemEndProps = {
+    endAdornment?: ReactNode;
+    endIcon?: IconName;
+    endOverlay?: never;
+} | {
+    endAdornment?: never;
+    endIcon?: never;
+    /**
+     * An overlay element that will be rendered on top of the item at the end.
+     * Useful when you cannot use the `endAdornment` prop,
+     * ie. when you have to render a button on the right and the ActionListItem itself is a Link.
+     * (you cannot nest buttons inside links in HTML, but you can display them on top of the link)
+     */
+    endOverlay: ReactNode;
+};
 export declare const ActionListItem: (props: ActionListItemProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+interface SlotChildProps {
+    children: ReactNode;
+    /**
+     * Children passed by the user.
+     */
+    externalChildren?: ReactNode;
+    asChild: boolean;
+}
+/**
+ * This component is used to properly render Slot's children.
+ */
+export declare const SlotChild: (props: SlotChildProps & import("react").RefAttributes<Element>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 export declare function ActionListLabel(props: PropsWithChildren): JSX.Element;
+export declare function ActionListHeader(props: PropsWithChildren): JSX.Element;
 export {};

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

@@ -85,6 +85,7 @@ export declare const Default: {
     decorators?: import("@storybook/types").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, {
         variant?: import("./ActionList").ActionListVariant | undefined;
         gap?: 0 | 4 | 8 | undefined;
+        sx?: import("../../theme").SX | undefined;
         children?: import("react").ReactNode;
         items: ActionListItemProps[];
     }>[] | undefined;
@@ -130,6 +131,7 @@ export declare const WithProgress: {
     decorators?: import("@storybook/types").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, {
         variant?: import("./ActionList").ActionListVariant | undefined;
         gap?: 0 | 4 | 8 | undefined;
+        sx?: import("../../theme").SX | undefined;
         children?: import("react").ReactNode;
         items: ActionListItemProps[];
     }>[] | undefined;
@@ -174,6 +176,7 @@ export declare const WithReadonlyProgress: {
     decorators?: import("@storybook/types").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, {
         variant?: import("./ActionList").ActionListVariant | undefined;
         gap?: 0 | 4 | 8 | undefined;
+        sx?: import("../../theme").SX | undefined;
         children?: import("react").ReactNode;
         items: ActionListItemProps[];
     }>[] | undefined;
@@ -208,10 +211,11 @@ export declare const NavigationMenu: {
         gap: 4;
         variant: "compact";
         items: ({
-            component: "ActionListLabel";
-            children: string;
+            component: "ActionListHeader";
+            children: JSX.Element;
             backgroundColor?: undefined;
             startIcon?: undefined;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -221,6 +225,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "prismic";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -230,6 +235,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "checkBox";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -239,6 +245,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "colorLens";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -248,6 +255,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "search";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -257,6 +265,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "language";
             children: string;
+            endOverlay: JSX.Element;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -270,6 +279,17 @@ export declare const NavigationMenu: {
             children?: undefined;
             backgroundColor?: undefined;
             startIcon?: undefined;
+            endOverlay?: undefined;
+            selected?: undefined;
+            renderEndIcon?: undefined;
+        } | {
+            component: "ActionListLabel";
+            children: string;
+            backgroundColor?: undefined;
+            startIcon?: undefined;
+            endOverlay?: undefined;
+            style?: undefined;
+            sx?: undefined;
             selected?: undefined;
             renderEndIcon?: undefined;
         } | {
@@ -277,6 +297,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "database";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -286,6 +307,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "folder";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -296,6 +318,7 @@ export declare const NavigationMenu: {
             startIcon: "checkBox";
             children: string;
             selected: true;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             renderEndIcon?: undefined;
@@ -304,6 +327,7 @@ export declare const NavigationMenu: {
             backgroundColor: "transparent";
             startIcon: "multipleStop";
             children: string;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -314,6 +338,7 @@ export declare const NavigationMenu: {
             startIcon: "colorLens";
             children: string;
             renderEndIcon: () => JSX.Element;
+            endOverlay?: undefined;
             style?: undefined;
             sx?: undefined;
             selected?: undefined;
@@ -322,6 +347,7 @@ export declare const NavigationMenu: {
     decorators?: import("@storybook/types").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R, {
         variant?: import("./ActionList").ActionListVariant | undefined;
         gap?: 0 | 4 | 8 | undefined;
+        sx?: import("../../theme").SX | undefined;
         children?: import("react").ReactNode;
         items: ((ActionListItemProps & {
             component: "ActionListItem";
@@ -329,6 +355,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }>[] | undefined;
     argTypes?: Partial<import("@storybook/types").ArgTypes<ActionListProps & {
@@ -338,6 +366,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }>> | undefined;
     loaders?: import("@storybook/types").LoaderFunction<import("@storybook/react/dist/types-0a347bb9").R, ActionListProps & {
@@ -347,6 +377,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }>[] | undefined;
     render?: import("@storybook/types").ArgsStoryFn<import("@storybook/react/dist/types-0a347bb9").R, ActionListProps & {
@@ -356,6 +388,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }> | undefined;
     name?: string | undefined;
@@ -367,6 +401,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }> | undefined;
     tags?: string[] | undefined;
@@ -377,6 +413,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }, Partial<ActionListProps & {
         items: ((ActionListItemProps & {
@@ -385,6 +423,8 @@ export declare const NavigationMenu: {
             component: "ActionListLabel";
         }) | (SeparatorProps & {
             component: "Separator";
+        }) | (PropsWithChildren & {
+            component: "ActionListHeader";
         }))[];
     }>>, "story"> | undefined;
 };

package/dist/components/ActionList/index.d.ts

@@ -1 +1 @@
-export { ActionList, ActionListItem, ActionListLabel } from "./ActionList";
+export { ActionList, ActionListHeader, ActionListItem, ActionListLabel } from "./ActionList";

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

@@ -7,7 +7,7 @@ declare const meta: {
     argTypes: {
         icon: {
             control: string;
-            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "attachFile", "autoFixHigh", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "contentPaste", "createNewFolder", "crop", "cropLandscape", "cropPortrait", "dataObject", "database", "dateRange", "delete", "description", "desktopWindows", "dragIndicator", "driveFileMove", "edit", "event", "expandLess", "expandMore", "firstPage", "folder", "formatBold", "formatClear", "formatItalic", "formatListBulleted", "formatListNumbered", "formatTextDirectionRToL", "hideImage", "image", "imageSearch", "insertDriveFile", "inventory", "invite", "javascript", "json", "keyboardArrowDown", "keyboardArrowUp", "label", "language", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notStarted", "notes", "openInFull", "openInNew", "outbound", "people", "phoneIphone", "photo", "pin", "place", "playCircle", "preview", "prismic", "public", "refresh", "save", "schedule", "search", "sentimentSatisfied", "settings", "settingsEthernet", "smartDisplay", "svelte", "tabletMac", "tag", "terminal", "textFields", "title", "toggleOff", "translate", "typescript", "unfoldMore", "unsplash", "upload", "videocam", "viewDay", "visibility", "vue", "zoomOutMap"];
+            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "attachFile", "autoFixHigh", "autorenew", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "contentPaste", "createNewFolder", "creditCard", "crop", "cropLandscape", "cropPortrait", "dataObject", "dataUsage", "database", "dateRange", "delete", "description", "desktopWindows", "dragIndicator", "driveFileMove", "edit", "event", "expandLess", "expandMore", "firstPage", "folder", "folderManaged", "formatBold", "formatClear", "formatItalic", "formatListBulleted", "formatListNumbered", "formatTextDirectionRToL", "groupWork", "hideImage", "image", "imageSearch", "insertDriveFile", "inventory", "invite", "javascript", "json", "keyboardArrowDown", "keyboardArrowUp", "label", "language", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "menuBook", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notStarted", "notes", "openInFull", "openInNew", "outbound", "people", "phoneIphone", "photo", "pin", "place", "playCircle", "preview", "prismic", "public", "receiptLong", "refresh", "save", "schedule", "search", "security", "sentimentSatisfied", "settings", "settingsEthernet", "smartDisplay", "svelte", "tabletMac", "tag", "terminal", "textFields", "title", "toggleOff", "translate", "tune", "typescript", "unfoldMore", "unsplash", "upload", "videocam", "viewDay", "visibility", "vue", "warning", "zoomOutMap"];
         };
         color: {
             control: string;

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

@@ -8,7 +8,7 @@ export default meta;
 export declare const Default: {
     render: (args: {
         ariaLabel: string;
-        gap?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
+        gap?: 0 | 2 | 1 | "auto" | "fieldSetGap" | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 60 | 72 | 80 | 100 | 120 | undefined;
         direction?: "horizontal" | "vertical" | undefined;
         items: unknown[];
         getItemKey: (item: unknown) => string;

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

@@ -44,7 +44,7 @@ export type BoxProps = {
 } & DisplayProps;
 type DisplayProps = {
     gap?: ThemeKeys<"space">;
-    alignItems?: "flex-start" | "center";
+    alignItems?: "flex-start" | "center" | "flex-end";
     justifyContent?: "center" | "space-between" | "end";
 } & (BoxGridDisplayProps | BoxFlexDisplayProps);
 type BoxGridDisplayProps = {

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

@@ -1,4 +1,6 @@
 /// <reference types="react" />
+import type { StoryObj } from "@storybook/react";
+type Story = StoryObj<typeof meta>;
 declare const meta: {
     title: string;
     component: (props: import("./Box").BoxProps & import("react").RefAttributes<HTMLElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
@@ -11,141 +13,4 @@ declare const meta: {
     };
 };
 export default meta;
-export declare const Default: {
-    render: (args: {
-        as?: "div" | "nav" | "ul" | "ol" | "article" | "header" | "form" | "span" | undefined;
-        children?: import("react").ReactNode;
-        position?: "fixed" | "absolute" | "relative" | "sticky" | undefined;
-        top?: string | number | undefined;
-        left?: string | number | undefined;
-        right?: string | number | undefined;
-        bottom?: string | number | undefined;
-        width?: string | number | undefined;
-        minWidth?: string | number | undefined;
-        maxWidth?: string | number | undefined;
-        height?: string | number | undefined;
-        minHeight?: string | number | undefined;
-        maxHeight?: string | number | undefined;
-        flexBasis?: 0 | undefined;
-        flexGrow?: 1 | undefined;
-        flexShrink?: 0 | undefined;
-        flexWrap?: "wrap" | undefined;
-        animation?: {
-            name?: "fadeIn" | undefined;
-            duration?: 0 | 100 | 75 | 150 | 200 | 250 | 300 | 400 | undefined;
-        } | undefined;
-        transition?: {
-            property: "opacity" | "background-color" | "height";
-            duration?: 0 | 100 | 75 | 150 | 200 | 250 | 300 | 400 | undefined;
-            delay?: string | undefined;
-        } | undefined;
-        padding?: (0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | {
-            block?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            inline?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            top?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            bottom?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            left?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            right?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-        }) | undefined;
-        border?: (boolean | {
-            top?: boolean | undefined;
-            bottom?: boolean | undefined;
-            left?: boolean | undefined;
-            right?: boolean | undefined;
-        }) | undefined;
-        borderRadius?: (0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | {
-            topLeft?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-            topRight?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-            bottomLeft?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-            bottomRight?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-        }) | undefined;
-        borderStyle?: "none" | "dashed" | "solid" | undefined;
-        backgroundColor?: "inherit" | "currentColor" | "transparent" | "white" | "black" | "grey1" | "grey2" | "grey3" | "grey4" | "grey5" | "grey6" | "grey7" | "grey8" | "grey9" | "grey10" | "grey11" | "grey12" | "dark12" | "indigo2" | "indigo4" | "indigo5" | "indigo7" | "indigo8" | "indigo10" | "indigo11" | "indigo12" | "green3" | "green4" | "green9" | "green10" | "green11" | "green12" | "amber3" | "amber4" | "amber9" | "amber10" | "amber11" | "amber12" | "tomato1" | "tomato2" | "tomato3" | "tomato4" | "tomato5" | "tomato6" | "tomato7" | "tomato8" | "tomato9" | "tomato10" | "tomato11" | "tomato12" | "purple1" | "purple2" | "purple3" | "purple4" | "purple5" | "purple6" | "purple7" | "purple8" | "purple9" | "purple10" | "purple11" | "purple12" | "greyAlpha1" | "logoPurple" | "logoBlue" | "logoYellow" | "logoRed" | undefined;
-        opacity?: 0 | 1 | 0.1 | 0.3 | 0.4 | 0.5 | 0.6 | 0.8 | 0.9 | undefined;
-        visibility?: "hidden" | "visible" | undefined;
-        overflowY?: "auto" | "hidden" | undefined;
-        overflow?: "hidden" | undefined;
-        gridColumn?: string | undefined;
-        gridRow?: string | undefined;
-        transform?: import("csstype").Property.Transform | undefined;
-        gap?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-        alignItems?: "flex-start" | "center" | undefined;
-        justifyContent?: "center" | "space-between" | "end" | undefined;
-        display: "grid";
-        gridTemplateColumns?: string | undefined;
-        gridTemplateRows?: string | undefined;
-        flexDirection?: undefined;
-        ref?: import("react").Ref<HTMLElement> | undefined;
-        key?: import("react").Key | null | undefined;
-    } | {
-        as?: "div" | "nav" | "ul" | "ol" | "article" | "header" | "form" | "span" | undefined;
-        children?: import("react").ReactNode;
-        position?: "fixed" | "absolute" | "relative" | "sticky" | undefined;
-        top?: string | number | undefined;
-        left?: string | number | undefined;
-        right?: string | number | undefined;
-        bottom?: string | number | undefined;
-        width?: string | number | undefined;
-        minWidth?: string | number | undefined;
-        maxWidth?: string | number | undefined;
-        height?: string | number | undefined;
-        minHeight?: string | number | undefined;
-        maxHeight?: string | number | undefined;
-        flexBasis?: 0 | undefined;
-        flexGrow?: 1 | undefined;
-        flexShrink?: 0 | undefined;
-        flexWrap?: "wrap" | undefined;
-        animation?: {
-            name?: "fadeIn" | undefined;
-            duration?: 0 | 100 | 75 | 150 | 200 | 250 | 300 | 400 | undefined;
-        } | undefined;
-        transition?: {
-            property: "opacity" | "background-color" | "height";
-            duration?: 0 | 100 | 75 | 150 | 200 | 250 | 300 | 400 | undefined;
-            delay?: string | undefined;
-        } | undefined;
-        padding?: (0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | {
-            block?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            inline?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            top?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            bottom?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            left?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-            right?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-        }) | undefined;
-        border?: (boolean | {
-            top?: boolean | undefined;
-            bottom?: boolean | undefined;
-            left?: boolean | undefined;
-            right?: boolean | undefined;
-        }) | undefined;
-        borderRadius?: (0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | {
-            topLeft?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-            topRight?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-            bottomLeft?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-            bottomRight?: 0 | "50%" | "100%" | "inherit" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | undefined;
-        }) | undefined;
-        borderStyle?: "none" | "dashed" | "solid" | undefined;
-        backgroundColor?: "inherit" | "currentColor" | "transparent" | "white" | "black" | "grey1" | "grey2" | "grey3" | "grey4" | "grey5" | "grey6" | "grey7" | "grey8" | "grey9" | "grey10" | "grey11" | "grey12" | "dark12" | "indigo2" | "indigo4" | "indigo5" | "indigo7" | "indigo8" | "indigo10" | "indigo11" | "indigo12" | "green3" | "green4" | "green9" | "green10" | "green11" | "green12" | "amber3" | "amber4" | "amber9" | "amber10" | "amber11" | "amber12" | "tomato1" | "tomato2" | "tomato3" | "tomato4" | "tomato5" | "tomato6" | "tomato7" | "tomato8" | "tomato9" | "tomato10" | "tomato11" | "tomato12" | "purple1" | "purple2" | "purple3" | "purple4" | "purple5" | "purple6" | "purple7" | "purple8" | "purple9" | "purple10" | "purple11" | "purple12" | "greyAlpha1" | "logoPurple" | "logoBlue" | "logoYellow" | "logoRed" | undefined;
-        opacity?: 0 | 1 | 0.1 | 0.3 | 0.4 | 0.5 | 0.6 | 0.8 | 0.9 | undefined;
-        visibility?: "hidden" | "visible" | undefined;
-        overflowY?: "auto" | "hidden" | undefined;
-        overflow?: "hidden" | undefined;
-        gridColumn?: string | undefined;
-        gridRow?: string | undefined;
-        transform?: import("csstype").Property.Transform | undefined;
-        gap?: 0 | "auto" | "fieldSetGap" | 1 | 2 | 4 | 6 | 8 | 10 | 12 | 16 | 18 | 20 | 24 | 28 | 32 | 40 | 48 | 72 | 80 | 100 | 120 | undefined;
-        alignItems?: "flex-start" | "center" | undefined;
-        justifyContent?: "center" | "space-between" | "end" | undefined;
-        display?: "flex" | "inline-flex" | undefined;
-        flexDirection?: "column" | "row" | undefined;
-        gridTemplateColumns?: undefined;
-        gridTemplateRows?: undefined;
-        ref?: import("react").Ref<HTMLElement> | undefined;
-        key?: import("react").Key | null | undefined;
-    }) => JSX.Element;
-    args: {
-        children: JSX.Element;
-        as: "div";
-    };
-    name: string;
-};
+export declare const Default: Story;

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

@@ -1,4 +1,4 @@
-import { type MouseEvent, type ReactNode } from "react";
+import { type ButtonHTMLAttributes, type MouseEvent, type ReactNode } from "react";
 import { type Keys } from "react-hotkeys-hook";
 import type { SX } from "../../theme";
 import { type IconName } from "../Icon";
@@ -45,6 +45,8 @@ export interface ButtonProps {
     onClick?: (event: MouseEvent | KeyboardEvent) => void;
     onMouseDown?: (event: MouseEvent) => void;
     onMouseUp?: (event: MouseEvent) => void;
+    type?: ButtonHTMLAttributes<HTMLButtonElement>["type"];
+    form?: ButtonHTMLAttributes<HTMLButtonElement>["form"];
 }
 export declare const Button: (props: ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 interface ButtonChildrenProps {

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

@@ -8,7 +8,7 @@ declare const meta: {
             control: {
                 type: string;
             };
-            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "attachFile", "autoFixHigh", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "contentPaste", "createNewFolder", "crop", "cropLandscape", "cropPortrait", "dataObject", "database", "dateRange", "delete", "description", "desktopWindows", "dragIndicator", "driveFileMove", "edit", "event", "expandLess", "expandMore", "firstPage", "folder", "formatBold", "formatClear", "formatItalic", "formatListBulleted", "formatListNumbered", "formatTextDirectionRToL", "hideImage", "image", "imageSearch", "insertDriveFile", "inventory", "invite", "javascript", "json", "keyboardArrowDown", "keyboardArrowUp", "label", "language", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notStarted", "notes", "openInFull", "openInNew", "outbound", "people", "phoneIphone", "photo", "pin", "place", "playCircle", "preview", "prismic", "public", "refresh", "save", "schedule", "search", "sentimentSatisfied", "settings", "settingsEthernet", "smartDisplay", "svelte", "tabletMac", "tag", "terminal", "textFields", "title", "toggleOff", "translate", "typescript", "unfoldMore", "unsplash", "upload", "videocam", "viewDay", "visibility", "vue", "zoomOutMap"];
+            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "attachFile", "autoFixHigh", "autorenew", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "contentPaste", "createNewFolder", "creditCard", "crop", "cropLandscape", "cropPortrait", "dataObject", "dataUsage", "database", "dateRange", "delete", "description", "desktopWindows", "dragIndicator", "driveFileMove", "edit", "event", "expandLess", "expandMore", "firstPage", "folder", "folderManaged", "formatBold", "formatClear", "formatItalic", "formatListBulleted", "formatListNumbered", "formatTextDirectionRToL", "groupWork", "hideImage", "image", "imageSearch", "insertDriveFile", "inventory", "invite", "javascript", "json", "keyboardArrowDown", "keyboardArrowUp", "label", "language", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "menuBook", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notStarted", "notes", "openInFull", "openInNew", "outbound", "people", "phoneIphone", "photo", "pin", "place", "playCircle", "preview", "prismic", "public", "receiptLong", "refresh", "save", "schedule", "search", "security", "sentimentSatisfied", "settings", "settingsEthernet", "smartDisplay", "svelte", "tabletMac", "tag", "terminal", "textFields", "title", "toggleOff", "translate", "tune", "typescript", "unfoldMore", "unsplash", "upload", "videocam", "viewDay", "visibility", "vue", "warning", "zoomOutMap"];
         };
     };
 };
@@ -26,8 +26,8 @@ export declare const Default: {
         textWeight?: "bold" | "normal" | undefined;
         radius?: "normal" | "full" | undefined;
         sx?: import("../../theme").SX | undefined;
-        startIcon?: "search" | "link" | "code" | "translate" | "visibility" | "label" | "title" | "block" | "add" | "image" | "description" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "attachFile" | "autoFixHigh" | "biToggle" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "chevronLeft" | "chevronRight" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "contentPaste" | "createNewFolder" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "database" | "dateRange" | "delete" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "expandLess" | "expandMore" | "firstPage" | "folder" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "hideImage" | "imageSearch" | "insertDriveFile" | "inventory" | "invite" | "javascript" | "json" | "keyboardArrowDown" | "keyboardArrowUp" | "language" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "migrationRelease" | "moreVert" | "multipleStop" | "musicNote" | "notStarted" | "notes" | "openInFull" | "openInNew" | "outbound" | "people" | "phoneIphone" | "photo" | "pin" | "place" | "playCircle" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "sentimentSatisfied" | "settings" | "settingsEthernet" | "smartDisplay" | "svelte" | "tabletMac" | "tag" | "terminal" | "textFields" | "toggleOff" | "typescript" | "unfoldMore" | "unsplash" | "upload" | "videocam" | "viewDay" | "vue" | "zoomOutMap" | undefined;
-        endIcon?: "search" | "link" | "code" | "translate" | "visibility" | "label" | "title" | "block" | "add" | "image" | "description" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "attachFile" | "autoFixHigh" | "biToggle" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "chevronLeft" | "chevronRight" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "contentPaste" | "createNewFolder" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "database" | "dateRange" | "delete" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "expandLess" | "expandMore" | "firstPage" | "folder" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "hideImage" | "imageSearch" | "insertDriveFile" | "inventory" | "invite" | "javascript" | "json" | "keyboardArrowDown" | "keyboardArrowUp" | "language" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "migrationRelease" | "moreVert" | "multipleStop" | "musicNote" | "notStarted" | "notes" | "openInFull" | "openInNew" | "outbound" | "people" | "phoneIphone" | "photo" | "pin" | "place" | "playCircle" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "sentimentSatisfied" | "settings" | "settingsEthernet" | "smartDisplay" | "svelte" | "tabletMac" | "tag" | "terminal" | "textFields" | "toggleOff" | "typescript" | "unfoldMore" | "unsplash" | "upload" | "videocam" | "viewDay" | "vue" | "zoomOutMap" | undefined;
+        startIcon?: "translate" | "visibility" | "search" | "link" | "description" | "code" | "add" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "attachFile" | "autoFixHigh" | "autorenew" | "biToggle" | "block" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "chevronLeft" | "chevronRight" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "contentPaste" | "createNewFolder" | "creditCard" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "dataUsage" | "database" | "dateRange" | "delete" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "expandLess" | "expandMore" | "firstPage" | "folder" | "folderManaged" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "groupWork" | "hideImage" | "image" | "imageSearch" | "insertDriveFile" | "inventory" | "invite" | "javascript" | "json" | "keyboardArrowDown" | "keyboardArrowUp" | "label" | "language" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "menuBook" | "migrationRelease" | "moreVert" | "multipleStop" | "musicNote" | "notStarted" | "notes" | "openInFull" | "openInNew" | "outbound" | "people" | "phoneIphone" | "photo" | "pin" | "place" | "playCircle" | "preview" | "prismic" | "public" | "receiptLong" | "refresh" | "save" | "schedule" | "security" | "sentimentSatisfied" | "settings" | "settingsEthernet" | "smartDisplay" | "svelte" | "tabletMac" | "tag" | "terminal" | "textFields" | "title" | "toggleOff" | "tune" | "typescript" | "unfoldMore" | "unsplash" | "upload" | "videocam" | "viewDay" | "vue" | "warning" | "zoomOutMap" | undefined;
+        endIcon?: "translate" | "visibility" | "search" | "link" | "description" | "code" | "add" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "attachFile" | "autoFixHigh" | "autorenew" | "biToggle" | "block" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "chevronLeft" | "chevronRight" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "contentPaste" | "createNewFolder" | "creditCard" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "dataUsage" | "database" | "dateRange" | "delete" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "expandLess" | "expandMore" | "firstPage" | "folder" | "folderManaged" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "groupWork" | "hideImage" | "image" | "imageSearch" | "insertDriveFile" | "inventory" | "invite" | "javascript" | "json" | "keyboardArrowDown" | "keyboardArrowUp" | "label" | "language" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "menuBook" | "migrationRelease" | "moreVert" | "multipleStop" | "musicNote" | "notStarted" | "notes" | "openInFull" | "openInNew" | "outbound" | "people" | "phoneIphone" | "photo" | "pin" | "place" | "playCircle" | "preview" | "prismic" | "public" | "receiptLong" | "refresh" | "save" | "schedule" | "security" | "sentimentSatisfied" | "settings" | "settingsEthernet" | "smartDisplay" | "svelte" | "tabletMac" | "tag" | "terminal" | "textFields" | "title" | "toggleOff" | "tune" | "typescript" | "unfoldMore" | "unsplash" | "upload" | "videocam" | "viewDay" | "vue" | "warning" | "zoomOutMap" | undefined;
         renderStartIcon?: ((icon: import("react").ReactNode) => import("react").ReactNode) | undefined;
         renderEndIcon?: ((icon: import("react").ReactNode) => import("react").ReactNode) | undefined;
         hotkeys?: import("react-hotkeys-hook").Keys | undefined;
@@ -38,6 +38,8 @@ export declare const Default: {
         onClick?: ((event: import("react").MouseEvent<Element, MouseEvent> | KeyboardEvent) => void) | undefined;
         onMouseDown?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
         onMouseUp?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
+        type?: "button" | "submit" | "reset" | undefined;
+        form?: string | undefined;
         ref?: import("react").Ref<HTMLButtonElement> | undefined;
         key?: import("react").Key | null | undefined;
     }) => JSX.Element;

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

@@ -9,7 +9,7 @@ declare const meta: {
         };
         name: {
             control: string;
-            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "attachFile", "autoFixHigh", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "contentPaste", "createNewFolder", "crop", "cropLandscape", "cropPortrait", "dataObject", "database", "dateRange", "delete", "description", "desktopWindows", "dragIndicator", "driveFileMove", "edit", "event", "expandLess", "expandMore", "firstPage", "folder", "formatBold", "formatClear", "formatItalic", "formatListBulleted", "formatListNumbered", "formatTextDirectionRToL", "hideImage", "image", "imageSearch", "insertDriveFile", "inventory", "invite", "javascript", "json", "keyboardArrowDown", "keyboardArrowUp", "label", "language", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notStarted", "notes", "openInFull", "openInNew", "outbound", "people", "phoneIphone", "photo", "pin", "place", "playCircle", "preview", "prismic", "public", "refresh", "save", "schedule", "search", "sentimentSatisfied", "settings", "settingsEthernet", "smartDisplay", "svelte", "tabletMac", "tag", "terminal", "textFields", "title", "toggleOff", "translate", "typescript", "unfoldMore", "unsplash", "upload", "videocam", "viewDay", "visibility", "vue", "zoomOutMap"];
+            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "attachFile", "autoFixHigh", "autorenew", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "contentPaste", "createNewFolder", "creditCard", "crop", "cropLandscape", "cropPortrait", "dataObject", "dataUsage", "database", "dateRange", "delete", "description", "desktopWindows", "dragIndicator", "driveFileMove", "edit", "event", "expandLess", "expandMore", "firstPage", "folder", "folderManaged", "formatBold", "formatClear", "formatItalic", "formatListBulleted", "formatListNumbered", "formatTextDirectionRToL", "groupWork", "hideImage", "image", "imageSearch", "insertDriveFile", "inventory", "invite", "javascript", "json", "keyboardArrowDown", "keyboardArrowUp", "label", "language", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "menuBook", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notStarted", "notes", "openInFull", "openInNew", "outbound", "people", "phoneIphone", "photo", "pin", "place", "playCircle", "preview", "prismic", "public", "receiptLong", "refresh", "save", "schedule", "search", "security", "sentimentSatisfied", "settings", "settingsEthernet", "smartDisplay", "svelte", "tabletMac", "tag", "terminal", "textFields", "title", "toggleOff", "translate", "tune", "typescript", "unfoldMore", "unsplash", "upload", "videocam", "viewDay", "visibility", "vue", "warning", "zoomOutMap"];
         };
         size: import("@storybook/types").InputType | undefined;
         variant: {

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

@@ -36,6 +36,14 @@ export interface ComboBoxProps {
      * Supports only "detached*" variants
      */
     overlay?: boolean;
+    /**
+     * Force no FormInput, to not display input borders twice.
+     * Useful when you want to add FormInputField over ComboBox manually
+     * ie. to display an error message or description.
+     * In the future, we should create FormComboBox component that wraps ComboBox into FormInputField.
+     * Tech debt ticket: https://linear.app/prismic/issue/PBD-1867/editor-ui-refactor-combobox-and-select-components
+     */
+    forceNoFormInput?: boolean;
 }
 export declare const ComboBox: (props: ComboBoxProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 interface ComboBoxContentProps {
@@ -73,6 +81,7 @@ export declare const ComboBoxItem: (props: ComboBoxItemProps & import("react").R
 interface ComboBoxInputProps {
     value: string;
     onValueChange: (search: string) => void;
+    id?: string;
     placeholder?: string;
     /**
      * Auto focuses the input when variant is "attached".
@@ -85,6 +94,7 @@ interface ComboBoxInputProps {
      */
     onFocus?: () => boolean;
     maxLength?: number;
+    startAdornment?: boolean;
     endAdornment?: boolean;
 }
 export declare const ComboBoxInput: (props: ComboBoxInputProps & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;

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

@@ -25,6 +25,7 @@ export interface DialogProps {
      */
     position?: "center" | "bottomRight" | "top";
     onPointerDownOutside?: RadixDialogContentProps["onPointerDownOutside"];
+    onOpenAutoFocus?: RadixDialogContentProps["onOpenAutoFocus"];
 }
 /**
  * A Dialog rendered in document.body.
@@ -40,7 +41,8 @@ export declare function DialogHeader(props: DialogHeaderProps): JSX.Element;
 interface DialogContentProps {
     children: ReactNode;
     padding?: 16;
-    gap?: 0 | 12;
+    paddingInline?: 8;
+    gap?: 0 | 12 | 16;
 }
 export declare function DialogContent(props: DialogContentProps): JSX.Element;
 export declare function DialogActions(props: {

package/dist/components/Field/Field.d.ts

@@ -6,6 +6,7 @@ export interface FieldProps {
     labelPosition?: "top" | "side";
     selected?: boolean;
     onMouseOverChange?: (isMouseOver: boolean) => void;
+    variant?: "normal" | "compact";
 }
 export declare const Field: (props: FieldProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 interface FieldIconProps {

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

@@ -14,6 +14,12 @@ declare const meta: {
             };
             options: string[];
         };
+        variant: {
+            control: {
+                type: string;
+            };
+            options: string[];
+        };
     };
 };
 export default meta;