@prismicio/editor-ui 0.4.12 → 0.4.14

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

@@ -0,0 +1,24 @@
+import { type KeyboardEvent, type RefObject } from "react";
+interface UseTagFieldHeaderProps {
+    selectedValues: Set<string>;
+    tagsContainerRef: RefObject<HTMLDivElement>;
+    open: boolean;
+    onSelectedValuesChange: (selectedValues: Set<string>) => void;
+}
+export declare function useTagFieldHeader(props: UseTagFieldHeaderProps): {
+    removeSelectedValue: (valueToDelete: string | LastItemLocation) => void;
+    displayedSelectedValues: Set<string>;
+    extraTags: number;
+};
+export type LastItemLocation = -1;
+interface UseHandleKeyboardEntriesProps {
+    inputRef: RefObject<HTMLDivElement>;
+    searchText: string;
+    setOpen: (open: boolean) => void;
+    onCreateTag: () => void;
+    removeSelectedValue: (valueToDelete: string | -1) => void;
+}
+export declare function useHandleKeyboardEntries(props: UseHandleKeyboardEntriesProps): {
+    onKeyDown: (evt: KeyboardEvent) => void;
+};
+export {};

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

@@ -1,4 +1,6 @@
+import { type StyleRule } from "@vanilla-extract/css";
 export declare const root: string;
