@servicetitan/anvil2 3.9.0 → 3.10.0

package/dist/DateFieldYearlessRange-D9XtRNWi.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateFieldYearlessRange-D9XtRNWi.js","sources":["../../hammer-icon/mdi/filled/arrow_forward.svg","../src/components/DateFieldYearlessRange/parts.ts","../src/components/DateFieldYearlessRange/DateFieldYearlessRange.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgArrowForward = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"m12 4-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z\" }));\nexport default SvgArrowForward;\n","/**\n * `data-anv-part` names for DateFieldYearlessRange interactive sub-elements.\n *\n * Consumer `data-*` is forwarded to the fieldset root. Scope start/end inputs\n * under it (`[data-cy=\"x\"] [data-anv-part=\"start-input\"]`). Picker popover /\n * month-list / day-list / option parts are stamped by the shared yearless\n * picker internals — see DateFieldYearless `PARTS`.\n */\nexport const PARTS = {\n  startInput: \"start-input\",\n  endInput: \"end-input\",\n} as const;\n","import { type ReactElement, isValidElement, useId } from \"react\";\nimport cx from \"classnames\";\nimport textFieldStyles from \"../TextField/TextField.module.scss\";\nimport dateFieldYearlessRangeStyles from \"./DateFieldYearlessRange.module.scss\";\nimport { Helper, type HelperProps } from \"../../internal/components\";\nimport { warnDeprecatedErrorUsage } from \"../FieldMessage\";\nimport type { DataAttributes, LayoutUtilProps, Size } from \"../../types\";\nimport { ANV_PART_ATTR } from \"../../internal/constants/anvParts\";\nimport {\n  useLayoutPropsUtil,\n  useOptionallyControlledState,\n} from \"../../internal/hooks\";\nimport FieldLabel, { type FieldLabelProps } from \"../FieldLabel\";\nimport type {\n  YearlessDate,\n  YearlessDateMode,\n} from \"../DateFieldYearless/types\";\nimport Icon from \"../Icon\";\nimport ArrowForward from \"@servicetitan/hammer-icon/mdi/filled/arrow_forward.svg\";\nimport { YearlessDateInputWithPicker } from \"../DateFieldYearless/internal/YearlessDateInputWithPicker\";\nimport { PARTS } from \"./parts\";\n\nexport type DateFieldYearlessRangeValue = {\n  startDate: YearlessDate | null;\n  endDate: YearlessDate | null;\n};\n\nexport type DateFieldYearlessRangeChange = {\n  startDate: YearlessDate | null;\n  endDate: YearlessDate | null;\n};\n\nexport type DateFieldYearlessRangeChangeHandler = (\n  change: DateFieldYearlessRangeChange,\n) => void;\n\nexport type DateFieldYearlessRangeProps = {\n  /**\n   * The controlled value of the date field\n   */\n  value?: DateFieldYearlessRangeValue;\n  /**\n   * The default value for uncontrolled usage\n   */\n  defaultValue?: DateFieldYearlessRangeValue;\n  /**\n   * The function to call when the date value changes\n   */\n  onChange?: DateFieldYearlessRangeChangeHandler;\n  /**\n   * The date format mode (mm/dd or dd/mm)\n   */\n  mode?: YearlessDateMode;\n  /**\n   * Whether the field is required\n   */\n  required?: boolean;\n  /**\n   * Whether the picker is disabled\n   */\n  disablePicker?: boolean;\n  /**\n   * Whether to disable the hint\n   */\n  disableHint?: boolean;\n  /**\n   * Error state for the field. Pass `true` to indicate error styling without a message.\n   * Pass a string, string[], or ReactElement (deprecated) for error messages.\n   */\n  error?: boolean | string | ReactElement | string[];\n  /**\n   * Label for the field group. Always required for accessibility.\n   */\n  label: string;\n  /**\n   * When `true`, hides the visible legend while keeping it accessible to screen readers.\n   * @default false\n   */\n  hideLabel?: boolean;\n  size?: Extract<Size, \"small\" | \"medium\" | \"large\">;\n  description?: HelperProps[\"description\"];\n  /**\n   * @deprecated No longer used. Error messages always use `aria-live=\"assertive\"`.\n   */\n  errorAriaLive?: HelperProps[\"errorAriaLive\"];\n  /**\n   * Warning message(s) to display. Supports a single string or an array of strings.\n   */\n  warning?: string | string[];\n  disabled?: boolean;\n  onFocus?: (event: React.FocusEvent) => void;\n  onBlur?: (event: React.FocusEvent) => void;\n  id?: string;\n  startLabel?: string;\n  endLabel?: string;\n  legendProps?: Omit<FieldLabelProps, \"el\">;\n  moreInfo?: FieldLabelProps[\"moreInfo\"];\n} & LayoutUtilProps &\n  DataAttributes;\n\n/**\n * DateFieldYearlessRange component for entering a start and end month/day\n * pair — a date range with no year, e.g. recurring events or anniversaries.\n *\n * Features:\n * - Two masked month/day inputs (mm/dd or dd/mm mode) with a picker toggle\n * - Separate `startLabel`/`endLabel` under a shared field-group `label`\n * - Optional error, warning, hint, and description messaging\n * - `disablePicker` and `disableHint` to trim the UI down when not needed\n *\n * @example\n * <DateFieldYearlessRange\n *   label=\"Recurring event\"\n *   startLabel=\"Start\"\n *   endLabel=\"End\"\n *   value={{ startDate: { month: 7, day: 2 }, endDate: { month: 7, day: 10 } }}\n *   onChange={(change) => console.log(change)}\n * />\n */\nexport const DateFieldYearlessRange = (props: DateFieldYearlessRangeProps) => {\n  const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n\n  const dataAttributes = Object.fromEntries(\n    Object.entries(componentProps).filter(([key]) => key.startsWith(\"data-\")),\n  ) as DataAttributes;\n\n  const {\n    label,\n    moreInfo,\n    size,\n    hideLabel = false,\n    required,\n    id: idProp,\n    legendProps,\n    errorAriaLive: _errorAriaLive,\n    onFocus: onFocusProp,\n    onBlur: onBlurProp,\n    error,\n    warning,\n    disabled,\n    disableHint,\n    description,\n    mode = \"mm/dd\",\n    startLabel = \"Start date\",\n    endLabel = \"End date\",\n    disablePicker,\n  } = componentProps;\n\n  const [value, setValue] =\n    useOptionallyControlledState<DateFieldYearlessRangeValue>({\n      controlledValue: props.value,\n      defaultValue: props.defaultValue,\n      onChange: props.onChange,\n    });\n\n  const labelUid = useId();\n  const id = idProp ?? labelUid;\n  const helperUid = useId();\n  const moreInfoUid = useId();\n\n  warnDeprecatedErrorUsage(\"DateFieldYearlessRange\", error);\n\n  const errorMessages =\n    typeof error === \"boolean\" || error === undefined ? undefined : error;\n\n  const handleStartDateChange = (startDate: YearlessDate | null) => {\n    setValue({\n      ...value,\n      startDate,\n    });\n  };\n\n  const handleEndDateChange = (endDate: YearlessDate | null) => {\n    setValue({\n      ...value,\n      endDate,\n    });\n  };\n\n  const ariaDescribedBy = [helperUid, moreInfo && moreInfoUid]\n    .filter(Boolean)\n    .join(\" \");\n\n  return (\n    <fieldset\n      {...dataAttributes}\n      className={cx(\n        textFieldStyles[\"textfield\"],\n        dateFieldYearlessRangeStyles[\"range-root\"],\n      )}\n      data-anv=\"date-field-yearless-range\"\n      style={layoutStyles}\n    >\n      <FieldLabel\n        el=\"legend\"\n        moreInfo={moreInfo}\n        moreInfoId={moreInfo ? moreInfoUid : undefined}\n        required={required}\n        {...legendProps}\n        className={cx(\n          legendProps?.className,\n          hideLabel ? dateFieldYearlessRangeStyles[\"sr-only\"] : undefined,\n        )}\n      >\n        {label}\n      </FieldLabel>\n      <div className={dateFieldYearlessRangeStyles[\"range-row\"]}>\n        <FieldLabel\n          htmlFor={id + \"-\" + \"start\"}\n          className={dateFieldYearlessRangeStyles[\"sr-only\"]}\n        >\n          {startLabel}\n        </FieldLabel>\n        <YearlessDateInputWithPicker\n          id={id + \"-\" + \"start\"}\n          size={size}\n          error={!!error}\n          required={required}\n          disabled={disabled}\n          mode={mode}\n          value={value?.startDate}\n          onChange={(change) => handleStartDateChange(change.value)}\n          aria-describedby={ariaDescribedBy}\n          disablePicker={disablePicker}\n          onFocus={onFocusProp}\n          onBlur={onBlurProp}\n          {...{ [ANV_PART_ATTR]: PARTS.startInput }}\n        />\n        <Icon\n          svg={ArrowForward}\n          className={dateFieldYearlessRangeStyles[\"range-arrow\"]}\n        />\n        <FieldLabel\n          htmlFor={id + \"-\" + \"end\"}\n          className={dateFieldYearlessRangeStyles[\"sr-only\"]}\n        >\n          {endLabel}\n        </FieldLabel>\n        <YearlessDateInputWithPicker\n          id={id + \"-\" + \"end\"}\n          size={size}\n          error={!!error}\n          required={required}\n          disabled={disabled}\n          mode={mode}\n          value={value?.endDate}\n          onChange={(change) => handleEndDateChange(change.value)}\n          aria-labelledby={labelUid}\n          aria-describedby={ariaDescribedBy}\n          disablePicker={disablePicker}\n          onFocus={onFocusProp}\n          onBlur={onBlurProp}\n          {...{ [ANV_PART_ATTR]: PARTS.endInput }}\n        />\n      </div>\n      {!disableHint || errorMessages || warning || description ? (\n        <Helper\n          id={helperUid}\n          hint={disableHint ? undefined : `Format: ${mode}`}\n          showCounter={false}\n          error={\n            typeof errorMessages === \"string\" || Array.isArray(errorMessages)\n              ? errorMessages\n              : undefined\n          }\n          warning={warning}\n          errorMessage={\n            isValidElement(errorMessages) ? errorMessages : undefined\n          }\n          description={description}\n        />\n      ) : null}\n    </fieldset>\n  );\n};\n"],"names":["ArrowForward"],"mappings":"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"}

