@elliemae/ds-data-table 3.60.0-next.9 → 3.70.0-next.1

package/dist/cjs/exported-related/FilterPopover/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/FilterPopover/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable import/no-cycle */\n/* eslint-disable no-void */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport type { DSPopperJST } from '@elliemae/ds-popperjs';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { DSDataTableName, DSDataTableSlots } from '../../constants/index.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { FilterPopoverProps } from './types.js';\nimport { useGetFilterHandlers } from './useGetFilterHandlers.js';\nimport { useGetFilterVisibility } from './useGetFilterVisibility.js';\n\nconst FilterButton = styled('span', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_BUTTON })<{\n  hide: boolean;\n}>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst PopperContent = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_CONTENT })`\n  background-color: #fff;\n`;\n\nconst StyledPoppoverJS = styled(DSPopperJS, {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.FILTER_POPOVER,\n})``;\n\nconst ButtonTrap = ({ cb }: { cb: () => void }) => (\n  <span\n    // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n    tabIndex={0}\n    onFocus={(e: React.FocusEvent) => {\n      e.stopPropagation();\n      cb();\n    }}\n  />\n);\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = (props: FilterPopoverProps) => {\n  const { column, customStyles, reduxHeader, menuContent, columnId, ariaLabel, triggerIcon, innerRef } = props;\n\n  const filters = usePropsStore((state) => state.filters);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const getOwnerPropsArguments = useCallback(\n    () => ({\n      columnId: column.id,\n    }),\n    [column.id],\n  );\n\n  const patchHeader = useInternalStore((state) => state.patchHeader);\n\n  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n  const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n  const [isButtonFocused, setIsButtonFocused] = useState(false);\n\n  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n    useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n  const buttonTrapCallback = useCallback(() => {\n    patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false });\n    buttonReference?.focus();\n  }, [columnId, patchHeader, buttonReference]);\n\n  const actionRef: Required<DSPopperJST.Props>['actionRef'] = useRef({\n    update: null,\n  });\n\n  useEffect(() => {\n    // When the filters change, we need to update the popper position,\n    // because the filter bar might push the datatable up or down, causing the popper to be misaligned\n    void actionRef.current.update?.();\n  }, [filters]);\n\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={handleMenuOnKeyDown}\n    >\n      <FilterButton\n        hide={!isIconVisible}\n        data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}\n        getOwnerProps={getOwnerProps}\n      >\n        <DSButtonV2\n          buttonType=\"icon\"\n          size=\"s\"\n          onClick={handleTriggerClick}\n          onFocus={handleTriggerOnFocus}\n          onBlur={handleTriggerOnBlur}\n          innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n          aria-label={ariaLabel}\n          aria-hidden={!isButtonFocused}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON_ELEMENT}\n        >\n          {triggerIcon}\n        </DSButtonV2>\n      </FilterButton>\n      {buttonReference && (\n        <StyledPoppoverJS\n          actionRef={actionRef}\n          referenceElement={buttonReference}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={[5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end', 'top-end']}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n        >\n          <PopperContent getOwnerProps={getOwnerProps}>\n            <ButtonTrap cb={buttonTrapCallback} />\n            {menuContent}\n            <ButtonTrap cb={buttonTrapCallback} />\n          </PopperContent>\n        </StyledPoppoverJS>\n      )}\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable import/no-cycle */\n/* eslint-disable no-void */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { useFocusTrap } from '@elliemae/ds-hooks-focus-trap';\nimport type { DSPopperJST } from '@elliemae/ds-popperjs';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../constants/index.js';\nimport type { FilterPopoverProps } from './types.js';\nimport { useGetFilterHandlers } from './useGetFilterHandlers.js';\nimport { useGetFilterVisibility } from './useGetFilterVisibility.js';\n\nconst FilterButton = styled('span', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_BUTTON })<{\n  hide: boolean;\n}>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nconst PopperContent = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_CONTENT })`\n  background-color: #fff;\n`;\n\nconst StyledPoppoverJS = styled(DSPopperJS, {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.FILTER_POPOVER,\n})``;\n\nexport const FilterPopover: React.ComponentType<FilterPopoverProps> = (props: FilterPopoverProps) => {\n  const {\n    column,\n    customStyles,\n    reduxHeader,\n    menuContent,\n    ariaLabel,\n    triggerIcon,\n    innerRef,\n    columnReference,\n    firstElementRef,\n    lastElementRef,\n  } = props;\n\n  const filters = usePropsStore((state) => state.filters);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const getOwnerPropsArguments = useCallback(\n    () => ({\n      columnId: column.id,\n    }),\n    [column.id],\n  );\n\n  const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n  const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n  const [isButtonFocused, setIsButtonFocused] = useState(false);\n\n  const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n    useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n  const actionRef: Required<DSPopperJST.Props>['actionRef'] = useRef({\n    update: null,\n  });\n  const popoverContentRef = useRef<HTMLDivElement>(null);\n\n  const handleOnKeyDown = useFocusTrap({\n    firstElementRef,\n    lastElementRef,\n  });\n\n  useEffect(() => {\n    // When the filters change, we need to update the popper position,\n    // because the filter bar might push the datatable up or down, causing the popper to be misaligned\n    void actionRef.current.update?.();\n  }, [filters]);\n\n  return (\n    <div\n      // This is here to prevent propagation, and not trigger the sort functionality\n      onClick={(e) => e.stopPropagation()}\n      onKeyDown={handleMenuOnKeyDown}\n    >\n      <FilterButton\n        hide={!isIconVisible}\n        data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON}\n        getOwnerProps={getOwnerProps}\n      >\n        <DSButtonV2\n          buttonType=\"icon\"\n          size=\"s\"\n          onClick={handleTriggerClick}\n          onFocus={handleTriggerOnFocus}\n          onBlur={handleTriggerOnBlur}\n          innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n          tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n          aria-label={ariaLabel}\n          aria-hidden={!isButtonFocused}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_BUTTON_ELEMENT}\n        >\n          {triggerIcon}\n        </DSButtonV2>\n      </FilterButton>\n      {(columnReference || buttonReference) && (\n        <StyledPoppoverJS\n          actionRef={actionRef}\n          referenceElement={columnReference || buttonReference}\n          showPopover={isMenuOpen}\n          closeContextMenu={handleClickOutsideMenu}\n          data-testid={DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n          startPlacementPreference=\"bottom-end\"\n          customOffset={columnReference ? [0, 1] : [5, 4]}\n          withoutArrow\n          withoutAnimation\n          extraPopperStyles={{\n            ...customStyles,\n            minWidth: column.ref?.current?.offsetWidth ?? '0px',\n          }}\n          placementOrderPreference={['bottom-end', 'top-end']}\n          getOwnerProps={getOwnerProps}\n          getOwnerPropsArguments={getOwnerPropsArguments}\n          role=\"dialog\"\n          aria-label={`Filter by ${column.Header as string}`}\n        >\n          <PopperContent getOwnerProps={getOwnerProps} innerRef={popoverContentRef} onKeyDown={handleOnKeyDown}>\n            {menuContent}\n          </PopperContent>\n        </StyledPoppoverJS>\n      )}\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": ["import_constants"]
 }

package/dist/cjs/exported-related/FilterPopover/styled.js

@@ -0,0 +1,62 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var styled_exports = {};
+__export(styled_exports, {
+  FilterButton: () => FilterButton,
+  PopperContent: () => PopperContent,
+  StyledDSDialogFooter: () => StyledDSDialogFooter,
+  StyledFloatingWrapper: () => StyledFloatingWrapper
+});
+module.exports = __toCommonJS(styled_exports);
+var React = __toESM(require("react"));
+var import_ds_system = require("@elliemae/ds-system");
+var import_ds_dialog = require("@elliemae/ds-dialog");
+var import_ds_floating_context = require("@elliemae/ds-floating-context");
+var import_constants = require("../../constants/index.js");
+const FilterButton = (0, import_ds_system.styled)("span", { name: import_constants.DSDataTableName, slot: import_constants.DSDataTableSlots.FILTER_POPOVER_BUTTON })`
+  display: inline-grid;
+  ${(props) => props.hide ? "opacity: 0; display: none; width: 0;" : ""}
+`;
+const PopperContent = (0, import_ds_system.styled)("div", { name: import_constants.DSDataTableName, slot: import_constants.DSDataTableSlots.FILTER_POPOVER_CONTENT })`
+  background-color: #fff;
+`;
+const StyledFloatingWrapper = (0, import_ds_system.styled)(import_ds_floating_context.FloatingWrapper, {
+  name: import_constants.DSDataTableName,
+  slot: import_constants.DSDataTableSlots.FILTER_POPOVER
+})``;
+const StyledDSDialogFooter = (0, import_ds_system.styled)(import_ds_dialog.DSDialogFooter, {
+  name: import_constants.DSDataTableName,
+  slot: import_constants.DSDataTableSlots.FILTER_POPOVER_FOOTER
+})`
+  display: flex;
+  flex-wrap: wrap;
+  padding-top: 8px;
+  padding-bottom: 8px;
+`;
+//# sourceMappingURL=styled.js.map

package/dist/cjs/exported-related/FilterPopover/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/exported-related/FilterPopover/styled.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSDialogFooter } from '@elliemae/ds-dialog';\nimport { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { DSDataTableName, DSDataTableSlots } from '../../constants/index.js';\n\nexport const FilterButton = styled('span', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_BUTTON })<{\n  hide: boolean;\n}>`\n  display: inline-grid;\n  ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nexport const PopperContent = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_CONTENT })`\n  background-color: #fff;\n`;\n\nexport const StyledFloatingWrapper = styled(FloatingWrapper, {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.FILTER_POPOVER,\n})``;\n\nexport const StyledDSDialogFooter = styled(DSDialogFooter, {\n  name: DSDataTableName,\n  slot: DSDataTableSlots.FILTER_POPOVER_FOOTER,\n})`\n  display: flex;\n  flex-wrap: wrap;\n  padding-top: 8px;\n  padding-bottom: 8px;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,uBAA+B;AAC/B,iCAAgC;AAChC,uBAAkD;AAE3C,MAAM,mBAAe,yBAAO,QAAQ,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,sBAAsB,CAAC;AAAA;AAAA,IAI9G,CAAC,UAAW,MAAM,OAAO,yCAAyC,EAAG;AAAA;AAGlE,MAAM,oBAAgB,yBAAO,OAAO,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,uBAAuB,CAAC;AAAA;AAAA;AAI5G,MAAM,4BAAwB,yBAAO,4CAAiB;AAAA,EAC3D,MAAM;AAAA,EACN,MAAM,kCAAiB;AACzB,CAAC;AAEM,MAAM,2BAAuB,yBAAO,iCAAgB;AAAA,EACzD,MAAM;AAAA,EACN,MAAM,kCAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;",
+  "names": []
+}

