@uniformdev/design-system 19.132.0 → 19.134.0

package/dist/esm/index.js

@@ -11754,7 +11754,6 @@ var activeMenuItem = css25`
 `;
 var menuItem = (textTheme, forceActive) => css25`
   align-items: center;
-  border: none;
   border-radius: var(--rounded-base);
   background: none;
   color: ${textTheme === "base" ? "var(--typography-base)" : "var(--brand-secondary-5)"};
@@ -11777,6 +11776,11 @@ var menuItem = (textTheme, forceActive) => css25`
   &[data-active-item] {
     ${typeof forceActive === "undefined" ? activeMenuItem : ""}
   }
+
+  // Remove border from input elements, this fixes UNI-4634
+  &:not(input[type='radio'], input[type='checkbox']) {
+    border: none;
+  }
 `;
 var menuItemWithIcon = css25`
   align-items: center;
@@ -12141,6 +12145,7 @@ var ButtonWithMenu = ({
   placement,
   size = "lg",
   menuContainerCssClasses,
+  withoutPortal = false,
   ...buttonProps
 }) => {
   const buttonTheme = {
@@ -12209,6 +12214,7 @@ var ButtonWithMenu = ({
           placement,
           menuTrigger: dropdownButton,
           menuItemsContainerCssClasses: menuContainerCssClasses,
+          portal: withoutPortal,
           children
         }
       ) })