package/dist/DateFieldYearlessRange.js

@@ -1,2 +1,2 @@
-export { D as DateFieldYearlessRange } from './DateFieldYearlessRange-B_bImgyn.js';
+export { D as DateFieldYearlessRange } from './DateFieldYearlessRange-D9XtRNWi.js';
 //# sourceMappingURL=DateFieldYearlessRange.js.map

package/dist/DrillDown.js

@@ -1,2 +1,2 @@
-export { D as DrillDown, b as DrillDownContent, c as DrillDownFooter, a as DrillDownHeader, d as DrillDownNextButton, e as DrillDownPrevButton, D as default, u as useDrillDown } from './useDrilldown-D7DKSs7E.js';
+export { D as DrillDown, b as DrillDownContent, c as DrillDownFooter, a as DrillDownHeader, d as DrillDownNextButton, e as DrillDownPrevButton, D as default, u as useDrillDown } from './useDrilldown-UAm0-l1l.js';
 //# sourceMappingURL=DrillDown.js.map

package/dist/{FilterBar-CBTAkEri.js → FilterBar-luqnJzAK.js}

@@ -2,13 +2,14 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import { useState, useEffect, useContext, useRef, useCallback, useMemo, forwardRef } from 'react';
 import { S as SvgClose } from './close-DZj38AEh.js';
-import { F as FilterGroupContext, g as getActiveFilters, h as hasFilterSelectionChanged, c as cloneFiltersWithItemRefs, u as updateSingleFilter, a as checkActiveFilters, b as getAdapter, s as styles, D as DateListDialog, r as resetFilters, p as preserveFilterState, d as FilterItemWrapper } from './filter-state-XmqhkURU.js';
+import { F as FilterGroupContext, g as getActiveFilters, h as hasFilterSelectionChanged, c as cloneFiltersWithItemRefs, u as updateSingleFilter, a as checkActiveFilters, b as getAdapter, s as styles, P as PARTS, D as DateListDialog, r as resetFilters, p as preserveFilterState, d as FilterItemWrapper } from './filter-state-BQOX7_rO.js';
 import { B as Button } from './Button-Dwh_Nd4l.js';
 import { F as Flex } from './Flex-CRF7gj0_.js';
 import { B as ButtonToggle } from './ButtonToggle-DKDBD1g3.js';
+import { A as ANV_PART_ATTR } from './anvParts-BGg5dgfl.js';
 import { C as Chip } from './Chip-D6Q0J0Xe.js';
 import { D as Drawer } from './Drawer-h2Mut1lB.js';
-import { u as useToolbarSize, a as updateToolbarItemsTabIndex, g as getToolbarElements, h as handleToolbarKeyDown, b as ToolbarContext } from './ToolbarButtonToggle-Bc0XvCM9.js';
+import { u as useToolbarSize, a as updateToolbarItemsTabIndex, g as getToolbarElements, h as handleToolbarKeyDown, b as ToolbarContext } from './ToolbarButtonToggle-BbtKfezH.js';
 import { c as cx } from './index-De1g9FRV.js';
 import { d as BreakpointSm, c as BreakpointMd, b as BreakpointLg, a as BreakpointXl, B as BreakpointXxl } from './primitive-BXgYQTTw.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';
@@ -159,6 +160,7 @@ const FilterDrawer = () => {
         className: triggerClasses,
         checked: open,
         size: toolbarSize,
+        ...{ [ANV_PART_ATTR]: PARTS.drawerTrigger },
         children: [
           "Filters",
           hasHiddenActiveFilters && /* @__PURE__ */ jsx(
@@ -166,7 +168,8 @@ const FilterDrawer = () => {
             {
               size: "small",
               color: "#0265DC",
-              label: activeFiltersCount.toString()
+              label: activeFiltersCount.toString(),
+              ...{ [ANV_PART_ATTR]: PARTS.countBadge }
             }
           )
         ]
@@ -179,6 +182,7 @@ const FilterDrawer = () => {
         "data-testid": "filter-group-drawer",
         open,
         onClose: () => setOpen(false),
+        ...{ [ANV_PART_ATTR]: PARTS.drawer },
         children: [
           /* @__PURE__ */ jsx(Drawer.Content, { children: /* @__PURE__ */ jsx(Flex, { direction: "column", gap: 6, grow: 1, children: filterForm }) }),
           /* @__PURE__ */ jsx(Drawer.Footer, { children: /* @__PURE__ */ jsxs(
@@ -193,12 +197,28 @@ const FilterDrawer = () => {
                     appearance: "ghost",
                     icon: { before: SvgClose },
                     onClick: clearDraftFilters,
+                    ...{ [ANV_PART_ATTR]: PARTS.clearFiltersButton },
                     children: "Clear All Filters"
                   }
                 ),
                 /* @__PURE__ */ jsxs(Flex, { gap: "3", children: [
-                  /* @__PURE__ */ jsx(Button, { onClick: handleCancel, children: "Cancel" }),
-                  /* @__PURE__ */ jsx(Button, { appearance: "primary", onClick: applyFiltering, children: "Apply" })
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      onClick: handleCancel,
+                      ...{ [ANV_PART_ATTR]: PARTS.cancelButton },
+                      children: "Cancel"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      appearance: "primary",
+                      onClick: applyFiltering,
+                      ...{ [ANV_PART_ATTR]: PARTS.applyButton },
+                      children: "Apply"
+                    }
+                  )
                 ] })
               ]
             }
@@ -418,6 +438,7 @@ const FilterBar = forwardRef(
                     before: SvgClose
                   },
                   onClick: clearAllFilters,
+                  ...{ [ANV_PART_ATTR]: PARTS.clearFiltersButton },
                   children: "Clear Filters"
                 }
               ) })