package/dist/cjs/exported-related/FilterPopover/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/FilterPopover/types.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import type React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport interface FilterPopoverProps {\n  column: DSDataTableT.InternalColumn;\n  columnId: string;\n  triggerIcon: JSX.Element;\n  menuContent: JSX.Element;\n  onTriggerClick?: (id: string, e: React.MouseEvent | React.KeyboardEvent) => void;\n  onClickOutsideMenu?: (id: string) => void;\n  reduxHeader: DSDataTableT.ReduxHeader;\n  innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import type React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport interface FilterPopoverProps {\n  column: DSDataTableT.InternalColumn;\n  columnId: string;\n  columnReference?: HTMLElement | null;\n  triggerIcon: JSX.Element;\n  menuContent: JSX.Element;\n  onTriggerClick?: (id: string, e: React.MouseEvent | React.KeyboardEvent) => void;\n  onClickOutsideMenu?: (id: string) => void;\n  reduxHeader: DSDataTableT.ReduxHeader;\n  innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\n  firstElementRef: React.RefObject<HTMLElement>;\n  lastElementRef: React.RefObject<HTMLElement>;\n}\n\nexport interface FilterPopoverV2Props {\n  column: DSDataTableT.InternalColumn;\n  columnId: string;\n  columnReference?: HTMLElement | null;\n  triggerIcon: JSX.Element;\n  menuContent: JSX.Element;\n  onTriggerClick?: (id: string, e: React.MouseEvent | React.KeyboardEvent) => void;\n  onClickOutsideMenu?: (id: string) => void;\n  reduxHeader: DSDataTableT.ReduxHeader;\n  innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n  ariaLabel: string;\n  customStyles?: React.CSSProperties;\n  firstElementRef: React.RefObject<HTMLElement>;\n  onFilterSubmit: (e: React.SyntheticEvent) => void;\n  onFilterReset: () => void;\n}\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
   "names": []
 }

package/dist/cjs/exported-related/FilterPopover/useGetFilterHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/FilterPopover/useGetFilterHandlers.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-params */\nimport type React from 'react';\nimport { useCallback, useEffect, useRef } from 'react';\nimport { useInternalStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { FilterPopoverProps } from './types.js';\n\nconst emptyFunc = () => null;\n\n// https://jira.elliemae.io/browse/PUI-12457\nconst useIframeClickCloseWorkaround = ({\n  columnId,\n  isMenuOpen,\n}: {\n  columnId: FilterPopoverProps['columnId'];\n  isMenuOpen: boolean;\n}) => {\n  // due to how browser handle events when iframes are involved we can only listen to window \"blur\" event to understand if the user clicked on any iframe\n  // out of the box the filter are supposed to close when the user clicks outside of the filter contextual region\n  // this helper ensure that the filter will close even if the user clicks on an iframe.\n  // since we must do vanilla javascript we need to handle this with extreme care and ensure we optimize as much as possible.\n  // we want to attach/detach the event listener only when the filter is open and we want to detach it as soon as the filter is closed.\n  // this is to ensure that no matter how many columns have filter functionality we only pay the performance cost for the filter that would do anything with it.\n  const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n\n  // we only care to invoke the latest version of patchHeaderFilterButtonAndMenu\n  // we do not need to reattach the event listener if pathHeaderFilterButtonAndMenu changes\n  // event attachment/detachment is more expensive than a simple ref update performance wise.\n  const patchRef = useRef(patchHeaderFilterButtonAndMenu);\n  useEffect(() => {\n    patchRef.current = patchHeaderFilterButtonAndMenu;\n  }, [patchHeaderFilterButtonAndMenu]);\n\n  // extremely optimized event listener attachment/detachment\n  //  we run this side effect strictly when required to ensure the best performance possible.\n  //  it's strictly required when:\n  //    - the filter is open ( so clicking an iframe will close it )\n  //    - the columnId changes ( so we close the correct filter )\n  //  if patchHeaderFilterButtonAndMenu changes we do not care to reattach the event listener\n  //    as long as the .current ref is updated in time before the close event is triggered.\n  //  which is guaranteed by:\n  //    - the fact that we update the ref in the useEffect above\n  //    - the fact that we invoke patchRef.current as a consquence of the user \"clicking\" on the filter button (which happens after the previous useEffect)\n  useEffect(() => {\n    // we declare the function locally in the closure to ensure we can detach it later\n    // useEffect is run after render, useCallBack is run before render,\n    // which means that using useCallback here could potentially cause a memory-leak/dangling reference/attached event listener that is never detached\n    const handleBlur = () => {\n      patchRef.current(columnId, true);\n    };\n\n    if (isMenuOpen) window.addEventListener('blur', handleBlur);\n    else window.removeEventListener('blur', handleBlur);\n\n    return () => {\n      window.removeEventListener('blur', handleBlur);\n    };\n  }, [columnId, isMenuOpen]);\n};\n\nexport const useGetFilterHandlers = (\n  props: FilterPopoverProps,\n  isMenuOpen: boolean,\n  buttonReference: HTMLButtonElement | null,\n  setIsButtonFocused: React.Dispatch<React.SetStateAction<boolean>>,\n) => {\n  const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;\n  useIframeClickCloseWorkaround({ columnId, isMenuOpen });\n\n  const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n  const patchHeader = useInternalStore((state) => state.patchHeader);\n\n  const handleTriggerClick = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent) => {\n      onTriggerClick(columnId, e);\n      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n      e.stopPropagation();\n    },\n    [columnId, isMenuOpen, onTriggerClick, patchHeader],\n  );\n\n  const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);\n  const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);\n\n  const handleClickOutsideMenu = useCallback(() => {\n    onClickOutsideMenu(columnId);\n    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n  }, [columnId, isMenuOpen, onClickOutsideMenu, patchHeaderFilterButtonAndMenu]);\n\n  const handleMenuOnKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      e.stopPropagation();\n      if (e.code === 'Escape') {\n        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, showSortCaret: true });\n        buttonReference?.focus();\n      }\n      // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n      // so we just prevent default behaviour in this case\n      if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n        e.preventDefault();\n      }\n    },\n    [buttonReference, columnId, patchHeader],\n  );\n\n  return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["/* eslint-disable max-params */\nimport type React from 'react';\nimport { useCallback, useEffect, useRef } from 'react';\nimport { useInternalStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { FilterPopoverProps, FilterPopoverV2Props } from './types.js';\n\nconst emptyFunc = () => null;\n\n// https://jira.elliemae.io/browse/PUI-12457\nconst useIframeClickCloseWorkaround = ({\n  columnId,\n  isMenuOpen,\n}: {\n  columnId: FilterPopoverProps['columnId'];\n  isMenuOpen: boolean;\n}) => {\n  // due to how browser handle events when iframes are involved we can only listen to window \"blur\" event to understand if the user clicked on any iframe\n  // out of the box the filter are supposed to close when the user clicks outside of the filter contextual region\n  // this helper ensure that the filter will close even if the user clicks on an iframe.\n  // since we must do vanilla javascript we need to handle this with extreme care and ensure we optimize as much as possible.\n  // we want to attach/detach the event listener only when the filter is open and we want to detach it as soon as the filter is closed.\n  // this is to ensure that no matter how many columns have filter functionality we only pay the performance cost for the filter that would do anything with it.\n  const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n\n  // we only care to invoke the latest version of patchHeaderFilterButtonAndMenu\n  // we do not need to reattach the event listener if pathHeaderFilterButtonAndMenu changes\n  // event attachment/detachment is more expensive than a simple ref update performance wise.\n  const patchRef = useRef(patchHeaderFilterButtonAndMenu);\n  useEffect(() => {\n    patchRef.current = patchHeaderFilterButtonAndMenu;\n  }, [patchHeaderFilterButtonAndMenu]);\n\n  // extremely optimized event listener attachment/detachment\n  //  we run this side effect strictly when required to ensure the best performance possible.\n  //  it's strictly required when:\n  //    - the filter is open ( so clicking an iframe will close it )\n  //    - the columnId changes ( so we close the correct filter )\n  //  if patchHeaderFilterButtonAndMenu changes we do not care to reattach the event listener\n  //    as long as the .current ref is updated in time before the close event is triggered.\n  //  which is guaranteed by:\n  //    - the fact that we update the ref in the useEffect above\n  //    - the fact that we invoke patchRef.current as a consquence of the user \"clicking\" on the filter button (which happens after the previous useEffect)\n  useEffect(() => {\n    // we declare the function locally in the closure to ensure we can detach it later\n    // useEffect is run after render, useCallBack is run before render,\n    // which means that using useCallback here could potentially cause a memory-leak/dangling reference/attached event listener that is never detached\n    const handleBlur = () => {\n      patchRef.current(columnId, true);\n    };\n\n    if (isMenuOpen) window.addEventListener('blur', handleBlur);\n    else window.removeEventListener('blur', handleBlur);\n\n    return () => {\n      window.removeEventListener('blur', handleBlur);\n    };\n  }, [columnId, isMenuOpen]);\n};\n\nexport const useGetFilterHandlers = (\n  props: FilterPopoverProps | FilterPopoverV2Props,\n  isMenuOpen: boolean,\n  buttonReference: HTMLButtonElement | null,\n  setIsButtonFocused: React.Dispatch<React.SetStateAction<boolean>>,\n) => {\n  const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;\n  useIframeClickCloseWorkaround({ columnId, isMenuOpen });\n\n  const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n  const patchHeader = useInternalStore((state) => state.patchHeader);\n\n  const handleTriggerClick = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent) => {\n      onTriggerClick(columnId, e);\n      patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n      e.stopPropagation();\n    },\n    [columnId, isMenuOpen, onTriggerClick, patchHeader],\n  );\n\n  const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);\n  const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);\n\n  const handleClickOutsideMenu = useCallback(() => {\n    onClickOutsideMenu(columnId);\n    if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n  }, [columnId, isMenuOpen, onClickOutsideMenu, patchHeaderFilterButtonAndMenu]);\n\n  const handleMenuOnKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      e.stopPropagation();\n      if (e.code === 'Escape') {\n        patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, showSortCaret: true });\n        buttonReference?.focus();\n      }\n      // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n      // so we just prevent default behaviour in this case\n      if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n        e.preventDefault();\n      }\n    },\n    [buttonReference, columnId, patchHeader],\n  );\n\n  return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };\n};\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAA+C;AAC/C,2CAAiC;AAGjC,MAAM,YAAY,MAAM;AAGxB,MAAM,gCAAgC,CAAC;AAAA,EACrC;AAAA,EACA;AACF,MAGM;AAOJ,QAAM,qCAAiC,uDAAiB,CAAC,UAAU,MAAM,8BAA8B;AAKvG,QAAM,eAAW,qBAAO,8BAA8B;AACtD,8BAAU,MAAM;AACd,aAAS,UAAU;AAAA,EACrB,GAAG,CAAC,8BAA8B,CAAC;AAYnC,8BAAU,MAAM;AAId,UAAM,aAAa,MAAM;AACvB,eAAS,QAAQ,UAAU,IAAI;AAAA,IACjC;AAEA,QAAI,WAAY,QAAO,iBAAiB,QAAQ,UAAU;AAAA,QACrD,QAAO,oBAAoB,QAAQ,UAAU;AAElD,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,UAAU;AAAA,IAC/C;AAAA,EACF,GAAG,CAAC,UAAU,UAAU,CAAC;AAC3B;AAEO,MAAM,uBAAuB,CAClC,OACA,YACA,iBACA,uBACG;AACH,QAAM,EAAE,UAAU,iBAAiB,WAAW,qBAAqB,UAAU,IAAI;AACjF,gCAA8B,EAAE,UAAU,WAAW,CAAC;AAEtD,QAAM,qCAAiC,uDAAiB,CAAC,UAAU,MAAM,8BAA8B;AACvG,QAAM,kBAAc,uDAAiB,CAAC,UAAU,MAAM,WAAW;AAEjE,QAAM,yBAAqB;AAAA,IACzB,CAAC,MAA8C;AAC7C,qBAAe,UAAU,CAAC;AAC1B,kBAAY,UAAU,EAAE,gBAAgB,YAAY,kBAAkB,MAAM,CAAC;AAC7E,QAAE,gBAAgB;AAAA,IACpB;AAAA,IACA,CAAC,UAAU,YAAY,gBAAgB,WAAW;AAAA,EACpD;AAEA,QAAM,2BAAuB,0BAAY,MAAM,mBAAmB,IAAI,GAAG,CAAC,kBAAkB,CAAC;AAC7F,QAAM,0BAAsB,0BAAY,MAAM,mBAAmB,KAAK,GAAG,CAAC,kBAAkB,CAAC;AAE7F,QAAM,6BAAyB,0BAAY,MAAM;AAC/C,uBAAmB,QAAQ;AAC3B,QAAI,WAAY,gCAA+B,UAAU,IAAI;AAAA,EAC/D,GAAG,CAAC,UAAU,YAAY,oBAAoB,8BAA8B,CAAC;AAE7E,QAAM,0BAAsB;AAAA,IAC1B,CAAC,MAA2B;AAC1B,QAAE,gBAAgB;AAClB,UAAI,EAAE,SAAS,UAAU;AACvB,oBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,OAAO,eAAe,KAAK,CAAC;AAC5F,yBAAiB,MAAM;AAAA,MACzB;AAGA,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,EAAE,IAAI,GAAG;AAC7C,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,UAAU,WAAW;AAAA,EACzC;AAEA,SAAO,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB;AACtH;",
   "names": []
 }