@@ -13391,7 +13397,7 @@ var DashedBox = ({
 };
 
 // src/components/DateTimePicker/DateTimePicker.tsx
-import { CalendarDate as CalendarDate3, parseDate as parseDate2, parseTime as parseTime2, Time as Time3 } from "@internationalized/date";
+import { CalendarDate as CalendarDate3, parseDate as parseDate2, parseTime as parseTime2, Time as Time2 } from "@internationalized/date";
 import { createContext as createContext2, useCallback as useCallback3, useContext as useContext3, useEffect as useEffect4, useMemo, useState as useState6 } from "react";
 import { Popover as Popover2, PopoverDisclosure, usePopoverState } from "reakit/Popover";
 
@@ -14292,7 +14298,8 @@ var InputTime = React13.forwardRef(
             isDisabled: !!disabled2,
             onChange: useCallback2(
               (time) => {
-                onChange == null ? void 0 : onChange(time.toString());
+                var _a;
+                onChange == null ? void 0 : onChange((_a = time == null ? void 0 : time.toString()) != null ? _a : "00:00:00");
               },
               [onChange]
             ),
@@ -14558,7 +14565,7 @@ function DateTimePickerSummary({
 import {
   getLocalTimeZone as libGetLocalTimeZone,
   parseAbsolute,
-  Time as Time2,
+  Time,
   toCalendarDate,
   toCalendarDateTime,
   toTime,
@@ -14588,7 +14595,7 @@ function tryToTime(time) {
 }
 function dateTimePickerPartsToIsoString(date, time, draftTimeZone) {
   return date ? toZoned(
-    toCalendarDateTime(date, time != null ? time : new Time2(0, 0)),
+    toCalendarDateTime(date, time != null ? time : new Time(0, 0)),
     draftTimeZone || getLocalTimeZone()
   ).toAbsoluteString() : null;
 }
@@ -14666,7 +14673,7 @@ var DateTimePicker = ({
     var _a;
     if (popover2.visible) {
       setDraftDate(tryToCalendarDate(parsedValue));
-      setDraftTime((_a = tryToTime(parsedValue)) != null ? _a : new Time3(0, 0));
+      setDraftTime((_a = tryToTime(parsedValue)) != null ? _a : new Time2(0, 0));
     }
   }, [parsedValue, popover2.visible]);
   const handleDateChange = useCallback3((isoDate) => {
@@ -17135,7 +17142,7 @@ var modalInnerStyles = css76`
   gap: var(--spacing-base);
   background: var(--gray-50);
   color: unset;
-  padding: calc(var(--spacing-2xl) - 2px);
+  padding: var(--spacing-base);
   box-shadow: var(--elevation-500);
   border-radius: var(--rounded-base);
 `;
@@ -17157,7 +17164,6 @@ var modalCloseButtonStyles = css76`
   display: block;
   padding: 0;
   margin-left: auto;
-  translate: calc(var(--spacing-base)) calc(var(--spacing-base) * -1);
   transition: color var(--duration-fast) var(--timing-ease-out);
 
   &:hover,
@@ -17170,21 +17176,33 @@ var modalContentStyles = css76`
   position: relative;
   flex: 1;
   overflow: auto;
+  padding: var(--spacing-md);
   ${scrollbarStyles}
 `;
+var modalDialogWrapper = css76`
+  padding: 0 var(--spacing-lg) var(--spacing-md);
+`;
+var modalDialogInnerStyles = css76`
+  // we need to override the gap of the modalInnerStyles when using a modal dialog
+  > div {
+    gap: 0;
+  }
+`;
 
 // src/components/Modal/Modal.tsx
 import { jsx as jsx94, jsxs as jsxs63 } from "@emotion/react/jsx-runtime";
+var defaultModalWidth = "75rem";
 var defaultModalHeight = "51rem";
 var Modal = React21.forwardRef(
   ({
     header: header2,
     children,
     onRequestClose,
-    width,
+    width = defaultModalWidth,
     height = defaultModalHeight,
     buttonGroup,
     modalSize = "lg",
+    withoutContentPadding = false,
     ...modalProps
   }, ref) => {
     const dialogRef = useRef6(null);
@@ -17227,7 +17245,7 @@ var Modal = React21.forwardRef(
             ref.current = element;
           }
         },
-        css: [modalStyles, width ? void 0 : size[modalSize]],
+        css: [modalStyles, !width ? size[modalSize] : void 0],
         style: { width, height: height === "auto" ? "min-content" : height },
         "data-testid": "side-dialog",
         onClick: onRequestClose,
@@ -17242,7 +17260,7 @@ var Modal = React21.forwardRef(
             onClick: (e) => e.stopPropagation(),
             children: [
               /* @__PURE__ */ jsxs63("div", { css: modalHeaderStyles, children: [
-                /* @__PURE__ */ jsx94("div", { css: modalHeaderHeaderStyles, children: header2 }),
+                !header2 ? null : /* @__PURE__ */ jsx94("div", { css: modalHeaderHeaderStyles, children: header2 }),
                 /* @__PURE__ */ jsx94(
                   Button,
                   {
@@ -17256,7 +17274,7 @@ var Modal = React21.forwardRef(
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsx94("div", { css: modalContentStyles, children }),
+              /* @__PURE__ */ jsx94("div", { css: [modalContentStyles, !withoutContentPadding ? null : { padding: 0 }], children }),
               buttonGroup ? /* @__PURE__ */ jsx94(HorizontalRhythm, { children: buttonGroup }) : null
             ]
           }
@@ -17267,6 +17285,33 @@ var Modal = React21.forwardRef(
 );
 Modal.displayName = "Modal";
 
+// src/components/Modal/ModalDialog.tsx
+import { forwardRef as forwardRef13 } from "react";
+import { jsx as jsx95, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
+var ModalDialog = forwardRef13(
+  ({ header: header2, buttonGroup, modalSize = "lg", children, height = "auto", onRequestClose, ...props }, ref) => {
+    return /* @__PURE__ */ jsx95(
+      Modal,
+      {
+        ...props,
+        modalSize,
+        ref,
+        onRequestClose,
+        height,
+        withoutContentPadding: true,
+        css: modalDialogInnerStyles,
+        width: "",
+        children: /* @__PURE__ */ jsxs64(VerticalRhythm, { css: modalDialogWrapper, children: [
+          /* @__PURE__ */ jsx95("div", { css: modalHeaderStyles, children: header2 }),
+          /* @__PURE__ */ jsx95("div", { children }),
+          /* @__PURE__ */ jsx95(HorizontalRhythm, { children: buttonGroup })
+        ] })
+      }
+    );
+  }
+);
+ModalDialog.displayName = "ModalDialog";
+
 // src/components/Pagination/Pagination.tsx
 import Paginate from "react-paginate";
 
@@ -17299,7 +17344,7 @@ var page = css77`
 `;
 
 // src/components/Pagination/Pagination.tsx
-import { jsx as jsx95 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx96 } from "@emotion/react/jsx-runtime";
 function Pagination({
   limit,
   offset,
@@ -17314,12 +17359,12 @@ function Pagination({
   if (pageCount <= 1) {
     return null;
   }
-  return /* @__PURE__ */ jsx95(
+  return /* @__PURE__ */ jsx96(
     Paginate,
     {
       forcePage: currentPage,
-      previousLabel: /* @__PURE__ */ jsx95("div", { className: prevNextControls, children: "<" }),
-      nextLabel: /* @__PURE__ */ jsx95("div", { className: prevNextControls, children: ">" }),
+      previousLabel: /* @__PURE__ */ jsx96("div", { className: prevNextControls, children: "<" }),
+      nextLabel: /* @__PURE__ */ jsx96("div", { className: prevNextControls, children: ">" }),
       breakLabel: "...",
       pageCount,
       marginPagesDisplayed: 2,
@@ -17386,7 +17431,7 @@ var inputIconBtn = css78`
 `;
 
 // src/components/ParameterInputs/LabelLeadingIcon.tsx
-import { jsx as jsx96, jsxs as jsxs64 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx97, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
 var LabelLeadingIcon = ({
   icon,
   iconColor,
@@ -17398,7 +17443,7 @@ var LabelLeadingIcon = ({
   ...props
 }) => {
   const titleFr = title2 != null ? title2 : isLocked ? "Read-only pattern parameter" : isBound ? "Connected to external content. Click to edit" : "Click to connect to external content";
-  return /* @__PURE__ */ jsx96(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs64(
+  return /* @__PURE__ */ jsx97(Tooltip, { title: titleFr, children: /* @__PURE__ */ jsxs65(
     "button",
     {
       css: inputIconBtn,
@@ -17408,7 +17453,7 @@ var LabelLeadingIcon = ({
       ...props,
       "data-testid": "lock-button",
       children: [
-        /* @__PURE__ */ jsx96(
+        /* @__PURE__ */ jsx97(
           Icon,
           {
             icon: isLocked ? "lock" : icon ? icon : "arrows-expand-down-right",
@@ -17711,7 +17756,7 @@ var linkParameterIcon = css79`
 `;
 
 // src/components/ParameterInputs/ParameterDataResource.tsx
-import { jsx as jsx97, jsxs as jsxs65 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx98, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
 function ParameterDataResource({
   label,
   labelLeadingIcon,
@@ -17721,12 +17766,12 @@ function ParameterDataResource({
   disabled: disabled2,
   children
 }) {
-  return /* @__PURE__ */ jsxs65("div", { "data-testid": "parameter-data-connect-button", children: [
-    /* @__PURE__ */ jsxs65("span", { css: labelText2, children: [
+  return /* @__PURE__ */ jsxs66("div", { "data-testid": "parameter-data-connect-button", children: [
+    /* @__PURE__ */ jsxs66("span", { css: labelText2, children: [
       labelLeadingIcon ? labelLeadingIcon : null,
       label
     ] }),
-    /* @__PURE__ */ jsxs65(
+    /* @__PURE__ */ jsxs66(
       "button",
       {
         type: "button",
@@ -17735,12 +17780,12 @@ function ParameterDataResource({
         disabled: disabled2,
         onClick: onConnectDatasource,
         children: [
-          /* @__PURE__ */ jsx97("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx97(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
+          /* @__PURE__ */ jsx98("span", { className: "advance-input-icon", css: [inputIcon2], children: /* @__PURE__ */ jsx98(Icon, { icon: "stack", iconColor: "currentColor", size: "1rem" }) }),
           children
         ]
       }
     ),
-    caption ? /* @__PURE__ */ jsx97(Caption, { children: caption }) : null
+    caption ? /* @__PURE__ */ jsx98(Caption, { children: caption }) : null
   ] });
 }
 
@@ -17766,19 +17811,19 @@ var ParameterDrawerHeaderTitle = css80`
 `;
 
 // src/components/ParameterInputs/ParameterDrawerHeader.tsx
-import { jsx as jsx98, jsxs as jsxs66 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
 var ParameterDrawerHeader = ({ title: title2, iconBeforeTitle, children }) => {
-  return /* @__PURE__ */ jsxs66("div", { css: ParameterDrawerHeaderContainer, children: [
-    /* @__PURE__ */ jsxs66("header", { css: ParameterDrawerHeaderTitleGroup, children: [
+  return /* @__PURE__ */ jsxs67("div", { css: ParameterDrawerHeaderContainer, children: [
+    /* @__PURE__ */ jsxs67("header", { css: ParameterDrawerHeaderTitleGroup, children: [
       iconBeforeTitle,
-      /* @__PURE__ */ jsx98(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
+      /* @__PURE__ */ jsx99(Heading, { level: 3, withMarginBottom: false, css: ParameterDrawerHeaderTitle, title: title2, children: title2 })
     ] }),
     children
   ] });
 };
 
 // src/components/ParameterInputs/ParameterGroup.tsx
-import { forwardRef as forwardRef13 } from "react";
+import { forwardRef as forwardRef14 } from "react";
 
 // src/components/ParameterInputs/styles/ParameterGroup.styles.ts
 import { css as css81 } from "@emotion/react";
@@ -17801,18 +17846,18 @@ var fieldsetLegend2 = css81`
 `;
 
 // src/components/ParameterInputs/ParameterGroup.tsx
-import { jsx as jsx99, jsxs as jsxs67 } from "@emotion/react/jsx-runtime";
-var ParameterGroup = forwardRef13(
+import { jsx as jsx100, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
+var ParameterGroup = forwardRef14(
   ({ legend, isDisabled, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs67("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
-      /* @__PURE__ */ jsx99("legend", { css: fieldsetLegend2, children: legend }),
+    return /* @__PURE__ */ jsxs68("fieldset", { css: fieldsetStyles, disabled: isDisabled, ref, ...props, children: [
+      /* @__PURE__ */ jsx100("legend", { css: fieldsetLegend2, children: legend }),
       children
     ] });
   }
 );
 
 // src/components/ParameterInputs/ParameterImage.tsx
-import { forwardRef as forwardRef15, useDeferredValue } from "react";
+import { forwardRef as forwardRef16, useDeferredValue } from "react";
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
 import { useState as useState12 } from "react";
@@ -17856,32 +17901,32 @@ var previewModalImage = css82`
 `;
 
 // src/components/ParameterInputs/ParameterImagePreview.tsx
-import { Fragment as Fragment13, jsx as jsx100, jsxs as jsxs68 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx101, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
 function ParameterImagePreview({ imageSrc }) {
   const [showModal, setShowModal] = useState12(false);
-  return imageSrc ? /* @__PURE__ */ jsxs68("div", { css: previewWrapper, children: [
-    /* @__PURE__ */ jsx100(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
-    /* @__PURE__ */ jsx100(
+  return imageSrc ? /* @__PURE__ */ jsxs69("div", { css: previewWrapper, children: [
+    /* @__PURE__ */ jsx101(PreviewImageModal, { open: showModal, imageSrc, onRequestClose: () => setShowModal(false) }),
+    /* @__PURE__ */ jsx101(
       "button",
       {
         css: previewLink,
         onClick: () => {
           setShowModal(true);
         },
-        children: /* @__PURE__ */ jsx100(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
+        children: /* @__PURE__ */ jsx101(Image, { src: imageSrc, "data-testid": "parameter-image-preview" })
       }
     )
   ] }) : null;
 }
 var PreviewImageModal = ({ open, onRequestClose, imageSrc }) => {
-  return open ? /* @__PURE__ */ jsx100(Fragment13, { children: createPortal2(
-    /* @__PURE__ */ jsx100(
+  return open ? /* @__PURE__ */ jsx101(Fragment13, { children: createPortal2(
+    /* @__PURE__ */ jsx101(
       Modal,
       {
         header: "Image Preview",
         onRequestClose,
-        buttonGroup: /* @__PURE__ */ jsx100(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
-        children: /* @__PURE__ */ jsx100("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx100(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
+        buttonGroup: /* @__PURE__ */ jsx101(Button, { buttonType: "secondary", onClick: onRequestClose, children: "Ok" }),
+        children: /* @__PURE__ */ jsx101("div", { css: previewModalWrapper, children: /* @__PURE__ */ jsx101(Image, { src: imageSrc, css: previewModalImage, "data-testid": "parameter-image-preview" }) })
       }
     ),
     document.body
@@ -17893,21 +17938,21 @@ import { css as css84 } from "@emotion/react";
 import { useState as useState13 } from "react";
 
 // src/components/ParameterInputs/ParameterLabel.tsx
-import { jsx as jsx101 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx102 } from "@emotion/react/jsx-runtime";
 var ParameterLabel = ({ id, asSpan, children, ...props }) => {
-  return !asSpan ? /* @__PURE__ */ jsx101("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx101("span", { "aria-labelledby": id, css: labelText2, children });
+  return !asSpan ? /* @__PURE__ */ jsx102("label", { ...props, htmlFor: id, css: labelText2, children }) : /* @__PURE__ */ jsx102("span", { "aria-labelledby": id, css: labelText2, children });
 };
 
 // src/components/ParameterInputs/ParameterMenuButton.tsx
-import { forwardRef as forwardRef14 } from "react";
-import { jsx as jsx102 } from "@emotion/react/jsx-runtime";
-var ParameterMenuButton = forwardRef14(
+import { forwardRef as forwardRef15 } from "react";
+import { jsx as jsx103 } from "@emotion/react/jsx-runtime";
+var ParameterMenuButton = forwardRef15(
   ({ label, children }, ref) => {
-    return /* @__PURE__ */ jsx102(
+    return /* @__PURE__ */ jsx103(
       Menu,
       {
         menuLabel: `${label} menu`,
-        menuTrigger: /* @__PURE__ */ jsx102(
+        menuTrigger: /* @__PURE__ */ jsx103(
           "button",
           {
             className: "parameter-menu",
@@ -17915,7 +17960,7 @@ var ParameterMenuButton = forwardRef14(
             type: "button",
             "aria-label": `${label} options`,
             ref,
-            children: /* @__PURE__ */ jsx102(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
+            children: /* @__PURE__ */ jsx103(Icon, { icon: "more-alt", iconColor: "currentColor", size: "0.9rem" })
           }
         ),
         children
@@ -17951,7 +17996,7 @@ var overrideMarker = css83`
 `;
 
 // src/components/ParameterInputs/ParameterShell.tsx
-import { jsx as jsx103, jsxs as jsxs69 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx104, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
 var extractParameterProps = (props) => {
   const {
     id,
@@ -18014,19 +18059,19 @@ var ParameterShell = ({
   const [manualErrorMessage, setManualErrorMessage] = useState13(void 0);
   const setErrorMessage = (message) => setManualErrorMessage(message);
   const errorMessaging = errorMessage || manualErrorMessage;
-  return /* @__PURE__ */ jsxs69("div", { css: inputContainer2, ...props, id, children: [
-    hiddenLabel || title2 ? null : /* @__PURE__ */ jsxs69(ParameterLabel, { id, css: labelText2, children: [
+  return /* @__PURE__ */ jsxs70("div", { css: inputContainer2, ...props, id, children: [
+    hiddenLabel || title2 ? null : /* @__PURE__ */ jsxs70(ParameterLabel, { id, css: labelText2, children: [
       labelLeadingIcon != null ? labelLeadingIcon : null,
       label,
       labelTrailingIcon != null ? labelTrailingIcon : null
     ] }),
-    !title2 ? null : /* @__PURE__ */ jsxs69(ParameterLabel, { id, asSpan: true, children: [
+    !title2 ? null : /* @__PURE__ */ jsxs70(ParameterLabel, { id, asSpan: true, children: [
       labelLeadingIcon != null ? labelLeadingIcon : null,
       title2,
       labelTrailingIcon != null ? labelTrailingIcon : null
     ] }),
-    /* @__PURE__ */ jsxs69("div", { css: inputWrapper, children: [
-      actionItems ? /* @__PURE__ */ jsx103(
+    /* @__PURE__ */ jsxs70("div", { css: inputWrapper, children: [
+      actionItems ? /* @__PURE__ */ jsx104(
         "div",
         {
           css: [
@@ -18039,8 +18084,8 @@ var ParameterShell = ({
           children: actionItems
         }
       ) : null,
-      menuItems ? /* @__PURE__ */ jsx103(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
-      /* @__PURE__ */ jsx103(
+      menuItems ? /* @__PURE__ */ jsx104(ParameterMenuButton, { label: `${label} menu`, children: menuItems }) : null,
+      /* @__PURE__ */ jsx104(
         ParameterShellContext.Provider,
         {
           value: {
@@ -18050,14 +18095,14 @@ var ParameterShell = ({
             errorMessage: errorMessaging,
             handleManuallySetErrorMessage: (message) => setErrorMessage(message)
           },
-          children: isParameterGroup ? /* @__PURE__ */ jsx103("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs69(ParameterShellPlaceholder, { children: [
+          children: isParameterGroup ? /* @__PURE__ */ jsx104("div", { style: { flexGrow: 1 }, children }) : /* @__PURE__ */ jsxs70(ParameterShellPlaceholder, { children: [
             children,
-            hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx103(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
+            hasOverriddenValue && onResetOverriddenValue ? /* @__PURE__ */ jsx104(ParameterOverrideMarker, { onClick: onResetOverriddenValue }) : null
           ] })
         }
       )
     ] }),
-    /* @__PURE__ */ jsx103(
+    /* @__PURE__ */ jsx104(
       FieldMessage,
       {
         helperMessageTestId: captionTestId,
@@ -18071,27 +18116,27 @@ var ParameterShell = ({
   ] });
 };
 var ParameterShellPlaceholder = ({ children }) => {
-  return /* @__PURE__ */ jsx103("div", { css: emptyParameterShell, children });
+  return /* @__PURE__ */ jsx104("div", { css: emptyParameterShell, children });
 };
-var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx103(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx103("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx103("span", { hidden: true, children: "reset overridden value to default" }) }) });
+var ParameterOverrideMarker = (props) => /* @__PURE__ */ jsx104(Tooltip, { title: "The default value has been overridden", children: /* @__PURE__ */ jsx104("button", { type: "button", css: overrideMarker, ...props, children: /* @__PURE__ */ jsx104("span", { hidden: true, children: "reset overridden value to default" }) }) });
 
 // src/components/ParameterInputs/ParameterImage.tsx
-import { Fragment as Fragment14, jsx as jsx104, jsxs as jsxs70 } from "@emotion/react/jsx-runtime";
-var ParameterImage = forwardRef15(
+import { Fragment as Fragment14, jsx as jsx105, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
+var ParameterImage = forwardRef16(
   ({ children, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
-    return /* @__PURE__ */ jsxs70(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
-      /* @__PURE__ */ jsx104(ParameterImageInner, { ref, ...innerProps }),
+    return /* @__PURE__ */ jsxs71(ParameterShell, { "data-test-id": "parameter-image", ...shellProps, children: [
+      /* @__PURE__ */ jsx105(ParameterImageInner, { ref, ...innerProps }),
       children
     ] });
   }
 );
-var ParameterImageInner = forwardRef15((props, ref) => {
+var ParameterImageInner = forwardRef16((props, ref) => {
   const { value } = props;
   const { id, label, hiddenLabel, errorMessage } = useParameterShell();
   const deferredValue = useDeferredValue(value);
-  return /* @__PURE__ */ jsxs70(Fragment14, { children: [
-    /* @__PURE__ */ jsx104(
+  return /* @__PURE__ */ jsxs71(Fragment14, { children: [
+    /* @__PURE__ */ jsx105(
       "input",
       {
         css: input3,
@@ -18103,21 +18148,21 @@ var ParameterImageInner = forwardRef15((props, ref) => {
         ...props
       }
     ),
-    errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx104(ParameterImagePreview, { imageSrc: deferredValue })
+    errorMessage || props.disablePreview ? null : /* @__PURE__ */ jsx105(ParameterImagePreview, { imageSrc: deferredValue })
   ] });
 });
 
 // src/components/ParameterInputs/ParameterInput.tsx
-import { forwardRef as forwardRef16 } from "react";
-import { jsx as jsx105 } from "@emotion/react/jsx-runtime";
-var ParameterInput = forwardRef16((props, ref) => {
+import { forwardRef as forwardRef17 } from "react";
+import { jsx as jsx106 } from "@emotion/react/jsx-runtime";
+var ParameterInput = forwardRef17((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx105(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx105(ParameterInputInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx106(ParameterShell, { "data-testid": "parameter-input", ...shellProps, children: /* @__PURE__ */ jsx106(ParameterInputInner, { ref, ...innerProps }) });
 });
-var ParameterInputInner = forwardRef16(
+var ParameterInputInner = forwardRef17(
   ({ ...props }, ref) => {
     const { id, label, hiddenLabel } = useParameterShell();
-    return /* @__PURE__ */ jsx105(
+    return /* @__PURE__ */ jsx106(
       "input",
       {
         css: input3,
@@ -18133,19 +18178,19 @@ var ParameterInputInner = forwardRef16(
 );
 
 // src/components/ParameterInputs/ParameterLink.tsx
-import { forwardRef as forwardRef17 } from "react";
-import { jsx as jsx106, jsxs as jsxs71 } from "@emotion/react/jsx-runtime";
-var ParameterLink = forwardRef17(
+import { forwardRef as forwardRef18 } from "react";
+import { jsx as jsx107, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
+var ParameterLink = forwardRef18(
   ({ disabled: disabled2, onConnectLink, externalLink, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
-    return /* @__PURE__ */ jsx106(
+    return /* @__PURE__ */ jsx107(
       ParameterShell,
       {
         "data-testid": "link-parameter-editor",
         ...shellProps,
         label: innerProps.value ? shellProps.label : "",
         title: !innerProps.value ? shellProps.label : void 0,
-        children: /* @__PURE__ */ jsx106(
+        children: /* @__PURE__ */ jsx107(
           ParameterLinkInner,
           {
             onConnectLink,
@@ -18158,13 +18203,13 @@ var ParameterLink = forwardRef17(
     );
   }
 );
-var ParameterLinkInner = forwardRef17(
+var ParameterLinkInner = forwardRef18(
   ({ externalLink, onConnectLink, disabled: disabled2, buttonText = "Select link", ...props }, ref) => {
     const { id, label, hiddenLabel } = useParameterShell();
     if (!props.value)
-      return /* @__PURE__ */ jsx106("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
-    return /* @__PURE__ */ jsxs71("div", { css: inputWrapper, children: [
-      /* @__PURE__ */ jsx106(
+      return /* @__PURE__ */ jsx107("button", { type: "button", css: dataConnectButton, disabled: disabled2, onClick: onConnectLink, children: buttonText });
+    return /* @__PURE__ */ jsxs72("div", { css: inputWrapper, children: [
+      /* @__PURE__ */ jsx107(
         "input",
         {
           type: "text",
@@ -18176,8 +18221,8 @@ var ParameterLinkInner = forwardRef17(
           ...props
         }
       ),
-      /* @__PURE__ */ jsxs71("div", { css: linkParameterControls, children: [
-        /* @__PURE__ */ jsx106(
+      /* @__PURE__ */ jsxs72("div", { css: linkParameterControls, children: [
+        /* @__PURE__ */ jsx107(
           "button",
           {
             type: "button",
@@ -18188,7 +18233,7 @@ var ParameterLinkInner = forwardRef17(
             children: "edit"
           }
         ),
-        externalLink ? /* @__PURE__ */ jsx106(
+        externalLink ? /* @__PURE__ */ jsx107(
           "a",
           {
             href: externalLink,
@@ -18196,7 +18241,7 @@ var ParameterLinkInner = forwardRef17(
             title: "Open link in new tab",
             target: "_blank",
             rel: "noopener noreferrer",
-            children: /* @__PURE__ */ jsx106(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
+            children: /* @__PURE__ */ jsx107(Icon, { icon: "arrows-expand-up-right", iconColor: "currentColor", size: "1rem" })
           }
         ) : null
       ] })
@@ -18205,7 +18250,7 @@ var ParameterLinkInner = forwardRef17(
 );
 
 // src/components/ParameterInputs/ParameterNameAndPublicIdInput.tsx
-import { Fragment as Fragment15, jsx as jsx107, jsxs as jsxs72 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx108, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
 var ParameterNameAndPublicIdInput = ({
   id,
   onBlur,
@@ -18231,8 +18276,8 @@ var ParameterNameAndPublicIdInput = ({
     navigator.clipboard.writeText(values[publicIdFieldName]);
   };
   autoFocus == null ? void 0 : autoFocus();
-  return /* @__PURE__ */ jsxs72(Fragment15, { children: [
-    /* @__PURE__ */ jsx107(
+  return /* @__PURE__ */ jsxs73(Fragment15, { children: [
+    /* @__PURE__ */ jsx108(
       ParameterInput,
       {
         id: nameIdField,
@@ -18251,7 +18296,7 @@ var ParameterNameAndPublicIdInput = ({
         value: values[nameIdField]
       }
     ),
-    /* @__PURE__ */ jsx107(
+    /* @__PURE__ */ jsx108(
       ParameterInput,
       {
         id: publicIdFieldName,
@@ -18265,11 +18310,11 @@ var ParameterNameAndPublicIdInput = ({
         caption: !publicIdError ? publicIdCaption : void 0,
         placeholder: publicIdPlaceholderText,
         errorMessage: publicIdError,
-        menuItems: /* @__PURE__ */ jsx107(
+        menuItems: /* @__PURE__ */ jsx108(
           MenuItem,
           {
             disabled: !values[publicIdFieldName],
-            icon: /* @__PURE__ */ jsx107(Icon, { icon: "path-trim", iconColor: "currentColor" }),
+            icon: /* @__PURE__ */ jsx108(Icon, { icon: "path-trim", iconColor: "currentColor" }),
             onClick: handleCopyPidFieldValue,
             children: "Copy"
           }
@@ -18277,7 +18322,7 @@ var ParameterNameAndPublicIdInput = ({
         value: values[publicIdFieldName]
       }
     ),
-    (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx107(Callout, { type: "caution", children: warnOverLength.message }) : null
+    (warnOverLength == null ? void 0 : warnOverLength.length) && values[publicIdFieldName].length > warnOverLength.length ? /* @__PURE__ */ jsx108(Callout, { type: "caution", children: warnOverLength.message }) : null
   ] });
 };
 
@@ -18667,7 +18712,7 @@ var getSelectedNode = (selection) => {
 };
 
 // src/components/ParameterInputs/rich-text/LinkNodePlugin.tsx
-import { Fragment as Fragment16, jsx as jsx108, jsxs as jsxs73 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx109, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
 var isProjectMapLinkValue = (value) => {
   return (value == null ? void 0 : value.type) === "projectMapNode" && Boolean(
     value.nodeId && value.path && value.projectMapId
@@ -19110,8 +19155,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
       });
     });
   };
-  return /* @__PURE__ */ jsxs73(Fragment16, { children: [
-    /* @__PURE__ */ jsx108(
+  return /* @__PURE__ */ jsxs74(Fragment16, { children: [
+    /* @__PURE__ */ jsx109(
       NodeEventPlugin,
       {
         nodeType: LinkNode,
@@ -19121,7 +19166,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
         }
       }
     ),
-    linkPopoverState ? /* @__PURE__ */ jsx108(
+    linkPopoverState ? /* @__PURE__ */ jsx109(
       "div",
       {
         css: linkPopover,
@@ -19130,8 +19175,8 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
           top: linkPopoverState.position.y
         },
         ref: linkPopoverElRef,
-        children: /* @__PURE__ */ jsxs73("div", { css: linkPopoverContainer, children: [
-          linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx108(
+        children: /* @__PURE__ */ jsxs74("div", { css: linkPopoverContainer, children: [
+          linkPopoverState.node.__link.type === "projectMapNode" ? linkPopoverState.node.__link.path : /* @__PURE__ */ jsx109(
             "a",
             {
               href: parsePath(
@@ -19143,7 +19188,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
               children: parsePath(linkPopoverState.node.__link.path)
             }
           ),
-          /* @__PURE__ */ jsx108(
+          /* @__PURE__ */ jsx109(
             Button,
             {
               size: "xs",
@@ -19151,7 +19196,7 @@ function LinkNodePlugin({ onConnectLink, getBoundPath }) {
                 onEditLinkNode(linkPopoverState.node);
               },
               buttonType: "ghost",
-              children: /* @__PURE__ */ jsx108(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
+              children: /* @__PURE__ */ jsx109(Icon, { icon: "pen", size: "1rem", title: "Edit link" })
             }
           )
         ] })
@@ -19176,7 +19221,7 @@ import {
   INDENT_CONTENT_COMMAND
 } from "lexical";
 import { useEffect as useEffect14 } from "react";
-import { jsx as jsx109 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx110 } from "@emotion/react/jsx-runtime";
 function isIndentPermitted(maxDepth) {
   const selection = $getSelection2();
   if (!$isRangeSelection2(selection)) {
@@ -19206,7 +19251,7 @@ function ListIndentPlugin({ maxDepth }) {
       COMMAND_PRIORITY_CRITICAL
     );
   }, [editor, maxDepth]);
-  return /* @__PURE__ */ jsx109(TabIndentationPlugin, {});
+  return /* @__PURE__ */ jsx110(TabIndentationPlugin, {});
 }
 
 // src/components/ParameterInputs/rich-text/RichTextToolbar.tsx
@@ -19233,7 +19278,7 @@ import {
   SELECTION_CHANGE_COMMAND
 } from "lexical";
 import { useCallback as useCallback9, useEffect as useEffect15, useMemo as useMemo4, useState as useState15 } from "react";
-import { Fragment as Fragment17, jsx as jsx110, jsxs as jsxs74 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx111, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
 var toolbar = css87`
   background: var(--gray-50);
   border-radius: var(--rounded-base);
@@ -19285,7 +19330,7 @@ var toolbarChevron = css87`
   margin-left: var(--spacing-xs);
 `;
 var RichTextToolbarIcon = ({ icon }) => {
-  return /* @__PURE__ */ jsx110(Icon, { icon, css: toolbarIcon, size: "1rem" });
+  return /* @__PURE__ */ jsx111(Icon, { icon, css: toolbarIcon, size: "1rem" });
 };
 var FORMATS_WITH_ICON = /* @__PURE__ */ new Map([
   ["bold", "format-bold"],
@@ -19394,15 +19439,15 @@ var RichTextToolbar = ({ config, customControls }) => {
       });
     });
   }, [editor, updateToolbar]);
-  return /* @__PURE__ */ jsxs74("div", { css: toolbar, children: [
-    /* @__PURE__ */ jsxs74(
+  return /* @__PURE__ */ jsxs75("div", { css: toolbar, children: [
+    /* @__PURE__ */ jsxs75(
       Menu,
       {
         menuLabel: "Elements",
-        menuTrigger: /* @__PURE__ */ jsxs74("button", { css: richTextToolbarButton, title: "Text styles", children: [
+        menuTrigger: /* @__PURE__ */ jsxs75("button", { css: richTextToolbarButton, title: "Text styles", children: [
           visibleTextualElements.some((element) => element.type === activeElement) ? getLabelForElement(activeElement) : getLabelForElement("paragraph"),
           " ",
-          /* @__PURE__ */ jsx110(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
+          /* @__PURE__ */ jsx111(Icon, { icon: "chevron-down", css: [toolbarIcon, toolbarChevron], size: "1rem" })
         ] }),
         placement: "bottom-start",
         children: [
@@ -19412,7 +19457,7 @@ var RichTextToolbar = ({ config, customControls }) => {
               type: "paragraph"
             },
             ...visibleTextualElements
-          ].map((element) => /* @__PURE__ */ jsx110(
+          ].map((element) => /* @__PURE__ */ jsx111(
             MenuItem,
             {
               onClick: () => {
@@ -19422,12 +19467,12 @@ var RichTextToolbar = ({ config, customControls }) => {
             },
             element.type
           )),
-          visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx110(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
+          visibleTextualElements.length === 0 ? /* @__PURE__ */ jsx111(MenuItem, { disabled: true, children: "Alternative text styles are not available" }) : null
         ]
       }
     ),
-    visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs74("div", { css: toolbarGroup, children: [
-      visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx110(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx110(
+    visibleFormatsWithIcon.length > 0 || visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsxs75("div", { css: toolbarGroup, children: [
+      visibleFormatsWithIcon.map((format) => /* @__PURE__ */ jsx111(Tooltip, { title: format.label, placement: "top", children: /* @__PURE__ */ jsx111(
         "button",
         {
           onClick: () => {
@@ -19437,16 +19482,16 @@ var RichTextToolbar = ({ config, customControls }) => {
             richTextToolbarButton,
             activeFormats.includes(format.type) ? richTextToolbarButtonActive : null
           ],
-          children: /* @__PURE__ */ jsx110(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
+          children: /* @__PURE__ */ jsx111(RichTextToolbarIcon, { icon: FORMATS_WITH_ICON.get(format.type) })
         }
       ) }, format.type)),
-      visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx110(
+      visibleFormatsWithoutIcon.length > 0 ? /* @__PURE__ */ jsx111(
         Menu,
         {
           menuLabel: "Alternative text styles",
-          menuTrigger: /* @__PURE__ */ jsx110("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx110(Icon, { icon: "more-alt", css: toolbarIcon }) }),
+          menuTrigger: /* @__PURE__ */ jsx111("button", { css: richTextToolbarButton, title: "Alternative text styles", children: /* @__PURE__ */ jsx111(Icon, { icon: "more-alt", css: toolbarIcon }) }),
           placement: "bottom-start",
-          children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx110(
+          children: visibleFormatsWithoutIcon.map((format) => /* @__PURE__ */ jsx111(
             MenuItem,
             {
               onClick: () => {
@@ -19459,19 +19504,19 @@ var RichTextToolbar = ({ config, customControls }) => {
         }
       ) : null
     ] }) : null,
-    visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs74("div", { css: toolbarGroup, children: [
-      linkElementVisible ? /* @__PURE__ */ jsx110(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx110(
+    visibleElementsWithIcons.size > 0 ? /* @__PURE__ */ jsxs75("div", { css: toolbarGroup, children: [
+      linkElementVisible ? /* @__PURE__ */ jsx111(Tooltip, { title: "Link", placement: "top", children: /* @__PURE__ */ jsx111(
         "button",
         {
           onClick: () => {
             isLink ? editor.dispatchCommand(REMOVE_LINK_NODE_COMMAND, {}) : editor.dispatchCommand(OPEN_LINK_NODE_MODAL_COMMAND, {});
           },
           css: [richTextToolbarButton, isLink ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx110(RichTextToolbarIcon, { icon: "link" })
+          children: /* @__PURE__ */ jsx111(RichTextToolbarIcon, { icon: "link" })
         }
       ) }) : null,
-      visibleLists.size > 0 ? /* @__PURE__ */ jsxs74(Fragment17, { children: [
-        visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx110(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx110(
+      visibleLists.size > 0 ? /* @__PURE__ */ jsxs75(Fragment17, { children: [
+        visibleLists.has("unorderedList") ? /* @__PURE__ */ jsx111(Tooltip, { title: "Bullet List", placement: "top", children: /* @__PURE__ */ jsx111(
           "button",
           {
             onClick: () => {
@@ -19481,10 +19526,10 @@ var RichTextToolbar = ({ config, customControls }) => {
               richTextToolbarButton,
               activeElement === "unorderedList" ? richTextToolbarButtonActive : null
             ],
-            children: /* @__PURE__ */ jsx110(RichTextToolbarIcon, { icon: "layout-list" })
+            children: /* @__PURE__ */ jsx111(RichTextToolbarIcon, { icon: "layout-list" })
           }
         ) }) : null,
-        visibleLists.has("orderedList") ? /* @__PURE__ */ jsx110(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx110(
+        visibleLists.has("orderedList") ? /* @__PURE__ */ jsx111(Tooltip, { title: "Ordered List", placement: "top", children: /* @__PURE__ */ jsx111(
           "button",
           {
             onClick: () => {
@@ -19494,32 +19539,32 @@ var RichTextToolbar = ({ config, customControls }) => {
               richTextToolbarButton,
               activeElement === "orderedList" ? richTextToolbarButtonActive : null
             ],
-            children: /* @__PURE__ */ jsx110(RichTextToolbarIcon, { icon: "layout-list-numbered" })
+            children: /* @__PURE__ */ jsx111(RichTextToolbarIcon, { icon: "layout-list-numbered" })
           }
         ) }) : null
       ] }) : null,
-      quoteElementVisible ? /* @__PURE__ */ jsx110(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx110(
+      quoteElementVisible ? /* @__PURE__ */ jsx111(Tooltip, { title: "Blockquote", placement: "top", children: /* @__PURE__ */ jsx111(
         "button",
         {
           onClick: () => {
             activeElement === "quote" ? onSelectElement("paragraph") : onSelectElement("quote");
           },
           css: [richTextToolbarButton, activeElement === "quote" ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx110(RichTextToolbarIcon, { icon: "quote" })
+          children: /* @__PURE__ */ jsx111(RichTextToolbarIcon, { icon: "quote" })
         }
       ) }) : null,
-      codeElementVisible ? /* @__PURE__ */ jsx110(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx110(
+      codeElementVisible ? /* @__PURE__ */ jsx111(Tooltip, { title: "Code Block", placement: "top", children: /* @__PURE__ */ jsx111(
         "button",
         {
           onClick: () => {
             activeElement === "code" ? onSelectElement("paragraph") : onSelectElement("code");
           },
           css: [richTextToolbarButton, activeElement === "code" ? richTextToolbarButtonActive : null],
-          children: /* @__PURE__ */ jsx110(RichTextToolbarIcon, { icon: "code-slash" })
+          children: /* @__PURE__ */ jsx111(RichTextToolbarIcon, { icon: "code-slash" })
         }
       ) }) : null
     ] }) : null,
-    customControls ? /* @__PURE__ */ jsx110("div", { css: toolbarGroup, children: customControls }) : null
+    customControls ? /* @__PURE__ */ jsx111("div", { css: toolbarGroup, children: customControls }) : null
   ] });
 };
 var RichTextToolbar_default = RichTextToolbar;
@@ -19633,7 +19678,7 @@ var useRichTextToolbarState = ({ config }) => {
 };
 
 // src/components/ParameterInputs/ParameterRichText.tsx
-import { Fragment as Fragment18, jsx as jsx111, jsxs as jsxs75 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx112, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
 var ParameterRichText = ({
   label,
   labelLeadingIcon,
@@ -19658,7 +19703,7 @@ var ParameterRichText = ({
   variables,
   customControls
 }) => {
-  return /* @__PURE__ */ jsxs75(
+  return /* @__PURE__ */ jsxs76(
     ParameterShell,
     {
       "data-testid": "parameter-richtext",
@@ -19672,7 +19717,7 @@ var ParameterRichText = ({
       captionTestId,
       menuItems,
       children: [
-        /* @__PURE__ */ jsx111(
+        /* @__PURE__ */ jsx112(
           ParameterRichTextInner,
           {
             value,
@@ -19690,7 +19735,7 @@ var ParameterRichText = ({
             children
           }
         ),
-        menuItems ? /* @__PURE__ */ jsx111(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx111(Fragment18, { children: menuItems }) }) : null
+        menuItems ? /* @__PURE__ */ jsx112(ParameterMenuButton, { label: `${label} menu`, children: /* @__PURE__ */ jsx112(Fragment18, { children: menuItems }) }) : null
       ]
     }
   );
@@ -19801,8 +19846,8 @@ var ParameterRichTextInner = ({
     },
     editable: !readOnly
   };
-  return /* @__PURE__ */ jsxs75(Fragment18, { children: [
-    /* @__PURE__ */ jsx111("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx111(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx111(
+  return /* @__PURE__ */ jsxs76(Fragment18, { children: [
+    /* @__PURE__ */ jsx112("div", { css: [editorWrapper], className: editorWrapperClassName, children: /* @__PURE__ */ jsx112(LexicalComposer, { initialConfig: lexicalConfig, children: /* @__PURE__ */ jsx112(
       RichText,
       {
         onChange,
@@ -19861,20 +19906,20 @@ var RichText = ({
   useEffect16(() => {
     editor.setEditable(!readOnly);
   }, [editor, readOnly]);
-  return /* @__PURE__ */ jsxs75(Fragment18, { children: [
-    readOnly ? null : /* @__PURE__ */ jsx111(RichTextToolbar_default, { config, customControls }),
-    /* @__PURE__ */ jsxs75("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
-      /* @__PURE__ */ jsx111(
+  return /* @__PURE__ */ jsxs76(Fragment18, { children: [
+    readOnly ? null : /* @__PURE__ */ jsx112(RichTextToolbar_default, { config, customControls }),
+    /* @__PURE__ */ jsxs76("div", { css: editorContainer, ref: editorContainerRef, "data-testid": "value-container", children: [
+      /* @__PURE__ */ jsx112(
         RichTextPlugin,
         {
-          contentEditable: /* @__PURE__ */ jsx111(ContentEditable, { css: editorInput, className: editorInputClassName }),
-          placeholder: /* @__PURE__ */ jsx111("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
+          contentEditable: /* @__PURE__ */ jsx112(ContentEditable, { css: editorInput, className: editorInputClassName }),
+          placeholder: /* @__PURE__ */ jsx112("div", { css: editorPlaceholder, children: readOnly ? "empty" : "start editing..." }),
           ErrorBoundary: LexicalErrorBoundary
         }
       ),
-      /* @__PURE__ */ jsx111(ListPlugin, {}),
-      readOnly ? null : /* @__PURE__ */ jsx111(HistoryPlugin, {}),
-      /* @__PURE__ */ jsx111(
+      /* @__PURE__ */ jsx112(ListPlugin, {}),
+      readOnly ? null : /* @__PURE__ */ jsx112(HistoryPlugin, {}),
+      /* @__PURE__ */ jsx112(
         LinkNodePlugin,
         {
           onConnectLink: onConnectLink ? onConnectLink : () => Promise.resolve(),
@@ -19884,27 +19929,27 @@ var RichText = ({
           } : void 0
         }
       ),
-      /* @__PURE__ */ jsx111(ListIndentPlugin, { maxDepth: 4 }),
-      /* @__PURE__ */ jsx111(DisableStylesPlugin, {}),
-      /* @__PURE__ */ jsx111(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
-      /* @__PURE__ */ jsx111(Fragment18, { children })
+      /* @__PURE__ */ jsx112(ListIndentPlugin, { maxDepth: 4 }),
+      /* @__PURE__ */ jsx112(DisableStylesPlugin, {}),
+      /* @__PURE__ */ jsx112(MarkdownShortcutPlugin, { transformers: MARKDOWN_TRANSFORMERS }),
+      /* @__PURE__ */ jsx112(Fragment18, { children })
     ] })
   ] });
 };
 
 // src/components/ParameterInputs/ParameterSelect.tsx
-import { forwardRef as forwardRef18 } from "react";
-import { jsx as jsx112, jsxs as jsxs76 } from "@emotion/react/jsx-runtime";
-var ParameterSelect = forwardRef18(
+import { forwardRef as forwardRef19 } from "react";
+import { jsx as jsx113, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
+var ParameterSelect = forwardRef19(
   ({ defaultOption, options, ...props }, ref) => {
     const { shellProps, innerProps } = extractParameterProps(props);
-    return /* @__PURE__ */ jsx112(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx112(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
+    return /* @__PURE__ */ jsx113(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx113(ParameterSelectInner, { options, defaultOption, ...innerProps, ref }) });
   }
 );
-var ParameterSelectInner = forwardRef18(
+var ParameterSelectInner = forwardRef19(
   ({ defaultOption, options, ...props }, ref) => {
     const { id, label, hiddenLabel } = useParameterShell();
-    return /* @__PURE__ */ jsxs76(
+    return /* @__PURE__ */ jsxs77(
       "select",
       {
         css: [input3, selectInput],
@@ -19913,10 +19958,10 @@ var ParameterSelectInner = forwardRef18(
         ref,
         ...props,
         children: [
-          defaultOption ? /* @__PURE__ */ jsx112("option", { value: "", children: defaultOption }) : null,
+          defaultOption ? /* @__PURE__ */ jsx113("option", { value: "", children: defaultOption }) : null,
           options.map((option) => {
             var _a;
-            return /* @__PURE__ */ jsx112("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
+            return /* @__PURE__ */ jsx113("option", { value: (_a = option.value) != null ? _a : option.label, children: option.label }, option.label);
           })
         ]
       }
@@ -19925,15 +19970,15 @@ var ParameterSelectInner = forwardRef18(
 );
 
 // src/components/ParameterInputs/ParameterTextarea.tsx
-import { forwardRef as forwardRef19 } from "react";
-import { jsx as jsx113 } from "@emotion/react/jsx-runtime";
-var ParameterTextarea = forwardRef19((props, ref) => {
+import { forwardRef as forwardRef20 } from "react";
+import { jsx as jsx114 } from "@emotion/react/jsx-runtime";
+var ParameterTextarea = forwardRef20((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx113(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx113(ParameterTextareaInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx114(ParameterShell, { "data-testid": "parameter-textarea", ...shellProps, children: /* @__PURE__ */ jsx114(ParameterTextareaInner, { ref, ...innerProps }) });
 });
-var ParameterTextareaInner = forwardRef19(({ ...props }, ref) => {
+var ParameterTextareaInner = forwardRef20(({ ...props }, ref) => {
   const { id, label, hiddenLabel } = useParameterShell();
-  return /* @__PURE__ */ jsx113(
+  return /* @__PURE__ */ jsx114(
     "textarea",
     {
       css: [input3, textarea2],
@@ -19946,18 +19991,18 @@ var ParameterTextareaInner = forwardRef19(({ ...props }, ref) => {
 });
 
 // src/components/ParameterInputs/ParameterToggle.tsx
-import { forwardRef as forwardRef20 } from "react";
-import { jsx as jsx114, jsxs as jsxs77 } from "@emotion/react/jsx-runtime";
-var ParameterToggle = forwardRef20((props, ref) => {
+import { forwardRef as forwardRef21 } from "react";
+import { jsx as jsx115, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
+var ParameterToggle = forwardRef21((props, ref) => {
   const { shellProps, innerProps } = extractParameterProps(props);
-  return /* @__PURE__ */ jsx114(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx114(ParameterToggleInner, { ref, ...innerProps }) });
+  return /* @__PURE__ */ jsx115(ParameterShell, { ...shellProps, children: /* @__PURE__ */ jsx115(ParameterToggleInner, { ref, ...innerProps }) });
 });
-var ParameterToggleInner = forwardRef20(
+var ParameterToggleInner = forwardRef21(
   ({ children, ...props }, ref) => {
     const { id, label } = useParameterShell();
-    return /* @__PURE__ */ jsxs77("label", { css: inputToggleLabel2, children: [
-      /* @__PURE__ */ jsx114("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
-      /* @__PURE__ */ jsx114("span", { css: inlineLabel2, children: label }),
+    return /* @__PURE__ */ jsxs78("label", { css: inputToggleLabel2, children: [
+      /* @__PURE__ */ jsx115("input", { css: toggleInput2, type: props.type, id, ref, ...props }),
+      /* @__PURE__ */ jsx115("span", { css: inlineLabel2, children: label }),
       children
     ] });
   }
@@ -20018,7 +20063,7 @@ var bar = css89`
 `;
 
 // src/components/ProgressBar/ProgressBar.tsx
-import { jsx as jsx115 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx116 } from "@emotion/react/jsx-runtime";
 function ProgressBar({
   current,
   max,
@@ -20028,7 +20073,7 @@ function ProgressBar({
 }) {
   const valueNow = Math.min(current, max);
   const valuePercentage = max > 0 ? Math.ceil(100 / max * valueNow) : 0;
-  return /* @__PURE__ */ jsx115(
+  return /* @__PURE__ */ jsx116(
     "div",
     {
       css: container3,
@@ -20039,7 +20084,7 @@ function ProgressBar({
       "aria-valuemax": max,
       "aria-valuenow": valueNow,
       ...props,
-      children: /* @__PURE__ */ jsx115(
+      children: /* @__PURE__ */ jsx116(
         "div",
         {
           css: [
@@ -20079,7 +20124,7 @@ var progressListItemStyles = css90`
 `;
 
 // src/components/ProgressList/ProgressList.tsx
-import { jsx as jsx116, jsxs as jsxs78 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx117, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
 var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
   const itemsWithStatus = useMemo5(() => {
     const indexOfInProgressItem = items.findIndex(({ id }) => id === inProgressId);
@@ -20093,8 +20138,8 @@ var ProgressList = ({ inProgressId, items, autoEllipsis, ...htmlProps }) => {
       return { ...item, status };
     });
   }, [items, inProgressId]);
-  return /* @__PURE__ */ jsx116("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
-    return /* @__PURE__ */ jsx116(
+  return /* @__PURE__ */ jsx117("ol", { css: progressListStyles, ...htmlProps, children: itemsWithStatus.map(({ id, label, status, error, errorLevel }) => {
+    return /* @__PURE__ */ jsx117(
       ProgressListItem,
       {
         status,
@@ -20152,11 +20197,11 @@ var ProgressListItem = ({
     };
     return colorPerStatus[status];
   }, [status, error, errorLevel]);
-  return /* @__PURE__ */ jsxs78("li", { css: [progressListItemStyles, statusStyles], children: [
-    /* @__PURE__ */ jsx116(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx116("div", { children: /* @__PURE__ */ jsx116(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
-    /* @__PURE__ */ jsxs78("div", { children: [
+  return /* @__PURE__ */ jsxs79("li", { css: [progressListItemStyles, statusStyles], children: [
+    /* @__PURE__ */ jsx117(Tooltip, { title: error != null ? error : "", children: /* @__PURE__ */ jsx117("div", { children: /* @__PURE__ */ jsx117(Icon, { icon, size: 20, iconColor: "currentColor" }) }) }),
+    /* @__PURE__ */ jsxs79("div", { children: [
       children,
-      /* @__PURE__ */ jsx116("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
+      /* @__PURE__ */ jsx117("span", { css: { visibility: autoEllipsis && status === "inProgress" && !error ? "visible" : "hidden" }, children: "..." })
     ] })
   ] });
 };
@@ -20444,11 +20489,8 @@ var ConditionalInputRow = css92`
   }
 `;
 var SearchInput = css92`
-  ${input("nowrap")}
-  border-radius: var(--rounded-full);
-  padding: var(--spacing-sm) var(--spacing-base);
-  font-size: var(--fs-sm);
-  padding-right: var(--spacing-2xl);
+  max-height: 40px;
+  min-height: unset;
 `;
 var FilterButton = css92`
   align-items: center;
@@ -20457,8 +20499,10 @@ var FilterButton = css92`
   border-radius: var(--rounded-full);
   color: var(--typography-base);
   display: flex;
+  font-size: var(--fs-sm);
   gap: var(--spacing-sm);
   padding: var(--spacing-sm) var(--spacing-base);
+  max-height: 40px;
   transition: color var(--duration-fast) var(--timing-ease-out),
     background-color var(--duration-fast) var(--timing-ease-out),
     border-color var(--duration-fast) var(--timing-ease-out),
@@ -20597,15 +20641,16 @@ var SortFilterInputRow = css92`
 `;
 
 // src/components/SearchAndFilter/FilterButton.tsx
-import { jsx as jsx117, jsxs as jsxs79 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx118, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
 var FilterButton2 = ({
   text = "Filters",
   icon = "filter-add",
   filterCount,
   hasSelectedValue,
+  dataTestId,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs79(
+  return /* @__PURE__ */ jsxs80(
     "button",
     {
       type: "button",
@@ -20615,11 +20660,11 @@ var FilterButton2 = ({
         filterCount ? [FilterButtonWithOptions, FilterButtonSelected] : void 0
       ],
       ...props,
-      "data-testid": "filters-button",
+      "data-testid": dataTestId,
       children: [
-        /* @__PURE__ */ jsx117(Icon, { icon, iconColor: "currentColor", size: "1rem" }),
-        /* @__PURE__ */ jsx117("span", { css: FilterButtonText, children: text }),
-        filterCount ? /* @__PURE__ */ jsx117(Counter, { count: filterCount, bgColor: "var(--white)" }) : null
+        /* @__PURE__ */ jsx118(Icon, { icon, iconColor: "currentColor", size: "1rem" }),
+        /* @__PURE__ */ jsx118("span", { css: FilterButtonText, children: text }),
+        filterCount ? /* @__PURE__ */ jsx118(Counter, { count: filterCount, bgColor: "var(--white)" }) : null
       ]
     }
   );
@@ -20639,7 +20684,7 @@ import {
   useMemo as useMemo6,
   useState as useState16
 } from "react";
-import { jsx as jsx118 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx119 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterContext = createContext6({
   searchTerm: "",
   setSearchTerm: () => {
@@ -20673,6 +20718,7 @@ var SearchAndFilterProvider = ({
   onSearchChange,
   onChange,
   onSortChange,
+  resetFilterValues = [],
   totalResults,
   children
 }) => {
@@ -20702,8 +20748,8 @@ var SearchAndFilterProvider = ({
     onChange([...filters, { field: "", operator: "", value: "" }]);
   }, [filters, onChange]);
   const handleResetFilters = useCallback10(() => {
-    onChange([]);
-  }, [onChange]);
+    onChange(resetFilterValues);
+  }, [onChange, resetFilterValues]);
   const handleDeleteFilter = useCallback10(
     (index) => {
       const remainingFilters = filters.filter((_, i) => i !== index);
@@ -20730,7 +20776,7 @@ var SearchAndFilterProvider = ({
       };
     }
   }, [filterVisibility]);
-  return /* @__PURE__ */ jsx118(
+  return /* @__PURE__ */ jsx119(
     SearchAndFilterContext.Provider,
     {
       value: {
@@ -20750,7 +20796,7 @@ var SearchAndFilterProvider = ({
         validFilterQuery,
         totalResults
       },
-      children: /* @__PURE__ */ jsx118(VerticalRhythm, { children })
+      children: /* @__PURE__ */ jsx119(VerticalRhythm, { children })
     }
   );
 };
@@ -20760,7 +20806,7 @@ var useSearchAndFilter = () => {
 };
 
 // src/components/SearchAndFilter/FilterControls.tsx
-import { Fragment as Fragment19, jsx as jsx119, jsxs as jsxs80 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx120, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
 var FilterControls = ({
   children,
   defaultSortByValue,
@@ -20811,8 +20857,8 @@ var FilterControls = ({
       setUserHasChangedSortByValue(true);
     }
   }, [initialSortValue, sortByValue]);
-  return /* @__PURE__ */ jsxs80(Fragment19, { children: [
-    /* @__PURE__ */ jsx119(
+  return /* @__PURE__ */ jsxs81(Fragment19, { children: [
+    /* @__PURE__ */ jsx120(
       FilterButton2,
       {
         "aria-controls": "search-and-filter-options",
@@ -20820,10 +20866,11 @@ var FilterControls = ({
         "aria-haspopup": "true",
         "aria-expanded": filterVisibility === "filters",
         filterCount: validFilterQuery == null ? void 0 : validFilterQuery.length,
-        onClick: () => handleFilterToggle("filters")
+        onClick: () => handleFilterToggle("filters"),
+        dataTestId: "filters-button"
       }
     ),
-    /* @__PURE__ */ jsx119(
+    /* @__PURE__ */ jsx120(
       FilterButton2,
       {
         "aria-controls": "search-and-filter-sortBy",
@@ -20834,17 +20881,18 @@ var FilterControls = ({
         "aria-expanded": filterVisibility === "sort",
         hasSelectedValue: sortByValue !== "",
         onClick: () => handleFilterToggle("sort"),
-        "data-testid": "sort-by-dropdown"
+        dataTestId: "sort-by-button"
       }
     ),
-    hideSearchInput ? null : /* @__PURE__ */ jsx119(
+    hideSearchInput ? null : /* @__PURE__ */ jsx120(
       InputKeywordSearch,
       {
         placeholder: "Search...",
         onSearchTextChanged: (e) => setLocaleSearchTerm(e),
         value: localeSearchTerm,
         compact: true,
-        rounded: true
+        rounded: true,
+        css: SearchInput
       }
     ),
     children
@@ -20938,7 +20986,7 @@ var StatusDeleted = css93`
 `;
 
 // src/components/Validation/StatusBullet.tsx
-import { jsx as jsx120 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx121 } from "@emotion/react/jsx-runtime";
 var StatusBullet = ({
   status,
   hideText = false,
@@ -20958,7 +21006,7 @@ var StatusBullet = ({
     Deleted: StatusDeleted
   };
   const statusSize = size === "base" ? StatusBulletBase : StatusBulletSmall;
-  return /* @__PURE__ */ jsx120(
+  return /* @__PURE__ */ jsx121(
     "span",
     {
       role: "status",
@@ -20971,7 +21019,7 @@ var StatusBullet = ({
 };
 
 // src/components/SearchAndFilter/FilterEditor.tsx
-import { Fragment as Fragment20, jsx as jsx121, jsxs as jsxs81 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx122, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
 var readOnlyAttributes = {
   isSearchable: false,
   menuIsOpen: false,
@@ -20986,7 +21034,7 @@ var FilterMultiChoiceEditor = ({
   ...props
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  return /* @__PURE__ */ jsx121("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx122(
     InputComboBox,
     {
       ...props,
@@ -21022,7 +21070,7 @@ var FilterSingleChoiceEditor = ({
   valueTestId
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  return /* @__PURE__ */ jsx121("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx122(
     InputComboBox,
     {
       placeholder: "Type to search...",
@@ -21048,7 +21096,7 @@ var FilterSingleChoiceEditor = ({
   ) });
 };
 var CustomOptions = ({ label, value }) => {
-  return /* @__PURE__ */ jsx121(StatusBullet, { status: label, message: value });
+  return /* @__PURE__ */ jsx122(StatusBullet, { status: label, message: value });
 };
 var StatusMultiEditor = ({
   options,
@@ -21059,7 +21107,7 @@ var StatusMultiEditor = ({
   valueTestId
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  return /* @__PURE__ */ jsx121("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx122(
     InputComboBox,
     {
       options,
@@ -21092,7 +21140,7 @@ var StatusSingleEditor = ({
   valueTestId
 }) => {
   const readOnlyProps = readOnly ? readOnlyAttributes : {};
-  return /* @__PURE__ */ jsx121("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122("div", { "data-testid": valueTestId, children: /* @__PURE__ */ jsx122(
     InputComboBox,
     {
       options,
@@ -21117,7 +21165,7 @@ var StatusSingleEditor = ({
 };
 var TextEditor = ({ onChange, ariaLabel, value, readOnly, valueTestId }) => {
   useDebounce3(() => onChange, 500, [value]);
-  return /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122(
     Input,
     {
       showLabel: false,
@@ -21160,9 +21208,9 @@ var NumberRangeEditor = ({
     setError("");
     onChange([minValue, maxValue]);
   }, [maxValue, minValue, setError]);
-  return /* @__PURE__ */ jsxs81(Fragment20, { children: [
-    /* @__PURE__ */ jsxs81("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
-      /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsxs82(Fragment20, { children: [
+    /* @__PURE__ */ jsxs82("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
+      /* @__PURE__ */ jsx122(
         Input,
         {
           label: `${ariaLabel}-min`,
@@ -21177,7 +21225,7 @@ var NumberRangeEditor = ({
           readOnly
         }
       ),
-      /* @__PURE__ */ jsx121(
+      /* @__PURE__ */ jsx122(
         Input,
         {
           type: "number",
@@ -21193,7 +21241,7 @@ var NumberRangeEditor = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx121(ErrorContainer, { errorMessage: error })
+    /* @__PURE__ */ jsx122(ErrorContainer, { errorMessage: error })
   ] });
 };
 var NumberEditor = ({
@@ -21204,7 +21252,7 @@ var NumberEditor = ({
   readOnly,
   valueTestId
 }) => {
-  return /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122(
     Input,
     {
       label: ariaLabel,
@@ -21227,7 +21275,7 @@ var DateEditor = ({
   readOnly,
   valueTestId
 }) => {
-  return /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122(
     Input,
     {
       type: "date",
@@ -21283,9 +21331,9 @@ var DateRangeEditor = ({
     setError("");
     onChange([minDateValue, maxDateValue]);
   }, [minDateValue, maxDateValue, setError]);
-  return /* @__PURE__ */ jsxs81(Fragment20, { children: [
-    /* @__PURE__ */ jsxs81("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
-      /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsxs82(Fragment20, { children: [
+    /* @__PURE__ */ jsxs82("div", { css: twoColumnGrid, "data-testid": valueTestId, children: [
+      /* @__PURE__ */ jsx122(
         Input,
         {
           label: `${ariaLabel}-min-date`,
@@ -21298,7 +21346,7 @@ var DateRangeEditor = ({
           readOnly
         }
       ),
-      /* @__PURE__ */ jsx121(
+      /* @__PURE__ */ jsx122(
         Input,
         {
           label: `${ariaLabel}-max-date`,
@@ -21312,7 +21360,7 @@ var DateRangeEditor = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx121(ErrorContainer, { errorMessage: error })
+    /* @__PURE__ */ jsx122(ErrorContainer, { errorMessage: error })
   ] });
 };
 var FilterEditorRenderer = ({ editorType, ...props }) => {
@@ -21323,7 +21371,7 @@ var FilterEditorRenderer = ({ editorType, ...props }) => {
   if (editorType === "empty") {
     return null;
   }
-  return /* @__PURE__ */ jsx121(Editor, { ...props, disabled: props.isDisabled });
+  return /* @__PURE__ */ jsx122(Editor, { ...props, disabled: props.isDisabled });
 };
 var filterMapper = {
   multiChoice: FilterMultiChoiceEditor,
@@ -21338,14 +21386,14 @@ var filterMapper = {
   empty: null
 };
 var ErrorContainer = ({ errorMessage }) => {
-  return /* @__PURE__ */ jsx121(
+  return /* @__PURE__ */ jsx122(
     "div",
     {
       css: {
         gridColumn: "span 6",
         order: 6
       },
-      children: /* @__PURE__ */ jsx121(FieldMessage, { errorMessage })
+      children: /* @__PURE__ */ jsx122(FieldMessage, { errorMessage })
     }
   );
 };
@@ -21357,14 +21405,14 @@ var twoColumnGrid = {
 
 // src/components/SearchAndFilter/FilterMenu.tsx
 import React24, { useEffect as useEffect20 } from "react";
-import { jsx as jsx122, jsxs as jsxs82 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx123, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterOptionsContainer2 = ({
   buttonRow,
   children
 }) => {
-  return /* @__PURE__ */ jsxs82("div", { css: SearchAndFilterOptionsContainer, "data-testid": "search-and-filter-options", children: [
-    /* @__PURE__ */ jsx122("div", { css: SearchAndFilterOptionsInnerContainer, children }),
-    buttonRow ? /* @__PURE__ */ jsx122(
+  return /* @__PURE__ */ jsxs83("div", { css: SearchAndFilterOptionsContainer, children: [
+    /* @__PURE__ */ jsx123("div", { css: SearchAndFilterOptionsInnerContainer, children }),
+    buttonRow ? /* @__PURE__ */ jsx123(
       HorizontalRhythm,
       {
         css: SearchAndFilterButtonGroup,
@@ -21376,7 +21424,13 @@ var SearchAndFilterOptionsContainer2 = ({
     ) : null
   ] });
 };
-var FilterMenu = ({ id, filterTitle = "Show results", menuControls, children }) => {
+var FilterMenu = ({
+  id,
+  filterTitle = "Show results",
+  menuControls,
+  children,
+  dataTestId
+}) => {
   const { filterVisibility, setFilterVisibility } = useSearchAndFilter();
   const innerMenuRef = React24.useRef(null);
   useEffect20(() => {
@@ -21385,16 +21439,17 @@ var FilterMenu = ({ id, filterTitle = "Show results", menuControls, children })
       (_a = innerMenuRef.current) == null ? void 0 : _a.focus();
     }
   }, [filterVisibility]);
-  return /* @__PURE__ */ jsx122(VerticalRhythm, { gap: "sm", "aria-haspopup": "true", id, children: filterVisibility ? /* @__PURE__ */ jsxs82(SearchAndFilterOptionsContainer2, { buttonRow: menuControls, children: [
-    /* @__PURE__ */ jsx122("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }),
-    /* @__PURE__ */ jsx122(
+  return /* @__PURE__ */ jsx123(VerticalRhythm, { gap: "sm", "aria-haspopup": "true", id, "data-testid": dataTestId, children: filterVisibility ? /* @__PURE__ */ jsxs83(SearchAndFilterOptionsContainer2, { buttonRow: menuControls, children: [
+    /* @__PURE__ */ jsx123("span", { css: Title, ref: innerMenuRef, tabIndex: 0, children: filterTitle }),
+    /* @__PURE__ */ jsx123(
       "button",
       {
         type: "button",
         "aria-label": "close filters",
         css: [CloseBtn],
         onClick: () => setFilterVisibility(void 0),
-        children: /* @__PURE__ */ jsx122(Icon, { icon: "close", iconColor: "currentColor", size: "1.1rem" })
+        "data-testid": "close-filters",
+        children: /* @__PURE__ */ jsx123(Icon, { icon: "close", iconColor: "currentColor", size: "1.1rem" })
       }
     ),
     children
@@ -21402,7 +21457,7 @@ var FilterMenu = ({ id, filterTitle = "Show results", menuControls, children })
 };
 
 // src/components/SearchAndFilter/FilterItem.tsx
-import { Fragment as Fragment21, jsx as jsx123, jsxs as jsxs83 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment21, jsx as jsx124, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
 var FilterItem = ({
   index,
   paramOptions,
@@ -21450,10 +21505,10 @@ var FilterItem = ({
     menuIsOpen: false,
     isClearable: false
   } : {};
-  return /* @__PURE__ */ jsxs83("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
-    /* @__PURE__ */ jsx123("span", { children: index === 0 ? "Where" : "and" }),
-    /* @__PURE__ */ jsxs83("div", { css: ConditionalInputRow, children: [
-      /* @__PURE__ */ jsx123(
+  return /* @__PURE__ */ jsxs84("div", { css: ConditionalFilterRow, "data-testid": "filter-item", children: [
+    /* @__PURE__ */ jsx124("span", { children: index === 0 ? "Where" : "and" }),
+    /* @__PURE__ */ jsxs84("div", { css: ConditionalInputRow, children: [
+      /* @__PURE__ */ jsx124(
         InputComboBox,
         {
           "aria-label": label,
@@ -21479,7 +21534,7 @@ var FilterItem = ({
           id: "filter-field"
         }
       ),
-      /* @__PURE__ */ jsx123(
+      /* @__PURE__ */ jsx124(
         InputComboBox,
         {
           "aria-label": operatorLabel,
@@ -21502,7 +21557,7 @@ var FilterItem = ({
           id: "filter-operator"
         }
       ),
-      /* @__PURE__ */ jsx123(
+      /* @__PURE__ */ jsx124(
         FilterEditorRenderer,
         {
           "aria-label": metaDataLabel,
@@ -21515,7 +21570,7 @@ var FilterItem = ({
           valueTestId: "filter-value"
         }
       ),
-      readOnly ? null : /* @__PURE__ */ jsx123(
+      readOnly ? null : /* @__PURE__ */ jsx124(
         "button",
         {
           type: "button",
@@ -21523,7 +21578,7 @@ var FilterItem = ({
           "aria-label": "delete filter",
           css: IconBtn,
           "data-testid": "delete-filter",
-          children: /* @__PURE__ */ jsx123(Icon, { icon: "trash", iconColor: "red", size: "1rem" })
+          children: /* @__PURE__ */ jsx124(Icon, { icon: "trash", iconColor: "red", size: "1rem" })
         }
       )
     ] })
@@ -21539,7 +21594,12 @@ var FilterItems = ({
     const next = [...filters];
     next[index] = { ...next[index], [prop]: value };
     if (prop === "operator") {
-      next[index].value = "";
+      if (["eq", "neq", "lt", "gt"].includes(value) && Array.isArray(next[index].value)) {
+        next[index].value = next[index].value[0];
+      }
+      if (["between"].includes(value) && Array.isArray(next[index].value) === false) {
+        next[index].value = [next[index].value, ""];
+      }
       if (value === "def" || value === "true") {
         next[index].value = "true";
       }
@@ -21557,12 +21617,13 @@ var FilterItems = ({
     }
     setFilters(next);
   };
-  return /* @__PURE__ */ jsx123(
+  return /* @__PURE__ */ jsx124(
     FilterMenu,
     {
       id: "search-and-filter-options",
-      menuControls: /* @__PURE__ */ jsxs83(Fragment21, { children: [
-        /* @__PURE__ */ jsxs83(
+      dataTestId: "search-and-filter-options",
+      menuControls: /* @__PURE__ */ jsxs84(Fragment21, { children: [
+        /* @__PURE__ */ jsxs84(
           "button",
           {
             type: "button",
@@ -21570,12 +21631,12 @@ var FilterItems = ({
             onClick: handleAddFilter,
             "data-testid": "add-filter",
             children: [
-              /* @__PURE__ */ jsx123(Icon, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
+              /* @__PURE__ */ jsx124(Icon, { icon: "math-plus", iconColor: "currentColor", size: "1rem" }),
               addButtonText
             ]
           }
         ),
-        (filters == null ? void 0 : filters.length) ? /* @__PURE__ */ jsx123(
+        (filters == null ? void 0 : filters.length) ? /* @__PURE__ */ jsx124(
           "button",
           {
             type: "button",
@@ -21597,7 +21658,7 @@ var FilterItems = ({
         })) == null ? void 0 : _a.options) != null ? _b : [];
         const possibleValueOptions = (_d = (_c = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _c.valueOptions) != null ? _d : [];
         const possibleOperators = (_f = (_e = availableTypeOptions == null ? void 0 : availableTypeOptions.find((op) => op.value === item.field)) == null ? void 0 : _e.operatorOptions) != null ? _f : [];
-        return /* @__PURE__ */ jsx123(
+        return /* @__PURE__ */ jsx124(
           FilterItem,
           {
             index: i,
@@ -21742,7 +21803,7 @@ var segmentedControlLabelContentStyles = css94`
 var segmentedControlLabelTextStyles = css94``;
 
 // src/components/SegmentedControl/SegmentedControl.tsx
-import { jsx as jsx124, jsxs as jsxs84 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx125, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
 var SegmentedControl = ({
   name,
   options,
@@ -21773,7 +21834,7 @@ var SegmentedControl = ({
   const isIconOnly = useMemo8(() => {
     return options.every((option) => option && option.icon && !option.label);
   }, [options]);
-  return /* @__PURE__ */ jsx124(
+  return /* @__PURE__ */ jsx125(
     "div",
     {
       css: [segmentedControlStyles, orientation === "vertical" ? segmentedControlVerticalStyles : void 0],
@@ -21785,7 +21846,7 @@ var SegmentedControl = ({
         }
         const text = option.label ? option.label : option.icon ? null : String(option.value);
         const isDisabled = disabled2 || option.disabled;
-        return /* @__PURE__ */ jsx124(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx124("div", { css: segmentedControlItemStyles, "data-testid": "container-segmented-control", children: /* @__PURE__ */ jsxs84(
+        return /* @__PURE__ */ jsx125(Tooltip, { title: (_a = option.tooltip) != null ? _a : "", children: /* @__PURE__ */ jsx125("div", { css: segmentedControlItemStyles, "data-testid": "container-segmented-control", children: /* @__PURE__ */ jsxs85(
           "label",
           {
             css: [
@@ -21794,7 +21855,7 @@ var SegmentedControl = ({
               isIconOnly ? segmentedControlLabelIconOnlyStyles : void 0
             ],
             children: [
-              /* @__PURE__ */ jsx124(
+              /* @__PURE__ */ jsx125(
                 "input",
                 {
                   css: segmentedControlInputStyles,
@@ -21806,10 +21867,10 @@ var SegmentedControl = ({
                   disabled: isDisabled
                 }
               ),
-              option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx124(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
-              /* @__PURE__ */ jsxs84("span", { css: segmentedControlLabelContentStyles, children: [
-                !option.icon ? null : /* @__PURE__ */ jsx124(Icon, { icon: option.icon, size: "1.5em", iconColor: "currentColor" }),
-                !text ? null : /* @__PURE__ */ jsx124("span", { css: segmentedControlLabelTextStyles, children: text })
+              option.value !== value || noCheckmark ? null : /* @__PURE__ */ jsx125(CgCheck4, { css: segmentedControlLabelCheckStyles, "aria-label": "Selected", size: "1.5em" }),
+              /* @__PURE__ */ jsxs85("span", { css: segmentedControlLabelContentStyles, children: [
+                !option.icon ? null : /* @__PURE__ */ jsx125(Icon, { icon: option.icon, size: "1.5em", iconColor: "currentColor" }),
+                !text ? null : /* @__PURE__ */ jsx125("span", { css: segmentedControlLabelTextStyles, children: text })
               ] })
             ]
           }
@@ -21820,7 +21881,7 @@ var SegmentedControl = ({
 };
 
 // src/components/SearchAndFilter/SortItems.tsx
-import { jsx as jsx125, jsxs as jsxs85 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx126, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
 var SortItems = () => {
   var _a, _b;
   const { sortOptions, setSortBy, sortByValue } = useSearchAndFilter();
@@ -21831,8 +21892,8 @@ var SortItems = () => {
     var _a2;
     return (_a2 = item.options) == null ? void 0 : _a2.find((option) => option.value === sortField);
   })) == null ? void 0 : _a.options) == null ? void 0 : _b.find((nestedOption) => nestedOption.value === sortField);
-  return /* @__PURE__ */ jsx125(FilterMenu, { id: "search-and-filter-options", filterTitle: "Sort by", children: /* @__PURE__ */ jsxs85("div", { css: SortFilterInputRow, children: [
-    /* @__PURE__ */ jsx125(
+  return /* @__PURE__ */ jsx126(FilterMenu, { id: "search-and-filter-options", filterTitle: "Sort by", dataTestId: "sorting-options", children: /* @__PURE__ */ jsxs86("div", { css: SortFilterInputRow, children: [
+    /* @__PURE__ */ jsx126(
       InputComboBox,
       {
         options: sortOptions,
@@ -21848,10 +21909,11 @@ var SortItems = () => {
             };
           }
         },
-        value: currentSelectedOption
+        value: currentSelectedOption,
+        id: "sort-by-field"
       }
     ),
-    /* @__PURE__ */ jsx125(
+    /* @__PURE__ */ jsx126(
       SegmentedControl,
       {
         noCheckmark: true,
@@ -21861,25 +21923,26 @@ var SortItems = () => {
           { label: "Descending", value: `DESC` }
         ],
         onChange: (e) => setSortBy(`${sortField}_${e}`),
-        value: sortDirection
+        value: sortDirection,
+        "data-testid": "ordering-options"
       }
     )
   ] }) });
 };
 
 // src/components/SearchAndFilter/FilterModeView.tsx
-import { jsx as jsx126 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx127 } from "@emotion/react/jsx-runtime";
 var FilterModeView = () => {
   const { filterVisibility } = useSearchAndFilter();
   const modeView = {
-    filters: /* @__PURE__ */ jsx126(FilterItems, {}),
-    sort: /* @__PURE__ */ jsx126(SortItems, {})
+    filters: /* @__PURE__ */ jsx127(FilterItems, {}),
+    sort: /* @__PURE__ */ jsx127(SortItems, {})
   };
   return filterVisibility ? modeView[filterVisibility] : null;
 };
 
 // src/components/SearchAndFilter/SearchAndFilterResultContainer.tsx
-import { Fragment as Fragment22, jsx as jsx127, jsxs as jsxs86 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment22, jsx as jsx128, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
 var SearchAndFilterResultContainer = ({
   buttonText,
   clearButtonLabel = "clear",
@@ -21913,24 +21976,24 @@ var SearchAndFilterResultContainer = ({
   if (totalResults && totalResults > 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxs86(Fragment22, { children: [
-    /* @__PURE__ */ jsxs86(HorizontalRhythm, { children: [
-      /* @__PURE__ */ jsxs86("span", { children: [
+  return /* @__PURE__ */ jsxs87(Fragment22, { children: [
+    /* @__PURE__ */ jsxs87(HorizontalRhythm, { children: [
+      /* @__PURE__ */ jsxs87("span", { children: [
         totalResults,
         " results ",
         searchTerm ? `for "${searchTerm}"` : null
       ] }),
-      !searchTerm ? null : /* @__PURE__ */ jsx127(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
+      !searchTerm ? null : /* @__PURE__ */ jsx128(Button, { buttonType: "ghostDestructive", size: "zero", onClick: () => setSearchTerm(""), children: clearButtonLabel })
     ] }),
-    totalResults === 0 ? /* @__PURE__ */ jsxs86(Callout, { title: calloutTitle2 != null ? calloutTitle2 : automateCalloutTitle(), type: "note", children: [
-      calloutText ? /* @__PURE__ */ jsx127(Paragraph, { children: calloutText }) : null,
-      /* @__PURE__ */ jsx127(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
+    totalResults === 0 ? /* @__PURE__ */ jsxs87(Callout, { title: calloutTitle2 != null ? calloutTitle2 : automateCalloutTitle(), type: "note", children: [
+      calloutText ? /* @__PURE__ */ jsx128(Paragraph, { children: calloutText }) : null,
+      /* @__PURE__ */ jsx128(Button, { buttonType: "tertiaryOutline", size: "xs", onClick: onHandleClear != null ? onHandleClear : handleResetFilters, children: buttonText != null ? buttonText : "Clear search" })
     ] }) : null
   ] });
 };
 
 // src/components/SearchAndFilter/SearchAndFilter.tsx
-import { jsx as jsx128, jsxs as jsxs87 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx129, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
 var SearchAndFilter = ({
   filters,
   filterOptions,
@@ -21939,14 +22002,15 @@ var SearchAndFilter = ({
   defaultSortByValue,
   filterControls,
   viewSwitchControls,
-  resultsContainerView = /* @__PURE__ */ jsx128(SearchAndFilterResultContainer, {}),
-  children = /* @__PURE__ */ jsx128(FilterModeView, {}),
+  resultsContainerView = /* @__PURE__ */ jsx129(SearchAndFilterResultContainer, {}),
+  children = /* @__PURE__ */ jsx129(FilterModeView, {}),
   onChange,
   onSearchChange,
   onSortChange,
-  totalResults
+  totalResults,
+  resetFilterValues = []
 }) => {
-  return /* @__PURE__ */ jsx128(
+  return /* @__PURE__ */ jsx129(
     SearchAndFilterProvider,
     {
       filters,
@@ -21958,15 +22022,16 @@ var SearchAndFilter = ({
       onSearchChange,
       onSortChange,
       totalResults,
-      children: /* @__PURE__ */ jsxs87(VerticalRhythm, { css: SearchAndFilterContainer, "data-testid": "search-and-filter", children: [
-        /* @__PURE__ */ jsxs87("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
-          /* @__PURE__ */ jsx128(
+      resetFilterValues,
+      children: /* @__PURE__ */ jsxs88(VerticalRhythm, { css: SearchAndFilterContainer, "data-testid": "search-and-filter", children: [
+        /* @__PURE__ */ jsxs88("div", { css: SearchAndFilterOutterControlWrapper(viewSwitchControls ? "1fr auto" : "1fr"), children: [
+          /* @__PURE__ */ jsx129(
             "div",
             {
               css: SearchAndFilterControlsWrapper(
                 viewSwitchControls ? "auto auto 1fr 0.5fr" : "auto auto 1fr"
               ),
-              children: !filterControls ? /* @__PURE__ */ jsx128(FilterControls, { hideSearchInput: !onSearchChange, defaultSortByValue }) : filterControls
+              children: !filterControls ? /* @__PURE__ */ jsx129(FilterControls, { hideSearchInput: !onSearchChange, defaultSortByValue }) : filterControls
             }
           ),
           viewSwitchControls
@@ -21981,7 +22046,7 @@ var SearchAndFilter = ({
 // src/components/SearchAndFilter/SearchOnlyFilter.tsx
 import { createContext as createContext7, useState as useState19 } from "react";
 import { useDebounce as useDebounce4 } from "react-use";
-import { jsx as jsx129 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx130 } from "@emotion/react/jsx-runtime";
 var SearchOnlyContext = createContext7({
   searchTerm: "",
   setSearchTerm: () => {
@@ -21998,14 +22063,14 @@ var SearchOnlyFilter = ({ onSearchChange, maxWidth }) => {
     300,
     [localeSearchTerm]
   );
-  return /* @__PURE__ */ jsx129(
+  return /* @__PURE__ */ jsx130(
     SearchOnlyContext.Provider,
     {
       value: {
         searchTerm,
         setSearchTerm: setLocaleSearchTerm
       },
-      children: /* @__PURE__ */ jsx129("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx129(
+      children: /* @__PURE__ */ jsx130("div", { css: { maxWidth: maxWidth != null ? maxWidth : "712px" }, children: /* @__PURE__ */ jsx130(
         InputKeywordSearch,
         {
           placeholder: "Search...",
@@ -22031,7 +22096,7 @@ var skeletonStyles = css96`
 `;
 
 // src/components/Skeleton/Skeleton.tsx
-import { jsx as jsx130 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx131 } from "@emotion/react/jsx-runtime";
 var Skeleton = ({
   width = "100%",
   height = "1.25rem",
@@ -22039,7 +22104,7 @@ var Skeleton = ({
   circle = false,
   children,
   ...otherProps
-}) => /* @__PURE__ */ jsx130(
+}) => /* @__PURE__ */ jsx131(
   "div",
   {
     css: [
@@ -22146,19 +22211,19 @@ var SwitchText = css97`
 `;
 
 // src/components/Switch/Switch.tsx
-import { Fragment as Fragment23, jsx as jsx131, jsxs as jsxs88 } from "@emotion/react/jsx-runtime";
+import { Fragment as Fragment23, jsx as jsx132, jsxs as jsxs89 } from "@emotion/react/jsx-runtime";
 var Switch = React26.forwardRef(
   ({ label, infoText, toggleText, children, ...inputProps }, ref) => {
     let additionalText = infoText;
     if (infoText && toggleText) {
       additionalText = inputProps.checked ? toggleText : infoText;
     }
-    return /* @__PURE__ */ jsxs88(Fragment23, { children: [
-      /* @__PURE__ */ jsxs88("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
-        /* @__PURE__ */ jsx131("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
-        /* @__PURE__ */ jsx131("span", { css: SwitchInputLabel, children: label })
+    return /* @__PURE__ */ jsxs89(Fragment23, { children: [
+      /* @__PURE__ */ jsxs89("label", { css: [SwitchInputContainer, inputProps.disabled ? SwitchInputDisabled : void 0], children: [
+        /* @__PURE__ */ jsx132("input", { type: "checkbox", css: SwitchInput, ...inputProps, ref }),
+        /* @__PURE__ */ jsx132("span", { css: SwitchInputLabel, children: label })
       ] }),
-      additionalText ? /* @__PURE__ */ jsx131("p", { css: SwitchText, children: additionalText }) : null,
+      additionalText ? /* @__PURE__ */ jsx132("p", { css: SwitchText, children: additionalText }) : null,
       children
     ] });
   }
@@ -22195,40 +22260,40 @@ var tableCellHead = css98`
 `;
 
 // src/components/Table/Table.tsx
-import { jsx as jsx132 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx133 } from "@emotion/react/jsx-runtime";
 var Table = React27.forwardRef(
   ({ children, cellPadding, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("table", { ref, css: table({ cellPadding }), ...otherProps, children });
+    return /* @__PURE__ */ jsx133("table", { ref, css: table({ cellPadding }), ...otherProps, children });
   }
 );
 var TableHead = React27.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("thead", { ref, css: tableHead, ...otherProps, children });
+    return /* @__PURE__ */ jsx133("thead", { ref, css: tableHead, ...otherProps, children });
   }
 );
 var TableBody = React27.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("tbody", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx133("tbody", { ref, ...otherProps, children });
   }
 );
 var TableFoot = React27.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("tfoot", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx133("tfoot", { ref, ...otherProps, children });
   }
 );
 var TableRow = React27.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("tr", { ref, css: tableRow, ...otherProps, children });
+    return /* @__PURE__ */ jsx133("tr", { ref, css: tableRow, ...otherProps, children });
   }
 );
 var TableCellHead = React27.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("th", { ref, css: tableCellHead, ...otherProps, children });
+    return /* @__PURE__ */ jsx133("th", { ref, css: tableCellHead, ...otherProps, children });
   }
 );
 var TableCellData = React27.forwardRef(
   ({ children, ...otherProps }, ref) => {
-    return /* @__PURE__ */ jsx132("td", { ref, ...otherProps, children });
+    return /* @__PURE__ */ jsx133("td", { ref, ...otherProps, children });
   }
 );
 
@@ -22268,7 +22333,7 @@ var tabButtonGroupStyles = css99`
 `;
 
 // src/components/Tabs/Tabs.tsx
-import { jsx as jsx133 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx134 } from "@emotion/react/jsx-runtime";
 var useCurrentTab = () => {
   const context = useAriakitTabStore();
   if (!context) {
@@ -22306,23 +22371,23 @@ var Tabs = ({
       tab.setSelectedId(selected);
     }
   }, [selected, tab]);
-  return /* @__PURE__ */ jsx133(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
+  return /* @__PURE__ */ jsx134(AriakitTabProvider, { store: tab, setSelectedId: onTabSelect, children });
 };
 var TabButtonGroup = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx133(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
+  return /* @__PURE__ */ jsx134(AriakitTabList, { ...props, css: tabButtonGroupStyles, children });
 };
 var TabButton = ({
   children,
   id,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx133(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
+  return /* @__PURE__ */ jsx134(AriakitTab, { type: "button", id, ...props, css: tabButtonStyles, children });
 };
 var TabContent = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsx133(AriakitTabPanel, { ...props, children });
+  return /* @__PURE__ */ jsx134(AriakitTabPanel, { ...props, children });
 };
 
 // src/components/Toast/Toast.tsx
@@ -22553,9 +22618,9 @@ var toastContainerStyles = css100`
 `;
 
 // src/components/Toast/Toast.tsx
-import { jsx as jsx134 } from "@emotion/react/jsx-runtime";
+import { jsx as jsx135 } from "@emotion/react/jsx-runtime";
 var ToastContainer = ({ limit = 4 }) => {
-  return /* @__PURE__ */ jsx134(
+  return /* @__PURE__ */ jsx135(
     ToastifyContainer,
     {
       css: toastContainerStyles,
@@ -22654,6 +22719,7 @@ export {
   MenuItemInner,
   MenuItemSeparator,
   Modal,
+  ModalDialog,
   MultilineChip,
   NUMBER_OPERATORS,
   PageHeaderSection,