@@ -431,4 +452,4 @@ const FilterBar = forwardRef(
 FilterBar.displayName = "FilterBar";
 
 export { FilterBar as F };
-//# sourceMappingURL=FilterBar-CBTAkEri.js.map
+//# sourceMappingURL=FilterBar-luqnJzAK.js.map

package/dist/FilterBar-luqnJzAK.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterBar-luqnJzAK.js","sources":["../src/internal/hooks/useContainerQuery/useContainerQuery.ts","../../hammer-icon/mdi/round/tune.svg","../src/beta/components/FilterBar/FilterDrawer.tsx","../src/beta/components/FilterBar/FilterBar.tsx"],"sourcesContent":["import { useEffect, useState, type RefObject } from \"react\";\nimport { core } from \"@servicetitan/hammer-token\";\n\n/**\n * Return type for the useContainerQuery hook\n */\nexport type ContainerQueryReturnProps = {\n  /**\n   * The breakpoint name\n   */\n  name: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\";\n  /**\n   * Minimum width for this breakpoint\n   */\n  min: number | undefined;\n  /**\n   * Maximum width for this breakpoint\n   */\n  max: number | undefined;\n  /**\n   * Current container width\n   */\n  containerWidth: number;\n  /**\n   * Current container height\n   */\n  containerHeight: number;\n};\n\n/**\n * Determines if the current container width matches a specific breakpoint\n * @param containerWidth - The container width\n * @param name - The breakpoint name\n * @param min - Minimum width for this breakpoint\n * @param max - Maximum width for this breakpoint\n * @returns Breakpoint information if matched, undefined otherwise\n */\nfunction containerBreakpoint(\n  containerWidth: number,\n  name: ContainerQueryReturnProps[\"name\"],\n  min?: number,\n  max?: number,\n): ContainerQueryReturnProps | undefined {\n  if (\n    (min == null || containerWidth >= min) &&\n    (max == null || containerWidth < max)\n  ) {\n    return {\n      name,\n      min,\n      max,\n      containerWidth,\n      containerHeight: 0, // Will be updated with actual height\n    } as const;\n  }\n  return undefined;\n}\n\n/**\n * Determines the current breakpoint based on container width and hammer-token breakpoint values.\n *\n * Features:\n * - Validates that all required hammer-token breakpoint values are available\n * - Uses cascade logic to determine the appropriate breakpoint\n * - Returns the first matching breakpoint in order of preference\n * - Handles edge cases where breakpoint values are missing\n * - Uses container dimensions for accurate measurements\n * - Supports all standard breakpoints (xs, sm, md, lg, xl, xxl)\n *\n * @param containerWidth - The width of the container element\n * @param containerHeight - The height of the container element\n * @returns Current breakpoint information or undefined if breakpoint values are unavailable\n */\nconst getContainerBreakpoint = (\n  containerWidth: number,\n  containerHeight: number,\n) => {\n  if (!core.primitive?.BreakpointSm) return;\n  if (!core.primitive?.BreakpointMd) return;\n  if (!core.primitive?.BreakpointLg) return;\n  if (!core.primitive?.BreakpointXl) return;\n  if (!core.primitive?.BreakpointXxl) return;\n\n  const sm = parseInt(core.primitive?.BreakpointSm.value);\n  const md = parseInt(core.primitive?.BreakpointMd.value);\n  const lg = parseInt(core.primitive?.BreakpointLg.value);\n  const xl = parseInt(core.primitive?.BreakpointXl.value);\n  const xxl = parseInt(core.primitive?.BreakpointXxl.value);\n\n  const result =\n    containerBreakpoint(containerWidth, \"xs\", undefined, sm) ??\n    containerBreakpoint(containerWidth, \"sm\", sm, md) ??\n    containerBreakpoint(containerWidth, \"md\", md, lg) ??\n    containerBreakpoint(containerWidth, \"lg\", lg, xl) ??\n    containerBreakpoint(containerWidth, \"xl\", xl, xxl) ??\n    containerBreakpoint(containerWidth, \"xxl\", xxl, undefined);\n\n  return result ? { ...result, containerHeight } : undefined;\n};\n\n/**\n * Custom hook for detecting current breakpoint based on container dimensions.\n *\n * Features:\n * - Detects current breakpoint based on container width instead of viewport width\n * - Supports all standard breakpoints (xs, sm, md, lg, xl, xxl)\n * - Provides container dimensions information\n * - Uses hammer-token breakpoint values for consistency\n * - Listens for container resize events using ResizeObserver\n * - Supports optional disable functionality\n * - Uses container element dimensions for accurate measurements\n *\n * @param containerRef - React ref to the container element to observe\n * @param props - Optional configuration object\n * @param props.disable - Whether to disable the hook\n * @returns Current breakpoint information or undefined if disabled\n */\nexport const useContainerQuery = (\n  containerRef: RefObject<HTMLElement>,\n  props?: { disable?: boolean },\n) => {\n  const [size, setSize] = useState<ContainerQueryReturnProps | undefined>(\n    undefined,\n  );\n\n  useEffect(() => {\n    if (props?.disable || !containerRef.current) return;\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        const { width, height } = entry.contentRect;\n        const breakpoint = getContainerBreakpoint(width, height);\n        setSize(breakpoint);\n      }\n    });\n\n    resizeObserver.observe(containerRef.current);\n\n    // Set initial size\n    const rect = containerRef.current.getBoundingClientRect();\n    setSize(getContainerBreakpoint(rect.width, rect.height));\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [containerRef, props?.disable]);\n\n  if (props?.disable) return undefined;\n  return size;\n};\n","import * as React from \"react\";\nconst SvgTune = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M3 18c0 .55.45 1 1 1h5v-2H4c-.55 0-1 .45-1 1zM3 6c0 .55.45 1 1 1h9V5H4c-.55 0-1 .45-1 1zm10 14v-1h7c.55 0 1-.45 1-1s-.45-1-1-1h-7v-1c0-.55-.45-1-1-1s-1 .45-1 1v4c0 .55.45 1 1 1s1-.45 1-1zM7 10v1H4c-.55 0-1 .45-1 1s.45 1 1 1h3v1c0 .55.45 1 1 1s1-.45 1-1v-4c0-.55-.45-1-1-1s-1 .45-1 1zm14 2c0-.55-.45-1-1-1h-9v2h9c.55 0 1-.45 1-1zm-5-3c.55 0 1-.45 1-1V7h3c.55 0 1-.45 1-1s-.45-1-1-1h-3V4c0-.55-.45-1-1-1s-1 .45-1 1v4c0 .55.45 1 1 1z\" }));\nexport default SvgTune;\n","import {\n  useContext,\n  useEffect,\n  useState,\n  useMemo,\n  useCallback,\n  useRef,\n} from \"react\";\nimport IconTune from \"@servicetitan/hammer-icon/mdi/round/tune.svg\";\nimport IconClose from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport type {\n  DateListFilter,\n  DateListLibraryOptionId,\n  Filter,\n} from \"./internal/types\";\nimport { FilterGroupContext } from \"./internal/FilterGroupContext\";\nimport { Flex } from \"../../../components/Flex\";\nimport {\n  checkActiveFilters,\n  getActiveFilters,\n  resetFilters,\n  updateSingleFilter,\n  cloneFiltersWithItemRefs,\n  hasFilterSelectionChanged,\n} from \"./internal/utils/filter-state\";\nimport { getAdapter } from \"./internal/adapters\";\nimport { DateListDialog } from \"./FilterDateList\";\nimport ButtonToggle from \"../../../components/ButtonToggle\";\nimport { ANV_PART_ATTR } from \"../../../internal/constants/anvParts\";\nimport { PARTS } from \"./parts\";\nimport Chip from \"../../../components/Chip\";\nimport Drawer from \"../../../components/Drawer\";\nimport Button from \"../../../components/Button\";\n\nimport { useToolbarSize } from \"../Toolbar/internal/ToolbarContext\";\n\nimport cx from \"classnames\";\nimport styles from \"./FilterBar.module.scss\";\n\n/**\n * FilterDrawer component provides a drawer interface for filter selection.\n * Always operates in controlled mode with batch updates.\n * Built into FilterGroup for batch editing of drawer-only and below-breakpoint filters.\n *\n * Features:\n * - Shows all available filters in a side panel\n * - Maintains separate draft state for all filters\n * - Updates filters only when Apply is clicked\n * - Provides Clear All functionality\n * - Supports boolean, custom, single-select, multi-select, date, and date range filter types\n * - Integrates with FilterGroup context for state management\n * - Handles date and date range filters with appropriate input components\n */\nexport const FilterDrawer = () => {\n  const [open, setOpen] = useState(false);\n\n  // Get filter context from parent\n  const {\n    filters,\n    updateFilter,\n    onFilterChange,\n    drawerOnlyFilters,\n    showInlineFilters,\n  } = useContext(FilterGroupContext);\n  const toolbarSize = useToolbarSize();\n\n  // Local draft state for filters within the drawer\n  const [draftFilters, setDraftFilters] = useState<Filter[]>(filters);\n\n  // Open dialog for a dateList library option (On…/Before…/After…/Custom Range…).\n  const [dateListDialogState, setDateListDialogState] = useState<{\n    filterId: string;\n    libraryId: DateListLibraryOptionId;\n  } | null>(null);\n\n  // Filters not reachable from the toolbar: when inline filters are shown,\n  // only drawer-only filters qualify; otherwise every filter qualifies.\n  const filtersNotInToolbar = showInlineFilters ? drawerOnlyFilters : filters;\n\n  const activeFiltersCount = getActiveFilters(filtersNotInToolbar).length;\n\n  // Track previous state to detect when to sync draft\n  const prevOpenRef = useRef(open);\n  const prevFiltersRef = useRef<Filter[]>(filters);\n\n  /**\n   * Reset draft filters when drawer opens and sync when filter selections change while open\n   * Ensures drawer always shows current filter state\n   */\n  useEffect(() => {\n    const justOpened = open && !prevOpenRef.current;\n    prevOpenRef.current = open;\n\n    if (open) {\n      // Sync draft state if:\n      // 1. Drawer just opened, OR\n      // 2. Any filter selection value changed while already open (race condition fix)\n      // Don't sync when only items arrays change (preserves selections during search)\n      const anySelectionChanged = prevFiltersRef.current.some(\n        (prevFilter, index) => {\n          const newFilter = filters[index];\n          return newFilter && hasFilterSelectionChanged(prevFilter, newFilter);\n        },\n      );\n\n      const shouldSync = justOpened || anySelectionChanged;\n\n      if (shouldSync) {\n        setDraftFilters(cloneFiltersWithItemRefs(filters));\n      }\n\n      prevFiltersRef.current = filters;\n    }\n  }, [open, filters]);\n\n  /**\n   * Handles changing a draft filter value\n   * Updates only the draft state, not the actual filters\n   *\n   * @param filterId - ID of the filter to update\n   * @param value - New value for the filter\n   */\n  const handleDraftChange = useCallback((filterId: string, value: unknown) => {\n    setDraftFilters((draft) => updateSingleFilter(draft, filterId, value));\n  }, []);\n\n  /**\n   * Clears all draft filters in the drawer\n   * Does not affect the actual filters until Apply is clicked\n   */\n  const clearDraftFilters = () => {\n    setDraftFilters(resetFilters(draftFilters));\n  };\n\n  const hasActiveDraftFilters = checkActiveFilters(draftFilters);\n\n  const requestDateListDialog = useCallback(\n    (filterId: string, libraryId: DateListLibraryOptionId) => {\n      setDateListDialogState({ filterId, libraryId });\n    },\n    [],\n  );\n\n  const filterForm = useMemo(\n    () =>\n      draftFilters.map((draftFilter) => {\n        const originalFilter = filters.find((f) => f.id === draftFilter.id);\n        if (!originalFilter) return null;\n\n        return getAdapter(draftFilter).renderDrawer({\n          originalFilter,\n          draftFilter,\n          onDraftChange: handleDraftChange,\n          requestDateListDialog,\n        });\n      }),\n    [draftFilters, filters, handleDraftChange, requestDateListDialog],\n  );\n\n  const applyFiltering = () => {\n    draftFilters.forEach((draftFilter) => {\n      const value = getAdapter(draftFilter).getValue(draftFilter);\n      updateFilter(draftFilter.id, value, false);\n    });\n\n    onFilterChange?.(draftFilters);\n    setOpen(false);\n  };\n\n  const handleCancel = () => {\n    setOpen(false);\n  };\n\n  const hasHiddenActiveFilters = activeFiltersCount > 0;\n\n  const triggerClasses = cx(\n    styles[\"filter-button-trigger\"],\n    styles[\"filter-drawer-trigger\"],\n    {\n      [styles[\"filter-drawer-trigger--chipped\"]]: hasHiddenActiveFilters,\n    },\n  );\n\n  const dateListDialogTarget = dateListDialogState\n    ? draftFilters.find(\n        (f): f is DateListFilter =>\n          f.id === dateListDialogState.filterId && f.type === \"dateList\",\n      )\n    : undefined;\n  const dateListDialogSelected = dateListDialogTarget?.selectedOption;\n  const dateListDialogInitialValue =\n    dateListDialogSelected &&\n    dateListDialogSelected.id === dateListDialogState?.libraryId &&\n    dateListDialogSelected.value !== null\n      ? dateListDialogSelected.value\n      : undefined;\n\n  return (\n    <>\n      <ButtonToggle\n        data-anv=\"filter-group-drawer-trigger\"\n        icon={{ before: IconTune }}\n        onClick={() => setOpen(true)}\n        className={triggerClasses}\n        checked={open}\n        size={toolbarSize}\n        {...{ [ANV_PART_ATTR]: PARTS.drawerTrigger }}\n      >\n        Filters\n        {hasHiddenActiveFilters && (\n          <Chip\n            size=\"small\"\n            color=\"#0265DC\"\n            label={activeFiltersCount.toString()}\n            {...{ [ANV_PART_ATTR]: PARTS.countBadge }}\n          />\n        )}\n      </ButtonToggle>\n\n      <Drawer\n        data-anv=\"filter-group-drawer\"\n        data-testid=\"filter-group-drawer\"\n        open={open}\n        onClose={() => setOpen(false)}\n        {...{ [ANV_PART_ATTR]: PARTS.drawer }}\n      >\n        <Drawer.Content>\n          <Flex direction=\"column\" gap={6} grow={1}>\n            {filterForm}\n          </Flex>\n        </Drawer.Content>\n\n        <Drawer.Footer>\n          <Flex\n            justifyContent={\n              hasActiveDraftFilters ? \"space-between\" : \"flex-end\"\n            }\n            grow={1}\n          >\n            {hasActiveDraftFilters && (\n              <Button\n                appearance=\"ghost\"\n                icon={{ before: IconClose }}\n                onClick={clearDraftFilters}\n                {...{ [ANV_PART_ATTR]: PARTS.clearFiltersButton }}\n              >\n                Clear All Filters\n              </Button>\n            )}\n\n            <Flex gap=\"3\">\n              <Button\n                onClick={handleCancel}\n                {...{ [ANV_PART_ATTR]: PARTS.cancelButton }}\n              >\n                Cancel\n              </Button>\n              <Button\n                appearance=\"primary\"\n                onClick={applyFiltering}\n                {...{ [ANV_PART_ATTR]: PARTS.applyButton }}\n              >\n                Apply\n              </Button>\n            </Flex>\n          </Flex>\n        </Drawer.Footer>\n      </Drawer>\n      <DateListDialog\n        libraryId={dateListDialogState?.libraryId ?? null}\n        parentFilterId={dateListDialogState?.filterId ?? \"\"}\n        initialValue={dateListDialogInitialValue}\n        mode={dateListDialogTarget?.mode}\n        dialogCtaLabel=\"Save\"\n        onCommit={(option) => {\n          if (dateListDialogState) {\n            handleDraftChange(dateListDialogState.filterId, option);\n          }\n          setDateListDialogState(null);\n        }}\n        onCancel={() => setDateListDialogState(null)}\n      />\n    </>\n  );\n};\n","import {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  useCallback,\n} from \"react\";\nimport { useMergeRefs } from \"../../../hooks\";\nimport CloseIcon from \"@servicetitan/hammer-icon/mdi/round/close.svg\";\nimport type { Filter } from \"./internal/types\";\nimport { FilterItemWrapper } from \"./FilterItemWrapper\";\nimport Button from \"../../../components/Button\";\nimport type { DataAttributes, LayoutUtilProps } from \"../../../types\";\nimport { useContainerQuery, useLayoutPropsUtil } from \"../../../internal/hooks\";\nimport {\n  checkActiveFilters,\n  resetFilters,\n  updateSingleFilter,\n  hasFilterSelectionChanged,\n  preserveFilterState,\n} from \"./internal/utils/filter-state\";\nimport { getAdapter } from \"./internal/adapters\";\nimport { FilterGroupContext } from \"./internal/FilterGroupContext\";\nimport { FilterDrawer } from \"./FilterDrawer\";\nimport { ToolbarContext } from \"../Toolbar/internal/ToolbarContext\";\nimport type { ToolbarSize } from \"../Toolbar/types\";\nimport {\n  getToolbarElements,\n  handleToolbarKeyDown,\n  updateToolbarItemsTabIndex,\n} from \"../Toolbar/internal/utils/accessibility\";\nimport { Flex } from \"../../../components/Flex\";\nimport { ANV_PART_ATTR } from \"../../../internal/constants/anvParts\";\nimport { PARTS } from \"./parts\";\n\nimport styles from \"./FilterBar.module.scss\";\n\n/**\n * Props for the FilterBar component\n *\n * @extends ComponentPropsWithoutRef<\"div\">\n * @extends LayoutUtilProps\n */\nexport type FilterBarProps = ComponentPropsWithoutRef<\"div\"> &\n  LayoutUtilProps &\n  DataAttributes & {\n    /** Array of filter objects */\n    filters: Filter[];\n    /** Description of the content this filter bar is associated with, used for accessibility */\n    associatedContent: string;\n    /** Callback function when filters change */\n    onFilterChange: (filters: Filter[]) => void;\n    /** Whether the filters submission is controlled via an apply button */\n    controlledFiltering?: boolean;\n    /**\n     * Size of filter controls\n     * @default xsmall\n     */\n    size?: ToolbarSize;\n    /**\n     * When true, filters stay inline at every container width instead of\n     * collapsing to drawer-only mode at narrow widths.\n     * @default false\n     */\n    disableCollapse?: boolean;\n  };\n\n/**\n * FilterBar component for displaying a standalone group of filters with toggles and a clear button.\n *\n * Features:\n * - Standalone component with `role=\"toolbar\"` and keyboard navigation\n * - Renders filter toggles and popovers for all filter types\n * - Supports controlled and uncontrolled filtering\n * - Integrates with FilterDrawer for batch filter editing of drawer-only filters\n * - Provides a clear all filters button\n * - Shares filter state via context for child components\n * - Supports boolean, custom, single-select, multi-select, date, and date range filter types\n * - Preserves filter state when filter configuration changes\n * - Responsive: collapses to drawer-only mode below 640px; opt out via `disableCollapse`\n * - Always wraps; never collapses items into an overflow menu\n * - Can be composed alongside Toolbar as a sibling using Flex layout\n *\n * @example\n * <FilterBar\n *   associatedContent=\"invoices\"\n *   filters={filters}\n *   onFilterChange={handleFilter}\n *   controlledFiltering={true}\n * />\n *\n * @example\n * // With Toolbar as sibling\n * <Flex alignItems=\"center\" justifyContent=\"space-between\">\n *   <Toolbar associatedContent=\"invoice actions\">\n *     <Toolbar.Button icon={SaveIcon} aria-label=\"Save\" />\n *   </Toolbar>\n *   <FilterBar\n *     associatedContent=\"invoices\"\n *     filters={filters}\n *     onFilterChange={handleFilter}\n *   />\n * </Flex>\n */\nexport const FilterBar = forwardRef<HTMLDivElement, FilterBarProps>(\n  function FilterBarInner(props, ref) {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const {\n      filters: initialFilters,\n      onFilterChange,\n      controlledFiltering = false,\n      associatedContent,\n      size = \"xsmall\",\n      disableCollapse = false,\n      className,\n      style,\n      onKeyDown,\n      ...rest\n    } = componentProps;\n\n    const [filters, setFilters] = useState<Filter[]>(initialFilters);\n    const filterBarRef = useRef<HTMLDivElement>(null);\n    const containerQuery = useContainerQuery(filterBarRef);\n\n    const showInlineFilters =\n      disableCollapse || !!(containerQuery && containerQuery.name !== \"xs\");\n\n    // Update filters when props change\n    useEffect(() => {\n      setFilters((prevFilters) => {\n        const existingFiltersMap = new Map(prevFilters.map((f) => [f.id, f]));\n\n        return initialFilters.map((newFilter: Filter) => {\n          const existingFilter = existingFiltersMap.get(newFilter.id);\n\n          if (!existingFilter) {\n            return newFilter;\n          }\n\n          if (!hasFilterSelectionChanged(existingFilter, newFilter)) {\n            return preserveFilterState(newFilter, existingFilter);\n          }\n\n          return newFilter;\n        });\n      });\n    }, [initialFilters]);\n\n    /**\n     * Updates filter state when a filter is changed\n     *\n     * @param filterId - ID of the filter to update\n     * @param value - New value for the filter\n     * @param submit - Whether to submit the filter change\n     */\n    const updateFilter = useCallback(\n      (filterId: string, value: unknown, submit: boolean) => {\n        setFilters((prevFilters) => {\n          const updatedFilters = updateSingleFilter(\n            prevFilters,\n            filterId,\n            value,\n          );\n\n          if (submit) {\n            onFilterChange?.(updatedFilters);\n          }\n\n          return updatedFilters;\n        });\n      },\n      [onFilterChange],\n    );\n\n    /**\n     * Clears all active filters\n     */\n    const clearAllFilters = () => {\n      const resetAllFilters = resetFilters(filters);\n      setFilters(resetAllFilters);\n      onFilterChange?.(resetAllFilters);\n\n      requestAnimationFrame(() => {\n        if (filterBarRef.current) {\n          const firstFocusable = filterBarRef.current.querySelector(\n            'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n          ) as HTMLElement;\n\n          if (firstFocusable) {\n            firstFocusable.focus();\n          }\n        }\n      });\n    };\n\n    const hasActiveFilters = checkActiveFilters(filters);\n\n    const { inlineFilters, drawerOnlyFilters } = useMemo(() => {\n      const inline: Filter[] = [];\n      const drawer: Filter[] = [];\n      for (const f of filters) {\n        (f.drawerOnly ? drawer : inline).push(f);\n      }\n      // The search filter is a pinned, always-visible field — keyboard\n      // navigation treats it as a fixed edge of the roving-focus sequence\n      // (see the ArrowLeft/ArrowRight boundary handoff below), so it always\n      // renders first regardless of where it sits in `filters`.\n      const searchFilter = inline.find((f) => f.type === \"search\");\n      const orderedInline = searchFilter\n        ? [searchFilter, ...inline.filter((f) => f !== searchFilter)]\n        : inline;\n      return { inlineFilters: orderedInline, drawerOnlyFilters: drawer };\n    }, [filters]);\n\n    // The drawer (and its trigger) only exists when at least one filter is\n    // unreachable from the toolbar — either because the container is too\n    // narrow to show inline filters or the filter is configured as drawer-only.\n    const shouldShowDrawer = !showInlineFilters || drawerOnlyFilters.length > 0;\n\n    const filterGroupControls = inlineFilters.map((filter) =>\n      getAdapter(filter).renderBarControl({\n        filter,\n        updateFilter,\n        controlledFiltering,\n      }),\n    );\n\n    // Provide ToolbarContext so filter sub-components read size from FilterBar.\n    // overflow is omitted — it's optional and defaults to wrap behavior.\n    const toolbarContextValue = useMemo(\n      () => ({\n        overflowItems: [],\n        addItem: () => {},\n        removeItem: () => {},\n        toolbarRef: filterBarRef,\n        size,\n      }),\n      [size],\n    );\n\n    const filterGroupContextValue = useMemo(\n      () => ({\n        filterGroupRef: filterBarRef,\n        filters,\n        updateFilter,\n        onFilterChange,\n        controlledFiltering,\n        associatedContent,\n        showInlineFilters,\n        drawerOnlyFilters,\n      }),\n      [\n        filterBarRef,\n        filters,\n        updateFilter,\n        onFilterChange,\n        controlledFiltering,\n        associatedContent,\n        showInlineFilters,\n        drawerOnlyFilters,\n      ],\n    );\n\n    // Initialize tabindex values for keyboard navigation\n    useEffect(() => {\n      if (filterBarRef.current) {\n        updateToolbarItemsTabIndex(filterBarRef.current);\n      }\n    }, [filters]);\n\n    const handleKeyDown = useCallback(\n      (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (filterBarRef.current) {\n          // The search field's input keeps a fixed tabindex and is excluded\n          // from the roving-tabindex pool (see FilterSearchField), so the\n          // generic handler below only knows about the filter chips and\n          // wraps within just that pool. When a search field is present,\n          // treat it as the boundary neighbor instead: ArrowLeft from the\n          // first chip and ArrowRight from the last chip go to the search\n          // input rather than wrapping among the chips.\n          const searchInput = filterBarRef.current.querySelector<HTMLElement>(\n            '[data-anv=\"filter-search-field\"] input',\n          );\n\n          if (searchInput) {\n            const items = getToolbarElements(filterBarRef.current);\n            const activeElement = event.target as HTMLElement;\n            const activeItem = items.find(\n              (item) =>\n                item === activeElement ||\n                Array.from(item.children).some(\n                  (child) => child === activeElement,\n                ),\n            );\n            const activeIndex = activeItem ? items.indexOf(activeItem) : -1;\n\n            if (\n              (event.code === \"ArrowLeft\" && activeIndex === 0) ||\n              (event.code === \"ArrowRight\" && activeIndex === items.length - 1)\n            ) {\n              event.preventDefault();\n              searchInput.focus();\n              onKeyDown?.(event);\n              return;\n            }\n          }\n\n          handleToolbarKeyDown(event, filterBarRef.current);\n        }\n        onKeyDown?.(event);\n      },\n      [onKeyDown],\n    );\n\n    const styleCombined = {\n      ...style,\n      ...layoutStyles,\n    };\n\n    return (\n      <ToolbarContext.Provider value={toolbarContextValue}>\n        <FilterGroupContext.Provider value={filterGroupContextValue}>\n          <Flex\n            ref={useMergeRefs([filterBarRef, ref])}\n            role=\"toolbar\"\n            aria-label={`Filters for ${associatedContent}. Use arrow keys to navigate through filter controls.`}\n            aria-orientation=\"horizontal\"\n            tabIndex={-1}\n            onKeyDown={handleKeyDown}\n            alignItems=\"center\"\n            gap={1}\n            wrap=\"wrap\"\n            className={className}\n            style={styleCombined}\n            data-anv=\"filter-bar\"\n            {...rest}\n          >\n            <Flex\n              alignItems=\"center\"\n              gap={1}\n              wrap=\"wrap\"\n              grow={1}\n              data-anv=\"toolbar-content\"\n            >\n              {showInlineFilters && filterGroupControls}\n              {shouldShowDrawer && <FilterDrawer />}\n\n              {showInlineFilters && hasActiveFilters && (\n                <FilterItemWrapper>\n                  <Button\n                    appearance=\"ghost\"\n                    size={size}\n                    className={styles[\"filter-button-trigger\"]}\n                    icon={{\n                      before: CloseIcon,\n                    }}\n                    onClick={clearAllFilters}\n                    {...{ [ANV_PART_ATTR]: PARTS.clearFiltersButton }}\n                  >\n                    Clear Filters\n                  </Button>\n                </FilterItemWrapper>\n              )}\n            </Flex>\n          </Flex>\n        </FilterGroupContext.Provider>\n      </ToolbarContext.Provider>\n    );\n  },\n);\n\nFilterBar.displayName = \"FilterBar\";\n"],"names":["core.primitive?.BreakpointSm","core.primitive?.BreakpointMd","core.primitive?.BreakpointLg","core.primitive?.BreakpointXl","core.primitive?.BreakpointXxl","IconTune","IconClose","CloseIcon"],"mappings":"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"}

