@spfx-fast/sharepoint-ui 0.4.1 → 0.4.3

package/dist/react.d.ts

@@ -23,6 +23,9 @@ export type DialogOnOpenChangeData = {
 import { type ProgressBarColor, type ProgressBarShape, type ProgressBarThickness } from "./elements/progress-bar.js";
 export type { ProgressBarColor, ProgressBarShape, ProgressBarThickness } from "./elements/progress-bar.js";
 export type { SpinButtonAppearance, SpinButtonSize, SpinButtonChangeData } from "./elements/spin-button.js";
+import { type RichTextEditorImageUploader, type RichTextEditorLinkPicker, type SharePointMultiLineField } from "./elements/rich-text-editor.js";
+export { getRichTextEditorFieldOptions, type SharePointMultiLineField, type RichTextEditorImageUploadResult, type RichTextEditorImageUploader, type RichTextEditorLink, type RichTextEditorLinkPicker } from "./elements/rich-text-editor.js";
+import { type SharePointFieldMetadata, type SharePointFieldValue } from "./sharepoint-fields.js";
 import { type SkeletonAnimation, type SkeletonAppearance, type SkeletonItemSize, type SkeletonShape } from "./elements/skeleton.js";
 import { type DividerAppearance } from "./elements/divider.js";
 export type { DividerAppearance } from "./elements/divider.js";
@@ -30,7 +33,8 @@ import { type AccordionItemValue, type AccordionNavigation } from "./elements/ac
 import { type AvatarColor } from "./elements/avatar.js";
 import { type PersonaPresence, type PersonaSize } from "./elements/persona.js";
 import { type VirtualListDataSource } from "./elements/virtual-list.js";
-import { type DataGridCellEdit, type DataGridColumn, type DataGridDataSource, type DataGridDataSourceRow, type DataGridColumnSizingOptions, type DataGridColumnWidths, type DataGridEditValue, type DataGridFocusMode, type DataGridSelectionAppearance, type DataGridSelectionModel, type DataGridSort } from "./elements/data-grid-model.js";
+import { type DataGridCellEdit, type DataGridCellEditError, type DataGridColumn, type DataGridDataSource, type DataGridDataSourceRow, type DataGridColumnSizingOptions, type DataGridColumnWidths, type DataGridEditValue, type DataGridFocusMode, type DataGridSelectionAppearance, type DataGridSelectionModel, type DataGridSort } from "./elements/data-grid-model.js";
+export type { DataGridCellEditError } from "./elements/data-grid-model.js";
 import { type TreeNode } from "./elements/tree-model.js";
 import { type InteractionTagSelectData, type TagAppearance, type TagGroupSelectData, type TagSize } from "./elements/tags.js";
 import { type TagPickerOpenChangeType } from "./elements/tag-picker.js";
@@ -75,10 +79,11 @@ import { type InfoPlacement } from "./elements/info.js";
 import { type CarouselAlign, type CarouselAppearance, type CarouselMotion } from "./elements/carousel.js";
 export type { CarouselIndexChangeData } from "./elements/carousel.js";
 export type { CarouselAlign, CarouselAppearance, CarouselMotion } from "./elements/carousel.js";
-import { type OverflowAxis, type OverflowState } from "./elements/overflow.js";
-export type { OverflowAxis, OverflowState } from "./elements/overflow.js";
+import { type OverflowAxis, type OverflowDensity, type OverflowState } from "./elements/overflow.js";
+export type { OverflowAxis, OverflowDensity, OverflowState } from "./elements/overflow.js";
 import { type SharePointUIAppearance, type SharePointUIBaseAppearance, type SharePointUIDensity, type SharePointUIStyleTokens } from "./appearance.js";
 import { type FluentThemeTokens, type SharePointUIDesignTheme } from "./theme.js";
+export { getSharePointThemeColorPresets, type SharePointThemeColorPreset } from "./theme.js";
 export { createResizeObserverFromDocument, getRTLRootMargin, scrollToItemDynamic, scrollToItemStatic, useDynamicVirtualizerMeasure, useIntersectionObserver, useMeasureList, useResizeObserverRef_unstable, useStaticVirtualizerMeasure } from "./virtualizer-hooks.js";
 export type { IndexedResizeCallbackElement, ResizeCallbackWithRef, ScrollToItemDynamicParams, ScrollToItemStaticParams, VirtualizerContextMeasureProps, VirtualizerMeasureDynamicProps, VirtualizerMeasureProps } from "./virtualizer-hooks.js";
 export { composeSharePointUIDesignThemes } from "./theme.js";
@@ -143,6 +148,12 @@ export type SharePointUIStrings = {
     close: string;
     dialogLabel?: string;
     richTextEditorLabel?: string;
+    richTextTextColor?: string;
+    richTextHighlightColor?: string;
+    richTextCustomColor?: string;
+    richTextThemeAccent?: string;
+    richTextFontFamily?: string;
+    richTextFontSize?: string;
     dismiss: string;
     notifications?: string;
     clear: string;
@@ -155,6 +166,15 @@ export type SharePointUIStrings = {
     invalidValue: string;
     moreInformation: string;
     people?: string;
+    presenceAvailable?: string;
+    presenceBusy?: string;
+    presenceDoNotDisturb?: string;
+    presenceAway?: string;
+    presenceOffline?: string;
+    presenceUnknown?: string;
+    presenceOutOfOffice?: string;
+    presenceBlocked?: string;
+    presenceOutOfOfficeLabel?: string;
     showMorePeople?: string;
     showFewerPeople?: string;
     navigationMenu?: string;
@@ -178,6 +198,9 @@ export type SharePointUIStrings = {
     dataGridSortPriority?: string;
     dataGridResizeLabel?: string;
     dataGridReorderLabel?: string;
+    dataGridReorderHint?: string;
+    dataGridLoadError?: string;
+    dataGridEditError?: string;
     dataGridEmptyGroupLabel?: string;
     dataGridExpandGroupLabel?: string;
     dataGridCollapseGroupLabel?: string;
@@ -219,6 +242,15 @@ export type SharePointUIStrings = {
     richTextBold: string;
     richTextItalic: string;
     richTextUnderline: string;
+    richTextStrike?: string;
+    richTextClearFormatting?: string;
+    richTextFormatBlock?: string;
+    richTextParagraph?: string;
+    richTextHeading1?: string;
+    richTextHeading2?: string;
+    richTextHeading3?: string;
+    richTextBlockquote?: string;
+    richTextPreformatted?: string;
     richTextBulletList: string;
     richTextNumberList: string;
     richTextLink: string;
@@ -269,6 +301,24 @@ export type SharePointUIStrings = {
     teachingPopoverPageLabel?: string;
     overflowDescription?: string;
     overflowMenuLabel?: string;
+} & {
+    richTextLinkDialog?: string;
+    richTextLinkNewTab?: string;
+    richTextLinkText?: string;
+    richTextLinkTitle?: string;
+    richTextLinkApply?: string;
+    richTextLinkRemove?: string;
+    richTextLinkCancel?: string;
+    richTextLinkInvalid?: string;
+    richTextLinkBrowse?: string;
+    richTextLinkBrowsing?: string;
+    richTextLinkPickerError?: string;
+    richTextSubscript?: string;
+    richTextSuperscript?: string;
+    richTextAlignLeft?: string;
+    richTextAlignCenter?: string;
+    richTextAlignRight?: string;
+    richTextAlignJustify?: string;
 };
 export type AvatarGroupContextValue = {
     size: number;
@@ -743,12 +793,13 @@ export declare function useOverflowMenu<TElement extends HTMLElement = HTMLEleme
     overflowCount: number;
     isOverflowing: boolean;
 };
-export declare function Overflow({ children, label, minimumVisible, overflowDirection, overflowAxis, hasHiddenItems, overflowContent, padding, onOverflowChange, onOverflowItemSelect, ...props }: ElementProps & {
+export declare function Overflow({ children, label, minimumVisible, overflowDirection, overflowAxis, density, hasHiddenItems, overflowContent, padding, onOverflowChange, onOverflowItemSelect, ...props }: ElementProps & {
     children?: React.ReactNode;
     label?: string;
     minimumVisible?: number;
     overflowDirection?: "start" | "end";
     overflowAxis?: OverflowAxis;
+    density?: OverflowDensity;
     hasHiddenItems?: boolean;
     overflowContent?: React.ReactNode;
     padding?: number;
@@ -997,22 +1048,38 @@ export declare const Drawer: React.ForwardRefExoticComponent<React.HTMLAttribute
 export declare function DrawerHeader({ children }: {
     children?: React.ReactNode;
 }): React.ReactElement;
-export declare function DrawerHeaderNavigation({ children, label, ...props }: ElementProps & {
+export type DrawerHeaderNavigationProps = ElementProps & {
     children?: React.ReactNode;
     label?: string;
-}): React.ReactElement;
+};
+export declare const DrawerHeaderNavigation: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    [attribute: `data-${string}`]: string | number | boolean | undefined;
+} & {
+    children?: React.ReactNode;
+    label?: string;
+} & React.RefAttributes<HTMLElement>>;
 export type DrawerHeaderTitleHeadingSlot = React.ReactElement<any> | Omit<React.HTMLAttributes<HTMLElement>, "children">;
 export declare function DrawerHeaderTitle({ children, action, heading, ...props }: ElementProps & {
     children?: React.ReactNode;
     action?: React.ReactNode;
     heading?: DrawerHeaderTitleHeadingSlot;
 }): React.ReactElement;
-export declare function DrawerBody({ children, ...props }: ElementProps & {
+export type DrawerBodyProps = ElementProps & {
     children?: React.ReactNode;
-}): React.ReactElement;
-export declare function DrawerFooter({ children, ...props }: ElementProps & {
+};
+export declare const DrawerBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    [attribute: `data-${string}`]: string | number | boolean | undefined;
+} & {
     children?: React.ReactNode;
-}): React.ReactElement;
+} & React.RefAttributes<HTMLDivElement>>;
+export type DrawerFooterProps = ElementProps & {
+    children?: React.ReactNode;
+};
+export declare const DrawerFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    [attribute: `data-${string}`]: string | number | boolean | undefined;
+} & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;
 export type InlineDrawerProps = ElementProps & {
     open?: boolean;
     title?: string;
@@ -1317,6 +1384,7 @@ export type ComboboxActiveOptionChangeData = {
 export type ComboBoxProps = NativeClickHostProps<HTMLInputElement> & {
     label?: string;
     selectedLabel?: string;
+    requiredMessage?: string;
     value?: string;
     defaultValue?: string;
     selectedValue?: string;
@@ -1359,6 +1427,7 @@ export declare const ComboBox: React.ForwardRefExoticComponent<Omit<ElementProps
 } & {
     label?: string;
     selectedLabel?: string;
+    requiredMessage?: string;
     value?: string;
     defaultValue?: string;
     selectedValue?: string;
@@ -1548,19 +1617,30 @@ export declare const OptionGroup: React.ForwardRefExoticComponent<React.HTMLAttr
     label?: string;
     children?: React.ReactNode;
 } & React.RefAttributes<HTMLElement>>;
+export type RichTextImageUploadErrorData = {
+    fileName: string;
+    error: unknown;
+};
+export type RichTextEditorContentMode = "plain" | "restricted" | "rich" | "html";
 export type RichTextEditorProps = NativeClickHostProps<HTMLDivElement> & {
     label?: string;
     editorLabel?: string;
     value?: string;
     defaultValue?: string;
     placeholder?: string;
+    field?: SharePointMultiLineField;
+    contentMode?: RichTextEditorContentMode;
+    allowHyperlink?: boolean;
     disabled?: boolean;
     readOnly?: boolean;
     required?: boolean;
     name?: string;
     form?: string;
-    onValueChange?: (html: string) => void;
-    onImageUpload?: (file: File) => Promise<string>;
+    onValueChange?: (value: string) => void;
+    onImageUpload?: RichTextEditorImageUploader;
+    onImageUploadError?: (data: RichTextImageUploadErrorData) => void;
+    linkPicker?: RichTextEditorLinkPicker;
+    onLinkPickerError?: (error: unknown) => void;
 };
 export declare const RichTextEditor: React.ForwardRefExoticComponent<Omit<ElementProps, "onClick" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & Pick<React.DOMAttributes<HTMLDivElement>, "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture"> & NativeMousePointerEventProps<HTMLDivElement> & NativeAdditionalEventProps<HTMLDivElement> & {
     onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;
@@ -1571,13 +1651,19 @@ export declare const RichTextEditor: React.ForwardRefExoticComponent<Omit<Elemen
     value?: string;
     defaultValue?: string;
     placeholder?: string;
+    field?: SharePointMultiLineField;
+    contentMode?: RichTextEditorContentMode;
+    allowHyperlink?: boolean;
     disabled?: boolean;
     readOnly?: boolean;
     required?: boolean;
     name?: string;
     form?: string;
-    onValueChange?: (html: string) => void;
-    onImageUpload?: (file: File) => Promise<string>;
+    onValueChange?: (value: string) => void;
+    onImageUpload?: RichTextEditorImageUploader;
+    onImageUploadError?: (data: RichTextImageUploadErrorData) => void;
+    linkPicker?: RichTextEditorLinkPicker;
+    onLinkPickerError?: (error: unknown) => void;
 } & React.RefAttributes<HTMLElement>>;
 export type BadgeProps = ElementProps & {
     children?: React.ReactNode;
@@ -1754,6 +1840,7 @@ export type TagPickerProps = Omit<ElementProps, "onChange"> & {
     children?: React.ReactNode;
     label?: string;
     selectedLabel?: string;
+    requiredMessage?: string;
     form?: string;
     disabled?: boolean;
     selectedOptions?: readonly string[];
@@ -1776,6 +1863,7 @@ export declare const TagPicker: React.ForwardRefExoticComponent<Omit<ElementProp
     children?: React.ReactNode;
     label?: string;
     selectedLabel?: string;
+    requiredMessage?: string;
     form?: string;
     disabled?: boolean;
     selectedOptions?: readonly string[];
@@ -1817,12 +1905,20 @@ export declare function TagPickerList({ children }: ElementProps & {
     children?: React.ReactNode;
     disableAutoFocus?: boolean;
 }): React.ReactElement;
-export declare function TagPickerButton({ children, appearance, size, disabled, ...props }: ElementProps & {
+export type TagPickerButtonProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "type"> & {
+    [attribute: `data-${string}`]: string | number | boolean | undefined;
     children?: React.ReactNode;
     appearance?: "filled-darker" | "filled-lighter" | "outline" | "underline";
     size?: "small" | "medium" | "large";
     disabled?: boolean;
-}): React.ReactElement;
+};
+export declare const TagPickerButton: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "type"> & {
+    [attribute: `data-${string}`]: string | number | boolean | undefined;
+    children?: React.ReactNode;
+    appearance?: "filled-darker" | "filled-lighter" | "outline" | "underline";
+    size?: "small" | "medium" | "large";
+    disabled?: boolean;
+} & React.RefAttributes<HTMLButtonElement>>;
 export declare const TagPickerOption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
     [attribute: `data-${string}`]: string | number | boolean | undefined;
 } & {
@@ -1860,6 +1956,7 @@ export type RatingProps = Omit<ElementProps, "onChange"> & {
     size?: "small" | "medium" | "large" | "extra-large";
     color?: "brand" | "marigold" | "neutral";
     label?: string;
+    requiredMessage?: string;
     itemLabel?: (rating: number) => string;
     iconFilled?: React.ElementType;
     iconOutline?: React.ElementType;
@@ -1880,6 +1977,7 @@ export declare const Rating: React.ForwardRefExoticComponent<Omit<ElementProps,
     size?: "small" | "medium" | "large" | "extra-large";
     color?: "brand" | "marigold" | "neutral";
     label?: string;
+    requiredMessage?: string;
     itemLabel?: (rating: number) => string;
     iconFilled?: React.ElementType;
     iconOutline?: React.ElementType;
@@ -1965,7 +2063,7 @@ export declare const CarouselNav: React.ForwardRefExoticComponent<React.HTMLAttr
 } & {
     children?: React.ReactNode;
     label?: string;
-    appearance?: "brand";
+    appearance?: "brand" | "thumbnails";
     slot?: string;
 } & React.RefAttributes<HTMLElement>>;
 export declare const CarouselNavButton: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
@@ -2172,6 +2270,7 @@ export declare const Nav: React.ForwardRefExoticComponent<Omit<ElementProps, "on
     defaultOpen?: boolean;
     collapsed?: boolean;
     defaultCollapsed?: boolean;
+    fullWidth?: boolean;
     collapsible?: boolean;
     multiple?: boolean;
     density?: "small" | "medium" | "large";
@@ -3048,7 +3147,7 @@ export type DataGridColumnResizeData = {
 };
 export type DataGridColumnResizeEvent = MouseEvent | KeyboardEvent | TouchEvent | undefined;
 export type DataGridSelectionChangeEvent = React.MouseEvent | React.KeyboardEvent;
-declare function VirtualDataGrid<T>({ items, dataSource, onDataLoadError, onDataSourceGroupToggle, columns, getRowId, label: labelProp, height, rowHeight, getRowHeight, overscan, virtualize, virtualizeColumns, focusMode, subtleSelection, selectionAppearance, selectionMode, selectedKeys, defaultSelectedKeys, selectionModel, defaultSelectionModel, onDataSourceSelectionChange, onSelectionChange, sort, defaultSort, onSortChange, multiSort, defaultMultiSort, onMultiSortChange, sortPriorityLabel: sortPriorityLabelProp, filterable, filterValue, defaultFilterValue, onFilterValueChange, filterLabel: filterLabelProp, renderCell, onCellEdit, onCellsEdit, validateCellEdit, rowLabel: rowLabelProp, editHint: editHintProp, emptyMessage: emptyMessageProp, loadingLabel: loadingLabelProp, selectLabel: selectLabelProp, selectAllLabel: selectAllLabelProp, resizableColumns, columnWidths, defaultColumnWidths, columnSizingOptions, resizableColumnsOptions, containerWidthOffset, onColumnResize, resizeLabel: resizeLabelProp, reorderableColumns, columnOrder, defaultColumnOrder, onColumnOrderChange, reorderLabel: reorderLabelProp, groupBy, collapsedGroupKeys, defaultCollapsedGroupKeys, onCollapsedGroupKeysChange, emptyGroupLabel: emptyGroupLabelProp, expandGroupLabel: expandGroupLabelProp, collapseGroupLabel: collapseGroupLabelProp, onRenderedRange, ...props }: ElementProps & {
+declare function VirtualDataGrid<T>({ items, dataSource, onDataLoadError, onDataSourceGroupToggle, columns, getRowId, label: labelProp, height, rowHeight, getRowHeight, overscan, virtualize, virtualizeColumns, focusMode, subtleSelection, selectionAppearance, selectionMode, selectedKeys, defaultSelectedKeys, selectionModel, defaultSelectionModel, onDataSourceSelectionChange, onSelectionChange, sort, defaultSort, onSortChange, multiSort, defaultMultiSort, onMultiSortChange, sortPriorityLabel: sortPriorityLabelProp, filterable, filterValue, defaultFilterValue, onFilterValueChange, filterLabel: filterLabelProp, renderCell, onCellEdit, onCellEditError, onCellsEdit, validateCellEdit, rowLabel: rowLabelProp, editHint: editHintProp, emptyMessage: emptyMessageProp, loadingLabel: loadingLabelProp, selectLabel: selectLabelProp, selectAllLabel: selectAllLabelProp, resizableColumns, columnWidths, defaultColumnWidths, columnSizingOptions, resizableColumnsOptions, containerWidthOffset, onColumnResize, resizeLabel: resizeLabelProp, reorderableColumns, columnOrder, defaultColumnOrder, onColumnOrderChange, reorderLabel: reorderLabelProp, groupBy, collapsedGroupKeys, defaultCollapsedGroupKeys, onCollapsedGroupKeysChange, emptyGroupLabel: emptyGroupLabelProp, expandGroupLabel: expandGroupLabelProp, collapseGroupLabel: collapseGroupLabelProp, onRenderedRange, ...props }: ElementProps & {
     items?: T[];
     dataSource?: DataGridDataSource<T>;
     onDataLoadError?: (error: unknown, range: {
@@ -3089,6 +3188,7 @@ declare function VirtualDataGrid<T>({ items, dataSource, onDataLoadError, onData
     filterLabel?: string;
     renderCell?: (item: T, column: DataGridColumn<T>, rowIndex: number) => React.ReactNode;
     onCellEdit?: (edit: DataGridCellEdit<T>) => void | Promise<void>;
+    onCellEditError?: (error: DataGridCellEditError<T>) => void;
     onCellsEdit?: (edits: readonly DataGridCellEdit<T>[]) => void | Promise<void>;
     validateCellEdit?: (edit: DataGridCellEdit<T>) => string | undefined;
     rowLabel?: string;
@@ -3182,6 +3282,7 @@ export type DataGridCompositionContextValue<T> = {
     rowLabel: string;
     editedCells: Record<string, DataGridEditValue>;
     onCellEdit?: (edit: DataGridCellEdit<T>) => void | Promise<void>;
+    onCellEditError?: (error: DataGridCellEditError<T>) => void;
     validateCellEdit?: (edit: DataGridCellEdit<T>) => string | undefined;
     setEditedCell: (key: string, value: DataGridEditValue) => void;
 };
@@ -3269,6 +3370,7 @@ export type DataGridCompositionProps<T> = Omit<ElementProps, "children"> & {
     onColumnOrderChange?: (columnIds: string[]) => void;
     reorderLabel?: string;
     onCellEdit?: (edit: DataGridCellEdit<T>) => void | Promise<void>;
+    onCellEditError?: (error: DataGridCellEditError<T>) => void;
     validateCellEdit?: (edit: DataGridCellEdit<T>) => string | undefined;
     rowLabel?: string;
     editHint?: string;
@@ -3548,7 +3650,20 @@ export type FieldProps = ElementProps & {
     size?: LabelSize;
 };
 /** Pair one form control with a theme-aware label, hint, and validation message. */
-export declare function Field({ children, label, hint, validationMessage, validationMessageIcon, validationState, required, disabled, orientation, size, className, style, ...props }: FieldProps): React.ReactElement;
+export declare const Field: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    [attribute: `data-${string}`]: string | number | boolean | undefined;
+} & {
+    children?: React.ReactNode | ((props: FieldControlProps) => React.ReactNode);
+    label?: React.ReactNode;
+    hint?: React.ReactNode;
+    validationMessage?: React.ReactNode;
+    validationMessageIcon?: React.ReactNode;
+    validationState?: FieldValidationState;
+    required?: boolean;
+    disabled?: boolean;
+    orientation?: FieldOrientation;
+    size?: LabelSize;
+} & React.RefAttributes<HTMLDivElement>>;
 export type InputProps = Omit<NativeClickHostProps<HTMLInputElement>, "children" | "onChange" | "defaultValue" | "defaultChecked"> & {
     children?: never;
     type?: InputType;
@@ -3857,6 +3972,35 @@ export type SwatchPickerOnSelectionChangeData = (SwatchPickerSelection & {
     type: "click";
     selectedSwatch: string;
 });
+export type SavedSwatchPalette = {
+    id: string;
+    name: string;
+    colors: readonly {
+        value: string;
+        color: string;
+        label?: string;
+    }[];
+};
+export type SwatchPaletteStore = {
+    list: () => Promise<readonly SavedSwatchPalette[]>;
+    save: (palette: SavedSwatchPalette) => Promise<void>;
+    remove: (id: string) => Promise<void>;
+};
+/** Load and persist a user's compact command-shelf choice in this browser. Use a site/app-scoped key. */
+export declare function useStoredOverflowCompactMode(storageKey: string, defaultCompact?: boolean): {
+    compact: boolean;
+    ready: boolean;
+    setCompact: (compact: boolean) => void;
+    toggleCompact: () => void;
+};
+export declare function useSavedSwatchPalettes(store: SwatchPaletteStore): {
+    palettes: readonly SavedSwatchPalette[];
+    loading: boolean;
+    error: unknown;
+    reload: () => Promise<readonly SavedSwatchPalette[]>;
+    save: (palette: SavedSwatchPalette) => Promise<void>;
+    remove: (id: string) => Promise<void>;
+};
 export type SwatchPickerProps = ElementProps & {
     selectedValue?: string;
     defaultSelectedValue?: string;
@@ -3902,6 +4046,11 @@ export declare const ColorSwatch: React.ForwardRefExoticComponent<React.HTMLAttr
     disabledIcon?: React.ReactNode;
     children?: React.ReactNode;
 } & React.RefAttributes<HTMLElement>>;
+export type SharePointThemeSwatchesProps = {
+    palette?: Readonly<Record<string, string | undefined>>;
+    labelForColor?: (paletteKey: string) => string;
+};
+export declare function SharePointThemeSwatches({ palette, labelForColor }: SharePointThemeSwatchesProps): React.ReactElement;
 export declare const ImageSwatch: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
     [attribute: `data-${string}`]: string | number | boolean | undefined;
 } & {
@@ -4544,3 +4693,23 @@ export declare const AccordionPanel: React.ForwardRefExoticComponent<React.HTMLA
     children?: React.ReactNode;
     collapseMotion?: React.ComponentType<PresenceMotionSlotProps>;
 } & React.RefAttributes<HTMLElement>>;
+export type SharePointFieldOption = {
+    value: string | number;
+    label: string;
+    disabled?: boolean;
+};
+export type SharePointFieldProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "defaultValue" | "onChange"> & {
+    field: SharePointFieldMetadata;
+    value?: SharePointFieldValue;
+    defaultValue?: SharePointFieldValue;
+    options?: readonly SharePointFieldOption[];
+    onValueChange?: (value: SharePointFieldValue) => void;
+    disabled?: boolean;
+    hint?: React.ReactNode;
+    validationMessage?: React.ReactNode;
+    renderUnsupported?: (field: SharePointFieldMetadata, reason: string) => React.ReactNode;
+    addChoiceLabel?: string;
+    emptyOptionLabel?: string;
+};
+/** Render a SharePoint field recipe using the library's matching form control. */
+export declare function SharePointField({ field, value, defaultValue, options: providedOptions, onValueChange, disabled, hint, validationMessage, renderUnsupported, addChoiceLabel, emptyOptionLabel, className, style, ...hostProps }: SharePointFieldProps): React.ReactElement | null;