@prismicio/editor-ui 0.4.25 → 0.4.26

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

@@ -3,7 +3,8 @@ import type { SX } from "../../theme/new";
 import { type IconName } from "../Icon";
 export interface ButtonProps {
     children?: ReactNode;
-    color?: "grey" | "purple" | "dark" | "tomato" | "amber" | "green";
+    /** Note that white is only supported for the invisible button */
+    color?: "grey" | "purple" | "dark" | "tomato" | "amber" | "green" | "white";
     size?: "small" | "medium" | "large";
     disabled?: boolean;
     loading?: boolean;
@@ -28,5 +29,14 @@ export interface ButtonProps {
     onClick?: (event: MouseEvent) => void;
     onMouseEnter?: (event: MouseEvent) => void;
     onMouseLeave?: (event: MouseEvent) => void;
+    onMouseDown?: (event: MouseEvent) => void;
+    onMouseUp?: (event: MouseEvent) => void;
+    /** Invisible variant in the design system. Used for icon buttons with no background */
+    invisible?: boolean;
+    /** Removes padding around the icon. Will only apply to icon only buttons. */
+    hasPadding?: boolean;
+    /**  Underlines the text content of the button. Only applies to invisible buttons */
+    underline?: boolean;
+    hiddenLabel?: string;
 }
 export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const meta: {
     title: string;
     component: import("react").ForwardRefExoticComponent<import("./Button").ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
@@ -7,7 +8,7 @@ declare const meta: {
             control: {
                 type: string;
             };
-            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "autoFixHigh", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "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", "keyboardArrowDown", "keyboardArrowUp", "label", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "moreVert", "musicNote", "notes", "openInFull", "openInNew", "phoneIphone", "photo", "pin", "place", "preview", "prismic", "public", "refresh", "save", "schedule", "search", "smartDisplay", "tabletMac", "tag", "textFields", "toggleOff", "unfoldMore", "unsplash", "upload", "viewDay", "visibility", "zoomOutMap"];
+            options: readonly ["add", "alert", "arrowBack", "arrowDownward", "arrowDropDown", "arrowDropDownCircle", "arrowForward", "arrowUpward", "autoFixHigh", "biToggle", "block", "calendarToday", "centerFocusWeak", "check", "checkBox", "checkBoxOutlinedBlank", "chevronLeft", "chevronRight", "close", "cloud", "cloudUpload", "code", "colorLens", "contentCopy", "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", "keyboardArrowDown", "keyboardArrowUp", "label", "link", "linkOff", "lock", "looks1", "looks2", "looks3", "looks4", "looks5", "looks6", "migrationRelease", "moreVert", "multipleStop", "musicNote", "notes", "openInFull", "openInNew", "phoneIphone", "photo", "pin", "place", "preview", "prismic", "public", "refresh", "save", "schedule", "search", "smartDisplay", "tabletMac", "tag", "textFields", "toggleOff", "unfoldMore", "unsplash", "upload", "viewDay", "visibility", "zoomOutMap"];
         };
     };
 };