package/dist/FilterBar.js

@@ -1,2 +1,2 @@
-export { F as FilterBar, F as default } from './FilterBar-CBTAkEri.js';
+export { F as FilterBar, F as default } from './FilterBar-luqnJzAK.js';
 //# sourceMappingURL=FilterBar.js.map

package/dist/{MenuFooter-BXcNxNnX.js → MenuFooter--lBF8OjJ.js}

@@ -1,5 +1,6 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { B as Button } from './Button-Dwh_Nd4l.js';
+import { C as COMMON_PART, A as ANV_PART_ATTR } from './anvParts-BGg5dgfl.js';
 
 import './MenuFooter.css';const stack = "_stack_o8ro5_1";
 const leading = "_leading_o8ro5_26";
@@ -30,6 +31,7 @@ const ClearButton = ({
     onClick,
     disabled,
     className: fullWidth ? styles["clear-full"] : void 0,
+    ...{ [ANV_PART_ATTR]: COMMON_PART.clearButton },
     children: label
   }
 );
@@ -50,6 +52,7 @@ const ConfirmationRow = ({
         size: "small",
         onMouseDown: preventBlur,
         onClick: onCancel,
+        ...{ [ANV_PART_ATTR]: COMMON_PART.cancelButton },
         children: cancelLabel
       }
     ),
