@persona/design-system 0.8.0 → 0.8.1

package/dist/{TableBoxCell-DzYMx4Ju.d.mts → TableBoxCell-BRhGeUnO.d.mts}

@@ -1,8 +1,8 @@
-import { o as ComboboxOptionsOrGroups } from "./ComboboxBase-BMCY6O7Y.mjs";
-import { a as TableCellProps, i as TableCell } from "./TableCell-CGPQRc5g.mjs";
-import { r as TableBoxRowProps } from "./TableBoxRow-B4rFCvWK.mjs";
-import { n as ReorderConfig, t as DragDirection } from "./useTableBoxDragAndDrop-Da4TiYBT.mjs";
-import { t as RowAction } from "./TableBoxRowActions-qMKcVuTL.mjs";
+import { o as ComboboxOptionsOrGroups } from "./ComboboxBase-CtNrsPO9.mjs";
+import { a as TableCellProps, i as TableCell } from "./TableCell-D5Sqb6iO.mjs";
+import { r as TableBoxRowProps } from "./TableBoxRow-DZzRYoID.mjs";
+import { n as ReorderConfig, t as DragDirection } from "./useTableBoxDragAndDrop-wjc_LCpC.mjs";
+import { t as RowAction } from "./TableBoxRowActions-4-j3flJq.mjs";
 import * as _$react from "react";
 import { ComponentPropsWithoutRef, PropsWithChildren } from "react";
 import * as _$styled_components0 from "styled-components";