package/dist/cjs/exported-related/FilterPopover/useOnClickOutside.js

@@ -0,0 +1,60 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useOnClickOutside_exports = {};
+__export(useOnClickOutside_exports, {
+  useOnClickOutside: () => useOnClickOutside
+});
+module.exports = __toCommonJS(useOnClickOutside_exports);
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+function useOnClickOutside(ref, cb) {
+  const cbRef = import_react.default.useRef(cb);
+  (0, import_react.useEffect)(() => {
+    cbRef.current = cb;
+  }, [cb]);
+  (0, import_react.useEffect)(() => {
+    if (!ref) {
+      return () => {
+      };
+    }
+    const listener = (event) => {
+      const target = event.target;
+      if (!target) return;
+      if (ref.contains(target)) return;
+      cbRef.current(event);
+    };
+    document.addEventListener("mousedown", listener, true);
+    document.addEventListener("touchstart", listener, true);
+    return () => {
+      document.removeEventListener("mousedown", listener, true);
+      document.removeEventListener("touchstart", listener, true);
+    };
+  }, [ref]);
+}
+//# sourceMappingURL=useOnClickOutside.js.map

package/dist/cjs/exported-related/FilterPopover/useOnClickOutside.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/exported-related/FilterPopover/useOnClickOutside.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useEffect } from 'react';\n\nexport function useOnClickOutside<T extends Node>(ref: T | null, cb: (event: Event) => void): void {\n  const cbRef = React.useRef(cb);\n\n  useEffect(() => {\n    cbRef.current = cb;\n  }, [cb]);\n\n  useEffect(() => {\n    if (!ref) {\n      return () => {};\n    }\n\n    const listener = (event: MouseEvent | TouchEvent) => {\n      const target = event.target as Node | null;\n      if (!target) return;\n\n      if (ref.contains(target)) return;\n\n      cbRef.current(event);\n    };\n\n    document.addEventListener('mousedown', listener, true);\n    document.addEventListener('touchstart', listener, true);\n\n    return () => {\n      document.removeEventListener('mousedown', listener, true);\n      document.removeEventListener('touchstart', listener, true);\n    };\n  }, [ref]);\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAiC;AAE1B,SAAS,kBAAkC,KAAe,IAAkC;AACjG,QAAM,QAAQ,aAAAA,QAAM,OAAO,EAAE;AAE7B,8BAAU,MAAM;AACd,UAAM,UAAU;AAAA,EAClB,GAAG,CAAC,EAAE,CAAC;AAEP,8BAAU,MAAM;AACd,QAAI,CAAC,KAAK;AACR,aAAO,MAAM;AAAA,MAAC;AAAA,IAChB;AAEA,UAAM,WAAW,CAAC,UAAmC;AACnD,YAAM,SAAS,MAAM;AACrB,UAAI,CAAC,OAAQ;AAEb,UAAI,IAAI,SAAS,MAAM,EAAG;AAE1B,YAAM,QAAQ,KAAK;AAAA,IACrB;AAEA,aAAS,iBAAiB,aAAa,UAAU,IAAI;AACrD,aAAS,iBAAiB,cAAc,UAAU,IAAI;AAEtD,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa,UAAU,IAAI;AACxD,eAAS,oBAAoB,cAAc,UAAU,IAAI;AAAA,IAC3D;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACV;",
+  "names": ["React"]
+}

package/dist/cjs/exported-related/FilterTypes.js

@@ -34,14 +34,24 @@ module.exports = __toCommonJS(FilterTypes_exports);
 var React = __toESM(require("react"));
 const FILTER_TYPES = {
   SELECT: "ds-filter-select",
+  SELECT_V2: "ds-filter-select-v2",
   CREATABLE_SELECT: "ds-filter-creatable-select",
+  CREATABLE_SELECT_V2: "ds-filter-creatable-select-v2",
   MULTI_SELECT: "ds-filter-multi-select",
+  MULTI_SELECT_V2: "ds-filter-multi-select-v2",
   CREATABLE_MULTI_SELECT: "ds-filter-multi-creatable-select",
+  CREATABLE_MULTI_SELECT_V2: "ds-filter-multi-creatable-select-v2",
   SINGLE_DATE: "ds-filter-single-date",
+  SINGLE_DATE_V2: "ds-filter-single-date-v2",
   DATE_RANGE: "ds-filter-date-range",
+  DATE_RANGE_V2: "ds-filter-date-range-v2",
   DATE_SWITCHER: "ds-filter-date-switcher",
+  DATE_SWITCHER_V2: "ds-filter-date-switcher-v2",
   NUMBER_RANGE: "ds-filter-number-range",
+  NUMBER_RANGE_V2: "ds-filter-number-range-v2",
   CURRENCY_RANGE: "ds-filter-currency-range",
-  FREE_TEXT_SEARCH: "ds-filter-free-text-search"
+  CURRENCY_RANGE_V2: "ds-filter-currency-range-v2",
+  FREE_TEXT_SEARCH: "ds-filter-free-text-search",
+  FREE_TEXT_SEARCH_V2: "ds-filter-free-text-search-v2"
 };
 //# sourceMappingURL=FilterTypes.js.map