@@ -61,6 +64,7 @@ const ConfirmationRow = ({
         onMouseDown: preventBlur,
         onClick: onApply,
         disabled: applyDisabled,
+        ...{ [ANV_PART_ATTR]: COMMON_PART.applyButton },
         children: applyLabel
       }
     )
@@ -112,4 +116,4 @@ const MenuFooter = ({
 MenuFooter.displayName = "MenuFooter";
 
 export { MenuFooter as M };
-//# sourceMappingURL=MenuFooter-BXcNxNnX.js.map
+//# sourceMappingURL=MenuFooter--lBF8OjJ.js.map

package/dist/MenuFooter--lBF8OjJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFooter--lBF8OjJ.js","sources":["../src/internal/components/MenuFooter/MenuFooter.tsx"],"sourcesContent":["import type { MouseEvent, ReactNode } from \"react\";\nimport Button from \"../../../components/Button\";\nimport styles from \"./MenuFooter.module.scss\";\nimport { ANV_PART_ATTR, COMMON_PART } from \"../../constants/anvParts\";\n\n// Safari does not focus buttons on mousedown the way Chrome / Firefox do.\n// Combined with the popover's focusout listener, that means clicking a footer\n// button can fire focusout with relatedTarget=null and close the popover\n// before the click handler runs. Preventing the default on mousedown keeps the\n// previously focused element focused, sidestepping the focusout entirely.\nconst preventBlur = (e: MouseEvent<HTMLButtonElement>) => {\n  e.preventDefault();\n};\n\nexport type MenuFooterClearConfig = {\n  onClick: () => void;\n  label?: string;\n  disabled?: boolean;\n};\n\nexport type MenuFooterConfirmationConfig = {\n  onApply: () => void;\n  onCancel: () => void;\n  applyLabel?: string;\n  cancelLabel?: string;\n  applyDisabled?: boolean;\n};\n\nexport type MenuFooterProps = {\n  /** Clear-selection button config. Omit to suppress. */\n  clear?: MenuFooterClearConfig;\n  /** Apply/Cancel pair config. Omit when not in confirmation mode. */\n  confirmation?: MenuFooterConfirmationConfig;\n  /**\n   * Pre-rendered add-new affordance (AddNewItemButton or similar). Layout owns\n   * its row vs. inline placement; the caller just provides the node.\n   */\n  addNew?: ReactNode;\n};\n\nconst ClearButton = ({\n  onClick,\n  label = \"Clear\",\n  disabled,\n  fullWidth,\n}: MenuFooterClearConfig & { fullWidth?: boolean }) => (\n  <Button\n    appearance=\"secondary\"\n    size=\"small\"\n    onMouseDown={preventBlur}\n    onClick={onClick}\n    disabled={disabled}\n    className={fullWidth ? styles[\"clear-full\"] : undefined}\n    {...{ [ANV_PART_ATTR]: COMMON_PART.clearButton }}\n  >\n    {label}\n  </Button>\n);\n\n/**\n * Single justified-flex row containing the Apply/Cancel pair, with an optional\n * leading element on the opposite side.\n */\nconst ConfirmationRow = ({\n  applyLabel = \"Apply\",\n  cancelLabel = \"Cancel\",\n  onApply,\n  onCancel,\n  applyDisabled,\n  leading,\n}: MenuFooterConfirmationConfig & { leading?: ReactNode }) => (\n  <div className={styles[\"confirmation-row\"]}>\n    {leading ? <div className={styles[\"leading\"]}>{leading}</div> : null}\n    <div className={styles[\"trailing\"]}>\n      <Button\n        appearance=\"secondary\"\n        size=\"small\"\n        onMouseDown={preventBlur}\n        onClick={onCancel}\n        {...{ [ANV_PART_ATTR]: COMMON_PART.cancelButton }}\n      >\n        {cancelLabel}\n      </Button>\n      <Button\n        appearance=\"primary\"\n        size=\"small\"\n        onMouseDown={preventBlur}\n        onClick={onApply}\n        disabled={applyDisabled}\n        {...{ [ANV_PART_ATTR]: COMMON_PART.applyButton }}\n      >\n        {applyLabel}\n      </Button>\n    </div>\n  </div>\n);\n\n/**\n * MenuFooter composes the footer of a menu popover/dialog from up to three\n * optional pieces: a clear-selection button, an Apply/Cancel pair, and an\n * add-new affordance.\n *\n * Layout rules:\n * - clear + confirmation + addNew → [addNew full-width row] / [clear | apply cancel]\n * - clear + confirmation         → [clear | apply cancel]\n * - clear + addNew               → [addNew] / [clear]   (stacked, both full-width)\n * - clear                        → [clear]               (full-width)\n * - confirmation + addNew        → [addNew | apply cancel]   (addNew on the leading side)\n * - confirmation                 → [apply | cancel]\n * - addNew                       → [addNew]\n * - (none)                       → null\n */\nexport const MenuFooter = ({\n  clear,\n  confirmation,\n  addNew,\n}: MenuFooterProps) => {\n  // Branches with confirmation\n  if (confirmation) {\n    if (clear && addNew) {\n      return (\n        <div className={styles[\"stack\"]}>\n          <div className={styles[\"stack-row\"]}>{addNew}</div>\n          <ConfirmationRow\n            {...confirmation}\n            leading={<ClearButton {...clear} />}\n          />\n        </div>\n      );\n    }\n    if (clear) {\n      return (\n        <ConfirmationRow\n          {...confirmation}\n          leading={<ClearButton {...clear} />}\n        />\n      );\n    }\n    return <ConfirmationRow {...confirmation} leading={addNew} />;\n  }\n\n  // Branches without confirmation\n  if (clear && addNew) {\n    return (\n      <div className={styles[\"stack\"]}>\n        <div className={styles[\"stack-row\"]}>{addNew}</div>\n        <div className={styles[\"stack-row\"]}>\n          <ClearButton {...clear} fullWidth />\n        </div>\n      </div>\n    );\n  }\n  if (clear) {\n    return (\n      <div className={styles[\"stack-row\"]}>\n        <ClearButton {...clear} fullWidth />\n      </div>\n    );\n  }\n  if (addNew) {\n    return <>{addNew}</>;\n  }\n  return null;\n};\n\nMenuFooter.displayName = \"MenuFooter\";\n"],"names":[],"mappings":"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"}