@@ -15,21 +16,27 @@ export default meta;
 export declare const Default: {
     render: (args: {
         children?: import("react").ReactNode;
-        color?: "dark" | "green" | "grey" | "purple" | "tomato" | "amber" | undefined;
-        size?: "small" | "large" | "medium" | undefined;
+        color?: "dark" | "white" | "green" | "grey" | "purple" | "tomato" | "amber" | undefined;
+        size?: "small" | "medium" | "large" | undefined;
         disabled?: boolean | undefined;
         loading?: boolean | undefined;
         textColor?: "placeholder" | undefined;
         flexContent?: boolean | undefined;
         textWeight?: "bold" | "normal" | undefined;
         sx?: import("../../theme/new").SX | undefined;
-        startIcon?: "visibility" | "search" | "link" | "description" | "code" | "block" | "add" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "autoFixHigh" | "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" | "moreVert" | "musicNote" | "notes" | "openInFull" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "smartDisplay" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "upload" | "viewDay" | "zoomOutMap" | undefined;
-        endIcon?: "visibility" | "search" | "link" | "description" | "code" | "block" | "add" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "autoFixHigh" | "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" | "moreVert" | "musicNote" | "notes" | "openInFull" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "smartDisplay" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "upload" | "viewDay" | "zoomOutMap" | 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" | "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" | "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;
         renderEndIcon?: ((icon: import("react").ReactNode) => import("react").ReactNode) | undefined;
         onClick?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
         onMouseEnter?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
         onMouseLeave?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
+        onMouseDown?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
+        onMouseUp?: ((event: import("react").MouseEvent<Element, MouseEvent>) => void) | undefined;
+        invisible?: boolean | undefined;
+        hasPadding?: boolean | undefined;
+        underline?: boolean | undefined;
+        hiddenLabel?: string | undefined;
         ref?: import("react").Ref<HTMLButtonElement> | undefined;
         key?: import("react").Key | null | undefined;
     }) => JSX.Element;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const meta: {
     title: string;
     component: import("react").ForwardRefExoticComponent<import("./ButtonGroup").ButtonGroupProps & import("react").RefAttributes<HTMLDivElement>>;
@@ -32,9 +33,9 @@ export declare const Default: {
     render: (args: {
         children?: import("react").ReactNode;
         disabled?: boolean | undefined;
-        size?: "small" | "large" | "medium" | undefined;
+        size?: "small" | "medium" | "large" | undefined;
         color?: "dark" | "grey" | "purple" | undefined;
-        density?: "compact" | "regular" | undefined;
+        density?: "regular" | "compact" | undefined;
         sx?: import("../../theme/new").SX | undefined;
         ref?: import("react").Ref<HTMLDivElement> | undefined;
         key?: import("react").Key | null | undefined;

package/dist/components/Calendar/Calendar.d.ts

@@ -1,6 +1,6 @@
 import { type DateValue, GregorianCalendar } from "@internationalized/date";
 export interface CalendarProps {
-    minValue?: "tomorrow";
+    minValue?: "today";
     value: DateValue | undefined;
     onValueChange: (value: DateValue) => void;
 }

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

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import type { KeyboardEvent, MouseEvent, ReactNode } from "react";
 import type { SX } from "../../theme/new";
 import { type TextProps } from "../Text";
 export interface CardProps {
@@ -6,7 +6,8 @@ export interface CardProps {
     color?: "grey1" | "grey2" | "grey3" | "indigo2" | "purple1";
     variant?: "dashed" | "elevated" | "outlined" | "selected";
     radius?: 4 | 6;
-    padding?: 24;
+    paddingBlock?: 8 | 16;
+    onSelect?: (event: MouseEvent | KeyboardEvent) => void;
     sx?: SX;
 }
 export declare function Card(props: CardProps): JSX.Element;
@@ -31,4 +32,9 @@ interface CardContentProps {
     sx?: SX;
 }
 export declare function CardContent(props: CardContentProps): JSX.Element;
+interface CardFooterProps {
+    children?: ReactNode;
+    sx?: SX;
+}
+export declare function CardFooter(props: CardFooterProps): JSX.Element;
 export {};

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

@@ -1,10 +1,49 @@
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("./Card").CardProps>;
-export default _default;
+/// <reference types="react" />
+import { Card } from "./Card";
+declare const meta: {
+    title: string;
+    component: typeof Card;
+    argTypes: {
+        children: {
+            control: {
+                disable: boolean;
+            };
+        };
+        color: {
+            control: {
+                type: string;
+            };
+            options: string[];
+        };
+        variant: {
+            control: {
+                type: string;
+            };
+            options: string[];
+        };
+        paddingBlock: {
+            control: {
+                type: string;
+            };
+            options: number[];
+        };
+    };
+};
+export default meta;
 export declare const Default: {
-    render: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, import("./Card").CardProps>;
+    render: (args: {
+        children?: import("react").ReactNode;
+        color?: "grey1" | "grey2" | "grey3" | "indigo2" | "purple1" | undefined;
+        variant?: "dashed" | "selected" | "elevated" | "outlined" | undefined;
+        radius?: 4 | 6 | undefined;
+        paddingBlock?: 8 | 16 | undefined;
+        onSelect?: ((event: import("react").MouseEvent<Element, MouseEvent> | import("react").KeyboardEvent<Element>) => void) | undefined;
+        sx?: import("../../theme/new").SX | undefined;
+    }) => JSX.Element;
     args: {
-        color: string;
-        variant: string;
+        color: "grey1";
+        variant: "elevated";
+        paddingBlock: 8;
     };
     name: string;
 };

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

@@ -0,0 +1,23 @@
+import type { ReactNode } from "react";
+export interface PreviewCardProps {
+    children: ReactNode;
+    /** Applies selected style, useful for the richtext field */
+    selected?: boolean;
+    variant?: "compact" | "large";
+    onClick?: () => void;
+}
+export declare function PreviewCard(props: PreviewCardProps): JSX.Element;
+interface PreviewImageProps {
+    src: string;
+    alt?: string;
+    aspectRatio?: "1:1" | "16:9";
+    framed?: boolean;
+    width?: number;
+    height?: number;
+}
+export declare function PreviewImage(props: PreviewImageProps): JSX.Element;
+interface PreviewContentProps {
+    children: ReactNode;
+}
+export declare function PreviewContent(props: PreviewContentProps): JSX.Element;
+export {};

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

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { PreviewCard } from "./PreviewCard";
+declare const meta: {
+    title: string;
+    component: typeof PreviewCard;
+    argTypes: {
+        children: {
+            control: {
+                disable: boolean;
+            };
+        };
+    };
+};
+export default meta;
+export declare const Default: {
+    render: ({ selected }: {
+        children: import("react").ReactNode;
+        selected?: boolean | undefined;
+        variant?: "large" | "compact" | undefined;
+        onClick?: (() => void) | undefined;
+    }) => JSX.Element;
+    args: {
+        selected: false;
+        children: null;
+    };
+    name: string;
+};

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

@@ -1 +1,2 @@
-export { Card, CardContent, CardHeader, CardHeaderActions, CardHeaderTitle } from "./Card";
+export { Card, CardContent, CardFooter, CardHeader, CardHeaderActions, CardHeaderTitle } from "./Card";
+export { PreviewCard, PreviewContent, PreviewImage } from "./PreviewCard";

package/dist/components/Carousel/Carousel.d.ts

@@ -7,4 +7,11 @@ export interface CarouselProps<ITEM> {
     onPageChange: (page: number) => void;
     style?: CSSProperties;
 }
+type Direction = "idle" | "prev" | "next";
 export declare function Carousel<ITEM>(props: CarouselProps<ITEM>): ReactElement;
+interface CarouselContext {
+    direction: Direction;
+}
+declare const CarouselContext: import("react").Context<CarouselContext | null>;
+export declare function useCarousel(): CarouselContext;
+export {};

package/dist/components/Carousel/CarouselItem.d.ts

@@ -1,7 +1,7 @@
-import { type FC, type Key } from "react";
+import { type Key } from "react";
 import { type ImageProps } from "../Image/Image";
 export interface CarouselItemProps extends ImageProps {
     key: Key;
     isUpdating?: boolean;
 }
-export declare const CarouselItem: FC<CarouselItemProps>;
+export declare function CarouselItem(props: CarouselItemProps): JSX.Element;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const meta: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("./Checkbox").CheckboxProps>;
 export default meta;
 export declare const Default: import("@storybook/types").StoryAnnotations<import("@storybook/react/dist/types-0a347bb9").R, {

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

@@ -0,0 +1,41 @@
+import { type ReactNode } from "react";
+import type { SX } from "../../theme/new";
+type Variant = "attached" | "detached";
+export interface ComboBoxProps {
+    children: ReactNode;
+    variant?: Variant;
+    sx?: SX;
+}
+export declare const ComboBox: import("react").ForwardRefExoticComponent<ComboBoxProps & import("react").RefAttributes<HTMLDivElement>>;
+interface ComboBoxContentProps {
+    children: ReactNode;
+    /**
+     * Aligns "detached" content above the input or below
+     * @variant - detached
+     */
+    side?: "top" | "bottom";
+}
+export declare const ComboBoxContent: import("react").ForwardRefExoticComponent<ComboBoxContentProps & import("react").RefAttributes<HTMLDivElement>>;
+type ComboBoxItemProps = {
+    onSelect: () => void;
+    disabled?: boolean;
+    selected?: boolean;
+    children: ReactNode;
+};
+export declare const ComboBoxItem: import("react").ForwardRefExoticComponent<ComboBoxItemProps & import("react").RefAttributes<HTMLDivElement>>;
+interface ComboBoxInputProps {
+    value: string;
+    onValueChange: (search: string) => void;
+    placeholder?: string;
+    /**
+     * Auto focuses the input when variant is "attached".
+     * Needed when ComboBox is nested within Popovers
+     */
+    autoFocus?: boolean;
+}
+export declare const ComboBoxInput: import("react").ForwardRefExoticComponent<ComboBoxInputProps & import("react").RefAttributes<HTMLInputElement>>;
+interface ComboBoxActionProps {
+    children: ReactNode;
+}
+export declare function ComboboxAction(props: ComboBoxActionProps): JSX.Element;
+export {};

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

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import type { StoryObj } from "@storybook/react";
+declare const meta: {
+    title: string;
+    component: import("react").ForwardRefExoticComponent<import("./ComboBox").ComboBoxProps & import("react").RefAttributes<HTMLDivElement>>;
+    tags: string[];
+    argTypes: {
+        variant: {
+            control: string;
+            options: string[];
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const WithoutAction: Story;
+export declare const WithAction: Story;

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

@@ -0,0 +1,4 @@
+export declare const ITEM_SELECTOR = "[combobox-item=\"\"]";
+export declare const VALID_ITEM_SELECTOR = "[combobox-item=\"\"]:not([aria-disabled=\"true\"])";
+export declare const VALUE_ATTR = "data-value";
+export declare const PICK_EVENT = "combobox-item-select";

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

@@ -0,0 +1 @@
+export { ComboBox, ComboboxAction, ComboBoxContent, ComboBoxInput, ComboBoxItem } from "./ComboBox";

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

@@ -0,0 +1,21 @@
+import { type KeyboardEvent, type RefObject } from "react";
+interface UseScrollIntoViewProps {
+    contentInnerRef: RefObject<HTMLDivElement>;
+}
+export declare function useScrollIntoView(props: UseScrollIntoViewProps): void;
+interface UseInternalSelectionProps {
+    contentInnerRef: RefObject<HTMLDivElement>;
+    inputInnerRef: RefObject<HTMLInputElement>;
+}
+export declare function useInternalSelection(props: UseInternalSelectionProps): {
+    next: (event: KeyboardEvent) => void;
+    prev: (event: KeyboardEvent) => void;
+    selectedValue: string | undefined;
+    listIsOpen: boolean;
+    setListIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    onChangeInternalSelection: (value: string | undefined) => void;
+    onItemPicked: () => void;
+    cleanupInternalState: () => void;
+};
+export declare function getSelectedItem(contentInnerRef: RefObject<HTMLDivElement>): Element | null | undefined;
+export {};

package/dist/components/ConjoinedIcons/ConjoinedIcons.d.ts

@@ -1,4 +1,4 @@
-import type { IconName } from "../Icon";
+import { type IconName } from "../Icon";
 export interface ConjoinedIconsProps {
     largeIconName: IconName;
     smallIconName: IconName;

package/dist/components/ContentEditable/ContentEditable.d.ts

@@ -1,8 +1,28 @@
-import type { ReactNode } from "react";
-export interface ContentEditableProps {
-    children?: ReactNode;
-    className?: string;
-    id?: string;
+import type { Editor } from "@tiptap/core";
+interface ContentEditableProps {
+    /** The raw text or HTML content */
+    content: string;
+    /**
+     * Bump the contentVersion when you need to reset/resync the content from the outside,
+     * for instance when the content is a radically different thing.
+     * This is pretty much like <ContentEditable key={contentVersion} /> except the Tiptap Editor remains mounted and doesn't bug out/flicker.
+     * tiptap doesn't officially support being controlled and it results in cursor/concurrency issues.
+     * If you do contentVersion={content}, this is essentially like controlling the component
+     * from the parent but it only works well for a readOnly ContentEditable.
+     */
+    contentVersion?: string | number;
     readOnly?: boolean;
+    placeholder?: string;
+    multiline?: boolean;
+    padding?: boolean;
+    /** Overrides the default styles of HTML tags */
+    decorations?: Decorations;
+    onChange?: (editor: Editor) => void;
+    onBlur?: (editor: Editor) => void;
 }
 export declare function ContentEditable(props: ContentEditableProps): JSX.Element;
+interface Decorations {
+    em?: "normal" | "highlight";
+    p?: "normal" | "emphasized";
+}
+export {};

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

@@ -1,9 +1,8 @@
-declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("./ContentEditable").ContentEditableProps>;
-export default _default;
+declare const meta: {
+    title: string;
+};
+export default meta;
 export declare const Default: {
-    args: {
-        children: JSX.Element;
-        readOnly: boolean;
-    };
+    render: () => JSX.Element;
     name: string;
 };

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

@@ -1 +1,5 @@
+export { ContentEditable } from "./ContentEditable";
+export { handleEditorFlushSyncError, useEditor } from "./useEditor";
 export declare const contentEditableClass: string;
+export declare const contentEditablePlaceholderClass: string;
+export declare const contentEditableMultilinePlaceholderClass: string;

package/dist/components/ContentEditable/useEditor.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="node" />
+import type { EditorOptions } from "@tiptap/core";
+import { Editor } from "@tiptap/react";
+import { type DependencyList } from "react";
+export declare function useEditor(options?: Partial<UseEditorOptions>, deps?: DependencyList): Editor;
+/**
+ * setTimeout is required to combat tiptap flushsync issue
+ * https://github.com/ueberdosis/tiptap/issues/3764
+ */
+export declare function handleEditorFlushSyncError(callback: VoidFunction): NodeJS.Timeout;
+type UseEditorOptions = Omit<EditorOptions, "onBeforeCreate" | "onCreate" | "onSelectionUpdate" | "onTransaction" | "onFocus" | "onDestroy">;
+export {};

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

@@ -8,7 +8,7 @@ export type DateInputProps = {
     /**
      * The minimum allowed date that a user may select.
      */
-    minValue?: "tomorrow";
+    minValue?: "today";
     "aria-labelledby": string;
     sx?: SX;
     onValueChange: (value?: Date) => void;

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

@@ -17,25 +17,16 @@ declare const meta: {
 };
 export default meta;
 export declare const Default: {
-    decorators: ((_Story: import("@storybook/types").PartialStoryFn<import("@storybook/react/dist/types-0a347bb9").R, {
+    render: (args: {
         value?: Date | undefined;
         mode: "date" | "date-time";
         defaultTime?: Time | undefined;
         disabled?: boolean | undefined;
-        minValue?: "tomorrow" | undefined;
+        minValue?: "today" | undefined;
         "aria-labelledby": string;
         sx?: import("../../theme/new").SX | undefined;
         onValueChange: (value?: Date | undefined) => void;
-    }>, { args }: import("@storybook/types").StoryContext<import("@storybook/react/dist/types-0a347bb9").R, {
-        value?: Date | undefined;
-        mode: "date" | "date-time";
-        defaultTime?: Time | undefined;
-        disabled?: boolean | undefined;
-        minValue?: "tomorrow" | undefined;
-        "aria-labelledby": string;
-        sx?: import("../../theme/new").SX | undefined;
-        onValueChange: (value?: Date | undefined) => void;
-    }>) => JSX.Element)[];
+    }) => JSX.Element;
     args: {
         mode: "date";
         "aria-labelledby": string;

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

@@ -1,5 +1,5 @@
-import { type DialogContentProps } from "@radix-ui/react-dialog";
-import { type FC, type PropsWithChildren, type ReactNode } from "react";
+import { type DialogContentProps as RadixDialogContentProps } from "@radix-ui/react-dialog";
+import { type FC, type ReactNode } from "react";
 import { type IconName } from "../Icon";
 export interface Custom {
     width: number | string;
@@ -21,7 +21,7 @@ export interface DialogProps {
      * "center" - The dialog is centered in the viewport. Useful for large, almost fullscreen dialogs.
      */
     position?: "center" | "bottomRight" | "top";
-    onPointerDownOutside?: DialogContentProps["onPointerDownOutside"];
+    onPointerDownOutside?: RadixDialogContentProps["onPointerDownOutside"];
 }
 /**
  * A Dialog rendered in document.body.
@@ -34,7 +34,11 @@ interface DialogHeaderProps {
     title: string;
 }
 export declare const DialogHeader: FC<DialogHeaderProps>;
-export declare const DialogContent: FC<PropsWithChildren>;
+interface DialogContentProps {
+    children: ReactNode;
+    padding?: 16;
+}
+export declare function DialogContent(props: DialogContentProps): JSX.Element;
 type ActionsProps = {
     ok: {
         text: string;

package/dist/components/DropdownMenu/DropdownMenu.d.ts

@@ -1,5 +1,18 @@
 import { type ReactNode } from "react";
 export interface DropdownMenuProps {
+    /**
+     * The controlled open state of the dropdown menu.
+     * Must be used in conjunction with onOpenChange
+     */
+    open?: boolean;
+    /**
+     * Event handler called when the open state of the dropdown menu changes.
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * When set to true, interaction with outside elements will be disabled.
+     * Only menu content will be visible to screen readers
+     */
     modal?: boolean;
     children: ReactNode;
 }
@@ -16,6 +29,23 @@ export interface DropdownMenuContentProps {
     children: ReactNode;
     asPortal?: boolean;
     maxHeight?: 256;
+    /**
+     * Whether the content should avoid collisions with the viewport
+     * @default true
+     */
+    avoidCollisions?: boolean;
+    /**
+     * Whether the content has a border
+     * @default true
+     */
+    border?: boolean;
+    /**
+     * When true, surrounds the dropdown content children with a radix primitive
+     * focus scope. Ensures children can grab focus from
+     * dropdown content when needed. https://github.com/radix-ui/primitives/issues/922#issuecomment-948366132
+     * @default false
+     */
+    childrenFocusScope?: boolean;
 }
 export declare function DropdownMenuContent(props: DropdownMenuContentProps): JSX.Element;
 interface DropdownMenuItemProps {

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

@@ -1,13 +1,13 @@
-import { colors } from "../../theme/colors";
+import { type ThemeKeys } from "../../theme/new";
 import { textVariantMapping } from "../Text";
 export interface EditableTextProps {
     "aria-label": string;
     value: string;
+    color?: ThemeKeys<"color">;
+    variant?: keyof typeof textVariantMapping;
+    disabled?: boolean;
     onFocus?: () => void;
     onBlur?: () => void;
     onChange?: (value: string) => void;
-    color?: keyof typeof colors;
-    variant?: keyof typeof textVariantMapping;
-    disabled?: boolean;
 }
 export declare function EditableText(props: EditableTextProps): JSX.Element;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const meta: {
     title: string;
     component: import("react").ForwardRefExoticComponent<import("./Field").FieldProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/FieldSet/FieldSet.d.ts

@@ -1,13 +1,10 @@
-import type { FC, ReactNode } from "react";
+import type { ReactNode } from "react";
 export interface FieldSetProps {
     children?: ReactNode;
     selected?: boolean;
     id?: string;
+    legend: string;
     name?: string;
     onFocus?: () => void;
 }
 export declare function FieldSet(props: FieldSetProps): JSX.Element;
-export interface FieldSetLegendProps {
-    children?: ReactNode;
-}
-export declare const FieldSetLegend: FC<FieldSetLegendProps>;

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

@@ -3,6 +3,7 @@ export default _default;
 export declare const Default: {
     args: {
         children: JSX.Element;
+        legend: string;
     };
     name: string;
 };

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

@@ -1,2 +1 @@
-export { FieldSet, FieldSetLegend } from "./FieldSet";
-export { fieldSetGap } from "./FieldSet.utils";
+export { FieldSet } from "./FieldSet";

package/dist/components/FileUpload/{FileDropZone/FileDropZone.d.ts → FileDropZone.d.ts}

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import { type MediaAssetType } from "../FileUpload.utils";
+import { type MediaAssetType } from "./FileUpload.utils";
 export interface FileDropZoneProps {
     onFilesSelected: (files: File[]) => void;
     overlay: ReactNode;