package/dist/cjs/exported-related/FilterTypes.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/exported-related/FilterTypes.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export const FILTER_TYPES = {\n  SELECT: 'ds-filter-select',\n  CREATABLE_SELECT: 'ds-filter-creatable-select',\n  MULTI_SELECT: 'ds-filter-multi-select',\n  CREATABLE_MULTI_SELECT: 'ds-filter-multi-creatable-select',\n  SINGLE_DATE: 'ds-filter-single-date',\n  DATE_RANGE: 'ds-filter-date-range',\n  DATE_SWITCHER: 'ds-filter-date-switcher',\n  NUMBER_RANGE: 'ds-filter-number-range',\n  CURRENCY_RANGE: 'ds-filter-currency-range',\n  FREE_TEXT_SEARCH: 'ds-filter-free-text-search',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,wBAAwB;AAAA,EACxB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,kBAAkB;AACpB;",
+  "sourcesContent": ["export const FILTER_TYPES = {\n  SELECT: 'ds-filter-select',\n  SELECT_V2: 'ds-filter-select-v2',\n  CREATABLE_SELECT: 'ds-filter-creatable-select',\n  CREATABLE_SELECT_V2: 'ds-filter-creatable-select-v2',\n  MULTI_SELECT: 'ds-filter-multi-select',\n  MULTI_SELECT_V2: 'ds-filter-multi-select-v2',\n  CREATABLE_MULTI_SELECT: 'ds-filter-multi-creatable-select',\n  CREATABLE_MULTI_SELECT_V2: 'ds-filter-multi-creatable-select-v2',\n  SINGLE_DATE: 'ds-filter-single-date',\n  SINGLE_DATE_V2: 'ds-filter-single-date-v2',\n  DATE_RANGE: 'ds-filter-date-range',\n  DATE_RANGE_V2: 'ds-filter-date-range-v2',\n  DATE_SWITCHER: 'ds-filter-date-switcher',\n  DATE_SWITCHER_V2: 'ds-filter-date-switcher-v2',\n  NUMBER_RANGE: 'ds-filter-number-range',\n  NUMBER_RANGE_V2: 'ds-filter-number-range-v2',\n  CURRENCY_RANGE: 'ds-filter-currency-range',\n  CURRENCY_RANGE_V2: 'ds-filter-currency-range-v2',\n  FREE_TEXT_SEARCH: 'ds-filter-free-text-search',\n  FREE_TEXT_SEARCH_V2: 'ds-filter-free-text-search-v2',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,qBAAqB;AACvB;",
   "names": []
 }

package/dist/cjs/exported-related/Filters/applyOutOfTheBoxFilters.js

@@ -56,8 +56,9 @@ const applyOutOfTheBoxFilters = (data, filters) => {
   let filteredData = data;
   filters.forEach((filter) => {
     const { type } = filter;
-    if (isFilterTypeOutOfTheBox(type)) {
-      const outOfTheBoxfilterFromMapper = filterMapper[type];
+    const fromV2toV1Type = type.replace("-v2", "");
+    if (isFilterTypeOutOfTheBox(fromV2toV1Type)) {
+      const outOfTheBoxfilterFromMapper = filterMapper[fromV2toV1Type];
       const outOfTheBoxFilterValue = filter.value;
       filteredData = outOfTheBoxfilterFromMapper(filteredData, filter.id, outOfTheBoxFilterValue);
     }

package/dist/cjs/exported-related/Filters/applyOutOfTheBoxFilters.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/exported-related/Filters/applyOutOfTheBoxFilters.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { singleSelectFilterFn } from './singleSelectFilterFn.js';\nimport { multiSelectFilterFn } from './multiSelectFilterFn.js';\nimport { singleDateFilterFn } from './singleDateFilterFn.js';\nimport { dateRangeFilterFn } from './dateRangeFilterFn.js';\nimport { dateSwitcherFilterFn } from './dateSwitcherFilterFn.js';\nimport { numberRangeFilterFn } from './numberRangeFilterFn.js';\nimport { currencyRangeFilterFn } from './currencyRangeFilterFn.js';\nimport { freeTextSearchFilterFn } from './freeTextSearchFilterFn.js';\nimport { FILTER_TYPES } from '../FilterTypes.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst filterMapper = {\n  [FILTER_TYPES.SELECT]: singleSelectFilterFn,\n  [FILTER_TYPES.MULTI_SELECT]: multiSelectFilterFn,\n  [FILTER_TYPES.SINGLE_DATE]: singleDateFilterFn,\n  [FILTER_TYPES.DATE_RANGE]: dateRangeFilterFn,\n  [FILTER_TYPES.DATE_SWITCHER]: dateSwitcherFilterFn,\n  [FILTER_TYPES.NUMBER_RANGE]: numberRangeFilterFn,\n  [FILTER_TYPES.CURRENCY_RANGE]: currencyRangeFilterFn,\n  [FILTER_TYPES.FREE_TEXT_SEARCH]: freeTextSearchFilterFn,\n} as const;\n\ntype OutOfTheBoxFilterType = keyof typeof filterMapper;\n\nconst isFilterTypeOutOfTheBox = (type: string): type is OutOfTheBoxFilterType =>\n  Object.keys(filterMapper).includes(type);\n\nexport const applyOutOfTheBoxFilters = (\n  data: DSDataTableT.Row[],\n  filters: DSDataTableT.Filter[],\n): DSDataTableT.Row[] => {\n  let filteredData = data;\n\n  filters.forEach((filter) => {\n    const { type } = filter;\n    if (isFilterTypeOutOfTheBox(type)) {\n      // all the out of the box filters have internal validation for the filter value\n      // so we can safely call the filter function with the filter value as unknown, and let the filter function validate it\n      const outOfTheBoxfilterFromMapper = filterMapper[type] as DSDataTableT.FilterFn<unknown>;\n      const outOfTheBoxFilterValue = filter.value;\n      filteredData = outOfTheBoxfilterFromMapper(filteredData, filter.id, outOfTheBoxFilterValue);\n    }\n  });\n\n  return filteredData;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,kCAAqC;AACrC,iCAAoC;AACpC,gCAAmC;AACnC,+BAAkC;AAClC,kCAAqC;AACrC,iCAAoC;AACpC,mCAAsC;AACtC,oCAAuC;AACvC,yBAA6B;AAG7B,MAAM,eAAe;AAAA,EACnB,CAAC,gCAAa,MAAM,GAAG;AAAA,EACvB,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,WAAW,GAAG;AAAA,EAC5B,CAAC,gCAAa,UAAU,GAAG;AAAA,EAC3B,CAAC,gCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,gCAAa,gBAAgB,GAAG;AACnC;AAIA,MAAM,0BAA0B,CAAC,SAC/B,OAAO,KAAK,YAAY,EAAE,SAAS,IAAI;AAElC,MAAM,0BAA0B,CACrC,MACA,YACuB;AACvB,MAAI,eAAe;AAEnB,UAAQ,QAAQ,CAAC,WAAW;AAC1B,UAAM,EAAE,KAAK,IAAI;AACjB,QAAI,wBAAwB,IAAI,GAAG;AAGjC,YAAM,8BAA8B,aAAa,IAAI;AACrD,YAAM,yBAAyB,OAAO;AACtC,qBAAe,4BAA4B,cAAc,OAAO,IAAI,sBAAsB;AAAA,IAC5F;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
+  "sourcesContent": ["import { singleSelectFilterFn } from './singleSelectFilterFn.js';\nimport { multiSelectFilterFn } from './multiSelectFilterFn.js';\nimport { singleDateFilterFn } from './singleDateFilterFn.js';\nimport { dateRangeFilterFn } from './dateRangeFilterFn.js';\nimport { dateSwitcherFilterFn } from './dateSwitcherFilterFn.js';\nimport { numberRangeFilterFn } from './numberRangeFilterFn.js';\nimport { currencyRangeFilterFn } from './currencyRangeFilterFn.js';\nimport { freeTextSearchFilterFn } from './freeTextSearchFilterFn.js';\nimport { FILTER_TYPES } from '../FilterTypes.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst filterMapper = {\n  [FILTER_TYPES.SELECT]: singleSelectFilterFn,\n  [FILTER_TYPES.MULTI_SELECT]: multiSelectFilterFn,\n  [FILTER_TYPES.SINGLE_DATE]: singleDateFilterFn,\n  [FILTER_TYPES.DATE_RANGE]: dateRangeFilterFn,\n  [FILTER_TYPES.DATE_SWITCHER]: dateSwitcherFilterFn,\n  [FILTER_TYPES.NUMBER_RANGE]: numberRangeFilterFn,\n  [FILTER_TYPES.CURRENCY_RANGE]: currencyRangeFilterFn,\n  [FILTER_TYPES.FREE_TEXT_SEARCH]: freeTextSearchFilterFn,\n} as const;\n\ntype OutOfTheBoxFilterType = keyof typeof filterMapper;\n\nconst isFilterTypeOutOfTheBox = (type: string): type is OutOfTheBoxFilterType =>\n  Object.keys(filterMapper).includes(type);\n\nexport const applyOutOfTheBoxFilters = (\n  data: DSDataTableT.Row[],\n  filters: DSDataTableT.Filter[],\n): DSDataTableT.Row[] => {\n  let filteredData = data;\n\n  filters.forEach((filter) => {\n    const { type } = filter;\n    const fromV2toV1Type = type.replace('-v2', '');\n    if (isFilterTypeOutOfTheBox(fromV2toV1Type)) {\n      // all the out of the box filters have internal validation for the filter value\n      // so we can safely call the filter function with the filter value as unknown, and let the filter function validate it\n      const outOfTheBoxfilterFromMapper = filterMapper[fromV2toV1Type] as DSDataTableT.FilterFn<unknown>;\n      const outOfTheBoxFilterValue = filter.value;\n      filteredData = outOfTheBoxfilterFromMapper(filteredData, filter.id, outOfTheBoxFilterValue);\n    }\n  });\n\n  return filteredData;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,kCAAqC;AACrC,iCAAoC;AACpC,gCAAmC;AACnC,+BAAkC;AAClC,kCAAqC;AACrC,iCAAoC;AACpC,mCAAsC;AACtC,oCAAuC;AACvC,yBAA6B;AAG7B,MAAM,eAAe;AAAA,EACnB,CAAC,gCAAa,MAAM,GAAG;AAAA,EACvB,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,WAAW,GAAG;AAAA,EAC5B,CAAC,gCAAa,UAAU,GAAG;AAAA,EAC3B,CAAC,gCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,gCAAa,gBAAgB,GAAG;AACnC;AAIA,MAAM,0BAA0B,CAAC,SAC/B,OAAO,KAAK,YAAY,EAAE,SAAS,IAAI;AAElC,MAAM,0BAA0B,CACrC,MACA,YACuB;AACvB,MAAI,eAAe;AAEnB,UAAQ,QAAQ,CAAC,WAAW;AAC1B,UAAM,EAAE,KAAK,IAAI;AACjB,UAAM,iBAAiB,KAAK,QAAQ,OAAO,EAAE;AAC7C,QAAI,wBAAwB,cAAc,GAAG;AAG3C,YAAM,8BAA8B,aAAa,cAAc;AAC/D,YAAM,yBAAyB,OAAO;AACtC,qBAAe,4BAA4B,cAAc,OAAO,IAAI,sBAAsB;AAAA,IAC5F;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
   "names": []
 }

package/dist/cjs/exported-related/index.js

@@ -33,6 +33,7 @@ __export(exported_related_exports, {
   FilterBarDropdownMenu: () => import_FilterBar.FilterBarDropdownMenu,
   FilterMenuButton: () => import_FilterBar.FilterMenuButton,
   FilterPopover: () => import_FilterPopover.FilterPopover,
+  PillsFromDataTableFilters: () => import_FilterBar.PillsFromDataTableFilters,
   ROW_VARIANTS: () => import_RowVariants.ROW_VARIANTS,
   ROW_VARIANT_COMPACT_KEY: () => import_RowVariants.ROW_VARIANT_COMPACT_KEY,
   ROW_VARIANT_KEY: () => import_RowVariants.ROW_VARIANT_KEY,

package/dist/cjs/exported-related/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/exported-related/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export { FilterPopover } from './FilterPopover/index.js';\nexport { EditableCell } from './EditableCell.js';\nexport { Toolbar } from './Toolbar/index.js';\nexport { groupBy } from './groupBy.js';\nexport { FILTER_TYPES } from './FilterTypes.js';\nexport { ROW_VARIANTS, ROW_VARIANT_KEY, ROW_VARIANT_COMPACT_KEY } from './RowVariants.js';\nexport {\n  applyOutOfTheBoxFilters,\n  singleDateFilterFn,\n  singleSelectFilterFn,\n  multiSelectFilterFn,\n  numberRangeFilterFn,\n  currencyRangeFilterFn,\n  dateRangeFilterFn,\n} from './Filters/index.js';\nexport { FilterBarDropdownMenu, FilterMenuButton } from './FilterBar/index.js';\nexport { SkeletonCell, SkeletonHeaderCell } from './Skeleton/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,2BAA8B;AAC9B,0BAA6B;AAC7B,qBAAwB;AACxB,qBAAwB;AACxB,yBAA6B;AAC7B,yBAAuE;AACvE,qBAQO;AACP,uBAAwD;AACxD,sBAAiD;",
+  "sourcesContent": ["export { FilterPopover } from './FilterPopover/index.js';\nexport { EditableCell } from './EditableCell.js';\nexport { Toolbar } from './Toolbar/index.js';\nexport { groupBy } from './groupBy.js';\nexport { FILTER_TYPES } from './FilterTypes.js';\nexport { ROW_VARIANTS, ROW_VARIANT_KEY, ROW_VARIANT_COMPACT_KEY } from './RowVariants.js';\nexport {\n  applyOutOfTheBoxFilters,\n  singleDateFilterFn,\n  singleSelectFilterFn,\n  multiSelectFilterFn,\n  numberRangeFilterFn,\n  currencyRangeFilterFn,\n  dateRangeFilterFn,\n} from './Filters/index.js';\nexport { FilterBarDropdownMenu, FilterMenuButton, PillsFromDataTableFilters } from './FilterBar/index.js';\nexport { SkeletonCell, SkeletonHeaderCell } from './Skeleton/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,2BAA8B;AAC9B,0BAA6B;AAC7B,qBAAwB;AACxB,qBAAwB;AACxB,yBAA6B;AAC7B,yBAAuE;AACvE,qBAQO;AACP,uBAAmF;AACnF,sBAAiD;",
   "names": []
 }

package/dist/cjs/index.js

@@ -41,6 +41,7 @@ __export(index_exports, {
   FilterMenuButton: () => import_exported_related.FilterMenuButton,
   FilterPopover: () => import_exported_related.FilterPopover,
   INTERNAL_COLUMNS: () => import_Columns.INTERNAL_COLUMNS,
+  PillsFromDataTableFilters: () => import_exported_related.PillsFromDataTableFilters,
   ROW_VARIANTS: () => import_exported_related.ROW_VARIANTS,
   ROW_VARIANT_COMPACT_KEY: () => import_exported_related.ROW_VARIANT_COMPACT_KEY,
   ROW_VARIANT_KEY: () => import_exported_related.ROW_VARIANT_KEY,

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export { DataTable, DataTableWithSchema } from './DataTable.js';\n\nexport {\n  FilterPopover,\n  EditableCell,\n  Toolbar,\n  groupBy,\n  FILTER_TYPES,\n  ROW_VARIANTS,\n  ROW_VARIANT_KEY,\n  ROW_VARIANT_COMPACT_KEY,\n  applyOutOfTheBoxFilters,\n  singleDateFilterFn,\n  singleSelectFilterFn,\n  multiSelectFilterFn,\n  numberRangeFilterFn,\n  currencyRangeFilterFn,\n  dateRangeFilterFn,\n  FilterBarDropdownMenu,\n  FilterMenuButton,\n  SkeletonCell,\n  SkeletonHeaderCell,\n} from './exported-related/index.js';\n\nexport {\n  actionColumn,\n  expandRowColumn,\n  multiSelectColumn,\n  singleSelectColumn,\n  dragHandleColumn,\n  INTERNAL_COLUMNS,\n} from './addons/Columns/index.js';\n\nexport type { DSDataTableT } from './react-desc-prop-types.js';\n\nexport { useWholeStore } from './configs/useStore/useStore.js';\n\nexport {\n  DATA_TABLE_DATA_TESTID,\n  DATA_TABLE_SLOTS,\n  DSDataTableDataTestIds,\n  DSDataTableName,\n  DSDataTableSlots,\n} from './constants/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA+C;AAE/C,8BAoBO;AAEP,qBAOO;AAIP,sBAA8B;AAE9B,uBAMO;",
+  "sourcesContent": ["export { DataTable, DataTableWithSchema } from './DataTable.js';\n\nexport {\n  FilterPopover,\n  EditableCell,\n  Toolbar,\n  groupBy,\n  FILTER_TYPES,\n  ROW_VARIANTS,\n  ROW_VARIANT_KEY,\n  ROW_VARIANT_COMPACT_KEY,\n  applyOutOfTheBoxFilters,\n  singleDateFilterFn,\n  singleSelectFilterFn,\n  multiSelectFilterFn,\n  numberRangeFilterFn,\n  currencyRangeFilterFn,\n  dateRangeFilterFn,\n  FilterBarDropdownMenu,\n  FilterMenuButton,\n  PillsFromDataTableFilters,\n  SkeletonCell,\n  SkeletonHeaderCell,\n} from './exported-related/index.js';\n\nexport {\n  actionColumn,\n  expandRowColumn,\n  multiSelectColumn,\n  singleSelectColumn,\n  dragHandleColumn,\n  INTERNAL_COLUMNS,\n} from './addons/Columns/index.js';\n\nexport type { DSDataTableT } from './react-desc-prop-types.js';\n\nexport { useWholeStore } from './configs/useStore/useStore.js';\n\nexport {\n  DATA_TABLE_DATA_TESTID,\n  DATA_TABLE_SLOTS,\n  DSDataTableDataTestIds,\n  DSDataTableName,\n  DSDataTableSlots,\n} from './constants/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA+C;AAE/C,8BAqBO;AAEP,qBAOO;AAIP,sBAA8B;AAE9B,uBAMO;",
   "names": []
 }

package/dist/cjs/parts/FilterBar/DeprecatedDropdown.js

@@ -35,7 +35,7 @@ var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_ds_button_v2 = require("@elliemae/ds-button-v2");
 var import_ds_icons = require("@elliemae/ds-icons");
-var import_ds_dropdownmenu = require("@elliemae/ds-dropdownmenu");
+var import_ds_legacy_dropdownmenu = require("@elliemae/ds-legacy-dropdownmenu");
 var import_configs = require("../../configs/index.js");
 const DeprecatedDropdown = ({
   finalIsOpen,
@@ -46,7 +46,7 @@ const DeprecatedDropdown = ({
   dropdownMenuRef,
   onTriggerClick
 }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-  import_ds_dropdownmenu.DSDropdownMenu,
+  import_ds_legacy_dropdownmenu.DSDropdownMenu,
   {
     preventOverflow: "scrollParent",
     isOpen: finalIsOpen,

package/dist/cjs/parts/FilterBar/DeprecatedDropdown.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/FilterBar/DeprecatedDropdown.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck This is using the deprecated dropdown menu\nimport React from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { DATA_TESTID } from '../../configs/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface DeprecatedDropdownProps {\n  finalIsOpen: boolean;\n  onFilterBarClose: () => void;\n  onFilterBarOnClickOutside: () => void;\n  removeAllFilters: () => void;\n  filterBarProps: DSDataTableT.Props['filterBarProps'];\n  dropdownMenuRef: React.MutableRefObject<HTMLButtonElement | null>;\n  onTriggerClick: () => void;\n}\n\nexport const DeprecatedDropdown: React.ComponentType<DeprecatedDropdownProps> = ({\n  finalIsOpen,\n  onFilterBarClose,\n  onFilterBarOnClickOutside,\n  removeAllFilters,\n  filterBarProps,\n  dropdownMenuRef,\n  onTriggerClick,\n}) => (\n  <DSDropdownMenu\n    preventOverflow=\"scrollParent\"\n    isOpen={finalIsOpen}\n    onClose={onFilterBarClose}\n    onClickOutsideMenu={onFilterBarOnClickOutside}\n    options={[\n      {\n        id: '__internal__option__clear__filters',\n        label: 'Clear Filters',\n        onClick: removeAllFilters,\n        onKeyDown: (e: React.KeyboardEvent) => {\n          if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n        },\n      },\n      ...(filterBarProps?.extraOptions || []).map((option) => ({\n        ...option,\n        onKeyDown: (e: React.KeyboardEvent) => {\n          if (['Enter', 'Space'].includes(e.code)) option?.onClick?.(e);\n        },\n      })),\n    ]}\n    triggerComponent={\n      <DSButtonV2\n        data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n        buttonType=\"icon\"\n        innerRef={dropdownMenuRef}\n        onClick={onTriggerClick}\n        aria-label=\"Filter bar addon\"\n        style={{ marginLeft: 'auto' }}\n      >\n        <MoreOptionsVert />\n      </DSButtonV2>\n    }\n  />\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0Df;AAvDR,0BAA2B;AAC3B,sBAAgC;AAChC,6BAA+B;AAC/B,qBAA4B;AAarB,MAAM,qBAAmE,CAAC;AAAA,EAC/E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC,iBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,oBAAoB;AAAA,IACpB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,kBAAiB;AAAA,QAC5D;AAAA,MACF;AAAA,MACA,IAAI,gBAAgB,gBAAgB,CAAC,GAAG,IAAI,CAAC,YAAY;AAAA,QACvD,GAAG;AAAA,QACH,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,SAAQ,UAAU,CAAC;AAAA,QAC9D;AAAA,MACF,EAAE;AAAA,IACJ;AAAA,IACA,kBACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa,2BAAY;AAAA,QACzB,YAAW;AAAA,QACX,UAAU;AAAA,QACV,SAAS;AAAA,QACT,cAAW;AAAA,QACX,OAAO,EAAE,YAAY,OAAO;AAAA,QAE5B,sDAAC,mCAAgB;AAAA;AAAA,IACnB;AAAA;AAEJ;",
+  "sourcesContent": ["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck This is using the deprecated dropdown menu\nimport React from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DSDropdownMenu } from '@elliemae/ds-legacy-dropdownmenu';\nimport { DATA_TESTID } from '../../configs/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface DeprecatedDropdownProps {\n  finalIsOpen: boolean;\n  onFilterBarClose: () => void;\n  onFilterBarOnClickOutside: () => void;\n  removeAllFilters: () => void;\n  filterBarProps: DSDataTableT.Props['filterBarProps'];\n  dropdownMenuRef: React.MutableRefObject<HTMLButtonElement | null>;\n  onTriggerClick: () => void;\n}\n\nexport const DeprecatedDropdown: React.ComponentType<DeprecatedDropdownProps> = ({\n  finalIsOpen,\n  onFilterBarClose,\n  onFilterBarOnClickOutside,\n  removeAllFilters,\n  filterBarProps,\n  dropdownMenuRef,\n  onTriggerClick,\n}) => (\n  <DSDropdownMenu\n    preventOverflow=\"scrollParent\"\n    isOpen={finalIsOpen}\n    onClose={onFilterBarClose}\n    onClickOutsideMenu={onFilterBarOnClickOutside}\n    options={[\n      {\n        id: '__internal__option__clear__filters',\n        label: 'Clear Filters',\n        onClick: removeAllFilters,\n        onKeyDown: (e: React.KeyboardEvent) => {\n          if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n        },\n      },\n      ...(filterBarProps?.extraOptions || []).map((option) => ({\n        ...option,\n        onKeyDown: (e: React.KeyboardEvent) => {\n          if (['Enter', 'Space'].includes(e.code)) option?.onClick?.(e);\n        },\n      })),\n    ]}\n    triggerComponent={\n      <DSButtonV2\n        data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n        buttonType=\"icon\"\n        innerRef={dropdownMenuRef}\n        onClick={onTriggerClick}\n        aria-label=\"Filter bar addon\"\n        style={{ marginLeft: 'auto' }}\n      >\n        <MoreOptionsVert />\n      </DSButtonV2>\n    }\n  />\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0Df;AAvDR,0BAA2B;AAC3B,sBAAgC;AAChC,oCAA+B;AAC/B,qBAA4B;AAarB,MAAM,qBAAmE,CAAC;AAAA,EAC/E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC,iBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,oBAAoB;AAAA,IACpB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,kBAAiB;AAAA,QAC5D;AAAA,MACF;AAAA,MACA,IAAI,gBAAgB,gBAAgB,CAAC,GAAG,IAAI,CAAC,YAAY;AAAA,QACvD,GAAG;AAAA,QACH,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,SAAQ,UAAU,CAAC;AAAA,QAC9D;AAAA,MACF,EAAE;AAAA,IACJ;AAAA,IACA,kBACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa,2BAAY;AAAA,QACzB,YAAW;AAAA,QACX,UAAU;AAAA,QACV,SAAS;AAAA,QACT,cAAW;AAAA,QACX,OAAO,EAAE,YAAY,OAAO;AAAA,QAE5B,sDAAC,mCAAgB;AAAA;AAAA,IACnB;AAAA;AAEJ;",
   "names": []
 }

package/dist/cjs/parts/FilterBar/FiltersBar.js

@@ -41,13 +41,21 @@ var import_DeprecatedDropdown = require("./DeprecatedDropdown.js");
 var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
 const pillRenderMapper = {
   [import_exported_related.FILTER_TYPES.SELECT]: import_components.SelectPill,
+  [import_exported_related.FILTER_TYPES.SELECT_V2]: import_components.SelectPill,
   [import_exported_related.FILTER_TYPES.MULTI_SELECT]: import_components.MultiSelectPill,
+  [import_exported_related.FILTER_TYPES.MULTI_SELECT_V2]: import_components.MultiSelectPill,
   [import_exported_related.FILTER_TYPES.SINGLE_DATE]: import_components.SingleDatePill,
+  [import_exported_related.FILTER_TYPES.SINGLE_DATE_V2]: import_components.SingleDatePill,
   [import_exported_related.FILTER_TYPES.DATE_RANGE]: import_components.DateRangePill,
+  [import_exported_related.FILTER_TYPES.DATE_RANGE_V2]: import_components.DateRangePill,
   [import_exported_related.FILTER_TYPES.DATE_SWITCHER]: import_components.DateSwitcherPill,
+  [import_exported_related.FILTER_TYPES.DATE_SWITCHER_V2]: import_components.DateSwitcherPill,
   [import_exported_related.FILTER_TYPES.NUMBER_RANGE]: import_components.NumberRangePill,
+  [import_exported_related.FILTER_TYPES.NUMBER_RANGE_V2]: import_components.NumberRangePill,
   [import_exported_related.FILTER_TYPES.CURRENCY_RANGE]: import_components.NumberRangePill,
-  [import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH]: import_components.FreeTextSearchPillPill
+  [import_exported_related.FILTER_TYPES.CURRENCY_RANGE_V2]: import_components.NumberRangePill,
+  [import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH]: import_components.FreeTextSearchPillPill,
+  [import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH_V2]: import_components.FreeTextSearchPillPill
 };
 const FiltersBar = () => {
   const width = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.width);
@@ -102,8 +110,6 @@ const FiltersBar = () => {
     import_styled.StyledWrapper,
     {
       width,
-      "aria-live": "polite",
-      "aria-relevant": "additions removals",
       gutter: "xs",
       getOwnerProps,
       children: [

package/dist/cjs/parts/FilterBar/FiltersBar.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/FilterBar/FiltersBar.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { FILTER_TYPES } from '../../exported-related/index.js';\nimport {\n  SelectPill,\n  MultiSelectPill,\n  SingleDatePill,\n  DateRangePill,\n  NumberRangePill,\n  DateSwitcherPill,\n  FreeTextSearchPillPill,\n} from './components/index.js';\nimport { StyledWrapper } from './styled.js';\nimport { DeprecatedDropdown } from './DeprecatedDropdown.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\n\nconst pillRenderMapper = {\n  [FILTER_TYPES.SELECT]: SelectPill,\n  [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n  [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n  [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n  [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n  [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n  [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n  [FILTER_TYPES.FREE_TEXT_SEARCH]: FreeTextSearchPillPill,\n} as const;\n\nexport const FiltersBar: React.ComponentType = () => {\n  const width = usePropsStore((state) => state.width);\n  const filterBarProps = usePropsStore((state) => state.filterBarProps);\n  const onFiltersChange = usePropsStore((state) => state.onFiltersChange);\n  const filters = usePropsStore((state) => state.filters);\n  const visibleColumns = usePropsStore((state) => state.visibleColumns);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const [isOpen, setIsOpen] = useState(false);\n\n  const pillGroupRefs = useMemo(() => {\n    const refs: React.RefObject<HTMLElement>[] = [];\n    for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n    return refs;\n  }, [filters.length]);\n\n  const dropdownMenuRef = useRef<HTMLButtonElement | null>(null);\n\n  const {\n    filterBarAddonRenderer: FilterBarAddonRenderer,\n    onClearAllFiltersClick,\n    onDropdownMenuToggle,\n    onDropdownMenuClickOutside,\n    onDropdownMenuTriggerClick,\n    isDropdownMenuOpen,\n  } = filterBarProps || {};\n\n  const removeAllFilters = useCallback(() => {\n    onFiltersChange([]);\n    onClearAllFiltersClick?.();\n    setIsOpen(false);\n  }, [onFiltersChange, onClearAllFiltersClick]);\n\n  const onFilterBarClose = useCallback(() => {\n    onDropdownMenuToggle?.(false, 'onClose');\n    dropdownMenuRef.current?.focus();\n    setIsOpen(false);\n  }, [onDropdownMenuToggle]);\n\n  const onFilterBarOpen = useCallback(() => {\n    onDropdownMenuToggle?.(true, 'onOpen');\n    setIsOpen(true);\n  }, [onDropdownMenuToggle]);\n\n  const onFilterBarOnClickOutside = useCallback(() => {\n    onDropdownMenuToggle?.(false, 'onClickOutside');\n    onDropdownMenuClickOutside?.();\n    setIsOpen(false);\n  }, [onDropdownMenuClickOutside, onDropdownMenuToggle]);\n\n  const onTriggerClick = useCallback(() => {\n    onDropdownMenuTriggerClick?.();\n    onFilterBarOpen();\n  }, [onDropdownMenuTriggerClick, onFilterBarOpen]);\n\n  const finalIsOpen = useMemo(() => {\n    if (typeof isDropdownMenuOpen === 'boolean') return isDropdownMenuOpen;\n    return isOpen;\n  }, [isDropdownMenuOpen, isOpen]);\n\n  return (\n    <StyledWrapper\n      width={width}\n      aria-live=\"polite\"\n      aria-relevant=\"additions removals\"\n      gutter=\"xs\"\n      getOwnerProps={getOwnerProps}\n    >\n      {filters.map(({ id: column, type, value }, index) => {\n        const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n        let Component:\n          | TypescriptHelpersT.ObjectValues<typeof pillRenderMapper>\n          | React.ComponentType<DSDataTableT.FilterPillProps<unknown>> = () => null;\n\n        const filterType = type;\n        if (filterType in pillRenderMapper) {\n          Component = pillRenderMapper[filterType as keyof typeof pillRenderMapper];\n        } else if (filterBarProps?.customPillRenderer) {\n          Component = filterBarProps.customPillRenderer;\n        }\n        return (\n          <Component\n            key={column}\n            columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n            column={column}\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment\n            value={value as any}\n            filters={filters}\n            onFiltersChange={onFiltersChange}\n            prevRef={pillGroupRefs[index - 1]}\n            innerRef={pillGroupRefs[index]}\n            nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n          />\n        );\n      })}\n      {FilterBarAddonRenderer ? (\n        <FilterBarAddonRenderer innerRef={dropdownMenuRef} />\n      ) : (\n        <DeprecatedDropdown\n          finalIsOpen={finalIsOpen}\n          onFilterBarClose={onFilterBarClose}\n          onFilterBarOnClickOutside={onFilterBarOnClickOutside}\n          removeAllFilters={removeAllFilters}\n          filterBarProps={filterBarProps}\n          dropdownMenuRef={dropdownMenuRef}\n          onTriggerClick={onTriggerClick}\n        />\n      )}\n    </StyledWrapper>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { FILTER_TYPES } from '../../exported-related/index.js';\nimport {\n  SelectPill,\n  MultiSelectPill,\n  SingleDatePill,\n  DateRangePill,\n  NumberRangePill,\n  DateSwitcherPill,\n  FreeTextSearchPillPill,\n} from './components/index.js';\nimport { StyledWrapper } from './styled.js';\nimport { DeprecatedDropdown } from './DeprecatedDropdown.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\n\nconst pillRenderMapper = {\n  [FILTER_TYPES.SELECT]: SelectPill,\n  [FILTER_TYPES.SELECT_V2]: SelectPill,\n  [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n  [FILTER_TYPES.MULTI_SELECT_V2]: MultiSelectPill,\n  [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n  [FILTER_TYPES.SINGLE_DATE_V2]: SingleDatePill,\n  [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n  [FILTER_TYPES.DATE_RANGE_V2]: DateRangePill,\n  [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n  [FILTER_TYPES.DATE_SWITCHER_V2]: DateSwitcherPill,\n  [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n  [FILTER_TYPES.NUMBER_RANGE_V2]: NumberRangePill,\n  [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n  [FILTER_TYPES.CURRENCY_RANGE_V2]: NumberRangePill,\n  [FILTER_TYPES.FREE_TEXT_SEARCH]: FreeTextSearchPillPill,\n  [FILTER_TYPES.FREE_TEXT_SEARCH_V2]: FreeTextSearchPillPill,\n} as const;\n\nexport const FiltersBar: React.ComponentType = () => {\n  const width = usePropsStore((state) => state.width);\n  const filterBarProps = usePropsStore((state) => state.filterBarProps);\n  const onFiltersChange = usePropsStore((state) => state.onFiltersChange);\n  const filters = usePropsStore((state) => state.filters);\n  const visibleColumns = usePropsStore((state) => state.visibleColumns);\n  const getOwnerProps = usePropsStore((store) => store.get);\n\n  const [isOpen, setIsOpen] = useState(false);\n\n  const pillGroupRefs = useMemo(() => {\n    const refs: React.RefObject<HTMLElement>[] = [];\n    for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n    return refs;\n  }, [filters.length]);\n\n  const dropdownMenuRef = useRef<HTMLButtonElement | null>(null);\n\n  const {\n    filterBarAddonRenderer: FilterBarAddonRenderer,\n    onClearAllFiltersClick,\n    onDropdownMenuToggle,\n    onDropdownMenuClickOutside,\n    onDropdownMenuTriggerClick,\n    isDropdownMenuOpen,\n  } = filterBarProps || {};\n\n  const removeAllFilters = useCallback(() => {\n    onFiltersChange([]);\n    onClearAllFiltersClick?.();\n    setIsOpen(false);\n  }, [onFiltersChange, onClearAllFiltersClick]);\n\n  const onFilterBarClose = useCallback(() => {\n    onDropdownMenuToggle?.(false, 'onClose');\n    dropdownMenuRef.current?.focus();\n    setIsOpen(false);\n  }, [onDropdownMenuToggle]);\n\n  const onFilterBarOpen = useCallback(() => {\n    onDropdownMenuToggle?.(true, 'onOpen');\n    setIsOpen(true);\n  }, [onDropdownMenuToggle]);\n\n  const onFilterBarOnClickOutside = useCallback(() => {\n    onDropdownMenuToggle?.(false, 'onClickOutside');\n    onDropdownMenuClickOutside?.();\n    setIsOpen(false);\n  }, [onDropdownMenuClickOutside, onDropdownMenuToggle]);\n\n  const onTriggerClick = useCallback(() => {\n    onDropdownMenuTriggerClick?.();\n    onFilterBarOpen();\n  }, [onDropdownMenuTriggerClick, onFilterBarOpen]);\n\n  const finalIsOpen = useMemo(() => {\n    if (typeof isDropdownMenuOpen === 'boolean') return isDropdownMenuOpen;\n    return isOpen;\n  }, [isDropdownMenuOpen, isOpen]);\n\n  return (\n    <StyledWrapper\n      width={width}\n      /**\n       * PUI-17317 - [DataTable] No announcement is made when a filter is added or removed\n       * https://jira.elliemae.io/browse/PUI-17317\n       *\n       * ## Problem\n       * Screen reader users received no feedback when filters were added or removed.\n       * The attempted fix \u2014 placing `aria-live=\"polite\"` + `aria-relevant=\"additions removals\"`\n       * on this wrapper \u2014 was unreliable across screen readers and, when it did fire,\n       * produced meaningless announcements by concatenating the pill label with its\n       * remove-button aria-label, e.g.:\n       *   \"React Dev Remove React Dev from Position\"\n       *\n       * WCAG recommends contextual messages like \"Filter applied: Currency = USD\".\n       * That level of specificity cannot be achieved automatically through aria attributes alone.\n       *\n       * ## Decision\n       * `aria-live` / `aria-relevant` were removed from this component.\n       * The responsibility for announcing filter changes is delegated to the consumer,\n       * who has access to the full filter state and can compose meaningful messages like:\n       *\n       * e.g: Multi Select Filter\n       *\n       * - \"Filter added: Position: React dev\"\n       * - \"Filter updated: Position: React dev, Fullstack dev\"\n       * - \"Filter removed: Position: React dev, Fullstack dev\"\n       */\n      /*\n      aria-live=\"polite\"\n      aria-relevant=\"additions removals\" \n      */\n      gutter=\"xs\"\n      getOwnerProps={getOwnerProps}\n    >\n      {filters.map(({ id: column, type, value }, index) => {\n        const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n        let Component:\n          | TypescriptHelpersT.ObjectValues<typeof pillRenderMapper>\n          | React.ComponentType<DSDataTableT.FilterPillProps<unknown>> = () => null;\n\n        const filterType = type;\n        if (filterType in pillRenderMapper) {\n          Component = pillRenderMapper[filterType as keyof typeof pillRenderMapper];\n        } else if (filterBarProps?.customPillRenderer) {\n          Component = filterBarProps.customPillRenderer;\n        }\n        return (\n          <Component\n            key={column}\n            columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n            column={column}\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment\n            value={value as any}\n            filters={filters}\n            onFiltersChange={onFiltersChange}\n            prevRef={pillGroupRefs[index - 1]}\n            innerRef={pillGroupRefs[index]}\n            nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n          />\n        );\n      })}\n      {FilterBarAddonRenderer ? (\n        <FilterBarAddonRenderer innerRef={dropdownMenuRef} />\n      ) : (\n        <DeprecatedDropdown\n          finalIsOpen={finalIsOpen}\n          onFilterBarClose={onFilterBarClose}\n          onFilterBarOnClickOutside={onFilterBarOnClickOutside}\n          removeAllFilters={removeAllFilters}\n          filterBarProps={filterBarProps}\n          dropdownMenuRef={dropdownMenuRef}\n          onTriggerClick={onTriggerClick}\n        />\n      )}\n    </StyledWrapper>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiGnB;AAjGJ,mBAA8D;AAE9D,8BAA6B;AAC7B,wBAQO;AACP,oBAA8B;AAC9B,gCAAmC;AAEnC,2CAA8B;AAE9B,MAAM,mBAAmB;AAAA,EACvB,CAAC,qCAAa,MAAM,GAAG;AAAA,EACvB,CAAC,qCAAa,SAAS,GAAG;AAAA,EAC1B,CAAC,qCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,qCAAa,eAAe,GAAG;AAAA,EAChC,CAAC,qCAAa,WAAW,GAAG;AAAA,EAC5B,CAAC,qCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,qCAAa,UAAU,GAAG;AAAA,EAC3B,CAAC,qCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,qCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,qCAAa,gBAAgB,GAAG;AAAA,EACjC,CAAC,qCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,qCAAa,eAAe,GAAG;AAAA,EAChC,CAAC,qCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,qCAAa,iBAAiB,GAAG;AAAA,EAClC,CAAC,qCAAa,gBAAgB,GAAG;AAAA,EACjC,CAAC,qCAAa,mBAAmB,GAAG;AACtC;AAEO,MAAM,aAAkC,MAAM;AACnD,QAAM,YAAQ,oDAAc,CAAC,UAAU,MAAM,KAAK;AAClD,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,sBAAkB,oDAAc,CAAC,UAAU,MAAM,eAAe;AACtE,QAAM,cAAU,oDAAc,CAAC,UAAU,MAAM,OAAO;AACtD,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,UAAM,OAAuC,CAAC;AAC9C,aAAS,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK,EAAG,MAAK,KAAK,aAAAA,QAAM,UAAU,CAAC;AACvE,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,sBAAkB,qBAAiC,IAAI;AAE7D,QAAM;AAAA,IACJ,wBAAwB;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,kBAAkB,CAAC;AAEvB,QAAM,uBAAmB,0BAAY,MAAM;AACzC,oBAAgB,CAAC,CAAC;AAClB,6BAAyB;AACzB,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,iBAAiB,sBAAsB,CAAC;AAE5C,QAAM,uBAAmB,0BAAY,MAAM;AACzC,2BAAuB,OAAO,SAAS;AACvC,oBAAgB,SAAS,MAAM;AAC/B,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,oBAAoB,CAAC;AAEzB,QAAM,sBAAkB,0BAAY,MAAM;AACxC,2BAAuB,MAAM,QAAQ;AACrC,cAAU,IAAI;AAAA,EAChB,GAAG,CAAC,oBAAoB,CAAC;AAEzB,QAAM,gCAA4B,0BAAY,MAAM;AAClD,2BAAuB,OAAO,gBAAgB;AAC9C,iCAA6B;AAC7B,cAAU,KAAK;AAAA,EACjB,GAAG,CAAC,4BAA4B,oBAAoB,CAAC;AAErD,QAAM,qBAAiB,0BAAY,MAAM;AACvC,iCAA6B;AAC7B,oBAAgB;AAAA,EAClB,GAAG,CAAC,4BAA4B,eAAe,CAAC;AAEhD,QAAM,kBAAc,sBAAQ,MAAM;AAChC,QAAI,OAAO,uBAAuB,UAAW,QAAO;AACpD,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,MAAM,CAAC;AAE/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MA+BA,QAAO;AAAA,MACP;AAAA,MAEC;AAAA,gBAAQ,IAAI,CAAC,EAAE,IAAI,QAAQ,MAAM,MAAM,GAAG,UAAU;AACnD,gBAAM,eAAe,eAAe,KAAK,CAAC,QAAQ,IAAI,aAAa,MAAM,GAAG;AAC5E,cAAI,YAE6D,MAAM;AAEvE,gBAAM,aAAa;AACnB,cAAI,cAAc,kBAAkB;AAClC,wBAAY,iBAAiB,UAA2C;AAAA,UAC1E,WAAW,gBAAgB,oBAAoB;AAC7C,wBAAY,eAAe;AAAA,UAC7B;AACA,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,cAAc,OAAO,iBAAiB,WAAW,eAAe;AAAA,cAChE;AAAA,cAEA;AAAA,cACA;AAAA,cACA;AAAA,cACA,SAAS,cAAc,QAAQ,CAAC;AAAA,cAChC,UAAU,cAAc,KAAK;AAAA,cAC7B,SAAS,cAAc,QAAQ,CAAC,KAAK;AAAA;AAAA,YAThC;AAAA,UAUP;AAAA,QAEJ,CAAC;AAAA,QACA,yBACC,4CAAC,0BAAuB,UAAU,iBAAiB,IAEnD;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EAEJ;AAEJ;",
   "names": ["React"]
 }

package/dist/cjs/parts/FilterBar/components/DateRangePill.js

@@ -36,21 +36,36 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_ds_pills_v2 = require("@elliemae/ds-pills-v2");
 const format = (value) => value?.replace(/-/g, "/");
-const DateRangePill = ({ columnHeader, column, value, filters, onFiltersChange, prevRef, innerRef, nextRef }) => {
+const DateRangePill = ({ columnHeader, column, value, filters, onFiltersChange, prevRef, innerRef, nextRef, onPillRemove }) => {
+  const removeFilter = (0, import_react.useCallback)(
+    () => onFiltersChange(filters.filter((filter) => filter.id !== column)),
+    [onFiltersChange, filters, column]
+  );
   const handleOnRemove = (0, import_react.useCallback)(() => {
+    if (onPillRemove) {
+      onPillRemove(removeFilter);
+      return;
+    }
     if (prevRef?.current) prevRef.current.focus();
-    else nextRef.current?.focus();
-    onFiltersChange(filters.filter((filter) => filter.id !== column));
-  }, [onFiltersChange, filters, prevRef, nextRef, column]);
+    else nextRef?.current?.focus();
+    removeFilter();
+  }, [onPillRemove, removeFilter, prevRef, nextRef]);
+  const formattedDateRange = (0, import_react.useMemo)(
+    () => value?.startDate && value?.endDate ? `${format(value.startDate)} - ${format(value.endDate)}` : "",
+    [value]
+  );
   return value?.startDate && value?.endDate ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_pills_v2.DSPillGroupV2, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_pills_v2.DSPillV2, { type: "label", label: columnHeader }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_ds_pills_v2.DSPillV2,
       {
         type: "removable",
-        label: `${format(value.startDate)} - ${format(value.endDate)}`,
+        label: formattedDateRange,
         onRemove: handleOnRemove,
-        innerRef
+        innerRef,
+        dsPillPillButton: {
+          dsButtonRoot: { "aria-label": `Remove ${formattedDateRange} from ${columnHeader}` }
+        }
       }
     )
   ] }) : null;

package/dist/cjs/parts/FilterBar/components/DateRangePill.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/parts/FilterBar/components/DateRangePill.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback } from 'react';\nimport { DSPillGroupV2, DSPillV2 } from '@elliemae/ds-pills-v2';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\nconst format = (value: string) => value?.replace(/-/g, '/');\n\nexport const DateRangePill: React.ComponentType<\n  DSDataTableT.FilterPillProps<{ startDate: string; endDate: string }>\n> = ({ columnHeader, column, value, filters, onFiltersChange, prevRef, innerRef, nextRef }) => {\n  const handleOnRemove = useCallback(() => {\n    if (prevRef?.current) prevRef.current.focus();\n    else nextRef.current?.focus();\n    onFiltersChange(filters.filter((filter) => filter.id !== column));\n  }, [onFiltersChange, filters, prevRef, nextRef, column]);\n\n  return value?.startDate && value?.endDate ? (\n    <DSPillGroupV2>\n      <DSPillV2 type=\"label\" label={columnHeader} />\n      <DSPillV2\n        type=\"removable\"\n        label={`${format(value.startDate)} - ${format(value.endDate)}`}\n        onRemove={handleOnRemove}\n        innerRef={innerRef}\n      />\n    </DSPillGroupV2>\n  ) : null;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgBnB;AAhBJ,mBAAmC;AACnC,yBAAwC;AAGxC,MAAM,SAAS,CAAC,UAAkB,OAAO,QAAQ,MAAM,GAAG;AAEnD,MAAM,gBAET,CAAC,EAAE,cAAc,QAAQ,OAAO,SAAS,iBAAiB,SAAS,UAAU,QAAQ,MAAM;AAC7F,QAAM,qBAAiB,0BAAY,MAAM;AACvC,QAAI,SAAS,QAAS,SAAQ,QAAQ,MAAM;AAAA,QACvC,SAAQ,SAAS,MAAM;AAC5B,oBAAgB,QAAQ,OAAO,CAAC,WAAW,OAAO,OAAO,MAAM,CAAC;AAAA,EAClE,GAAG,CAAC,iBAAiB,SAAS,SAAS,SAAS,MAAM,CAAC;AAEvD,SAAO,OAAO,aAAa,OAAO,UAChC,6CAAC,oCACC;AAAA,gDAAC,+BAAS,MAAK,SAAQ,OAAO,cAAc;AAAA,IAC5C;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO,GAAG,OAAO,MAAM,SAAS,CAAC,MAAM,OAAO,MAAM,OAAO,CAAC;AAAA,QAC5D,UAAU;AAAA,QACV;AAAA;AAAA,IACF;AAAA,KACF,IACE;AACN;",
+  "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport { DSPillGroupV2, DSPillV2 } from '@elliemae/ds-pills-v2';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\nconst format = (value: string) => value?.replace(/-/g, '/');\n\nexport const DateRangePill: React.ComponentType<\n  DSDataTableT.FilterPillProps<{ startDate: string; endDate: string }>\n> = ({ columnHeader, column, value, filters, onFiltersChange, prevRef, innerRef, nextRef, onPillRemove }) => {\n  const removeFilter = useCallback(\n    () => onFiltersChange(filters.filter((filter) => filter.id !== column)),\n    [onFiltersChange, filters, column],\n  );\n\n  const handleOnRemove = useCallback(() => {\n    if (onPillRemove) {\n      onPillRemove(removeFilter);\n      return;\n    }\n\n    if (prevRef?.current) prevRef.current.focus();\n    else nextRef?.current?.focus();\n\n    removeFilter();\n  }, [onPillRemove, removeFilter, prevRef, nextRef]);\n\n  const formattedDateRange = useMemo(\n    () => (value?.startDate && value?.endDate ? `${format(value.startDate)} - ${format(value.endDate)}` : ''),\n    [value],\n  );\n\n  return value?.startDate && value?.endDate ? (\n    <DSPillGroupV2>\n      <DSPillV2 type=\"label\" label={columnHeader} />\n      <DSPillV2\n        type=\"removable\"\n        label={formattedDateRange}\n        onRemove={handleOnRemove}\n        innerRef={innerRef}\n        dsPillPillButton={{\n          dsButtonRoot: { 'aria-label': `Remove ${formattedDateRange} from ${columnHeader}` },\n        }}\n      />\n    </DSPillGroupV2>\n  ) : null;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgCnB;AAhCJ,mBAA4C;AAC5C,yBAAwC;AAGxC,MAAM,SAAS,CAAC,UAAkB,OAAO,QAAQ,MAAM,GAAG;AAEnD,MAAM,gBAET,CAAC,EAAE,cAAc,QAAQ,OAAO,SAAS,iBAAiB,SAAS,UAAU,SAAS,aAAa,MAAM;AAC3G,QAAM,mBAAe;AAAA,IACnB,MAAM,gBAAgB,QAAQ,OAAO,CAAC,WAAW,OAAO,OAAO,MAAM,CAAC;AAAA,IACtE,CAAC,iBAAiB,SAAS,MAAM;AAAA,EACnC;AAEA,QAAM,qBAAiB,0BAAY,MAAM;AACvC,QAAI,cAAc;AAChB,mBAAa,YAAY;AACzB;AAAA,IACF;AAEA,QAAI,SAAS,QAAS,SAAQ,QAAQ,MAAM;AAAA,QACvC,UAAS,SAAS,MAAM;AAE7B,iBAAa;AAAA,EACf,GAAG,CAAC,cAAc,cAAc,SAAS,OAAO,CAAC;AAEjD,QAAM,yBAAqB;AAAA,IACzB,MAAO,OAAO,aAAa,OAAO,UAAU,GAAG,OAAO,MAAM,SAAS,CAAC,MAAM,OAAO,MAAM,OAAO,CAAC,KAAK;AAAA,IACtG,CAAC,KAAK;AAAA,EACR;AAEA,SAAO,OAAO,aAAa,OAAO,UAChC,6CAAC,oCACC;AAAA,gDAAC,+BAAS,MAAK,SAAQ,OAAO,cAAc;AAAA,IAC5C;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO;AAAA,QACP,UAAU;AAAA,QACV;AAAA,QACA,kBAAkB;AAAA,UAChB,cAAc,EAAE,cAAc,UAAU,kBAAkB,SAAS,YAAY,GAAG;AAAA,QACpF;AAAA;AAAA,IACF;AAAA,KACF,IACE;AACN;",
   "names": []
 }