package/dist/MultiSelectField.js

@@ -1,2 +1,2 @@
-export { M as MultiSelectField, a as MultiSelectFieldSync } from './MultiSelectFieldSync-CpfsWecG.js';
+export { M as MultiSelectField, a as MultiSelectFieldSync } from './MultiSelectFieldSync-HhFKGtQM.js';
 //# sourceMappingURL=MultiSelectField.js.map

package/dist/{MultiSelectFieldSync-CpfsWecG.js → MultiSelectFieldSync-HhFKGtQM.js}

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useRef, useState, useMemo, useEffect, forwardRef, useId, useCallback } from 'react';
 import { w as warnDeprecatedErrorUsage } from './utils-CM48ODEJ.js';
-import { a as useToggleSelection, M as MultiSelectOptions, u as useBulkActionRunner, r as resolveBulkActionCheckState, b as resolveBulkActionLabel } from './bulkActionTypes-BnZNAru6.js';
+import { a as useToggleSelection, M as MultiSelectOptions, u as useBulkActionRunner, r as resolveBulkActionCheckState, b as resolveBulkActionLabel } from './bulkActionTypes-CWcUhKFS.js';
 import { c as cx } from './index-De1g9FRV.js';
 import { B as Button } from './Button-Dwh_Nd4l.js';
 import { C as Chip } from './Chip-D6Q0J0Xe.js';