+export declare const normalVariantDef: StyleRule;
 export declare const variant: Record<"inherit" | "normal" | "small" | "italic" | "bold" | "extraSmall" | "h1" | "h2" | "h3" | "h4" | "smallItalic" | "smallBold" | "emphasized", string>;
 export declare const align: {
     start: string;
@@ -8,3 +10,4 @@ export declare const align: {
 };
 export declare const noWrap: string;
 export declare const noSelect: string;
+export declare const underline: string;

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

@@ -1,6 +1,6 @@
 import { type ReactNode } from "react";
 import { colors } from "../../theme/colors";
-import { SX } from "../../theme/util";
+import { type SX } from "../../theme/util";
 import * as styles from "./Text.css";
 export interface TextProps {
     align?: keyof typeof styles.align;
@@ -12,9 +12,10 @@ export interface TextProps {
     variant?: Variant;
     noSelect?: boolean;
     htmlFor?: string;
+    underline?: boolean;
     sx?: SX;
 }
 export declare const Text: import("react").ForwardRefExoticComponent<TextProps & import("react").RefAttributes<HTMLElement>>;
-declare type Component = "code" | "h1" | "h2" | "h3" | "h4" | "kbd" | "p" | "pre" | "span" | "label";
-declare type Variant = keyof typeof styles.variant;
+type Component = "code" | "h1" | "h2" | "h3" | "h4" | "kbd" | "p" | "pre" | "span" | "label";
+type Variant = keyof typeof styles.variant;
 export {};

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

@@ -1 +1 @@
-export { type TextProps, Text } from "./Text";
+export { Text, type TextProps } from "./Text";

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

@@ -1,11 +1,12 @@
+import { type SX } from "../../theme/util";
 export interface TextAreaProps {
     autoComplete?: string;
-    className?: string;
     id?: string;
     name?: string;
     onChange?: (value: string) => void;
     placeholder?: string;
     readOnly?: boolean;
     value?: string;
+    sx?: SX;
 }
 export declare function TextArea(props: TextAreaProps): JSX.Element;

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

@@ -1,8 +1,8 @@
+import type { SX } from "../../theme/util";
 import type { BaseInputProps } from "../BaseInput/BaseInput";
 export interface TextInputProps {
     inputMode?: "text";
     name?: string;
-    className?: BaseInputProps["className"];
     id?: BaseInputProps["id"];
     placeholder?: BaseInputProps["placeholder"];
     readOnly?: BaseInputProps["readOnly"];
@@ -13,7 +13,10 @@ export interface TextInputProps {
     onFocus?: BaseInputProps["onFocus"];
     onBlur?: BaseInputProps["onBlur"];
     cursor?: BaseInputProps["cursor"];
+    sx?: SX;
     onKeyDown?: BaseInputProps["onKeyDown"];
     onValueChange?: (value: string) => void;
+    border?: BaseInputProps["border"];
+    maxLength?: BaseInputProps["maxLength"];
 }
 export declare const TextInput: import("react").ForwardRefExoticComponent<TextInputProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/components/TextLink/TextLink.css.d.ts

@@ -1,6 +1,8 @@
 export declare const root: string;
 export declare const underline: string;
+export declare const inline: string;
 export declare const hoverColor: {
     readonly indigo11: "indigo10";
     readonly grey11: "grey10";
+    readonly tomato11: "tomato10";
 };

package/dist/components/TextLink/TextLink.d.ts

@@ -2,7 +2,9 @@ export interface TextLinkProps {
     href: string;
     children: string;
     underline?: boolean;
-    color?: "grey11" | "indigo11";
+    color?: "grey11" | "indigo11" | "tomato11";
+    inline?: boolean;
+    onClick?: () => void;
 }
 /**
  * A basic link with a single line of text.

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

@@ -1,6 +1,6 @@
 import React from "react";
-import { IconName } from "../Icon";
-declare type Props = {
+import { type IconName } from "../Icon";
+type Props = {
     anchor: React.ReactNode;
     open: boolean;
     onOpenChange?: (open: boolean) => void;

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

@@ -3,7 +3,7 @@ declare const _default: import("@storybook/types").ComponentAnnotations<import("
     anchor: React.ReactNode;
     open: boolean;
     onOpenChange?: ((open: boolean) => void) | undefined;
-    icon?: "visibility" | "add" | "code" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "dateRange" | "delete" | "description" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "firstPage" | "folder" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "hideImage" | "image" | "imageSearch" | "inventory" | "keyboardArrowDown" | "keyboardArrowUp" | "label" | "link" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "moreVert" | "notes" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "preview" | "public" | "refresh" | "save" | "schedule" | "search" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "viewDay" | "zoomOutMap" | undefined;
+    icon?: "visibility" | "add" | "code" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "dateRange" | "delete" | "description" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "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" | "notes" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "search" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "viewDay" | "zoomOutMap" | undefined;
     loadingIndicator?: boolean | undefined;
     title: string;
     seconds: number;
@@ -18,7 +18,7 @@ export declare const Default: {
         anchor: React.ReactNode;
         open: boolean;
         onOpenChange?: ((open: boolean) => void) | undefined;
-        icon?: "visibility" | "add" | "code" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "dateRange" | "delete" | "description" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "firstPage" | "folder" | "formatBold" | "formatClear" | "formatItalic" | "formatListBulleted" | "formatListNumbered" | "formatTextDirectionRToL" | "hideImage" | "image" | "imageSearch" | "inventory" | "keyboardArrowDown" | "keyboardArrowUp" | "label" | "link" | "linkOff" | "lock" | "looks1" | "looks2" | "looks3" | "looks4" | "looks5" | "looks6" | "moreVert" | "notes" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "preview" | "public" | "refresh" | "save" | "schedule" | "search" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "viewDay" | "zoomOutMap" | undefined;
+        icon?: "visibility" | "add" | "code" | "alert" | "arrowBack" | "arrowDownward" | "arrowDropDown" | "arrowDropDownCircle" | "arrowForward" | "arrowUpward" | "calendarToday" | "centerFocusWeak" | "check" | "checkBox" | "checkBoxOutlinedBlank" | "close" | "cloud" | "cloudUpload" | "colorLens" | "contentCopy" | "crop" | "cropLandscape" | "cropPortrait" | "dataObject" | "dateRange" | "delete" | "description" | "desktopWindows" | "dragIndicator" | "driveFileMove" | "edit" | "event" | "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" | "notes" | "openInNew" | "phoneIphone" | "photo" | "pin" | "place" | "preview" | "prismic" | "public" | "refresh" | "save" | "schedule" | "search" | "tabletMac" | "tag" | "textFields" | "toggleOff" | "unfoldMore" | "unsplash" | "viewDay" | "zoomOutMap" | undefined;
         loadingIndicator?: boolean | undefined;
         title: string;
         seconds: number;

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

@@ -1,4 +1,4 @@
-import { PropsWithChildren } from "react";
+import { type PropsWithChildren } from "react";
 interface ToastConfig {
     title: string;
     seconds?: number;

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

@@ -2,13 +2,13 @@ import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
 import type { FC, ReactNode } from "react";
 import type * as buttonStyles from "../Button/Button.css";
 import type * as buttonGroupStyles from "../ButtonGroup/ButtonGroup.css";
-declare type ToggleButtonGroupProps = Readonly<Pick<ToggleGroupPrimitive.ToggleGroupMultipleProps, "children" | "disabled"> & (Pick<ToggleGroupPrimitive.ToggleGroupMultipleProps, "onValueChange" | "type" | "value"> | Pick<ToggleGroupPrimitive.ToggleGroupSingleProps, "onValueChange" | "type" | "value">) & {
+type ToggleButtonGroupProps = Readonly<Pick<ToggleGroupPrimitive.ToggleGroupMultipleProps, "children" | "disabled"> & (Pick<ToggleGroupPrimitive.ToggleGroupMultipleProps, "onValueChange" | "type" | "value"> | Pick<ToggleGroupPrimitive.ToggleGroupSingleProps, "onValueChange" | "type" | "value">) & {
     density?: keyof typeof buttonGroupStyles.density;
     size?: keyof typeof buttonStyles.size;
     variant?: keyof typeof buttonStyles.variant;
 }>;
 export declare const ToggleButtonGroup: FC<ToggleButtonGroupProps>;
-declare type ToggleButtonGroupItemProps = Readonly<Pick<ToggleGroupPrimitive.ToggleGroupItemProps, "children" | "disabled" | "value"> & {
+type ToggleButtonGroupItemProps = Readonly<Pick<ToggleGroupPrimitive.ToggleGroupItemProps, "children" | "disabled" | "value"> & {
     endIcon?: ReactNode;
     size?: keyof typeof buttonStyles.size;
     startIcon?: ReactNode;

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

@@ -1,10 +1,11 @@
 import * as ToolbarPrimitive from "@radix-ui/react-toolbar";
 import { type MouseEvent, type ReactNode } from "react";
+import { type SX } from "../../theme/util";
 import type * as buttonGroupStyles from "../ButtonGroup/ButtonGroup.css";
 import type { IconName } from "../Icon";
 export interface ToolbarProps {
     children?: ReactNode;
-    className?: string;
+    sx?: SX;
 }
 export declare function Toolbar(props: ToolbarProps): JSX.Element;
 interface ToolbarButtonProps {
@@ -46,10 +47,10 @@ interface ToolbarToggleButtonProps {
     onPressedChange?: (pressed: boolean) => void;
 }
 export declare function ToolbarToggleButton(props: ToolbarToggleButtonProps): JSX.Element;
-declare type SingleGroupProps = Pick<ToolbarPrimitive.ToolbarToggleGroupSingleProps, "type" | "value" | "onValueChange">;
-declare type MultipleGroupProps = Pick<ToolbarPrimitive.ToolbarToggleGroupMultipleProps, "type" | "value" | "onValueChange">;
-declare type GroupProps = SingleGroupProps | MultipleGroupProps;
-declare type ToolbarToggleButtonGroupProps = {
+type SingleGroupProps = Pick<ToolbarPrimitive.ToolbarToggleGroupSingleProps, "type" | "value" | "onValueChange">;
+type MultipleGroupProps = Pick<ToolbarPrimitive.ToolbarToggleGroupMultipleProps, "type" | "value" | "onValueChange">;
+type GroupProps = SingleGroupProps | MultipleGroupProps;
+type ToolbarToggleButtonGroupProps = {
     children?: ReactNode;
     disabled?: boolean;
     density?: keyof typeof buttonGroupStyles.density;

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

@@ -1,5 +1,6 @@
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { ReactNode } from "react";
+import { type ReactNode } from "react";
+import { vars } from "../../theme/vars.css";
 export declare const TooltipProvider: import("react").FC<TooltipPrimitive.TooltipProviderProps>;
 export interface TooltipProps {
     title?: string;
@@ -8,5 +9,17 @@ export interface TooltipProps {
     side?: Parameters<typeof TooltipPrimitive.Content>[0]["side"];
     align?: Parameters<typeof TooltipPrimitive.Content>[0]["align"];
     open?: boolean;
+    zIndex?: keyof typeof vars.zIndex;
+    disabled?: boolean;
+    /**
+     * By enabling the stable mount a `div` will be rendered around your trigger item.
+     *
+     * This is a workaround for a bug where mounting the Tooltip portal
+     * inside another Portal rendered item causes the Tooltip to not open.
+     *
+     * @param stableMount
+     * @defaultValue `false` This will wrap the trigger element in a Fragment.
+     */
+    stableMount?: boolean;
 }
 export declare function Tooltip(props: TooltipProps): JSX.Element;

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

@@ -1,11 +1,12 @@
 export interface VideoProps {
     src: string;
     loop?: boolean;
-    autoplay?: boolean;
+    autoPlay?: boolean;
     sizing?: "contain" | "cover" | "none";
     borderRadius?: 0 | 4;
     boxShadow?: "3";
     animateOnLoad?: boolean;
     onLoad?: () => void;
+    controls?: boolean;
 }
 export declare function Video(props: VideoProps): JSX.Element;

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

@@ -6,7 +6,8 @@ export declare const Default: {
         src: string;
         borderRadius: number;
         loop: boolean;
-        autoplay: boolean;
+        autoPlay: boolean;
+        controls: boolean;
     };
     name: string;
 };

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

@@ -1 +1 @@
-export { type VideoProps, Video } from "./Video";
+export { Video, type VideoProps } from "./Video";

package/dist/index.d.ts

@@ -1,7 +1,8 @@
 export { ActionList, ActionListItem } from "./components/ActionList";
-export { Alert, AlertButton, AlertProvider, useAlert } from "./components/Alert";
-export { type AnimatedElementProps, AnimatedElement } from "./components/AnimatedElement";
-export { type RenderDragPreviewParams, type RenderDropIndicatorParams, AnimatedList } from "./components/AnimatedList";
+export { Alert, AlertButton, type AlertConfig, AlertProvider, useAlert } from "./components/Alert";
+export { AnimatedElement, type AnimatedElementProps } from "./components/AnimatedElement";
+export { AnimatedList, type RenderDragPreviewParams, type RenderDropIndicatorParams } from "./components/AnimatedList";
+export { Avatar } from "./components/Avatar";
 export { Badge } from "./components/Badge";
 export { BlankSlate, BlankSlateActions, BlankSlateDescription, BlankSlateIcon, BlankSlateImage, BlankSlateTitle } from "./components/BlankSlate";
 export { Box } from "./components/Box";
@@ -22,41 +23,45 @@ export { Dialog, DialogActions, DialogContent, DialogHeader, DialogOptions, Dial
 export { DocumentCard } from "./components/DocumentCard";
 export { DocumentStatusBar } from "./components/DocumentStatusBar";
 export { DocumentStatusDot } from "./components/DocumentStatusDot";
-export { DocumentVersions } from "./components/DocumentVersions";
 export { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, dropdownMenuStyles, DropdownMenuTrigger } from "./components/DropdownMenu";
 export { EditableText } from "./components/EditableText";
 export { EmbedPreview, EmptyEmbed } from "./components/Embed";
 export { DefaultErrorMessage, ErrorBoundary } from "./components/ErrorBoundary";
 export { Field, FieldControl, FieldFooter, FieldIcon, FieldLabel } from "./components/Field";
-export { FieldSet, FieldSetLegend } from "./components/FieldSet";
+export { FieldSet, fieldSetGap, FieldSetLegend } from "./components/FieldSet";
 export { FileDropZone, FileUploadTrigger, UploadProgress } from "./components/FileUpload";
-export { type FilterOption, FilterField } from "./components/FilterField";
-export { Form, FormInput } from "./components/Form";
+export { FilterField, type FilterOption } from "./components/FilterField";
+export { Form, FormDateInput, FormInput } from "./components/Form";
 export { Gradient } from "./components/Gradient";
 export { Group, GroupItem } from "./components/Group";
 export { HairlineButton } from "./components/HairlineButton";
-export { type IconName, Icon, PrismicLogo } from "./components/Icon";
+export { Icon, type IconName, PrismicLogo } from "./components/Icon";
 export { IconButton } from "./components/IconButton";
 export { Image, SuspenseImage } from "./components/Image";
 export { InvisibleButton } from "./components/InvisibleButton";
+export { LazyRender } from "./components/LazyRender";
 export { LinkDescriptionCard } from "./components/LinkDescriptionCard";
-export { type MasonryItemInfo, Masonry, MasonryMedia, MasonrySkeleton } from "./components/Masonry";
+export { LinkImageCard } from "./components/LinkImageCard";
+export { Masonry, MasonryFile, type MasonryItemInfo, MasonryMedia, MasonrySkeleton } from "./components/Masonry";
 export { NumberInput } from "./components/NumberInput";
-export { Popover } from "./components/Popover";
+export { Popover, type PopoverInteractOutsideEvent } from "./components/Popover";
 export { ProgressCircle } from "./components/ProgressCircle";
+export { RadioButton, RadioCard, RadioGroup } from "./components/Radio";
 export { ScrollArea } from "./components/ScrollArea";
 export { SearchInput } from "./components/SearchInput";
 export { Select, SelectItem } from "./components/Select";
 export { SelectButton } from "./components/SelectButton";
+export { SelectCard } from "./components/SelectCard";
 export { Separator } from "./components/Separator";
 export { Skeleton } from "./components/Skeleton";
-export { SliceCard, SliceVariationCard } from "./components/Slice";
+export { SliceCard, SliceSelectCard } from "./components/Slice";
 export { Slider } from "./components/Slider";
 export { Switch } from "./components/Switch";
 export { Tab } from "./components/Tab";
+export { Table, TableBody, TableCell, TableHead, TableRow } from "./components/Table";
 export { Tag } from "./components/Tag";
 export { TagField } from "./components/TagField";
-export { type TextProps, Text } from "./components/Text";
+export { Text, type TextProps } from "./components/Text";
 export { TextArea } from "./components/TextArea";
 export { TextInput } from "./components/TextInput";
 export { TextLink } from "./components/TextLink";
@@ -69,6 +74,7 @@ export { Tooltip, TooltipProvider } from "./components/Tooltip";
 export { Video } from "./components/Video";
 export { default as dialogErrorImage } from "./images/dialogError.svg";
 export { colors } from "./theme/colors";
+export { breakpoints } from "./theme/mediaQueries";
 export { mode } from "./theme/mode.css";
 export { selectors } from "./theme/selectors";
 export { sprinkles } from "./theme/sprinkles.css";