@@ -273,4 +273,4 @@ declare const TableBoxCell: ({
 }: TableBoxCellProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { TableBox as a, PinnedActionsCell as i, TableBoxCellProps as n, TableBoxContext as o, InlineEditConfig as r, TableBoxProps as s, TableBoxCell as t };
-//# sourceMappingURL=TableBoxCell-DzYMx4Ju.d.mts.map
+//# sourceMappingURL=TableBoxCell-BRhGeUnO.d.mts.map

package/dist/TableBoxCell.d.mts

@@ -1,2 +1,2 @@
-import { n as TableBoxCellProps, t as TableBoxCell } from "./TableBoxCell-DzYMx4Ju.mjs";
+import { n as TableBoxCellProps, t as TableBoxCell } from "./TableBoxCell-BRhGeUnO.mjs";
 export { TableBoxCellProps, TableBoxCell as default };

package/dist/TableBoxField-Cq9M1upV.d.mts

@@ -0,0 +1,103 @@
+import { l as MenuItemProps } from "./Menu-CUN9bmc1.mjs";
+import { o as ImplementsFormField } from "./inputFields-BVDurw3L.mjs";
+import { r as TableBoxRowProps } from "./TableBoxRow-DZzRYoID.mjs";
+import { n as TableBoxCellProps, s as TableBoxProps } from "./TableBoxCell-BRhGeUnO.mjs";
+import { MouseEvent, ReactNode } from "react";
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region components/FormField/TableBoxField.d.ts
+interface TableBoxFieldAction extends Omit<MenuItemProps, 'children'> {
+  label: string;
+  onClick: (selectedKey: TableBoxProps['selectedKey']) => void;
+}
+interface TableBoxFieldActionGroup {
+  type: 'group';
+  heading: string;
+  actions: TableBoxFieldAction[];
+}
+type TableBoxFieldActionEntry = TableBoxFieldAction | TableBoxFieldActionGroup;
+/** Aria-label on TableBoxField's + button. Consumers that style or detect that
+ *  button (e.g. popover toggle guards) should import this rather than redefining it. */
+declare const TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL = "Add item to table";
+interface AddDropdownConfig {
+  options: Array<{
+    label: string;
+    value: string;
+  }>;
+  onSelection: (value: string) => void;
+}
+interface TableBoxFieldProps<T extends object = object> extends ImplementsFormField, Omit<TableBoxProps<T>, 'aria-label' | 'onCreateNewRow'> {
+  onAdd?: (e: MouseEvent<HTMLButtonElement>) => void;
+  onDelete?: (selectedKey: string | null) => void;
+  deleteDisabled?: boolean;
+  /** Actions and labeled action groups rendered in order. Empty groups are omitted. */
+  actions?: TableBoxFieldActionEntry[];
+  addDropdownConfig?: AddDropdownConfig;
+  /**
+   * Callback to create a new row and add it to the rows array
+   * Should return the id of the newly created row
+   */
+  createNewRow?: () => string;
+  children?: ReactNode;
+}
+declare const TableBoxField: {
+  <T extends object = object>({
+    label,
+    helperText,
+    errorText,
+    warningText,
+    labelProps: labelPropsProp,
+    helperProps,
+    errorProps,
+    warningProps,
+    inputId,
+    required,
+    onAdd,
+    onDelete,
+    deleteDisabled,
+    configField: configFieldProp,
+    actions,
+    addDropdownConfig,
+    selectedKey: selectedKeyProp,
+    onSelectionChange,
+    defaultSelectedKey,
+    selectionMode,
+    disabled,
+    createNewRow,
+    children,
+    emptyText,
+    ...props
+  }: TableBoxFieldProps<T>): _$react_jsx_runtime0.JSX.Element;
+  Row: ({
+    children,
+    actions,
+    onDelete,
+    errorText,
+    id,
+    dropdownFormFields,
+    dropdownContent,
+    dropdownHeadingText,
+    dropdownFooter,
+    onBlur,
+    onFocus,
+    ...props
+  }: TableBoxRowProps) => _$react_jsx_runtime0.JSX.Element;
+  Cell: ({
+    children,
+    itemId,
+    value,
+    columnKey,
+    errorText,
+    isLastCell,
+    actions,
+    onDelete,
+    inlineEditConfigOverride,
+    rowErrorText,
+    onBlur,
+    onFocus,
+    ...props
+  }: TableBoxCellProps) => _$react_jsx_runtime0.JSX.Element;
+};
+//#endregion
+export { TableBoxFieldActionGroup as a, TableBoxFieldActionEntry as i, TableBoxField as n, TableBoxFieldAction as r, TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL as t };
+//# sourceMappingURL=TableBoxField-Cq9M1upV.d.mts.map

package/dist/TableBoxField.d.mts

@@ -1,103 +1,2 @@
-import { l as MenuItemProps } from "./Menu-BekLwm8w.mjs";
-import { ImplementsFormField } from "./inputFields.mjs";
-import { r as TableBoxRowProps } from "./TableBoxRow-B4rFCvWK.mjs";
-import { n as TableBoxCellProps, s as TableBoxProps } from "./TableBoxCell-DzYMx4Ju.mjs";
-import { MouseEvent, ReactNode } from "react";
-import * as _$react_jsx_runtime0 from "react/jsx-runtime";
-
-//#region components/FormField/TableBoxField.d.ts
-interface TableBoxFieldAction extends Omit<MenuItemProps, 'children'> {
-  label: string;
-  onClick: (selectedKey: TableBoxProps['selectedKey']) => void;
-}
-interface TableBoxFieldActionGroup {
-  type: 'group';
-  heading: string;
-  actions: TableBoxFieldAction[];
-}
-type TableBoxFieldActionEntry = TableBoxFieldAction | TableBoxFieldActionGroup;
-/** Aria-label on TableBoxField's + button. Consumers that style or detect that
- *  button (e.g. popover toggle guards) should import this rather than redefining it. */
-declare const TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL = "Add item to table";
-interface AddDropdownConfig {
-  options: Array<{
-    label: string;
-    value: string;
-  }>;
-  onSelection: (value: string) => void;
-}
-interface TableBoxFieldProps<T extends object = object> extends ImplementsFormField, Omit<TableBoxProps<T>, 'aria-label' | 'onCreateNewRow'> {
-  onAdd?: (e: MouseEvent<HTMLButtonElement>) => void;
-  onDelete?: (selectedKey: string | null) => void;
-  deleteDisabled?: boolean;
-  /** Actions and labeled action groups rendered in order. Empty groups are omitted. */
-  actions?: TableBoxFieldActionEntry[];
-  addDropdownConfig?: AddDropdownConfig;
-  /**
-   * Callback to create a new row and add it to the rows array
-   * Should return the id of the newly created row
-   */
-  createNewRow?: () => string;
-  children?: ReactNode;
-}
-declare const TableBoxField: {
-  <T extends object = object>({
-    label,
-    helperText,
-    errorText,
-    warningText,
-    labelProps: labelPropsProp,
-    helperProps,
-    errorProps,
-    warningProps,
-    inputId,
-    required,
-    onAdd,
-    onDelete,
-    deleteDisabled,
-    configField: configFieldProp,
-    actions,
-    addDropdownConfig,
-    selectedKey: selectedKeyProp,
-    onSelectionChange,
-    defaultSelectedKey,
-    selectionMode,
-    disabled,
-    createNewRow,
-    children,
-    emptyText,
-    ...props
-  }: TableBoxFieldProps<T>): _$react_jsx_runtime0.JSX.Element;
-  Row: ({
-    children,
-    actions,
-    onDelete,
-    errorText,
-    id,
-    dropdownFormFields,
-    dropdownContent,
-    dropdownHeadingText,
-    dropdownFooter,
-    onBlur,
-    onFocus,
-    ...props
-  }: TableBoxRowProps) => _$react_jsx_runtime0.JSX.Element;
-  Cell: ({
-    children,
-    itemId,
-    value,
-    columnKey,
-    errorText,
-    isLastCell,
-    actions,
-    onDelete,
-    inlineEditConfigOverride,
-    rowErrorText,
-    onBlur,
-    onFocus,
-    ...props
-  }: TableBoxCellProps) => _$react_jsx_runtime0.JSX.Element;
-};
-//#endregion
-export { TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL, TableBoxFieldAction, TableBoxFieldActionEntry, TableBoxFieldActionGroup, TableBoxField as default };
-//# sourceMappingURL=TableBoxField.d.mts.map
+import { a as TableBoxFieldActionGroup, i as TableBoxFieldActionEntry, n as TableBoxField, r as TableBoxFieldAction, t as TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL } from "./TableBoxField-Cq9M1upV.mjs";
+export { TABLE_BOX_FIELD_ADD_BUTTON_ARIA_LABEL, TableBoxFieldAction, TableBoxFieldActionEntry, TableBoxFieldActionGroup, TableBoxField as default };

package/dist/{TableBoxRow-B4rFCvWK.d.mts → TableBoxRow-DZzRYoID.d.mts}

@@ -1,5 +1,5 @@
-import { l as MenuItemProps } from "./Menu-BekLwm8w.mjs";
-import { t as TableRow } from "./TableRow-BJZM8I8i.mjs";
+import { l as MenuItemProps } from "./Menu-CUN9bmc1.mjs";
+import { t as TableRow } from "./TableRow-Cy1y7b9S.mjs";
 import { ComponentPropsWithoutRef, ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -83,4 +83,4 @@ declare const TableBoxRowOverlay: ({
 }) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { TableBoxRowOverlay as n, TableBoxRowProps as r, TableBoxRow as t };
-//# sourceMappingURL=TableBoxRow-B4rFCvWK.d.mts.map
+//# sourceMappingURL=TableBoxRow-DZzRYoID.d.mts.map

package/dist/TableBoxRow.d.mts

@@ -1,2 +1,2 @@
-import { n as TableBoxRowOverlay, r as TableBoxRowProps, t as TableBoxRow } from "./TableBoxRow-B4rFCvWK.mjs";
+import { n as TableBoxRowOverlay, r as TableBoxRowProps, t as TableBoxRow } from "./TableBoxRow-DZzRYoID.mjs";
 export { TableBoxRowOverlay, TableBoxRowProps, TableBoxRow as default };

package/dist/{TableBoxRowActions-qMKcVuTL.d.mts → TableBoxRowActions-4-j3flJq.d.mts}

@@ -1,4 +1,4 @@
-import { l as MenuItemProps } from "./Menu-BekLwm8w.mjs";
+import { l as MenuItemProps } from "./Menu-CUN9bmc1.mjs";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -54,4 +54,4 @@ declare const RowActions: ({
 }: RowActionsProps) => _$react_jsx_runtime0.JSX.Element | null;
 //#endregion
 export { RowActionsContainerWithFadeWidth as i, RowActions as n, RowActionsContainer as r, RowAction as t };
-//# sourceMappingURL=TableBoxRowActions-qMKcVuTL.d.mts.map
+//# sourceMappingURL=TableBoxRowActions-4-j3flJq.d.mts.map

package/dist/TableBoxRowActions.d.mts

@@ -1,2 +1,2 @@
-import { i as RowActionsContainerWithFadeWidth, n as RowActions, r as RowActionsContainer, t as RowAction } from "./TableBoxRowActions-qMKcVuTL.mjs";
+import { i as RowActionsContainerWithFadeWidth, n as RowActions, r as RowActionsContainer, t as RowAction } from "./TableBoxRowActions-4-j3flJq.mjs";
 export { RowAction, RowActions, RowActionsContainer, RowActionsContainerWithFadeWidth };

package/dist/{TableCell-CGPQRc5g.d.mts → TableCell-D5Sqb6iO.d.mts}

@@ -1,4 +1,4 @@
-import { n as TableRowProps } from "./TableRow-BJZM8I8i.mjs";
+import { n as TableRowProps } from "./TableRow-Cy1y7b9S.mjs";
 import { ComponentPropsWithoutRef, ReactNode } from "react";
 import * as _$styled_components0 from "styled-components";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
@@ -51,4 +51,4 @@ declare const TableTR: _$styled_components0.StyledComponent<"tr", any, {
 }, "role">;
 //#endregion
 export { TableCellProps as a, TableTD as c, TableCell as i, TableTR as l, StickyTH as n, TableCellTitle as o, TableActionTD as r, TableIconTD as s, StickyTD as t };
-//# sourceMappingURL=TableCell-CGPQRc5g.d.mts.map
+//# sourceMappingURL=TableCell-D5Sqb6iO.d.mts.map

package/dist/TableCell.d.mts

@@ -1,2 +1,2 @@
-import { a as TableCellProps, c as TableTD, i as TableCell, l as TableTR, n as StickyTH, o as TableCellTitle, r as TableActionTD, s as TableIconTD, t as StickyTD } from "./TableCell-CGPQRc5g.mjs";
+import { a as TableCellProps, c as TableTD, i as TableCell, l as TableTR, n as StickyTH, o as TableCellTitle, r as TableActionTD, s as TableIconTD, t as StickyTD } from "./TableCell-D5Sqb6iO.mjs";
 export { StickyTD, StickyTH, TableActionTD, TableCellProps, TableCellTitle, TableIconTD, TableTD, TableTR, TableCell as default };

package/dist/{TableControls-WP78qtET.d.mts → TableControls-B-LakH-8.d.mts}

@@ -1,5 +1,5 @@
-import { n as ControlBarProps } from "./ControlBar-Cegjxa6-.mjs";
-import { i as TableViewConfigurationProps } from "./TableViewConfigurationDropdown-Dwy_9FBz.mjs";
+import { n as ControlBarProps } from "./ControlBar-BJUY6GOX.mjs";
+import { i as TableViewConfigurationProps } from "./TableViewConfigurationDropdown-BzygLtGm.mjs";
 import { ReactNode } from "react";
 import * as _$react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -65,4 +65,4 @@ declare const TableControls: ({
 }: TableControlsProps) => _$react_jsx_runtime0.JSX.Element;
 //#endregion
 export { TableControlsProps as n, TableControls as t };
-//# sourceMappingURL=TableControls-WP78qtET.d.mts.map
+//# sourceMappingURL=TableControls-B-LakH-8.d.mts.map

package/dist/{TableControls-RS_ozBsI.mjs → TableControls-CqW_nyBY.mjs}

@@ -14,20 +14,21 @@ import { useScrollOverflow } from "./lib/useScrollOverflow.mjs";
 import { Z_INDICES } from "./lib/zindex.mjs";
 import { focusOutline, focusWithinOutline } from "./mixins/focus.mjs";
 import { semanticScrollbar } from "./mixins/scrollbar.mjs";
-import { n as Stack, t as HStack } from "./Stack-Bkn0TUDe.mjs";
-import { n as Button, t as IconButton } from "./IconButton-CCLMYWVN.mjs";
-import { i as TabBar, n as StyledTab, r as Tab } from "./TabBar-Bj84q1Mr.mjs";
-import { r as InputGroup } from "./Input-Cl4o41k4.mjs";
+import { n as Stack, t as HStack } from "./Stack-CEPzs4Pb.mjs";
+import { n as Button, t as IconButton } from "./IconButton-BHFCjvzs.mjs";
+import { i as TabBar, n as StyledTab, r as Tab } from "./TabBar-BSl5v5aa.mjs";
+import { r as InputGroup } from "./Input-BQN97Hzm.mjs";
 import Input_default from "./components/Input/index.mjs";
-import { c as MenuList, s as MenuItem } from "./Menu-CwlI7BMN.mjs";
-import { n as DropdownMenu_default } from "./DropdownMenu-rm9Nnxn7.mjs";
-import { t as Combobox } from "./Combobox-C_kCY3P3.mjs";
-import { s as Popover_default } from "./Popover-ZAj03lws.mjs";
-import { t as Toggle } from "./Toggle-D4ZaUcVt.mjs";
-import { i as selectedPresetFor, n as parseDateFilterValue, r as resolveDateFilterValue, t as formatDateFilterValue } from "./date-filter-BnzR6NxT.mjs";
-import { t as ListBox } from "./ListBox-sqeLBiKS.mjs";
-import { m as FormField, o as ComboboxField } from "./FormField-Crp3F-hv.mjs";
-import { r as DatePicker, t as DateRangePicker } from "./DatePicker-C7z1yodK.mjs";
+import { c as MenuList, s as MenuItem } from "./Menu-DjW2b3Wk.mjs";
+import { n as DropdownMenu_default } from "./DropdownMenu-j8NWbAvM.mjs";
+import { t as Combobox } from "./Combobox-CCDoNF9Y.mjs";
+import { s as Popover_default } from "./Popover-CbYaWrAy.mjs";
+import { i as Modal_default } from "./Modal-DHLPK65-.mjs";
+import { t as Toggle } from "./Toggle-CntyMUPJ.mjs";
+import { i as selectedPresetFor, n as parseDateFilterValue, r as resolveDateFilterValue, t as formatDateFilterValue } from "./date-filter-D6IfCkwp.mjs";
+import { t as ListBox } from "./ListBox-DOqN9DNl.mjs";
+import { m as FormField, o as ComboboxField } from "./FormField-DbcqNcx2.mjs";
+import { r as DatePicker, t as DateRangePicker } from "./DatePicker-LPIJrc0n.mjs";
 import { BorderRadius, Color, Spacing, Typography } from "@persona/design-tokens";
 import { Fragment, createContext, createElement, forwardRef, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -348,7 +349,7 @@ const TabOverflowContainer = styled.div`
   position: absolute;
   height: 32px;
 `;
-const SavedViewTab = ({ view, selected, tabIdPrefix = TAB_ID_PREFIX, canEditViews, handleNameChange, onDuplicateView, onDeleteView, onSelectView, onResetCurrentView, onSaveView, onSetDefaultView, isViewDirty, showTabContextMenu, setShowTabContextMenu, className, ...rest }) => {
+const SavedViewTab = ({ view, selected, tabIdPrefix = TAB_ID_PREFIX, canEditViews, handleNameChange, onDuplicateView, onRequestDeleteView, onSelectView, onResetCurrentView, onSaveView, onSetDefaultView, isViewDirty, showTabContextMenu, setShowTabContextMenu, className, ...rest }) => {
 	const inputRef = useRef(null);
 	const lastSubmittedNameRef = useRef(null);
 	const submitNameChange = (newName) => {
@@ -437,12 +438,12 @@ const SavedViewTab = ({ view, selected, tabIdPrefix = TAB_ID_PREFIX, canEditView
 						onKeyDown: enterProxiesClick,
 						children: view.isDefault ? "Already the default" : "Set as default"
 					}),
-					onDeleteView && /* @__PURE__ */ jsx(MenuItem, {
+					onRequestDeleteView && /* @__PURE__ */ jsx(MenuItem, {
 						id: "table-controls__view__menu-delete",
 						prefixIcon: /* @__PURE__ */ jsx(TrashIcon, {}),
-						onClick: async () => {
-							await onDeleteView(view.id);
+						onClick: () => {
 							setShowTabContextMenu(false);
+							onRequestDeleteView(view);
 						},
 						onKeyDown: enterProxiesClick,
 						children: "Delete"
@@ -554,9 +555,17 @@ const ControlBar = ({ presetViews, currentView, onSelectView, views, onAddView,
 	const tabOverflowRef = useRef(null);
 	const [hiddenViews, setHiddenViews] = useState([]);
 	const [showTabContextMenu, setShowTabContextMenu] = useState(false);
+	const [pendingDeleteView, setPendingDeleteView] = useState(null);
+	const previousPendingDeleteViewRef = useRef(null);
+	const [isDeletingView, setIsDeletingView] = useState(false);
 	const [isAddingView, setIsAddingView] = useState(false);
 	const [lastVisibleViewElement, setLastVisibleViewElement] = useState(null);
 	const [tabOverflowWidth, setTabOverflowWidth] = useState(null);
+	useEffect(() => {
+		const previousPendingDeleteView = previousPendingDeleteViewRef.current;
+		if (!pendingDeleteView && previousPendingDeleteView) (document.getElementById(`${OVERFLOW_TAB_ID_PREFIX}${previousPendingDeleteView.id}`) ?? document.getElementById(`${TAB_ID_PREFIX}${previousPendingDeleteView.id}`))?.focus();
+		previousPendingDeleteViewRef.current = pendingDeleteView;
+	}, [pendingDeleteView]);
 	const onResize = useCallback(() => {
 		if (!tabListRef.current) return;
 		const containerRect = tabListRef.current.getBoundingClientRect();
@@ -615,6 +624,17 @@ const ControlBar = ({ presetViews, currentView, onSelectView, views, onAddView,
 	const handleNameChange = (view, newName) => {
 		if (canEditViews && view.name !== newName) onViewNameChange?.(view.id, newName);
 	};
+	const onRequestDeleteView = onDeleteView ? (view) => setPendingDeleteView(view) : void 0;
+	const confirmDeleteView = async () => {
+		if (!pendingDeleteView || !onDeleteView) return;
+		setIsDeletingView(true);
+		try {
+			await onDeleteView(pendingDeleteView.id);
+			setPendingDeleteView(null);
+		} catch {} finally {
+			setIsDeletingView(false);
+		}
+	};
 	if (compact) return /* @__PURE__ */ jsx(CompactBar, {
 		"data-tour-target": dataTourTarget,
 		title,
@@ -708,7 +728,7 @@ const ControlBar = ({ presetViews, currentView, onSelectView, views, onAddView,
 						canEditViews: canEditViews ?? false,
 						handleNameChange,
 						onDuplicateView,
-						onDeleteView,
+						onRequestDeleteView,
 						onSelectView,
 						onResetCurrentView,
 						onSaveView,
@@ -737,7 +757,7 @@ const ControlBar = ({ presetViews, currentView, onSelectView, views, onAddView,
 					handleAddView: onAddView ? handleAddView : null,
 					handleNameChange,
 					onDuplicateView,
-					onDeleteView,
+					onRequestDeleteView,
 					onResetCurrentView,
 					onSaveView,
 					onSetDefaultView,
@@ -777,7 +797,35 @@ const ControlBar = ({ presetViews, currentView, onSelectView, views, onAddView,
 				propertiesButton
 			]
 		}),
-		showFilters && filterPanel
+		showFilters && filterPanel,
+		/* @__PURE__ */ jsx(Modal_default, {
+			open: pendingDeleteView != null,
+			onOpenChange: (open) => {
+				if (!open && !isDeletingView) setPendingDeleteView(null);
+			},
+			isKeyboardDismissDisabled: isDeletingView,
+			contentProps: isDeletingView ? { showCloseButton: false } : void 0,
+			title: "Delete view?",
+			footer: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
+				variant: "basic",
+				width: "auto",
+				disabled: isDeletingView,
+				onClick: () => setPendingDeleteView(null),
+				children: "Cancel"
+			}), /* @__PURE__ */ jsx(Button, {
+				id: "table-controls__view__delete-confirm",
+				variant: "danger",
+				width: "auto",
+				isPending: isDeletingView,
+				onClick: confirmDeleteView,
+				children: "Delete"
+			})] }),
+			children: /* @__PURE__ */ jsxs(Paragraph, { children: [
+				"This will permanently delete “",
+				pendingDeleteView?.name,
+				"”. This action cannot be undone."
+			] })
+		})
 	] });
 };
 //#endregion
@@ -1304,6 +1352,14 @@ function isValuelessOperator(operator) {
 function carriesDateRange(operator, fieldType) {
 	return isRangeOperator(operator) || fieldType === "date_range";
 }
+/**
+* Whether a rule's value control edits minute-precision date-times: the bar
+* and field both opt in, and the value is a range or a before/after instant
+* (`date` + `is` stays a whole calendar day).
+*/
+function isMinutePrecisionDate(field, operator, dateTimesEnabled) {
+	return dateTimesEnabled && field.timeGranularity === "minute" && (field.type === "date_range" || field.type === "date" && operator !== "is");
+}
 function isRangeOperator(operator) {
 	return RANGE_OPERATORS.has(operator);
 }
@@ -1604,7 +1660,8 @@ const StatementFields = styled.div`
     background: transparent;
   }
 `;
-function RuleEditorFields({ registry, field, groupIndex, ruleIndex, rule, size, operators, operatorConfigurable, onFieldChange, onOperatorChange, onValueChange, renderValueControl }) {
+function RuleEditorFields({ registry, dateTimesEnabled, field, groupIndex, ruleIndex, rule, size, operators, operatorConfigurable, onFieldChange, onOperatorChange, onValueChange, renderValueControl }) {
+	const minutePrecisionValue = field != null && isMinutePrecisionDate(field, rule.operator, dateTimesEnabled);
 	const fieldOptions = useMemo(() => buildFieldPickerOptions(registry), [registry]);
 	return /* @__PURE__ */ jsxs(StatementFields, { children: [
 		/* @__PURE__ */ jsx(ComboboxField, {
@@ -1648,13 +1705,14 @@ function RuleEditorFields({ registry, field, groupIndex, ruleIndex, rule, size,
 		field && !isValuelessOperator(rule.operator) ? /* @__PURE__ */ jsx(FormField, {
 			label: "Value",
 			labelProps: { size },
+			configField: minutePrecisionValue ? false : void 0,
 			children: /* @__PURE__ */ jsx(Fragment$1, { children: renderValueControl(field, rule.operator, rule.value, (next, relativeDate) => onValueChange(groupIndex, ruleIndex, next, relativeDate), rule.relativeDate) })
 		}) : null
 	] });
 }
 //#endregion
 //#region components/DataTable/TableControls/FiltersV2/AdvancedFilterRulesPopover/AdvancedFilterRuleRow.tsx
-function AdvancedFilterRuleRow({ registry, groupIndex, ruleIndex, rule, size, isOpen, onClose, onDelete, onFieldChange, onOperatorChange, onValueChange, renderValueControl }) {
+function AdvancedFilterRuleRow({ registry, dateTimesEnabled, groupIndex, ruleIndex, rule, size, isOpen, onClose, onDelete, onFieldChange, onOperatorChange, onValueChange, renderValueControl }) {
 	const field = registry.get(rule.fieldId);
 	const operators = field ? getOperatorsForField(field) : [];
 	const operatorConfigurable = field ? fieldHasMultipleOperators(field) : true;
@@ -1683,6 +1741,7 @@ function AdvancedFilterRuleRow({ registry, groupIndex, ruleIndex, rule, size, is
 		dropdownHeadingText: `Edit \u2018${condition}\u2019 statement`,
 		dropdownFormFields: /* @__PURE__ */ jsx(RuleEditorFields, {
 			registry,
+			dateTimesEnabled,
 			field,
 			groupIndex,
 			ruleIndex,
@@ -1803,7 +1862,7 @@ const PopoverContent = styled(PopoverPrimitive.Content)`
   z-index: ${Z_INDICES.modalDropdown};
 `;
 const PopoverCard = styled(Card_default)`
-  width: 384px;
+  width: ${({ $wide }) => $wide ? "520px" : "384px"};
   max-width: calc(100vw - ${Spacing[4]});
   margin-bottom: 0;
 
@@ -1909,9 +1968,10 @@ function groupsForRender(compound) {
 * inline; clicking a row reveals the field/operator/value editor inside the
 * row's dropdown popover.
 */
-const AdvancedFilterRulesPopover = ({ registry, compound, onChange, trigger, open, onOpenChange, renderValueControl, size }) => {
+const AdvancedFilterRulesPopover = ({ registry, compound, onChange, trigger, open, onOpenChange, renderValueControl, size, dateTimesEnabled = false }) => {
 	const resolvedSize = useFilterBarSize(size);
 	const subtleIconSize = resolvedSize === "sm" ? "xs" : "sm";
+	const wide = useMemo(() => dateTimesEnabled && registry.all().some((field) => field.timeGranularity === "minute"), [registry, dateTimesEnabled]);
 	const [internalOpen, setInternalOpen] = useState(false);
 	const isControlled = open != null;
 	const isOpen = isControlled ? open : internalOpen;
@@ -2034,6 +2094,7 @@ const AdvancedFilterRulesPopover = ({ registry, compound, onChange, trigger, ope
 			},
 			children: /* @__PURE__ */ jsxs(PopoverCard, {
 				elevated: true,
+				$wide: wide,
 				children: [/* @__PURE__ */ jsx(Header, { children: /* @__PURE__ */ jsx(Paragraph, {
 					size: resolvedSize,
 					color: "secondary",
@@ -2096,6 +2157,7 @@ const AdvancedFilterRulesPopover = ({ registry, compound, onChange, trigger, ope
 								const rowId = `${groupIndex}-${ruleIndex}`;
 								return /* @__PURE__ */ jsx(AdvancedFilterRuleRow, {
 									registry,
+									dateTimesEnabled,
 									groupIndex,
 									ruleIndex,
 									rule,
@@ -2432,7 +2494,8 @@ const DateRangeValueControl = ({ field, operator, value, relativeDate, onChange,
 		showClear: false,
 		size,
 		visibleMonths,
-		granularity: minuteMode ? "minute" : "day"
+		granularity: minuteMode ? "minute" : "day",
+		hideTimeZone: !minuteMode
 	}, hasCompleteRange ? "range" : "empty");
 };
 //#endregion
@@ -2441,7 +2504,7 @@ const DATE_ONLY = /^\d{4}-\d{2}-\d{2}$/;
 const parseIsoDate = (value, field, operator, dateTimesEnabled) => {
 	if (typeof value !== "string") return null;
 	try {
-		if (dateTimesEnabled && field.timeGranularity === "minute" && operator !== "is") {
+		if (isMinutePrecisionDate(field, operator, dateTimesEnabled)) {
 			if (DATE_ONLY.test(value)) {
 				const dateTime = DateTime.fromISO(value, { zone: Settings.defaultZone });
 				const iso = (operator === "after" ? dateTime.startOf("day") : dateTime.endOf("day")).toISO();
@@ -2467,7 +2530,7 @@ const parseIsoDate = (value, field, operator, dateTimesEnabled) => {
 */
 const DateValueControl = ({ field, operator, value, onChange, ariaLabel, dateTimesEnabled = false }) => {
 	const size = useFilterBarSize();
-	const minuteMode = dateTimesEnabled && field.timeGranularity === "minute" && operator !== "is";
+	const minuteMode = isMinutePrecisionDate(field, operator, dateTimesEnabled);
 	const handleChange = useCallback((nextDate) => {
 		if (!nextDate || !minuteMode) {
 			onChange(nextDate ? nextDate.toString() : null);
@@ -3093,10 +3156,11 @@ const FilterPill = forwardRef(function FilterPill({ field, rule, onClick, onDism
 //#region components/DataTable/TableControls/FiltersV2/FilterPopover/FilterPopover.tsx
 /**
 * Compact value controls fit the minimum width; wider controls can grow
-* up to 320px without overflowing.
+* up to 320px without overflowing, or 520px when the popover is `wide`.
 */
 const POPOVER_MIN_WIDTH = "196px";
 const POPOVER_MAX_WIDTH = "320px";
+const POPOVER_WIDE_MAX_WIDTH = "520px";
 const OperatorMenu = styled(DropdownMenu_default)`
   && {
     background-color: ${({ theme }) => semanticColor(theme, "SurfaceElevated", theme.color.background.primary)};
@@ -3104,7 +3168,7 @@ const OperatorMenu = styled(DropdownMenu_default)`
 `;
 const PopoverPanel = styled(Stack).attrs({ spacing: Spacing[0] })`
   min-width: ${POPOVER_MIN_WIDTH};
-  max-width: ${POPOVER_MAX_WIDTH};
+  max-width: ${({ $wide }) => $wide ? POPOVER_WIDE_MAX_WIDTH : POPOVER_MAX_WIDTH};
   /* The design-system Popover.Card already supplies bg, border, shadow,
      and 6px corner radius — we just constrain the inner content. */
 `;
@@ -3206,7 +3270,7 @@ const Footer = styled(HStack).attrs({
 * back through `onChangeOperator` and forwards open/close transitions
 * through Radix's controlled props.
 */
-const FilterPopover = ({ field, operator, onChangeOperator, valueControlSlot, onClose, trigger, open, onOpenChange, size }) => {
+const FilterPopover = ({ field, operator, onChangeOperator, valueControlSlot, onClose, trigger, open, onOpenChange, size, wide = false }) => {
 	const resolvedSize = useFilterBarSize(size);
 	const valueless = isValuelessOperator(operator);
 	const CaretIcon = resolvedSize === "sm" ? CaretDownIcon$1 : CaretDownIcon;
@@ -3255,6 +3319,7 @@ const FilterPopover = ({ field, operator, onChangeOperator, valueControlSlot, on
 			"aria-label": `Edit filter for ${field.label}`,
 			noPadding: true,
 			children: /* @__PURE__ */ jsxs(PopoverPanel, {
+				$wide: wide,
 				onKeyDown: handleKeyDown,
 				children: [/* @__PURE__ */ jsxs(Main, {
 					$valueless: valueless,
@@ -4021,6 +4086,7 @@ function FilterBar({ registry, initialState, onChange, advancedRulesEnabled = tr
 			"aria-label": "Filter bar",
 			children: [filterState.advancedRulesEnabled ? /* @__PURE__ */ jsx(AdvancedFilterRulesPopover, {
 				registry,
+				dateTimesEnabled,
 				compound: filterState.state.compound,
 				open: rulesPopoverOpen,
 				onOpenChange: setRulesPopoverOpen,
@@ -4060,6 +4126,7 @@ function FilterBar({ registry, initialState, onChange, advancedRulesEnabled = tr
 						return /* @__PURE__ */ jsx(FilterPopover, {
 							field,
 							operator: rule.operator,
+							wide: isMinutePrecisionDate(field, rule.operator, dateTimesEnabled) && carriesDateRange(rule.operator, field.type),
 							onChangeOperator: (op) => {
 								const { relativeDate: _staleRelativeDate, ...rest } = rule;
 								filterState.updateTopLevelRule(rule.id, {
@@ -4431,4 +4498,4 @@ function decodeBase64(input) {
 //#endregion
 export { TableControlsProvider as A, getOperatorsForType as C, reconcileValueForOperator as D, isValuelessOperator as E, ControlBar as F, DataTableCompactBar as I, TableViewConfiguration as M, TableViewConfigurationDropdown as N, dateRuleIntent as O, TableControls as P, getOperatorsForField as S, isRangeOperator as T, FILTER_SIZE_TOKENS as _, encodeFilterStateToUrlParam as a, emptyValueForRule as b, FilterBar_default as c, isFilterStateV2 as d, pruneToRegistry as f, resolveValueControl as g, PillShell as h, decodeFilterStateFromUrl as i, useTableControls as j, TableControlsContext as k, useFilterStateV2 as l, isEmptyState as m, applyFilterStateToSearchParams as n, FieldRegistry as o, EMPTY_FILTER_STATE as p, decodeFilterStateFromString as r, buildFieldRegistry as s, FILTER_STATE_URL_PARAM as t, hasCompleteValue as u, useFilterBarSize as v, isCompleteDateRange as w, getDefaultOperatorForType as x, resolveDateRangeRuleValue as y };
 
-//# sourceMappingURL=TableControls-RS_ozBsI.mjs.map
+//# sourceMappingURL=TableControls-CqW_nyBY.mjs.map