@@ -10,11 +10,12 @@ import { m as mergeRefs, u as useMergeRefs } from './useMergeRefs-Dfmtq9cI.js';
 import { S as SvgChevronRight } from './chevron_right-BdpsxX7x.js';
 import { S as SvgClose } from './close-DZj38AEh.js';
 import { u as useChipLayout } from './useChipLayout-BWZfKDgd.js';
+import { C as COMMON_PART, A as ANV_PART_ATTR } from './anvParts-BGg5dgfl.js';
 import { S as SelectFieldLabel } from './SelectFieldLabel-CjY6zFJA.js';
 import { s as styles$1 } from './SelectTriggerBase.module-Brmw1nYG.js';
 import { u as useDownshiftEnvironment, a as useCombobox, b as useSelect } from './downshift.esm-xtSnQp44.js';
-import { a as useProcessedOptions, b as buildSelectItems, s as shouldShowAddNewItem, A as AddNewItemButton, u as useSelectOrchestration, d as defaultSyncFilter, t as toSyncFilterFn } from './syncFilterUtils-UVNoFsDr.js';
-import { O as OptionsDialog, a as OptionsPopover } from './useAdaptiveView-C_WvM4-P.js';
+import { a as useProcessedOptions, b as buildSelectItems, s as shouldShowAddNewItem, A as AddNewItemButton, u as useSelectOrchestration, d as defaultSyncFilter, t as toSyncFilterFn } from './syncFilterUtils-YB6gRuuR.js';
+import { O as OptionsDialog, a as OptionsPopover } from './useAdaptiveView-DmhhcX-B.js';
 import { F as FieldMessage } from './FieldMessage-mTGdycSA.js';
 import { u as useDebouncedCallback } from './useDebouncedCallback-DLkapjcP.js';
 import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-DjqeAJZ9.js';
@@ -51,6 +52,15 @@ const styles = {
 	small: small,
 	large: large};
 
+const PARTS = {
+  trigger: COMMON_PART.trigger,
+  input: COMMON_PART.input,
+  chip: COMMON_PART.chip,
+  overflowChip: COMMON_PART.overflowChip,
+  clearButton: COMMON_PART.clearButton,
+  toggleButton: COMMON_PART.toggleButton
+};
+
 const MultiSelectFieldInput = ({
   placeholder,
   size,
@@ -93,7 +103,10 @@ const MultiSelectFieldInput = ({
   });
   const handleInputKeyDown = (e) => {
     if (e.key === "Backspace" && !inputProps?.value && selectedOptions.length > 0 && onRemoveOption && !disabled && !readOnly) {
-      onRemoveOption(selectedOptions[selectedOptions.length - 1]);
+      const lastRemovable = [...selectedOptions].reverse().find((option) => !option.disabled);
+      if (lastRemovable) {
+        onRemoveOption(lastRemovable);
+      }
     }
     if (inputProps?.onKeyDown) {
       inputProps.onKeyDown(e);
@@ -127,8 +140,9 @@ const MultiSelectFieldInput = ({
                   Chip,
                   {
                     ...getChipProps?.(option),
+                    ...{ [ANV_PART_ATTR]: PARTS.chip },
                     label: option.label,
-                    onClose: disabled || readOnly ? void 0 : () => onRemoveOption(option),
+                    onClose: disabled || readOnly || option.disabled ? void 0 : () => onRemoveOption(option),
                     className: styles["chip"],
                     title: option.label
                   }
@@ -141,7 +155,8 @@ const MultiSelectFieldInput = ({
               {
                 label: `+${hiddenCount}`,
                 className: styles["chip"],
-                title: selectedOptions.slice(displayCount).map((option) => option.label).join(", ")
+                title: selectedOptions.slice(displayCount).map((option) => option.label).join(", "),
+                ...{ [ANV_PART_ATTR]: PARTS.overflowChip }
               }
             ) }) : null,
             /* @__PURE__ */ jsxs(Flex, { className: styles["input-flex"], alignItems: "center", children: [
@@ -154,6 +169,7 @@ const MultiSelectFieldInput = ({
                   disabled,
                   readOnly,
                   ...inputProps,
+                  ...{ [ANV_PART_ATTR]: PARTS.input },
                   ref: mergedInputRef,
                   onKeyDown: handleInputKeyDown,
                   className: cx(styles["input"], inputProps?.className, {
@@ -173,6 +189,7 @@ const MultiSelectFieldInput = ({
                 appearance: "ghost",
                 size: "small",
                 className: styles["close-button"],
+                ...{ [ANV_PART_ATTR]: PARTS.clearButton },
                 onClick: () => {
                   onClear?.();
                 }
@@ -187,6 +204,7 @@ const MultiSelectFieldInput = ({
                 size: "small",
                 disabled,
                 ...toggleButtonProps,
+                ...{ [ANV_PART_ATTR]: PARTS.toggleButton },
                 className: cx(
                   styles["toggle-button"],
                   toggleButtonProps?.className
@@ -496,7 +514,8 @@ const MultiSelectFieldComboboxMode = ({
   addItemLabel,
   onAddNewItem,
   handleRemoveOption,
-  handleClear
+  handleClear,
+  dataAttributes
 }) => {
   const listRef = useRef(null);
   const debouncedOptionLoader = useDebouncedCallback((inputValue2) => {
@@ -572,6 +591,8 @@ const MultiSelectFieldComboboxMode = ({
     return /* @__PURE__ */ jsxs(
       "div",
       {
+        ...dataAttributes,
+        "data-anv": "multi-select-field",
         className: className ? `${styles$1["search-field"]} ${className}` : styles$1["search-field"],
         style: { ...layoutStyles, ...style },
         ref: wrapperDivRef,
@@ -689,6 +710,8 @@ const MultiSelectFieldComboboxMode = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ...dataAttributes,
+      "data-anv": "multi-select-field",
       className: className ? `${styles$1["search-field"]} ${className}` : styles$1["search-field"],
       style: { ...layoutStyles, ...style },
       children: [
@@ -823,6 +846,7 @@ const MultiSelectFieldTrigger = ({
         ...restToggleButtonProps,
         popoverTarget,
         id,
+        ...{ [ANV_PART_ATTR]: PARTS.trigger },
         className: cx(inputWrapperClassNames, restToggleButtonProps?.className),
         children: [
           prefix ? /* @__PURE__ */ jsx("div", { className: styles["prefix"], children: prefix }) : null,
@@ -835,8 +859,9 @@ const MultiSelectFieldTrigger = ({
                   Chip,
                   {
                     ...getChipProps?.(option),
+                    ...{ [ANV_PART_ATTR]: PARTS.chip },
                     label: option.label,
-                    onClose: disabled || readOnly ? void 0 : (e) => {
+                    onClose: disabled || readOnly || option.disabled ? void 0 : (e) => {
                       e.stopPropagation();
                       onRemoveOption(option);
                       triggerRef.current?.focus();
@@ -853,7 +878,8 @@ const MultiSelectFieldTrigger = ({
               {
                 label: `+${hiddenCount}`,
                 className: styles["chip"],
-                title: selectedOptions.slice(displayCount).map((option) => option.label).join(", ")
+                title: selectedOptions.slice(displayCount).map((option) => option.label).join(", "),
+                ...{ [ANV_PART_ATTR]: PARTS.overflowChip }
               }
             ) }) : null,
             selectedOptions.length === 0 ? /* @__PURE__ */ jsxs(Flex, { className: styles["input-flex"], alignItems: "center", children: [
@@ -878,6 +904,7 @@ const MultiSelectFieldTrigger = ({
               size: "small",
               disabled,
               tabIndex: -1,
+              ...{ [ANV_PART_ATTR]: PARTS.toggleButton },
               className: styles["toggle-button"]
             }
           ) }) })
@@ -897,6 +924,7 @@ const MultiSelectFieldTrigger = ({
             appearance: "ghost",
             size: "small",
             className: styles["close-button"],
+            ...{ [ANV_PART_ATTR]: PARTS.clearButton },
             onClick: (e) => {
               e.stopPropagation();
               onClear?.();
@@ -1110,7 +1138,8 @@ const MultiSelectFieldSelectMode = ({
   addItemLabel,
   onAddNewItem,
   handleRemoveOption,
-  handleClear
+  handleClear,
+  dataAttributes
 }) => {
   const listRef = useRef(null);
   const {
@@ -1180,6 +1209,8 @@ const MultiSelectFieldSelectMode = ({
     return /* @__PURE__ */ jsxs(
       "div",
       {
+        ...dataAttributes,
+        "data-anv": "multi-select-field",
         className: className ? `${styles$1["search-field"]} ${className}` : styles$1["search-field"],
         style: { ...layoutStyles, ...style },
         ref: wrapperDivRef,
@@ -1271,6 +1302,8 @@ const MultiSelectFieldSelectMode = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ...dataAttributes,
+      "data-anv": "multi-select-field",
       className: className ? `${styles$1["search-field"]} ${className}` : styles$1["search-field"],
       style: { ...layoutStyles, ...style },
       children: [
@@ -1357,6 +1390,9 @@ const MultiSelectFieldSelectMode = ({
 
 const MultiSelectField = forwardRef((propsWithLayout, ref) => {
   const { layoutStyles, componentProps } = useLayoutPropsUtil(propsWithLayout);
+  const dataAttributes = Object.fromEntries(
+    Object.entries(componentProps).filter(([key]) => key.startsWith("data-"))
+  );
   const inputWrapperRef = useRef(null);
   const {
     id: idProp,
@@ -1435,6 +1471,10 @@ const MultiSelectField = forwardRef((propsWithLayout, ref) => {
   });
   const handleRemoveOption = useCallback(
     (option) => {
+      const target = selectedOptions.find((opt) => opt.id === option.id);
+      if (target?.disabled) {
+        return;
+      }
       onSelectedOptionsChange(
         selectedOptions.filter((opt) => opt.id !== option.id)
       );
@@ -1442,9 +1482,13 @@ const MultiSelectField = forwardRef((propsWithLayout, ref) => {
     [selectedOptions, onSelectedOptionsChange]
   );
   const handleClear = useCallback(() => {
-    onSelectedOptionsChange([]);
-  }, [onSelectedOptionsChange]);
-  const disableClearButton = selectedOptions.length === 0 || isDisabledOrReadOnly;
+    const lockedOptions = selectedOptions.filter((opt) => opt.disabled);
+    onSelectedOptionsChange(lockedOptions);
+  }, [selectedOptions, onSelectedOptionsChange]);
+  const removableSelectedCount = selectedOptions.filter(
+    (opt) => !opt.disabled
+  ).length;
+  const disableClearButton = removableSelectedCount === 0 || isDisabledOrReadOnly;
   const { pending: bulkPending, runBulk } = useBulkActionRunner({
     setDraft: onSelectedOptionsChange
   });
@@ -1531,7 +1575,8 @@ const MultiSelectField = forwardRef((propsWithLayout, ref) => {
     addItemLabel,
     onAddNewItem,
     handleRemoveOption,
-    handleClear
+    handleClear,
+    dataAttributes
   };
   if (disableSearch) {
     return /* @__PURE__ */ jsx(MultiSelectFieldSelectMode, { ...baseProps });
@@ -1661,4 +1706,4 @@ const MultiSelectFieldSync = (props) => {
 };
 
 export { MultiSelectField as M, MultiSelectFieldSync as a };
-//# sourceMappingURL=MultiSelectFieldSync-CpfsWecG.js.map
+//# sourceMappingURL=MultiSelectFieldSync-HhFKGtQM.js.map