se-design 1.0.83-dev.4 → 1.0.83-r-dev.1

package/dist/index25.js.map

@@ -1 +1 @@
-{"version":3,"file":"index25.js","sources":["../src/components/Dropdown/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef, useEffect, useLayoutEffect } from 'react';\n\nimport { Popover, PopoverHandle } from 'src/components/Popover';\nimport { Icon } from 'components/Icon';\nimport { Checkbox } from '../Checkbox';\nimport { Button } from '../Button';\nimport { InputWithIcon } from '../InputWithIcon';\nimport { useStableId } from '../../utils/useStableId';\nimport { useCombobox } from '../../utils/a11y/useCombobox';\n\ntype DropdownValue = {\n  [key: string]: any;\n};\n\ntype DropdownProps = {\n  label?: string;\n  firstOptionAsHeading?: boolean;\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  type: 'select' | 'multi-select';\n  dropDownOptions?: DropdownValue[];\n  defaultText?: string;\n  selectBy?: string;\n  optionsUniqueBy?: string;\n  displaySelected?: boolean;\n  defaultSelectedValue?: DropdownValue | DropdownValue[];\n  customSelectedValue?: string;\n  onOptionClick?: (selectedValue: DropdownValue) => void;\n  style?: React.CSSProperties;\n  renderOptionChip?: (option: DropdownValue, srcOption: boolean) => React.ReactNode;\n  className?: string;\n  iconColor?: string;\n  disabled?: boolean;\n  dropdownClassName?: string;\n  hasError?: boolean;\n  errorMessage?: string;\n  onApply?: (selectedValue: DropdownValue[]) => void;\n  onClear?: () => void;\n  customDropdownContent?: () => React.ReactNode;\n  isBorderless?: boolean;\n  dropDownSrcAutomationId?: string;\n  dropDownSelectAutomationId?: string;\n  dropDownContentAutomationId?: string;\n  shouldShowSearch?: boolean;\n  showSearchIcon?: boolean;\n  searchPlaceholder?: string;\n  searchResultEmptyMessage?: string;\n  /** Controlled selection — when provided, Dropdown won't manage internal selected state */\n  selectedValue?: DropdownValue | DropdownValue[];\n  /** Controlled open state — when provided, Dropdown won't manage internal open/close */\n  isOpen?: boolean;\n  /** Callback when open state changes (fires in both controlled and uncontrolled modes) */\n  onOpenChange?: (isOpen: boolean) => void;\n  /** Custom trigger element — replaces the default bordered div + chevron */\n  renderSrcElement?: (props: { isOpen: boolean; selectedValue: DropdownValue[] }) => React.ReactNode;\n  /** Render the dropdown panel in a portal (document.body) to escape overflow:hidden containers */\n  isWithPortal?: boolean;\n  /** Optional ref that will be populated with the Popover wrapper element on mount.\n   *  Use with setFocusAnchor() to return focus to the dropdown trigger after a modal closes. */\n  popoverElementRef?: React.RefObject<HTMLElement | null>;\n  /** Inline styles forwarded to the Popover content (portal or inline). Useful for min-width overrides. */\n  popoverContentStyleProperty?: React.CSSProperties;\n};\n\nexport const Dropdown: FC<DropdownProps> = (props) => {\n  const isControlledSelection = props.selectedValue !== undefined;\n  const isControlledOpen = props.isOpen !== undefined;\n\n  const [internalIsOpen, setInternalIsOpen] = useState(false);\n  const [searchQuery, setSearchQuery] = useState('');\n  const [internalSelectedValues, setInternalSelectedValues] = useState<DropdownValue[]>(() =>\n    props?.defaultSelectedValue\n      ? Array.isArray(props?.defaultSelectedValue)\n        ? props?.defaultSelectedValue\n        : [props.defaultSelectedValue]\n      : []\n  );\n  const popoverRef = useRef<HTMLDivElement & PopoverHandle>(null);\n  const searchInputRef = useRef<HTMLInputElement>(null);\n  const labelId = useStableId(undefined, 'dropdown-label');\n  const valueId = useStableId(undefined, 'dropdown-value');\n  const listboxId = useStableId(undefined, 'dropdown-listbox');\n\n  // Derived state: controlled props take precedence over internal state\n  const isDropDownOpen = isControlledOpen ? props.isOpen! : internalIsOpen;\n  const selectedDropDownValues = isControlledSelection\n    ? (Array.isArray(props.selectedValue) ? props.selectedValue : props.selectedValue ? [props.selectedValue] : [])\n    : internalSelectedValues;\n\n  const setIsDropDownOpen = (value: boolean) => {\n    if (!isControlledOpen) {\n      setInternalIsOpen(value);\n    }\n    props.onOpenChange?.(value);\n  };\n\n  const setSelectedDropDownValues = (values: DropdownValue[]) => {\n    if (!isControlledSelection) {\n      setInternalSelectedValues(values);\n    }\n  };\n\n  const {\n    selectBy = '',\n    optionsUniqueBy = '',\n    displaySelected = false,\n    dropDownOptions,\n    defaultText = 'Select',\n    iconColor = 'var(--color-gray-700)',\n    disabled = false,\n    dropdownClassName = '',\n    hasError = false,\n    errorMessage = '',\n    customDropdownContent = null,\n    isBorderless = false,\n    shouldShowSearch = false,\n    showSearchIcon = true,\n    searchPlaceholder = 'Search...',\n    searchResultEmptyMessage = 'No results found',\n    ariaLabel = '',\n    customSelectedValue = '',\n    isWithPortal = false,\n    firstOptionAsHeading = false\n  } = props;\n\n  useEffect(() => {\n    if (!isControlledSelection) {\n      const newValues = props?.defaultSelectedValue\n        ? Array.isArray(props?.defaultSelectedValue)\n          ? props?.defaultSelectedValue\n          : [props.defaultSelectedValue]\n        : [];\n      setInternalSelectedValues(newValues);\n    }\n  }, [props?.defaultSelectedValue, isControlledSelection]);\n\n  useEffect(() => {\n    if (!isDropDownOpen) {\n      setSearchQuery('');\n    }\n  }, [isDropDownOpen]);\n\n  // Focus search input when dropdown opens with search enabled\n  useEffect(() => {\n    if (isDropDownOpen && shouldShowSearch && searchInputRef.current) {\n      requestAnimationFrame(() => searchInputRef.current?.focus());\n    }\n  }, [isDropDownOpen, shouldShowSearch]);\n\n  // Populate caller's popoverElementRef with the Popover wrapper element.\n  // Runs after mount so popoverRef.current is set.\n  useLayoutEffect(() => {\n    if (props.popoverElementRef) {\n      props.popoverElementRef.current = popoverRef.current?.element ?? null;\n    }\n  });\n\n  const isMultiSelect = props?.type === 'multi-select';\n\n  const getFilteredOptions = () => {\n    if (!searchQuery.trim()) {\n      return dropDownOptions || [];\n    }\n    return (dropDownOptions || []).filter((option) => {\n      const optionValue = option?.[selectBy]?.toString().toLowerCase() || '';\n      return optionValue.includes(searchQuery.toLowerCase());\n    });\n  };\n\n  const handleDropDownOptionClick = (dropDownOption: any) => {\n    setSelectedDropDownValues([dropDownOption]);\n    setIsDropDownOpen(false);\n    props?.onOptionClick?.(dropDownOption);\n    // Restore focus to the trigger after portal unmounts.\n    // Double rAF ensures this runs after React re-renders AND the focus trap safety net,\n    // getting the final say on focus.\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        popoverRef.current?.focusTrigger();\n      });\n    });\n  };\n\n  // Use useCombobox hook for keyboard navigation (only for single-select)\n  const filteredOptions = getFilteredOptions();\n  const {\n    listboxProps,\n    getOptionProps,\n    highlightedIndex,\n    setHighlightedIndex,\n    containerProps: comboboxContainerProps,\n    inputProps: comboboxInputProps,\n    isKeyboardFocused: isSingleSelectKeyboardFocused\n  } = useCombobox({\n    items: isMultiSelect ? [] : filteredOptions, // Only use for single-select\n    isOpen: isDropDownOpen && !isMultiSelect,\n    onOpenChange: setIsDropDownOpen,\n    onSelect: (item: DropdownValue) => {\n      handleDropDownOptionClick(item);\n    },\n    listboxId,\n    disabled: isMultiSelect || disabled,\n    hasItems: filteredOptions.length > 0\n  });\n\n  // Second useCombobox for multi-select: provides ARIA props, keyboard navigation, and auto-scroll.\n  // Enter/Space are intercepted in multiSelectOnKeyDown to avoid the hook's highlight reset after select.\n  const {\n    inputProps: multiSelectComboboxInputProps,\n    listboxProps: multiSelectListboxProps,\n    containerProps: multiSelectContainerProps,\n    highlightedIndex: highlightedMultiSelectIndex,\n    setHighlightedIndex: setHighlightedMultiSelectIndex,\n    isKeyboardFocused: isMultiSelectKeyboardFocused\n  } = useCombobox({\n    items: isMultiSelect ? filteredOptions : [],\n    isOpen: isDropDownOpen && isMultiSelect,\n    onOpenChange: setIsDropDownOpen,\n    onSelect: () => {},\n    listboxId,\n    disabled: !isMultiSelect,\n    loop: false,\n    hasItems: filteredOptions.length > 0,\n    closeOnTab: false\n  });\n\n  const getSelectedDropDownValue = (option: DropdownValue, isSrcOption: boolean = false) => {\n    if (isMultiSelect) {\n      return defaultText;\n    }\n\n    // if custom selected value is provided, use it instead of the option value\n    if (isSrcOption && customSelectedValue) {\n      return customSelectedValue;\n    }\n\n    return option?.[selectBy] || defaultText;\n  };\n\n  const clearSelectedDropDownValues = () => {\n    setSelectedDropDownValues([]);\n    props?.onClear?.();\n  };\n\n  const optionChip = (option: DropdownValue, srcOption: boolean = false) => {\n    if (props?.renderOptionChip) {\n      return props?.renderOptionChip(option, srcOption);\n    }\n\n    if (isMultiSelect && selectedDropDownValues?.length > 0) {\n      const firstSelectedLabel = selectedDropDownValues[0]?.[selectBy] || '';\n      const remainingCount = selectedDropDownValues.length - 1;\n\n      // For multiple selections: text takes remaining space, count takes minimum space needed\n      return (\n        <div className={`option-chip flex items-center w-full`}>\n          <div\n            className={`${remainingCount > 0 ? 'w-full' : 'flex-1'} truncate`}\n          >{`${defaultText}: ${firstSelectedLabel}`}</div>\n          {remainingCount > 0 && <div className=\"flex-shrink-0\">+{remainingCount}</div>}\n        </div>\n      );\n    }\n\n    const selectedLabel = getSelectedDropDownValue(option, srcOption);\n    const hasVisibleLabel = !!props?.label || !!props?.ariaLabelledBy;\n    const showPrefix = srcOption && defaultText && option?.[selectBy] && !customSelectedValue && !hasVisibleLabel;\n\n    return (\n      <p className={`option-chip flex flex-1 items-center justify-between`}>\n        {showPrefix ? `${defaultText}: ${selectedLabel}` : selectedLabel}\n      </p>\n    );\n  };\n\n  const renderSearchInput = (extraInputProps: Record<string, any>) => (\n    <div className=\" w-full relative flex items-center border-b border-[var(--color-gray-300)]\">\n      <InputWithIcon\n        leftIcon={showSearchIcon ? { name: 'search', position: 'left', style: { color: 'var(--color-gray-500)' } } : undefined}\n        value={searchQuery}\n        onChange={(value) => setSearchQuery(value)}\n        placeholder={searchPlaceholder}\n        style={{ margin: 0, gap: 0 }}\n        inputStyle={{ width: '100%', border: 'none', outline: 'none' }}\n        automationId=\"se-design-dropdown-search\"\n        ariaLabel={searchPlaceholder}\n        inputRef={searchInputRef}\n        inputProps={extraInputProps}\n      />\n    </div>\n  );\n\n  const renderSearchBar = () => {\n    if (isMultiSelect) {\n      return renderSearchInput({\n        ...multiSelectComboboxInputProps,\n        onKeyDown: (e: React.KeyboardEvent) => multiSelectOnKeyDown(e, true)\n      });\n    }\n\n    // Single-select: wrap onKeyDown to add Escape → focusTrigger (portal-safe)\n    return renderSearchInput({\n      ...comboboxInputProps,\n      onKeyDown: (e: React.KeyboardEvent) => {\n        comboboxInputProps.onKeyDown(e);\n        if (e.key === 'Escape') {\n          requestAnimationFrame(() => popoverRef.current?.focusTrigger());\n        }\n      }\n    });\n  };\n\n  const dropDownOptionJsx = (dropDownOption: DropdownValue, index: number) => {\n    const optionTxt = dropDownOption[selectBy];\n    const dropDownSelectedValue = selectedDropDownValues[0]?.[selectBy] || defaultText;\n    const selectByUniqueId = optionsUniqueBy?.length\n      ? dropDownOption[optionsUniqueBy] == selectedDropDownValues[0]?.[optionsUniqueBy]\n      : true;\n    const isOptionSelected = displaySelected && optionTxt === dropDownSelectedValue && selectByUniqueId;\n    const isHighlighted = highlightedIndex === index;\n    const optionProps = !isMultiSelect ? getOptionProps(index, isOptionSelected) : {};\n\n    return (\n      <div\n        key={dropDownOption.id || dropDownOption.value}\n        className={`option break-words px-3 py-2 hover:bg-[var(--color-gray-100)] focus:bg-[var(--color-gray-100)] focus-outline cursor-pointer select-none flex items-center justify-between ${\n          isOptionSelected ? 'selected' : ''\n        } ${isHighlighted ? `bg-[var(--color-gray-100)]${isSingleSelectKeyboardFocused ? ' outline outline-[length:var(--focus-width)] -outline-offset-2 outline-[var(--focus-color)]' : ''}` : ''}`}\n        onClick={() => handleDropDownOptionClick(dropDownOption)}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter' || e.key === ' ') {\n            e.preventDefault();\n            handleDropDownOptionClick(dropDownOption);\n          } else if (e.key === 'Escape') {\n            // Return focus to the Popover trigger on Escape, consistent with the search input path.\n            // handlePopoverContentKeyDown in Popover also handles this but is unreliable for the\n            // portal case because srcElementRef is not in the portal's DOM ancestry.\n            requestAnimationFrame(() => popoverRef.current?.focusTrigger());\n          }\n        }}\n        tabIndex={-1}\n        data-automation-id={`dropdown-option-${dropDownOption?.automationId || index}`}\n        {...optionProps}\n        aria-selected={isOptionSelected ? 'true' : 'false'}\n      >\n        {optionChip({ ...dropDownOption, isOptionSelected }, false)}\n        {isOptionSelected && <Icon name=\"checkmark\" stroke={iconColor} />}\n      </div>\n    );\n  };\n\n  const renderDropdownContents = () => {\n    return (\n      <>\n        {props?.label && firstOptionAsHeading && (\n          <div\n            aria-hidden=\"true\"\n            className=\"px-3 pt-2 pb-1 text-[var(--color-gray-650)] text-xs cursor-default select-none\"\n          >\n            {props.label}\n          </div>\n        )}\n        {shouldShowSearch && renderSearchBar()}\n        <div\n          className=\"dropdown-content dropdown-options\"\n          aria-label={`${defaultText} options`}\n          {...listboxProps}\n        >\n        <div className=\"flex flex-col max-h-80 overflow-y-auto\">\n          {filteredOptions.length > 0 ? (\n            filteredOptions.map((dropDownOption, index) => dropDownOptionJsx(dropDownOption, index))\n          ) : (\n            <div\n              className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\"\n              role=\"status\"\n              aria-live=\"polite\"\n            >\n              {searchResultEmptyMessage}\n            </div>\n          )}\n        </div>\n      </div>\n      </>\n    );\n  };\n\n  const handleMultiSelectDropdownOptionClick = (isSelected: boolean, dropDownOption: DropdownValue) => {\n    let newSelectedDropDownValues: DropdownValue[] = [];\n    if (isSelected) {\n      newSelectedDropDownValues = [...selectedDropDownValues, dropDownOption];\n    } else {\n      newSelectedDropDownValues = selectedDropDownValues?.filter(\n        (option) => option[optionsUniqueBy] !== dropDownOption[optionsUniqueBy]\n      );\n    }\n    setSelectedDropDownValues(newSelectedDropDownValues);\n  };\n\n  const handleApplySelectedDropDownValues = () => {\n    popoverRef.current?.togglePopover();\n    props?.onApply?.(selectedDropDownValues);\n  };\n\n  // Wraps the multi-select useCombobox's onKeyDown.\n  // - Intercepts Enter/Space to toggle selection without resetting the highlight\n  //   (the hook resets highlightedIndex to -1 after onSelect, which is wrong for multi-select).\n  // - When isSearchInput is true, Space is left for typing.\n  // - Adds focusTrigger on Escape (Popover's handler is unreliable for portals).\n  const multiSelectOnKeyDown = (e: React.KeyboardEvent, isSearchInput: boolean = false) => {\n    if (isSearchInput && e.key === ' ') return;\n\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      if (highlightedMultiSelectIndex >= 0 && highlightedMultiSelectIndex < filteredOptions.length) {\n        const option = filteredOptions[highlightedMultiSelectIndex];\n        const isSelected = selectedDropDownValues.some(\n          (v) => v[optionsUniqueBy] === option[optionsUniqueBy]\n        );\n        handleMultiSelectDropdownOptionClick(!isSelected, option);\n      }\n      return;\n    }\n\n    multiSelectComboboxInputProps.onKeyDown(e);\n\n    if (e.key === 'Escape') {\n      e.stopPropagation();\n      requestAnimationFrame(() => popoverRef.current?.focusTrigger());\n    }\n  };\n\n  const multiSelectDropdownOptionJSX = (dropDownOption: DropdownValue, index: number) => {\n    const isOptionSelected = selectedDropDownValues.some(\n      (option) => option[optionsUniqueBy] === dropDownOption[optionsUniqueBy]\n    );\n    const optionId = `${listboxId}-option-${index}`;\n    const isHighlighted = highlightedMultiSelectIndex === index;\n\n    return (\n      <div\n        key={dropDownOption.id || dropDownOption.value}\n        id={optionId}\n        role=\"option\"\n        aria-selected={isOptionSelected}\n        className={`option px-3 py-2 hover:bg-[var(--color-gray-100)] focus:bg-[var(--color-gray-100)] cursor-pointer select-none flex items-center gap-2 ${\n          isHighlighted ? `bg-[var(--color-gray-100)]${isMultiSelectKeyboardFocused ? ' outline outline-[length:var(--focus-width)] -outline-offset-2 outline-[var(--focus-color)]' : ''}` : ''\n        }`}\n        onClick={() => handleMultiSelectDropdownOptionClick(!isOptionSelected, dropDownOption)}\n        data-automation-id={`dropdown-option-${dropDownOption?.automationId || index}`}\n      >\n        <Checkbox\n          tabIndex={-1}\n          ariaHidden\n          checked={isOptionSelected}\n          onChange={() => {}}\n          className=\"pointer-events-none\"\n        />\n        <span className=\"checkbox-label\">{dropDownOption?.label}</span>\n      </div>\n    );\n  };\n\n  const renderMultiSelectDropdownContents = () => {\n    return (\n      <div\n        className=\"dropdown-content dropdown-options\"\n        onKeyDown={(e) => {\n          // Stop all Tab events from reaching Popover's handlePopoverContentKeyDown (which closes on Tab).\n          // Forward Tab: search → Clear → Apply → focus exits → useDismissOnFocusOut closes.\n          // Shift+Tab: Apply → Clear → search → trigger.\n          if (e.key === 'Tab') {\n            e.stopPropagation();\n          }\n        }}\n      >\n        {shouldShowSearch && renderSearchBar()}\n        <div\n          {...multiSelectListboxProps}\n          aria-label={`${defaultText} options`}\n          aria-multiselectable=\"true\"\n          style={{ outline: 'none' }}\n          {...(!shouldShowSearch ? {\n            tabIndex: -1,\n            'aria-activedescendant': multiSelectComboboxInputProps['aria-activedescendant'],\n            onKeyDown: (e: React.KeyboardEvent) => multiSelectOnKeyDown(e, false),\n            onFocus: () => {\n              if (highlightedMultiSelectIndex === -1 && filteredOptions.length > 0) {\n                setHighlightedMultiSelectIndex(0);\n              }\n            }\n          } : {})}\n        >\n          <div className=\"flex flex-col max-h-80 overflow-y-auto\">\n            {filteredOptions.length > 0 ? (\n              filteredOptions.map((dropDownOption, index) => multiSelectDropdownOptionJSX(dropDownOption, index))\n            ) : (\n              <div\n                className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\"\n                role=\"status\"\n                aria-live=\"polite\"\n              >\n                {searchResultEmptyMessage}\n              </div>\n            )}\n          </div>\n        </div>\n        <div\n          className=\"flex items-center justify-end gap-4 p-3 border-t border-[var(--color-gray-200)]\"\n          onKeyDown={(e) => {\n            if (e.key === 'Tab' && e.shiftKey) {\n              e.preventDefault();\n              e.stopPropagation();\n              if (shouldShowSearch) {\n                searchInputRef.current?.focus();\n              } else {\n                multiSelectListboxProps.ref.current?.focus();\n              }\n            }\n          }}\n        >\n          <Button label=\"Clear\" type=\"link\" size=\"sm\" onClick={clearSelectedDropDownValues} automationId=\"se-design-dropdown-clear-button\" />\n          <Button label=\"Apply\" type=\"primary\" size=\"sm\" onClick={handleApplySelectedDropDownValues} automationId=\"se-design-dropdown-apply-button\" />\n        </div>\n      </div>\n    );\n  };\n\n  const renderDropdownSelect = () => {\n    const borderColor = isDropDownOpen\n      ? 'border-[var(--color-blue-500)]'\n      : disabled\n      ? 'border-[var(--color-gray-300)]'\n      : 'border-[var(--color-gray-600)]';\n    const errorBorderColor = hasError ? 'border-[var(--color-red-500)]' : '';\n    const dropDownSelectClass = `dropdown-src-element bg-[var(--color-white)] flex px-3 py-2 ${\n      isBorderless ? 'border-0' : `border rounded-md ${errorBorderColor ? errorBorderColor : borderColor}`\n    } flex items-center ${dropdownClassName}`;\n\n    return (\n      <div className={dropDownSelectClass}>\n        <div\n          id={valueId}\n          className=\"flex-1 min-w-0\"\n          data-automation-id={props?.dropDownSelectAutomationId || 'selected-dropdown-value'}\n        >\n          {optionChip(selectedDropDownValues[0], true)}\n        </div>\n        <div className=\"flex-shrink-0 ml-2\" aria-hidden=\"true\">\n          <Icon\n            name={'chevron'}\n            rotation={isDropDownOpen ? '180' : '0'}\n            className={`transition-transform`}\n            stroke={iconColor}\n          />\n        </div>\n      </div>\n    );\n  };\n\n  const getDropdownAriaLabel = () => {\n    const selectedLabel = selectedDropDownValues[0]?.[selectBy];\n    if (ariaLabel && selectedLabel) {\n      return `${ariaLabel}, ${selectedLabel}`;\n    }\n    return ariaLabel || defaultText || 'Select option';\n  };\n\n  // Trigger is always a button that reveals a listbox popup (Select/Listbox pattern).\n  // For search-enabled dropdowns, the combobox role lives on the search input inside the popup.\n  // This matches React Aria (useSelect), Radix (Select), and Headless UI (Listbox) — all use\n  // role=\"button\" with real focus on options, separate from their Combobox components.\n  const triggerSourceRole = 'button';\n\n  // Trigger is always role=\"button\" — combobox ARIA (aria-activedescendant etc.)\n  // lives on the search input inside the popup, not on the trigger.\n  // Trigger only needs aria-haspopup + aria-expanded (Popover handles) + aria-controls.\n\n  return (\n    <div\n      className={`se-design-dropdown-container${props?.className ? ` ${props?.className}` : ''}`}\n      style={props?.style}\n    >\n      {props?.label ? (\n        <div id={labelId} className={`se-design-dropdown-label ${firstOptionAsHeading ? 'sr-only' : 'mb-[3px] text-[var(--color-gray-700)] text-sm'}`}>\n          {props?.label}\n        </div>\n      ) : !props?.ariaLabelledBy && ariaLabel ? (\n        <span id={labelId} className=\"sr-only\">{ariaLabel}</span>\n      ) : null}\n      <div\n        style={props?.style}\n        className={`${disabled ? 'bg-[var(--color-gray-50)] rounded-md cursor-not-allowed' : ''}`}\n        {...(!isMultiSelect ? {\n          ...comboboxContainerProps,\n          // Portal content lives in document.body — focus moving into it looks like \"focus out\" to\n          // the container's blur handler, causing immediate close. Suppress it; the Popover's own\n          // onBlur handler checks both source and portal content and handles dismissal correctly.\n          ...(isWithPortal ? { onBlurCapture: undefined } : {})\n        } : {\n          // Multi-select: only spread focus-tracking handlers for isKeyboardFocused.\n          // Dismiss is handled by Popover — don't spread onBlurCapture.\n          onPointerMove: multiSelectContainerProps.onPointerMove,\n          onPointerDown: multiSelectContainerProps.onPointerDown,\n          onPointerUp: multiSelectContainerProps.onPointerUp,\n          onFocusCapture: multiSelectContainerProps.onFocusCapture,\n          onKeyDownCapture: multiSelectContainerProps.onKeyDownCapture\n        })}\n      >\n        <Popover\n          ref={popoverRef}\n          isPopoverOpen={isDropDownOpen}\n          isWithPortal={isWithPortal}\n          renderPopoverContents={\n            customDropdownContent\n              ? customDropdownContent\n              : isMultiSelect\n              ? renderMultiSelectDropdownContents\n              : renderDropdownContents\n          }\n          contentWidth={'full'}\n          popoverContentStyleProperty={props.popoverContentStyleProperty}\n          renderPopoverSrcElement={\n            props.renderSrcElement\n              ? () => props.renderSrcElement!({ isOpen: isDropDownOpen, selectedValue: selectedDropDownValues })\n              : renderDropdownSelect\n          }\n          onPopoverToggle={(value) => {\n            setIsDropDownOpen(value);\n            if (value && !isMultiSelect && selectedDropDownValues.length > 0) {\n              // Highlight the currently selected option when the dropdown opens (APG Select pattern)\n              const selectedIndex = filteredOptions.findIndex(\n                (option) => optionsUniqueBy\n                  ? option[optionsUniqueBy] === selectedDropDownValues[0]?.[optionsUniqueBy]\n                  : option[selectBy] === selectedDropDownValues[0]?.[selectBy]\n              );\n              if (selectedIndex >= 0) {\n                setHighlightedIndex(selectedIndex);\n              }\n            }\n            if (value && isMultiSelect && !shouldShowSearch) {\n              // Focus listbox after Popover's own focus-first-on-open (setTimeout 0ms) has fired.\n              // Using nested requestAnimationFrame ensures we run after both the Popover timeout\n              // and any pending paint, so the listbox DOM is ready and we get the last word on focus.\n              requestAnimationFrame(() => requestAnimationFrame(() => multiSelectListboxProps.ref.current?.focus()));\n            }\n            // When search is enabled, Popover's focus-first-on-open naturally finds the search input.\n          }}\n          disabled={disabled}\n          automationId={props?.dropDownSrcAutomationId}\n          popoverContentAutomationId={props?.dropDownContentAutomationId}\n          ariaLabelledBy={\n            props?.label || props?.ariaLabelledBy || ariaLabel\n              ? [props?.label || (!props?.ariaLabelledBy && ariaLabel) ? labelId : props?.ariaLabelledBy, valueId].filter(Boolean).join(' ')\n              : undefined\n          }\n          ariaLabel={!props?.label && !ariaLabel && !props?.ariaLabelledBy ? getDropdownAriaLabel() : undefined}\n          sourceRole={triggerSourceRole}\n          {...{ 'aria-haspopup': 'listbox' }}\n          {...(isDropDownOpen ? { 'aria-controls': listboxId } : {})}\n        />\n      </div>\n      {hasError && <div className=\"text-[var(--color-red-500)] text-sm\">{errorMessage}</div>}\n    </div>\n  );\n};\n"],"names":["Dropdown","props","isControlledSelection","selectedValue","undefined","isControlledOpen","isOpen","internalIsOpen","setInternalIsOpen","useState","searchQuery","setSearchQuery","internalSelectedValues","setInternalSelectedValues","defaultSelectedValue","Array","isArray","popoverRef","useRef","searchInputRef","labelId","useStableId","valueId","listboxId","isDropDownOpen","selectedDropDownValues","setIsDropDownOpen","value","onOpenChange","setSelectedDropDownValues","values","selectBy","optionsUniqueBy","displaySelected","dropDownOptions","defaultText","iconColor","disabled","dropdownClassName","hasError","errorMessage","customDropdownContent","isBorderless","shouldShowSearch","showSearchIcon","searchPlaceholder","searchResultEmptyMessage","ariaLabel","customSelectedValue","isWithPortal","firstOptionAsHeading","useEffect","newValues","current","requestAnimationFrame","focus","useLayoutEffect","popoverElementRef","element","isMultiSelect","type","getFilteredOptions","trim","filter","option","toString","toLowerCase","includes","handleDropDownOptionClick","dropDownOption","onOptionClick","focusTrigger","filteredOptions","listboxProps","getOptionProps","highlightedIndex","setHighlightedIndex","containerProps","comboboxContainerProps","inputProps","comboboxInputProps","isKeyboardFocused","isSingleSelectKeyboardFocused","useCombobox","items","onSelect","item","hasItems","length","multiSelectComboboxInputProps","multiSelectListboxProps","multiSelectContainerProps","highlightedMultiSelectIndex","setHighlightedMultiSelectIndex","isMultiSelectKeyboardFocused","loop","closeOnTab","getSelectedDropDownValue","isSrcOption","clearSelectedDropDownValues","onClear","optionChip","srcOption","renderOptionChip","firstSelectedLabel","remainingCount","React","createElement","className","selectedLabel","hasVisibleLabel","label","ariaLabelledBy","showPrefix","renderSearchInput","extraInputProps","InputWithIcon","leftIcon","name","position","style","color","onChange","placeholder","margin","gap","inputStyle","width","border","outline","automationId","inputRef","renderSearchBar","onKeyDown","e","multiSelectOnKeyDown","key","dropDownOptionJsx","index","optionTxt","dropDownSelectedValue","selectByUniqueId","isOptionSelected","isHighlighted","optionProps","_extends","id","onClick","preventDefault","tabIndex","Icon","stroke","renderDropdownContents","Fragment","map","role","handleMultiSelectDropdownOptionClick","isSelected","newSelectedDropDownValues","handleApplySelectedDropDownValues","togglePopover","onApply","isSearchInput","some","v","stopPropagation","multiSelectDropdownOptionJSX","optionId","Checkbox","ariaHidden","checked","renderMultiSelectDropdownContents","onFocus","shiftKey","ref","Button","size","renderDropdownSelect","borderColor","errorBorderColor","dropDownSelectClass","dropDownSelectAutomationId","rotation","getDropdownAriaLabel","onPointerMove","onPointerDown","onPointerUp","onFocusCapture","onKeyDownCapture","onBlurCapture","Popover","isPopoverOpen","renderPopoverContents","contentWidth","popoverContentStyleProperty","renderPopoverSrcElement","renderSrcElement","onPopoverToggle","selectedIndex","findIndex","dropDownSrcAutomationId","popoverContentAutomationId","dropDownContentAutomationId","Boolean","join","sourceRole"],"mappings":"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"}
+{"version":3,"file":"index25.js","sources":["../src/components/Dropdown/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef, useEffect, useLayoutEffect } from 'react';\n\nimport { Popover, PopoverHandle } from 'src/components/Popover';\nimport { Icon } from 'components/Icon';\nimport { Checkbox } from '../Checkbox';\nimport { Button } from '../Button';\nimport { InputWithIcon } from '../InputWithIcon';\nimport { useStableId } from '../../utils/useStableId';\nimport { useCombobox } from '../../utils/a11y/useCombobox';\n\ntype DropdownValue = {\n  [key: string]: any;\n};\n\ntype DropdownProps = {\n  label?: string;\n  firstOptionAsHeading?: boolean;\n  ariaLabel?: string;\n  ariaLabelledBy?: string;\n  type: 'select' | 'multi-select';\n  dropDownOptions?: DropdownValue[];\n  defaultText?: string;\n  selectBy?: string;\n  optionsUniqueBy?: string;\n  displaySelected?: boolean;\n  defaultSelectedValue?: DropdownValue | DropdownValue[];\n  customSelectedValue?: string;\n  onOptionClick?: (selectedValue: DropdownValue) => void;\n  style?: React.CSSProperties;\n  renderOptionChip?: (option: DropdownValue, srcOption: boolean) => React.ReactNode;\n  className?: string;\n  iconColor?: string;\n  disabled?: boolean;\n  dropdownClassName?: string;\n  hasError?: boolean;\n  errorMessage?: string;\n  onApply?: (selectedValue: DropdownValue[]) => void;\n  onClear?: () => void;\n  customDropdownContent?: () => React.ReactNode;\n  isBorderless?: boolean;\n  dropDownSrcAutomationId?: string;\n  dropDownSelectAutomationId?: string;\n  dropDownContentAutomationId?: string;\n  shouldShowSearch?: boolean;\n  showSearchIcon?: boolean;\n  searchPlaceholder?: string;\n  searchResultEmptyMessage?: string;\n  /** Controlled selection — when provided, Dropdown won't manage internal selected state */\n  selectedValue?: DropdownValue | DropdownValue[];\n  /** Controlled open state — when provided, Dropdown won't manage internal open/close */\n  isOpen?: boolean;\n  /** Callback when open state changes (fires in both controlled and uncontrolled modes) */\n  onOpenChange?: (isOpen: boolean) => void;\n  /** Custom trigger element — replaces the default bordered div + chevron */\n  renderSrcElement?: (props: { isOpen: boolean; selectedValue: DropdownValue[] }) => React.ReactNode;\n  /** Render the dropdown panel in a portal (document.body) to escape overflow:hidden containers */\n  isWithPortal?: boolean;\n  /** Optional ref that will be populated with the Popover wrapper element on mount.\n   *  Use with setFocusAnchor() to return focus to the dropdown trigger after a modal closes. */\n  popoverElementRef?: React.RefObject<HTMLElement | null>;\n};\n\nexport const Dropdown: FC<DropdownProps> = (props) => {\n  const isControlledSelection = props.selectedValue !== undefined;\n  const isControlledOpen = props.isOpen !== undefined;\n\n  const [internalIsOpen, setInternalIsOpen] = useState(false);\n  const [searchQuery, setSearchQuery] = useState('');\n  const [internalSelectedValues, setInternalSelectedValues] = useState<DropdownValue[]>(() =>\n    props?.defaultSelectedValue\n      ? Array.isArray(props?.defaultSelectedValue)\n        ? props?.defaultSelectedValue\n        : [props.defaultSelectedValue]\n      : []\n  );\n  const popoverRef = useRef<HTMLDivElement & PopoverHandle>(null);\n  const searchInputRef = useRef<HTMLInputElement>(null);\n  const labelId = useStableId(undefined, 'dropdown-label');\n  const valueId = useStableId(undefined, 'dropdown-value');\n  const listboxId = useStableId(undefined, 'dropdown-listbox');\n\n  // Derived state: controlled props take precedence over internal state\n  const isDropDownOpen = isControlledOpen ? props.isOpen! : internalIsOpen;\n  const selectedDropDownValues = isControlledSelection\n    ? (Array.isArray(props.selectedValue) ? props.selectedValue : props.selectedValue ? [props.selectedValue] : [])\n    : internalSelectedValues;\n\n  const setIsDropDownOpen = (value: boolean) => {\n    if (!isControlledOpen) {\n      setInternalIsOpen(value);\n    }\n    props.onOpenChange?.(value);\n  };\n\n  const setSelectedDropDownValues = (values: DropdownValue[]) => {\n    if (!isControlledSelection) {\n      setInternalSelectedValues(values);\n    }\n  };\n\n  const {\n    selectBy = '',\n    optionsUniqueBy = '',\n    displaySelected = false,\n    dropDownOptions,\n    defaultText = 'Select',\n    iconColor = 'var(--color-gray-700)',\n    disabled = false,\n    dropdownClassName = '',\n    hasError = false,\n    errorMessage = '',\n    customDropdownContent = null,\n    isBorderless = false,\n    shouldShowSearch = false,\n    showSearchIcon = true,\n    searchPlaceholder = 'Search...',\n    searchResultEmptyMessage = 'No results found',\n    ariaLabel = '',\n    customSelectedValue = '',\n    isWithPortal = false,\n    firstOptionAsHeading = false\n  } = props;\n\n  useEffect(() => {\n    if (!isControlledSelection) {\n      const newValues = props?.defaultSelectedValue\n        ? Array.isArray(props?.defaultSelectedValue)\n          ? props?.defaultSelectedValue\n          : [props.defaultSelectedValue]\n        : [];\n      setInternalSelectedValues(newValues);\n    }\n  }, [props?.defaultSelectedValue, isControlledSelection]);\n\n  useEffect(() => {\n    if (!isDropDownOpen) {\n      setSearchQuery('');\n    }\n  }, [isDropDownOpen]);\n\n  // Focus search input when dropdown opens with search enabled\n  useEffect(() => {\n    if (isDropDownOpen && shouldShowSearch && searchInputRef.current) {\n      requestAnimationFrame(() => searchInputRef.current?.focus());\n    }\n  }, [isDropDownOpen, shouldShowSearch]);\n\n  // Populate caller's popoverElementRef with the Popover wrapper element.\n  // Runs after mount so popoverRef.current is set.\n  useLayoutEffect(() => {\n    if (props.popoverElementRef) {\n      props.popoverElementRef.current = popoverRef.current?.element ?? null;\n    }\n  });\n\n  const isMultiSelect = props?.type === 'multi-select';\n\n  const getFilteredOptions = () => {\n    if (!searchQuery.trim()) {\n      return dropDownOptions || [];\n    }\n    return (dropDownOptions || []).filter((option) => {\n      const optionValue = option?.[selectBy]?.toString().toLowerCase() || '';\n      return optionValue.includes(searchQuery.toLowerCase());\n    });\n  };\n\n  const handleDropDownOptionClick = (dropDownOption: any) => {\n    setSelectedDropDownValues([dropDownOption]);\n    setIsDropDownOpen(false);\n    props?.onOptionClick?.(dropDownOption);\n    // Restore focus to the trigger after portal unmounts.\n    // Double rAF ensures this runs after React re-renders AND the focus trap safety net,\n    // getting the final say on focus.\n    requestAnimationFrame(() => {\n      requestAnimationFrame(() => {\n        popoverRef.current?.focusTrigger();\n      });\n    });\n  };\n\n  // Use useCombobox hook for keyboard navigation (only for single-select)\n  const filteredOptions = getFilteredOptions();\n  const {\n    listboxProps,\n    getOptionProps,\n    highlightedIndex,\n    setHighlightedIndex,\n    containerProps: comboboxContainerProps,\n    inputProps: comboboxInputProps\n  } = useCombobox({\n    items: isMultiSelect ? [] : filteredOptions, // Only use for single-select\n    isOpen: isDropDownOpen && !isMultiSelect,\n    onOpenChange: setIsDropDownOpen,\n    onSelect: (item: DropdownValue) => {\n      handleDropDownOptionClick(item);\n    },\n    listboxId,\n    disabled: isMultiSelect || disabled,\n    hasItems: filteredOptions.length > 0\n  });\n\n  // Second useCombobox for multi-select: provides ARIA props, keyboard navigation, and auto-scroll.\n  // Enter/Space are intercepted in multiSelectOnKeyDown to avoid the hook's highlight reset after select.\n  const {\n    inputProps: multiSelectComboboxInputProps,\n    listboxProps: multiSelectListboxProps,\n    highlightedIndex: highlightedMultiSelectIndex,\n    setHighlightedIndex: setHighlightedMultiSelectIndex\n  } = useCombobox({\n    items: isMultiSelect ? filteredOptions : [],\n    isOpen: isDropDownOpen && isMultiSelect,\n    onOpenChange: setIsDropDownOpen,\n    onSelect: () => {},\n    listboxId,\n    disabled: !isMultiSelect,\n    loop: false,\n    hasItems: filteredOptions.length > 0\n  });\n\n  const getSelectedDropDownValue = (option: DropdownValue, isSrcOption: boolean = false) => {\n    if (isMultiSelect) {\n      return defaultText;\n    }\n\n    // if custom selected value is provided, use it instead of the option value\n    if (isSrcOption && customSelectedValue) {\n      return customSelectedValue;\n    }\n\n    return option?.[selectBy] || defaultText;\n  };\n\n  const clearSelectedDropDownValues = () => {\n    setSelectedDropDownValues([]);\n    props?.onClear?.();\n  };\n\n  const optionChip = (option: DropdownValue, srcOption: boolean = false) => {\n    if (props?.renderOptionChip) {\n      return props?.renderOptionChip(option, srcOption);\n    }\n\n    if (isMultiSelect && selectedDropDownValues?.length > 0) {\n      const firstSelectedLabel = selectedDropDownValues[0]?.[selectBy] || '';\n      const remainingCount = selectedDropDownValues.length - 1;\n\n      // For multiple selections: text takes remaining space, count takes minimum space needed\n      return (\n        <div className={`option-chip flex items-center w-full`}>\n          <div\n            className={`${remainingCount > 0 ? 'w-full' : 'flex-1'} truncate`}\n          >{`${defaultText}: ${firstSelectedLabel}`}</div>\n          {remainingCount > 0 && <div className=\"flex-shrink-0\">+{remainingCount}</div>}\n        </div>\n      );\n    }\n\n    const selectedLabel = getSelectedDropDownValue(option, srcOption);\n    const hasVisibleLabel = !!props?.label || !!props?.ariaLabelledBy;\n    const showPrefix = srcOption && defaultText && option?.[selectBy] && !customSelectedValue && !hasVisibleLabel;\n\n    return (\n      <p className={`option-chip flex flex-1 items-center justify-between`}>\n        {showPrefix ? `${defaultText}: ${selectedLabel}` : selectedLabel}\n      </p>\n    );\n  };\n\n  const renderSearchInput = (extraInputProps: Record<string, any>) => (\n    <div className=\" w-full relative flex items-center border-b border-[var(--color-gray-300)]\">\n      <InputWithIcon\n        leftIcon={showSearchIcon ? { name: 'search', position: 'left', style: { color: 'var(--color-gray-500)' } } : undefined}\n        value={searchQuery}\n        onChange={(value) => setSearchQuery(value)}\n        placeholder={searchPlaceholder}\n        style={{ margin: 0, gap: 0 }}\n        inputStyle={{ width: '100%', border: 'none', outline: 'none' }}\n        automationId=\"se-design-dropdown-search\"\n        ariaLabel={searchPlaceholder}\n        inputRef={searchInputRef}\n        inputProps={extraInputProps}\n      />\n    </div>\n  );\n\n  const renderSearchBar = () => {\n    if (isMultiSelect) {\n      return renderSearchInput({\n        ...multiSelectComboboxInputProps,\n        onKeyDown: (e: React.KeyboardEvent) => multiSelectOnKeyDown(e, true)\n      });\n    }\n\n    // Single-select: wrap onKeyDown to add Escape → focusTrigger (portal-safe)\n    return renderSearchInput({\n      ...comboboxInputProps,\n      onKeyDown: (e: React.KeyboardEvent) => {\n        comboboxInputProps.onKeyDown(e);\n        if (e.key === 'Escape') {\n          requestAnimationFrame(() => popoverRef.current?.focusTrigger());\n        }\n      }\n    });\n  };\n\n  const dropDownOptionJsx = (dropDownOption: DropdownValue, index: number) => {\n    const optionTxt = dropDownOption[selectBy];\n    const dropDownSelectedValue = selectedDropDownValues[0]?.[selectBy] || defaultText;\n    const selectByUniqueId = optionsUniqueBy?.length\n      ? dropDownOption[optionsUniqueBy] == selectedDropDownValues[0]?.[optionsUniqueBy]\n      : true;\n    const isOptionSelected = displaySelected && optionTxt === dropDownSelectedValue && selectByUniqueId;\n    const isHighlighted = highlightedIndex === index;\n    const optionProps = !isMultiSelect ? getOptionProps(index, isOptionSelected) : {};\n\n    return (\n      <div\n        key={dropDownOption.id || dropDownOption.value}\n        className={`option break-words px-3 py-2 hover:bg-[var(--color-gray-100)] focus:bg-[var(--color-gray-100)] cursor-pointer select-none flex items-center justify-between ${\n          isOptionSelected ? 'selected' : ''\n        } ${isHighlighted ? 'bg-[var(--color-blue-50)]' : ''}`}\n        onClick={() => handleDropDownOptionClick(dropDownOption)}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter' || e.key === ' ') {\n            e.preventDefault();\n            handleDropDownOptionClick(dropDownOption);\n          } else if (e.key === 'Escape') {\n            // Return focus to the Popover trigger on Escape, consistent with the search input path.\n            // handlePopoverContentKeyDown in Popover also handles this but is unreliable for the\n            // portal case because srcElementRef is not in the portal's DOM ancestry.\n            requestAnimationFrame(() => popoverRef.current?.focusTrigger());\n          }\n        }}\n        tabIndex={-1}\n        data-automation-id={`dropdown-option-${dropDownOption?.automationId || index}`}\n        {...optionProps}\n        aria-selected={isOptionSelected ? 'true' : 'false'}\n      >\n        {optionChip({ ...dropDownOption, isOptionSelected }, false)}\n        {isOptionSelected && <Icon name=\"checkmark\" stroke={iconColor} />}\n      </div>\n    );\n  };\n\n  const renderDropdownContents = () => {\n    return (\n      <>\n        {props?.label && firstOptionAsHeading && (\n          <div\n            aria-hidden=\"true\"\n            className=\"px-3 pt-2 pb-1 text-[var(--color-gray-650)] text-xs cursor-default select-none\"\n          >\n            {props.label}\n          </div>\n        )}\n        <div\n          className=\"dropdown-content dropdown-options\"\n          aria-label={`${defaultText} options`}\n          {...listboxProps}\n        >\n        {shouldShowSearch && renderSearchBar()}\n        <div className=\"flex flex-col max-h-80 overflow-y-auto\">\n          {filteredOptions.length > 0 ? (\n            filteredOptions.map((dropDownOption, index) => dropDownOptionJsx(dropDownOption, index))\n          ) : (\n            <div\n              className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\"\n              role=\"status\"\n              aria-live=\"polite\"\n            >\n              {searchResultEmptyMessage}\n            </div>\n          )}\n        </div>\n      </div>\n      </>\n    );\n  };\n\n  const handleMultiSelectDropdownOptionClick = (isSelected: boolean, dropDownOption: DropdownValue) => {\n    let newSelectedDropDownValues: DropdownValue[] = [];\n    if (isSelected) {\n      newSelectedDropDownValues = [...selectedDropDownValues, dropDownOption];\n    } else {\n      newSelectedDropDownValues = selectedDropDownValues?.filter(\n        (option) => option[optionsUniqueBy] !== dropDownOption[optionsUniqueBy]\n      );\n    }\n    setSelectedDropDownValues(newSelectedDropDownValues);\n  };\n\n  const handleApplySelectedDropDownValues = () => {\n    popoverRef.current?.togglePopover();\n    props?.onApply?.(selectedDropDownValues);\n  };\n\n  // Wraps the multi-select useCombobox's onKeyDown.\n  // - Intercepts Enter/Space to toggle selection without resetting the highlight\n  //   (the hook resets highlightedIndex to -1 after onSelect, which is wrong for multi-select).\n  // - When isSearchInput is true, Space is left for typing.\n  // - Adds focusTrigger on Escape (Popover's handler is unreliable for portals).\n  const multiSelectOnKeyDown = (e: React.KeyboardEvent, isSearchInput: boolean = false) => {\n    if (isSearchInput && e.key === ' ') return;\n\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      if (highlightedMultiSelectIndex >= 0 && highlightedMultiSelectIndex < filteredOptions.length) {\n        const option = filteredOptions[highlightedMultiSelectIndex];\n        const isSelected = selectedDropDownValues.some(\n          (v) => v[optionsUniqueBy] === option[optionsUniqueBy]\n        );\n        handleMultiSelectDropdownOptionClick(!isSelected, option);\n      }\n      return;\n    }\n\n    multiSelectComboboxInputProps.onKeyDown(e);\n\n    if (e.key === 'Escape') {\n      e.stopPropagation();\n      requestAnimationFrame(() => popoverRef.current?.focusTrigger());\n    }\n  };\n\n  const multiSelectDropdownOptionJSX = (dropDownOption: DropdownValue, index: number) => {\n    const isOptionSelected = selectedDropDownValues.some(\n      (option) => option[optionsUniqueBy] === dropDownOption[optionsUniqueBy]\n    );\n    const optionId = `${listboxId}-option-${index}`;\n    const isHighlighted = highlightedMultiSelectIndex === index;\n\n    return (\n      <div\n        key={dropDownOption.id || dropDownOption.value}\n        id={optionId}\n        role=\"option\"\n        aria-selected={isOptionSelected}\n        className={`option px-3 py-2 hover:bg-[var(--color-gray-100)] focus:bg-[var(--color-gray-100)] cursor-pointer select-none flex items-center gap-2 ${\n          isHighlighted ? 'bg-[var(--color-blue-50)]' : ''\n        }`}\n        onClick={() => handleMultiSelectDropdownOptionClick(!isOptionSelected, dropDownOption)}\n        data-automation-id={`dropdown-option-${dropDownOption?.automationId || index}`}\n      >\n        <Checkbox\n          tabIndex={-1}\n          ariaHidden\n          checked={isOptionSelected}\n          onChange={() => {}}\n        />\n        <span className=\"checkbox-label\">{dropDownOption?.label}</span>\n      </div>\n    );\n  };\n\n  const renderMultiSelectDropdownContents = () => {\n    return (\n      <div\n        className=\"dropdown-content dropdown-options\"\n        onKeyDown={(e) => {\n          // Stop all Tab events from reaching Popover's handlePopoverContentKeyDown (which closes on Tab).\n          // Forward Tab: search → Clear → Apply → focus exits → useDismissOnFocusOut closes.\n          // Shift+Tab: Apply → Clear → search → trigger.\n          if (e.key === 'Tab') {\n            e.stopPropagation();\n          }\n        }}\n      >\n        {shouldShowSearch && renderSearchBar()}\n        <div\n          {...multiSelectListboxProps}\n          aria-label={`${defaultText} options`}\n          aria-multiselectable=\"true\"\n          style={{ outline: 'none' }}\n          {...(!shouldShowSearch ? {\n            tabIndex: -1,\n            'aria-activedescendant': multiSelectComboboxInputProps['aria-activedescendant'],\n            onKeyDown: (e: React.KeyboardEvent) => multiSelectOnKeyDown(e, false),\n            onFocus: () => {\n              if (highlightedMultiSelectIndex === -1 && filteredOptions.length > 0) {\n                setHighlightedMultiSelectIndex(0);\n              }\n            }\n          } : {})}\n        >\n          <div className=\"flex flex-col max-h-80 overflow-y-auto\">\n            {filteredOptions.length > 0 ? (\n              filteredOptions.map((dropDownOption, index) => multiSelectDropdownOptionJSX(dropDownOption, index))\n            ) : (\n              <div\n                className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\"\n                role=\"status\"\n                aria-live=\"polite\"\n              >\n                {searchResultEmptyMessage}\n              </div>\n            )}\n          </div>\n        </div>\n        <div\n          className=\"flex items-center justify-end gap-4 p-3 border-t border-[var(--color-gray-200)]\"\n          onKeyDown={(e) => {\n            if (e.key === 'Tab' && e.shiftKey) {\n              e.preventDefault();\n              e.stopPropagation();\n              if (shouldShowSearch) {\n                searchInputRef.current?.focus();\n              } else {\n                multiSelectListboxProps.ref.current?.focus();\n              }\n            }\n          }}\n        >\n          <Button label=\"Clear\" type=\"link\" size=\"sm\" onClick={clearSelectedDropDownValues} automationId=\"se-design-dropdown-clear-button\" />\n          <Button label=\"Apply\" type=\"primary\" size=\"sm\" onClick={handleApplySelectedDropDownValues} automationId=\"se-design-dropdown-apply-button\" />\n        </div>\n      </div>\n    );\n  };\n\n  const renderDropdownSelect = () => {\n    const borderColor = isDropDownOpen\n      ? 'border-[var(--color-blue-500)]'\n      : disabled\n      ? 'border-[var(--color-gray-300)]'\n      : 'border-[var(--color-gray-600)]';\n    const errorBorderColor = hasError ? 'border-[var(--color-red-500)]' : '';\n    const dropDownSelectClass = `dropdown-src-element bg-[var(--color-white)] flex px-3 py-2 ${\n      isBorderless ? 'border-0' : `border rounded-md ${errorBorderColor ? errorBorderColor : borderColor}`\n    } flex items-center ${dropdownClassName}`;\n\n    return (\n      <div className={dropDownSelectClass}>\n        <div\n          id={valueId}\n          className=\"flex-1 min-w-0\"\n          data-automation-id={props?.dropDownSelectAutomationId || 'selected-dropdown-value'}\n        >\n          {optionChip(selectedDropDownValues[0], true)}\n        </div>\n        <div className=\"flex-shrink-0 ml-2\" aria-hidden=\"true\">\n          <Icon\n            name={'chevron'}\n            rotation={isDropDownOpen ? '180' : '0'}\n            className={`transition-transform`}\n            stroke={iconColor}\n          />\n        </div>\n      </div>\n    );\n  };\n\n  const getDropdownAriaLabel = () => {\n    const selectedLabel = selectedDropDownValues[0]?.[selectBy];\n    if (ariaLabel && selectedLabel) {\n      return `${ariaLabel}, ${selectedLabel}`;\n    }\n    return ariaLabel || defaultText || 'Select option';\n  };\n\n  // Trigger is always a button that reveals a listbox popup (Select/Listbox pattern).\n  // For search-enabled dropdowns, the combobox role lives on the search input inside the popup.\n  // This matches React Aria (useSelect), Radix (Select), and Headless UI (Listbox) — all use\n  // role=\"button\" with real focus on options, separate from their Combobox components.\n  const triggerSourceRole = 'button';\n\n  // Trigger is always role=\"button\" — combobox ARIA (aria-activedescendant etc.)\n  // lives on the search input inside the popup, not on the trigger.\n  // Trigger only needs aria-haspopup + aria-expanded (Popover handles) + aria-controls.\n\n  return (\n    <div\n      className={`se-design-dropdown-container${props?.className ? ` ${props?.className}` : ''}`}\n      style={props?.style}\n    >\n      {props?.label ? (\n        <div id={labelId} className={`se-design-dropdown-label ${firstOptionAsHeading ? 'sr-only' : 'mb-[3px] text-[var(--color-gray-700)] text-sm'}`}>\n          {props?.label}\n        </div>\n      ) : !props?.ariaLabelledBy && ariaLabel ? (\n        <span id={labelId} className=\"sr-only\">{ariaLabel}</span>\n      ) : null}\n      <div\n        style={props?.style}\n        className={`${disabled ? 'bg-[var(--color-gray-50)] rounded-md cursor-not-allowed' : ''}`}\n        {...(!isMultiSelect ? {\n          ...comboboxContainerProps,\n          // Portal content lives in document.body — focus moving into it looks like \"focus out\" to\n          // the container's blur handler, causing immediate close. Suppress it; the Popover's own\n          // onBlur handler checks both source and portal content and handles dismissal correctly.\n          ...(isWithPortal ? { onBlurCapture: undefined } : {})\n        } : {})}\n      >\n        <Popover\n          ref={popoverRef}\n          isPopoverOpen={isDropDownOpen}\n          isWithPortal={isWithPortal}\n          renderPopoverContents={\n            customDropdownContent\n              ? customDropdownContent\n              : isMultiSelect\n              ? renderMultiSelectDropdownContents\n              : renderDropdownContents\n          }\n          contentWidth={'full'}\n          renderPopoverSrcElement={\n            props.renderSrcElement\n              ? () => props.renderSrcElement!({ isOpen: isDropDownOpen, selectedValue: selectedDropDownValues })\n              : renderDropdownSelect\n          }\n          onPopoverToggle={(value) => {\n            setIsDropDownOpen(value);\n            if (value && !isMultiSelect && selectedDropDownValues.length > 0) {\n              // Highlight the currently selected option when the dropdown opens (APG Select pattern)\n              const selectedIndex = filteredOptions.findIndex(\n                (option) => optionsUniqueBy\n                  ? option[optionsUniqueBy] === selectedDropDownValues[0]?.[optionsUniqueBy]\n                  : option[selectBy] === selectedDropDownValues[0]?.[selectBy]\n              );\n              if (selectedIndex >= 0) {\n                setHighlightedIndex(selectedIndex);\n              }\n            }\n            if (value && isMultiSelect && !shouldShowSearch) {\n              // Focus listbox after Popover's own focus-first-on-open (setTimeout 0ms) has fired.\n              // Using nested requestAnimationFrame ensures we run after both the Popover timeout\n              // and any pending paint, so the listbox DOM is ready and we get the last word on focus.\n              requestAnimationFrame(() => requestAnimationFrame(() => multiSelectListboxProps.ref.current?.focus()));\n            }\n            // When search is enabled, Popover's focus-first-on-open naturally finds the search input.\n          }}\n          disabled={disabled}\n          automationId={props?.dropDownSrcAutomationId}\n          popoverContentAutomationId={props?.dropDownContentAutomationId}\n          ariaLabelledBy={\n            props?.label || props?.ariaLabelledBy || ariaLabel\n              ? [props?.label || (!props?.ariaLabelledBy && ariaLabel) ? labelId : props?.ariaLabelledBy, valueId].filter(Boolean).join(' ')\n              : undefined\n          }\n          ariaLabel={!props?.label && !ariaLabel && !props?.ariaLabelledBy ? getDropdownAriaLabel() : undefined}\n          sourceRole={triggerSourceRole}\n          {...{ 'aria-haspopup': 'listbox' }}\n          {...(isDropDownOpen ? { 'aria-controls': listboxId } : {})}\n        />\n      </div>\n      {hasError && <div className=\"text-[var(--color-red-500)] text-sm\">{errorMessage}</div>}\n    </div>\n  );\n};\n"],"names":["Dropdown","props","isControlledSelection","selectedValue","undefined","isControlledOpen","isOpen","internalIsOpen","setInternalIsOpen","useState","searchQuery","setSearchQuery","internalSelectedValues","setInternalSelectedValues","defaultSelectedValue","Array","isArray","popoverRef","useRef","searchInputRef","labelId","useStableId","valueId","listboxId","isDropDownOpen","selectedDropDownValues","setIsDropDownOpen","value","onOpenChange","setSelectedDropDownValues","values","selectBy","optionsUniqueBy","displaySelected","dropDownOptions","defaultText","iconColor","disabled","dropdownClassName","hasError","errorMessage","customDropdownContent","isBorderless","shouldShowSearch","showSearchIcon","searchPlaceholder","searchResultEmptyMessage","ariaLabel","customSelectedValue","isWithPortal","firstOptionAsHeading","useEffect","newValues","current","requestAnimationFrame","focus","useLayoutEffect","popoverElementRef","element","isMultiSelect","type","getFilteredOptions","trim","filter","option","toString","toLowerCase","includes","handleDropDownOptionClick","dropDownOption","onOptionClick","focusTrigger","filteredOptions","listboxProps","getOptionProps","highlightedIndex","setHighlightedIndex","containerProps","comboboxContainerProps","inputProps","comboboxInputProps","useCombobox","items","onSelect","item","hasItems","length","multiSelectComboboxInputProps","multiSelectListboxProps","highlightedMultiSelectIndex","setHighlightedMultiSelectIndex","loop","getSelectedDropDownValue","isSrcOption","clearSelectedDropDownValues","onClear","optionChip","srcOption","renderOptionChip","firstSelectedLabel","remainingCount","React","createElement","className","selectedLabel","hasVisibleLabel","label","ariaLabelledBy","showPrefix","renderSearchInput","extraInputProps","InputWithIcon","leftIcon","name","position","style","color","onChange","placeholder","margin","gap","inputStyle","width","border","outline","automationId","inputRef","renderSearchBar","onKeyDown","e","multiSelectOnKeyDown","key","dropDownOptionJsx","index","optionTxt","dropDownSelectedValue","selectByUniqueId","isOptionSelected","isHighlighted","optionProps","_extends","id","onClick","preventDefault","tabIndex","Icon","stroke","renderDropdownContents","Fragment","map","role","handleMultiSelectDropdownOptionClick","isSelected","newSelectedDropDownValues","handleApplySelectedDropDownValues","togglePopover","onApply","isSearchInput","some","v","stopPropagation","multiSelectDropdownOptionJSX","optionId","Checkbox","ariaHidden","checked","renderMultiSelectDropdownContents","onFocus","shiftKey","ref","Button","size","renderDropdownSelect","borderColor","errorBorderColor","dropDownSelectClass","dropDownSelectAutomationId","rotation","getDropdownAriaLabel","onBlurCapture","Popover","isPopoverOpen","renderPopoverContents","contentWidth","renderPopoverSrcElement","renderSrcElement","onPopoverToggle","selectedIndex","findIndex","dropDownSrcAutomationId","popoverContentAutomationId","dropDownContentAutomationId","Boolean","join","sourceRole"],"mappings":"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"}

package/dist/index27.js

@@ -1,5 +1,5 @@
 import e from "react";
-import { ShimmerLoader as c } from "./index55.js";
+import { ShimmerLoader as c } from "./index59.js";
 /* empty css         */
 const f = (r) => {
   const {

package/dist/index28.js

@@ -1,7 +1,7 @@
 import i, { useMemo as D, useRef as j, useEffect as m } from "react";
 import { Icon as M } from "./index6.js";
-import { getA11yNameAttributes as $ } from "./index81.js";
-import { useFocusTrap as k } from "./index72.js";
+import { getA11yNameAttributes as $ } from "./index82.js";
+import { useFocusTrap as k } from "./index76.js";
 import { useDismissOnEscape as z } from "./index215.js";
 import { useFocusSentinel as T } from "./index216.js";
 /* empty css         */
@@ -96,13 +96,13 @@ const V = (s) => {
     inert: e ? void 0 : ""
   }), /* @__PURE__ */ i.createElement("div", {
     className: "overlay-content"
-  }, !t && /* @__PURE__ */ i.createElement("div", _), C && /* @__PURE__ */ i.createElement(M, {
+  }, C && /* @__PURE__ */ i.createElement(M, {
     name: O,
     onClick: d,
     className: "overlay-close",
     ariaLabel: P,
     automationId: "sidebar_overlay_close"
-  }), o, !t && /* @__PURE__ */ i.createElement("div", A)));
+  }), !t && /* @__PURE__ */ i.createElement("div", _), o, !t && /* @__PURE__ */ i.createElement("div", A)));
 };
 export {
   V as SidebarOverlay

package/dist/index28.js.map

@@ -1 +1 @@
-{"version":3,"file":"index28.js","sources":["../src/components/SidebarOverlay/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useMemo, useRef } from 'react';\nimport { Icon } from 'components/Icon';\nimport { getA11yNameAttributes, useFocusTrap, useDismissOnEscape } from '../../utils/a11y';\nimport { useFocusSentinel } from '../../utils/a11y/useFocusSentinel';\n\nimport './style.scss';\n\ntype SidebarOverlayA11yRole = 'dialog' | 'complementary';\n\nexport interface SidebarOverlayProps {\n  content: React.ReactNode;\n  className?: string;\n  alignment?: 'left' | 'right';\n  style?: React.CSSProperties;\n  noShadow?: boolean;\n  automationId?: string;\n  id?: string;\n  position?: 'absolute' | 'fixed' | 'relative' | 'static' | '';\n  isOpen?: boolean;\n  displayCloseSidebar?: boolean;\n  closeSidebarIcon?: string;\n  /**\n   * Accessible label for the close button. Defaults to 'Close sidebar'.\n   */\n  closeAriaLabel?: string;\n  onClose?: () => void;\n  onSidebarUnmount?: () => void;\n  onPathChange?: (route: string) => void;\n  currentPath?: string;\n  animateSidebar?: boolean;\n  /**\n   * Accessibility role that determines the full behavior bundle.\n   * - 'dialog': modal drawer (focus trap, scroll lock, aria-modal, Escape closes)\n   * - 'complementary': persistent side panel (no trap, no forced focus, no scroll lock)\n   * If not provided, derives from position: fixed|absolute → 'dialog', static|relative|'' → 'complementary'\n   */\n  a11yRole?: SidebarOverlayA11yRole;\n  /**\n   * Accessible name when no visible label exists.\n   * Prefer ariaLabelledBy when a visible title exists inside the sidebar.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of visible element(s) that label this sidebar.\n   * Preferred over ariaLabel when a visible title exists (keeps SR and visual text in sync).\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this sidebar (additional context).\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Explicit element to restore focus to when the sidebar closes.\n   * Overrides automatic trigger capture from document.activeElement.\n   * Use when the opener element is known (e.g. a ref on the toggle button).\n   * In complementary mode: seeds the trigger ref directly.\n   * In dialog mode: passed through to useFocusTrap.\n   */\n  returnFocusRef?: React.RefObject<HTMLElement | null>;\n}\n\nexport const SidebarOverlay: FC<SidebarOverlayProps> = (props) => {\n  const {\n    content,\n    className = '',\n    alignment,\n    noShadow,\n    position = 'fixed',\n    isOpen,\n    displayCloseSidebar,\n    onClose,\n    onSidebarUnmount,\n    onPathChange,\n    style,\n    automationId,\n    id,\n    currentPath = '',\n    closeSidebarIcon = 'close',\n    closeAriaLabel = 'Close sidebar',\n    animateSidebar = true,\n    a11yRole,\n    ariaLabel,\n    ariaLabelledBy,\n    ariaDescribedBy,\n    returnFocusRef,\n  } = props;\n\n  // Default to complementary — consumers opt into dialog (focus trap + scroll lock)\n  // by passing a11yRole=\"dialog\" explicitly.\n  const effectiveA11yRole: SidebarOverlayA11yRole = a11yRole ?? 'complementary';\n\n  const isModal = effectiveA11yRole === 'dialog';\n\n  // Get accessible name attributes\n  const accessibleNameProps = useMemo(\n    () => getA11yNameAttributes({ ariaLabel, ariaLabelledBy, ariaDescribedBy }),\n    [ariaLabel, ariaLabelledBy, ariaDescribedBy]\n  );\n\n  const sidebarRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    return () => {\n      onSidebarUnmount && onSidebarUnmount();\n    };\n  }, []);\n\n  // Scroll lock — modal only.\n  useEffect(() => {\n    if (!isModal) return;\n    document.body.style.overflow = isOpen ? 'hidden' : '';\n    return () => {\n      document.body.style.overflow = '';\n    };\n  }, [isOpen, isModal]);\n\n  useEffect(() => {\n    onPathChange && onPathChange(currentPath);\n  }, [currentPath]);\n\n  useDismissOnEscape({\n    containerRef: sidebarRef,\n    onDismiss: onClose,\n    enabled: isOpen\n  });\n\n  // Focus trap: modal mode only, guarded by onClose as a WCAG safety net —\n  // trapping focus without a dismiss path is a keyboard trap (WCAG 2.1.2).\n  useFocusTrap({\n    enabled: Boolean(isModal && isOpen && !!onClose),\n    containerRef: sidebarRef,\n    restoreFocus: true,\n    initialFocus: 'first',\n    returnFocusRef,\n  });\n\n  // Complementary (non-modal) focus management: move focus in on open,\n  // restore to trigger on close, wrap Tab/Shift+Tab at panel boundaries.\n  const { startSentinelProps, endSentinelProps } = useFocusSentinel({\n    isOpen,\n    isModal,\n    containerRef: sidebarRef,\n    returnFocusRef,\n  });\n\n  const getSidebarClassName = () => {\n    let defaultClass = `se-design-sidebar-overlay-container z-[1000]`;\n\n    defaultClass += className.length > 0 ? ` ${className}` : '';\n    defaultClass += alignment === 'left' ? ' left-aligned' : ' right-aligned';\n    defaultClass += noShadow ? ' no-shadow' : '';\n    defaultClass += position.length > 0 ? ` ${position}` : '';\n    defaultClass += isOpen ? ' open-sidebar' : ' closed-sidebar';\n    if(!animateSidebar) {\n      defaultClass += isOpen ? '' : ' hidden';\n    }\n    return defaultClass;\n  };\n\n  const getSidebarStyle = () => {\n    return {\n      ...style,\n      ...(isOpen && style?.width ? { width: style?.width } : { width: '0px' })\n    };\n  };\n\n  return (\n    <div\n      ref={sidebarRef}\n      id={id}\n      className={getSidebarClassName()}\n      style={getSidebarStyle()}\n      data-automation-id={automationId}\n      tabIndex={-1}\n      role={effectiveA11yRole}\n      aria-modal={isModal ? 'true' : undefined}\n      aria-hidden={!isOpen ? 'true' : undefined}\n      {...accessibleNameProps}\n      inert={!isOpen ? ('' as unknown as boolean) : undefined}\n    >\n      <div className=\"overlay-content\">\n        {!isModal && <div {...startSentinelProps} />}\n        {displayCloseSidebar && (\n          <Icon\n            name={closeSidebarIcon}\n            onClick={onClose}\n            className=\"overlay-close\"\n            ariaLabel={closeAriaLabel}\n            automationId=\"sidebar_overlay_close\"\n          />\n        )}\n        {content}\n        {!isModal && <div {...endSentinelProps} />}\n      </div>\n    </div>\n  );\n};\n"],"names":["SidebarOverlay","props","content","className","alignment","noShadow","position","isOpen","displayCloseSidebar","onClose","onSidebarUnmount","onPathChange","style","automationId","id","currentPath","closeSidebarIcon","closeAriaLabel","animateSidebar","a11yRole","ariaLabel","ariaLabelledBy","ariaDescribedBy","returnFocusRef","effectiveA11yRole","isModal","accessibleNameProps","useMemo","getA11yNameAttributes","sidebarRef","useRef","useEffect","document","body","overflow","useDismissOnEscape","containerRef","onDismiss","enabled","useFocusTrap","Boolean","restoreFocus","initialFocus","startSentinelProps","endSentinelProps","useFocusSentinel","getSidebarClassName","defaultClass","length","getSidebarStyle","width","React","createElement","_extends","ref","tabIndex","role","undefined","inert","Icon","name","onClick"],"mappings":"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"}
+{"version":3,"file":"index28.js","sources":["../src/components/SidebarOverlay/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useMemo, useRef } from 'react';\nimport { Icon } from 'components/Icon';\nimport { getA11yNameAttributes, useFocusTrap, useDismissOnEscape } from '../../utils/a11y';\nimport { useFocusSentinel } from '../../utils/a11y/useFocusSentinel';\n\nimport './style.scss';\n\ntype SidebarOverlayA11yRole = 'dialog' | 'complementary';\n\nexport interface SidebarOverlayProps {\n  content: React.ReactNode;\n  className?: string;\n  alignment?: 'left' | 'right';\n  style?: React.CSSProperties;\n  noShadow?: boolean;\n  automationId?: string;\n  id?: string;\n  position?: 'absolute' | 'fixed' | 'relative' | 'static' | '';\n  isOpen?: boolean;\n  displayCloseSidebar?: boolean;\n  closeSidebarIcon?: string;\n  /**\n   * Accessible label for the close button. Defaults to 'Close sidebar'.\n   */\n  closeAriaLabel?: string;\n  onClose?: () => void;\n  onSidebarUnmount?: () => void;\n  onPathChange?: (route: string) => void;\n  currentPath?: string;\n  animateSidebar?: boolean;\n  /**\n   * Accessibility role that determines the full behavior bundle.\n   * - 'dialog': modal drawer (focus trap, scroll lock, aria-modal, Escape closes)\n   * - 'complementary': persistent side panel (no trap, no forced focus, no scroll lock)\n   * If not provided, derives from position: fixed|absolute → 'dialog', static|relative|'' → 'complementary'\n   */\n  a11yRole?: SidebarOverlayA11yRole;\n  /**\n   * Accessible name when no visible label exists.\n   * Prefer ariaLabelledBy when a visible title exists inside the sidebar.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of visible element(s) that label this sidebar.\n   * Preferred over ariaLabel when a visible title exists (keeps SR and visual text in sync).\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this sidebar (additional context).\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Explicit element to restore focus to when the sidebar closes.\n   * Overrides automatic trigger capture from document.activeElement.\n   * Use when the opener element is known (e.g. a ref on the toggle button).\n   * In complementary mode: seeds the trigger ref directly.\n   * In dialog mode: passed through to useFocusTrap.\n   */\n  returnFocusRef?: React.RefObject<HTMLElement | null>;\n}\n\nexport const SidebarOverlay: FC<SidebarOverlayProps> = (props) => {\n  const {\n    content,\n    className = '',\n    alignment,\n    noShadow,\n    position = 'fixed',\n    isOpen,\n    displayCloseSidebar,\n    onClose,\n    onSidebarUnmount,\n    onPathChange,\n    style,\n    automationId,\n    id,\n    currentPath = '',\n    closeSidebarIcon = 'close',\n    closeAriaLabel = 'Close sidebar',\n    animateSidebar = true,\n    a11yRole,\n    ariaLabel,\n    ariaLabelledBy,\n    ariaDescribedBy,\n    returnFocusRef,\n  } = props;\n\n  // Default to complementary — consumers opt into dialog (focus trap + scroll lock)\n  // by passing a11yRole=\"dialog\" explicitly.\n  const effectiveA11yRole: SidebarOverlayA11yRole = a11yRole ?? 'complementary';\n\n  const isModal = effectiveA11yRole === 'dialog';\n\n  // Get accessible name attributes\n  const accessibleNameProps = useMemo(\n    () => getA11yNameAttributes({ ariaLabel, ariaLabelledBy, ariaDescribedBy }),\n    [ariaLabel, ariaLabelledBy, ariaDescribedBy]\n  );\n\n  const sidebarRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    return () => {\n      onSidebarUnmount && onSidebarUnmount();\n    };\n  }, []);\n\n  // Scroll lock — modal only.\n  useEffect(() => {\n    if (!isModal) return;\n    document.body.style.overflow = isOpen ? 'hidden' : '';\n    return () => {\n      document.body.style.overflow = '';\n    };\n  }, [isOpen, isModal]);\n\n  useEffect(() => {\n    onPathChange && onPathChange(currentPath);\n  }, [currentPath]);\n\n  useDismissOnEscape({\n    containerRef: sidebarRef,\n    onDismiss: onClose,\n    enabled: isOpen\n  });\n\n  // Focus trap: modal mode only, guarded by onClose as a WCAG safety net —\n  // trapping focus without a dismiss path is a keyboard trap (WCAG 2.1.2).\n  useFocusTrap({\n    enabled: Boolean(isModal && isOpen && !!onClose),\n    containerRef: sidebarRef,\n    restoreFocus: true,\n    initialFocus: 'first',\n    returnFocusRef,\n  });\n\n  // Complementary (non-modal) focus management: move focus in on open,\n  // restore to trigger on close, wrap Tab/Shift+Tab at panel boundaries.\n  const { startSentinelProps, endSentinelProps } = useFocusSentinel({\n    isOpen,\n    isModal,\n    containerRef: sidebarRef,\n    returnFocusRef,\n  });\n\n  const getSidebarClassName = () => {\n    let defaultClass = `se-design-sidebar-overlay-container z-[1000]`;\n\n    defaultClass += className.length > 0 ? ` ${className}` : '';\n    defaultClass += alignment === 'left' ? ' left-aligned' : ' right-aligned';\n    defaultClass += noShadow ? ' no-shadow' : '';\n    defaultClass += position.length > 0 ? ` ${position}` : '';\n    defaultClass += isOpen ? ' open-sidebar' : ' closed-sidebar';\n    if(!animateSidebar) {\n      defaultClass += isOpen ? '' : ' hidden';\n    }\n    return defaultClass;\n  };\n\n  const getSidebarStyle = () => {\n    return {\n      ...style,\n      ...(isOpen && style?.width ? { width: style?.width } : { width: '0px' })\n    };\n  };\n\n  return (\n    <div\n      ref={sidebarRef}\n      id={id}\n      className={getSidebarClassName()}\n      style={getSidebarStyle()}\n      data-automation-id={automationId}\n      tabIndex={-1}\n      role={effectiveA11yRole}\n      aria-modal={isModal ? 'true' : undefined}\n      aria-hidden={!isOpen ? 'true' : undefined}\n      {...accessibleNameProps}\n      inert={!isOpen ? ('' as unknown as boolean) : undefined}\n    >\n      <div className=\"overlay-content\">\n        {displayCloseSidebar && (\n          <Icon\n            name={closeSidebarIcon}\n            onClick={onClose}\n            className=\"overlay-close\"\n            ariaLabel={closeAriaLabel}\n            automationId=\"sidebar_overlay_close\"\n          />\n        )}\n        {!isModal && <div {...startSentinelProps} />}\n        {content}\n        {!isModal && <div {...endSentinelProps} />}\n      </div>\n    </div>\n  );\n};\n"],"names":["SidebarOverlay","props","content","className","alignment","noShadow","position","isOpen","displayCloseSidebar","onClose","onSidebarUnmount","onPathChange","style","automationId","id","currentPath","closeSidebarIcon","closeAriaLabel","animateSidebar","a11yRole","ariaLabel","ariaLabelledBy","ariaDescribedBy","returnFocusRef","effectiveA11yRole","isModal","accessibleNameProps","useMemo","getA11yNameAttributes","sidebarRef","useRef","useEffect","document","body","overflow","useDismissOnEscape","containerRef","onDismiss","enabled","useFocusTrap","Boolean","restoreFocus","initialFocus","startSentinelProps","endSentinelProps","useFocusSentinel","getSidebarClassName","defaultClass","length","getSidebarStyle","width","React","createElement","_extends","ref","tabIndex","role","undefined","inert","Icon","name","onClick"],"mappings":"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"}

package/dist/index29.js

@@ -1,10 +1,10 @@
-import r, { useState as $, useMemo as j, useRef as L, useEffect as B } from "react";
-import { Icon as O } from "./index6.js";
+import r, { useState as $, useMemo as j, useRef as F, useEffect as B } from "react";
+import { Icon as L } from "./index6.js";
 import { Popover as z } from "./index19.js";
 import { MenuList as H } from "./index18.js";
 import { useStableId as U } from "./index205.js";
-import "./index72.js";
-import { useTabsA11y as V, getPanelId as q } from "./index73.js";
+import "./index76.js";
+import { useTabsA11y as V, getPanelId as q } from "./index77.js";
 /* empty css         */
 function d() {
   return d = Object.assign ? Object.assign.bind() : function(i) {
@@ -21,19 +21,19 @@ const re = ({
   onTabChange: m,
   primaryTabCount: u,
   headingLevel: g,
-  id: A,
-  ariaLabel: F = "Tabs",
+  id: O,
+  ariaLabel: A = "Tabs",
   ariaLabelledBy: M,
   panelId: p
 }) => {
-  const K = i || (o[0] ? o[0].id : ""), [b, h] = $(K), [w, y] = $(!1), T = u ?? o?.length, f = o.slice(0, T), c = o.slice(T), l = c.find((e) => e.id === b), E = o.some((e) => e.renderTabContent), k = U(A, "tabs"), R = j(() => {
-    const e = f.filter((s) => !s.disabled), t = c.filter((s) => !s.disabled), n = e.map((s) => s.id);
+  const K = i || (o[0] ? o[0].id : ""), [b, h] = $(K), [w, y] = $(!1), T = u ?? o?.length, f = o.slice(0, T), c = o.slice(T), s = c.find((e) => e.id === b), E = o.some((e) => e.renderTabContent), k = U(O, "tabs"), R = j(() => {
+    const e = f.filter((l) => !l.disabled), t = c.filter((l) => !l.disabled), n = e.map((l) => l.id);
     return t.length > 0 ? [...n, "overflow"] : n;
   }, [f, c]), {
-    getTabProps: x,
+    getTabProps: I,
     getPanelProps: S,
     getTabListProps: _,
-    handleKeyDown: I,
+    handleKeyDown: x,
     setFocusedTabId: C
   } = V({
     itemIds: R,
@@ -42,11 +42,11 @@ const re = ({
     idBase: k,
     includePanelLinks: E || !!p,
     externalPanelId: p
-  }), N = L(null), v = L(!1);
+  }), P = F(null), v = F(!1);
   B(() => {
     h(i || "");
   }, [i]);
-  const P = (e) => {
+  const N = (e) => {
     h(e?.id), m?.(e?.id);
   }, D = (e, t) => e.id === t;
   if (g && o.length === 1) {
@@ -63,19 +63,19 @@ const re = ({
     className: "se-design-tabs flex items-stretch relative border rounded-md border-[var(--color-gray-400)] w-fit",
     "data-automation-id": "tabs-container"
   }, _({
-    ariaLabel: F,
+    ariaLabel: A,
     ariaLabelledBy: M
   })), f.map((e) => {
-    const t = b === e.id, n = !!e.disabled, s = x(e.id);
+    const t = b === e.id, n = !!e.disabled, l = I(e.id);
     return /* @__PURE__ */ r.createElement("button", d({
       type: "button",
       key: e.id
-    }, s, {
+    }, l, {
       disabled: n,
       "aria-label": e.ariaLabel,
       onFocus: () => !n && C(e.id),
-      onKeyDown: I,
-      onClick: () => P(e),
+      onKeyDown: x,
+      onClick: () => N(e),
       className: `se-design-tab-item flex items-center text-base px-3 py-0.5 min-w-0 border-l first:border-l-0 first:rounded-l-[0.3rem] last:rounded-r-[0.3rem] border-[var(--color-gray-400)] ${n ? "" : "focus-outline"} ${n ? "text-[var(--color-gray-400)] cursor-not-allowed" : t ? "se-design-tab-item-active text-[var(--color-white)] bg-[var(--color-blue-500)] font-medium hover:cursor-pointer" : "text-[var(--color-gray-700)] font-normal hover:bg-[var(--color-gray-50)] hover:text-[var(--color-gray-900)] cursor-pointer transition-all duration-200 ease-in-out"}`,
       "data-automation-id": `tab-item-${e.automationId || e.id || ""}`
     }), e.label);
@@ -85,20 +85,20 @@ const re = ({
     noBorder: !0,
     disableClickToggle: !0,
     onPopoverToggle: (e) => {
-      e || (v.current && N.current?.focus(), v.current = !1);
+      e || (v.current && P.current?.focus(), v.current = !1);
     },
     renderPopoverSrcElement: ({
       displayPopover: e,
       togglePopover: t
     }) => {
-      const n = x("overflow"), s = l ? q(l.id, k) : void 0;
+      const n = I("overflow"), l = s ? q(s.id, k) : void 0;
       return /* @__PURE__ */ r.createElement("div", d({}, n, {
         ref: (a) => {
-          N.current = a, n.ref(a);
+          P.current = a, n.ref(a);
         },
-        "aria-selected": !!l,
-        "aria-label": l?.label ? void 0 : `More tabs (${c.length})`,
-        "aria-controls": s,
+        "aria-selected": !!s,
+        "aria-label": s?.label ? void 0 : `More tabs (${c.length})`,
+        "aria-controls": l,
         "aria-haspopup": "true",
         "aria-expanded": e,
         onClick: () => {
@@ -107,25 +107,21 @@ const re = ({
         onFocus: () => C("overflow"),
         "data-automation-id": "tabs-kebab-menu",
         onKeyDown: (a) => {
-          a.key === "Enter" || a.key === " " || a.key === "ArrowDown" ? (a.preventDefault(), v.current = !0, t(!0)) : a.key === "ArrowUp" ? (a.preventDefault(), v.current = !0, t("last")) : I(a);
+          a.key === "Enter" || a.key === " " || a.key === "ArrowDown" ? (a.preventDefault(), v.current = !0, t(!0)) : a.key === "ArrowUp" ? (a.preventDefault(), v.current = !0, t("last")) : x(a);
         },
-        className: `overflow-tabs-src-element focus-outline border-l px-3 py-0.5 rounded-r-md font-medium hover:cursor-pointer transition-all duration-200 ease-in-out ${e ? "bg-[var(--color-blue-100)]" : ""} ${l?.label ? "bg-[var(--color-blue-500)]" : "hover:bg-[var(--color-gray-50)]"}`,
+        className: `overflow-tabs-src-element focus-outline border-l px-3 py-0.5 rounded-r-md font-medium hover:cursor-pointer transition-all duration-200 ease-in-out ${e ? "bg-[var(--color-blue-100)]" : ""} ${s?.label ? "bg-[var(--color-blue-500)]" : "hover:bg-[var(--color-gray-50)]"}`,
         onMouseEnter: () => y(!0),
         onMouseLeave: () => y(!1)
-      }), l?.label ? /* @__PURE__ */ r.createElement("span", {
-        className: "pointer-events-none flex items-center gap-1"
-      }, /* @__PURE__ */ r.createElement("span", {
+      }), s?.label ? /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement("span", {
         className: "text-[var(--color-white)]"
-      }, l?.label), /* @__PURE__ */ r.createElement(O, {
+      }, s?.label), /* @__PURE__ */ r.createElement(L, {
         name: "chevron",
         rotation: e ? "180" : "0",
         stroke: w ? "var(--color-gray-100)" : "var(--color-white)"
-      })) : /* @__PURE__ */ r.createElement("span", {
-        className: "pointer-events-none"
-      }, /* @__PURE__ */ r.createElement(O, {
+      })) : /* @__PURE__ */ r.createElement(L, {
         name: "kebab-menu",
         fill: w ? "var(--color-gray-900)" : "var(--color-gray-700)"
-      })));
+      }));
     },
     renderPopoverContents: ({
       closePopoverCb: e
@@ -135,7 +131,7 @@ const re = ({
         label: t?.label,
         automationId: t?.automationId || t?.id,
         onClick: () => {
-          P(t), e();
+          N(t), e();
         }
       }))
     })

package/dist/index29.js.map

@@ -1 +1 @@
-{"version":3,"file":"index29.js","sources":["../src/components/Tabs/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useState, useEffect, useMemo, useRef } from 'react';\nimport { Icon } from '../Icon';\nimport { Popover } from '../Popover';\nimport { MenuList } from '../MenuList';\nimport { useStableId } from '../../utils/useStableId';\nimport { useTabsA11y, getPanelId } from '../../utils/a11y';\n\nimport './style.scss';\n\ninterface TabProps {\n  label: string;\n  id: string;\n  disabled?: boolean;\n  renderTabContent?: (tab: TabProps) => ReactNode;\n  automationId?: string;\n  ariaLabel?: string;\n}\ninterface TabsProps {\n  defaultActiveTab?: string;\n  tabs: TabProps[];\n  onTabChange?: (tabId: string) => void;\n  primaryTabCount?: number; // prop for controlling primary tabs\n  headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span'; // heading tag to render single tab as a heading element when only one tab is present\n  automationId?: string;\n  id?: string; // custom ID for baseId (passed to useStableId)\n  ariaLabel?: string; // Accessible name when no visible label exists\n  ariaLabelledBy?: string; // ID of element that labels this tablist (preferred over ariaLabel)\n  panelId?: string; // When consumer manages a single external panel, pass its id here\n}\n\nexport const Tabs: FC<TabsProps> = ({\n  defaultActiveTab,\n  tabs,\n  onTabChange,\n  primaryTabCount,\n  headingLevel: HeadingTag,\n  id,\n  ariaLabel = 'Tabs',\n  ariaLabelledBy,\n  panelId\n}) => {\n  const defaultTabId = defaultActiveTab || (tabs[0] ? tabs[0].id : '');\n  const [activeTab, setActiveTab] = useState(defaultTabId);\n  const [isIconTabHover, setIsIconTabHover] = useState(false);\n\n  const visibleTabCount = primaryTabCount ?? tabs?.length;\n  const visibleTabs = tabs.slice(0, visibleTabCount);\n  const overflowTabs = tabs.slice(visibleTabCount);\n  const activeOverflowTab = overflowTabs.find((tab) => tab.id === activeTab);\n\n  // Only render internal panels if at least one tab provides content via renderTabContent\n  const hasPanelContent = tabs.some(t => t.renderTabContent);\n\n  // A11y setup\n  const baseId = useStableId(id, 'tabs');\n  const itemIds = useMemo(() => {\n    const enabledVisibleTabs = visibleTabs.filter(t => !t.disabled);\n    const enabledOverflowTabs = overflowTabs.filter(t => !t.disabled);\n    const visibleIds = enabledVisibleTabs.map(t => t.id);\n    return enabledOverflowTabs.length > 0 ? [...visibleIds, 'overflow'] : visibleIds;\n  }, [visibleTabs, overflowTabs]);\n\n  const { getTabProps, getPanelProps, getTabListProps, handleKeyDown, setFocusedTabId } = useTabsA11y({\n    itemIds,\n    activeItem: activeTab,\n    orientation: 'horizontal',\n    idBase: baseId,\n    includePanelLinks: hasPanelContent || !!panelId,\n    externalPanelId: panelId\n  });\n\n  // Ref for the overflow button div — needed to return focus after menu closes\n  const overflowDivRef = useRef<HTMLDivElement>(null);\n  // Track whether the overflow popover was opened via keyboard — only return focus\n  // programmatically in that case (mouse-opened popovers should not trigger :focus-visible on close)\n  const wasKeyboardOpenedRef = useRef(false);\n\n  useEffect(() => {\n    setActiveTab(defaultActiveTab || '');\n  }, [defaultActiveTab]);\n\n  const handleTabClick = (tab: TabProps) => {\n    setActiveTab(tab?.id);\n    onTabChange?.(tab?.id);\n  };\n\n  const isTabActive = (tab: TabProps, activeTab: string) => {\n    return tab.id === activeTab;\n  };\n\n  if (HeadingTag && tabs.length === 1) {\n    const singleTab = tabs[0];\n    return (\n      <>\n        <HeadingTag className=\"se-design-tabs se-design-tabs-heading\">\n          {singleTab.label}\n        </HeadingTag>\n        <div className=\"se-design-tabs-content\">\n          <div className=\"tab-content block\">\n            {singleTab?.renderTabContent && singleTab?.renderTabContent(singleTab)}\n          </div>\n        </div>\n      </>\n    );\n  }\n\n  return (\n    <>\n      <div\n        className=\"se-design-tabs flex items-stretch relative border rounded-md border-[var(--color-gray-400)] w-fit\"\n        data-automation-id=\"tabs-container\"\n        {...getTabListProps({ ariaLabel, ariaLabelledBy })}\n      >\n        {visibleTabs.map((tab) => {\n          const isActive = activeTab === tab.id;\n          const isDisabled = !!tab.disabled;\n          const tabProps = getTabProps(tab.id);\n          return (\n            <button\n              type=\"button\"\n              key={tab.id}\n              {...tabProps}\n              disabled={isDisabled}\n              aria-label={tab.ariaLabel}\n              onFocus={() => !isDisabled && setFocusedTabId(tab.id)}\n              onKeyDown={handleKeyDown}\n              onClick={() => handleTabClick(tab)}\n              className={`se-design-tab-item flex items-center text-base px-3 py-0.5 min-w-0 border-l first:border-l-0 first:rounded-l-[0.3rem] last:rounded-r-[0.3rem] border-[var(--color-gray-400)] ${!isDisabled ? 'focus-outline' : ''} ${\n                isDisabled\n                  ? 'text-[var(--color-gray-400)] cursor-not-allowed'\n                  : isActive\n                  ? 'se-design-tab-item-active text-[var(--color-white)] bg-[var(--color-blue-500)] font-medium hover:cursor-pointer'\n                  : 'text-[var(--color-gray-700)] font-normal hover:bg-[var(--color-gray-50)] hover:text-[var(--color-gray-900)] cursor-pointer transition-all duration-200 ease-in-out'\n              }`}\n              data-automation-id={`tab-item-${tab.automationId || tab.id || ''}`}\n            >\n              {tab.label}\n            </button>\n          );\n        })}\n\n        {overflowTabs.length > 0 && (\n          <Popover\n            className=\"se-design-overflow-tabs\"\n            position=\"bottom-left\"\n            noBorder\n            disableClickToggle={true}\n            onPopoverToggle={(isOpen) => {\n              if (!isOpen) {\n                if (wasKeyboardOpenedRef.current) overflowDivRef.current?.focus();\n                wasKeyboardOpenedRef.current = false;\n              }\n            }}\n            renderPopoverSrcElement={({ displayPopover, togglePopover }) => {\n              const overflowTabProps = getTabProps('overflow');\n              const overflowAriaControls = activeOverflowTab\n                ? getPanelId(activeOverflowTab.id, baseId)\n                : undefined;\n\n              return (\n                <div\n                  {...overflowTabProps}\n                  ref={(el) => { overflowDivRef.current = el; overflowTabProps.ref(el); }}\n                  aria-selected={!!activeOverflowTab}\n                  aria-label={activeOverflowTab?.label ? undefined : `More tabs (${overflowTabs.length})`}\n                  aria-controls={overflowAriaControls}\n                  aria-haspopup=\"true\"\n                  aria-expanded={displayPopover}\n                  onClick={() => { wasKeyboardOpenedRef.current = false; togglePopover(true); }}\n                  onFocus={() => setFocusedTabId('overflow')}\n                  data-automation-id=\"tabs-kebab-menu\"\n                  onKeyDown={(e) => {\n                    if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n                      e.preventDefault();\n                      wasKeyboardOpenedRef.current = true;\n                      togglePopover(true);\n                    } else if (e.key === 'ArrowUp') {\n                      e.preventDefault();\n                      wasKeyboardOpenedRef.current = true;\n                      togglePopover('last');\n                    } else {\n                      handleKeyDown(e);\n                    }\n                  }}\n                  className={`overflow-tabs-src-element focus-outline border-l px-3 py-0.5 rounded-r-md font-medium hover:cursor-pointer transition-all duration-200 ease-in-out ${\n                    displayPopover ? 'bg-[var(--color-blue-100)]' : ''\n                  } ${activeOverflowTab?.label ? 'bg-[var(--color-blue-500)]' : 'hover:bg-[var(--color-gray-50)]'}`}\n                  onMouseEnter={() => setIsIconTabHover(true)}\n                  onMouseLeave={() => setIsIconTabHover(false)}\n                >\n                  {activeOverflowTab?.label ? (\n                    <span className=\"pointer-events-none flex items-center gap-1\">\n                      <span className=\"text-[var(--color-white)]\">{activeOverflowTab?.label}</span>\n                      <Icon\n                        name=\"chevron\"\n                        rotation={displayPopover ? '180' : '0'}\n                        stroke={isIconTabHover ? 'var(--color-gray-100)' : 'var(--color-white)'}\n                      />\n                    </span>\n                  ) : (\n                    <span className=\"pointer-events-none\">\n                      <Icon name=\"kebab-menu\" fill={isIconTabHover ? 'var(--color-gray-900)' : 'var(--color-gray-700)'} />\n                    </span>\n                  )}\n                </div>\n              );\n            }}\n            renderPopoverContents={({ closePopoverCb }) => (\n              <MenuList\n                items={overflowTabs.map((tab) => ({\n                  id: tab?.id,\n                  label: tab?.label,\n                  automationId: tab?.automationId || tab?.id,\n                  onClick: () => {\n                    handleTabClick(tab);\n                    closePopoverCb();\n                  }\n                }))}\n              />\n            )}\n          />\n        )}\n      </div>\n\n      {hasPanelContent && (\n        <div className=\"se-design-tabs-content\">\n          {tabs.map((tab) => (\n            <div\n              key={tab.id}\n              {...getPanelProps(tab.id)}\n              className={`tab-content ${isTabActive(tab, activeTab) ? 'block' : 'hidden'}`}\n            >\n              {isTabActive(tab, activeTab) && tab.renderTabContent?.(tab)}\n            </div>\n          ))}\n        </div>\n      )}\n    </>\n  );\n};\n"],"names":["Tabs","defaultActiveTab","tabs","onTabChange","primaryTabCount","headingLevel","HeadingTag","id","ariaLabel","ariaLabelledBy","panelId","defaultTabId","activeTab","setActiveTab","useState","isIconTabHover","setIsIconTabHover","visibleTabCount","length","visibleTabs","slice","overflowTabs","activeOverflowTab","find","tab","hasPanelContent","some","t","renderTabContent","baseId","useStableId","itemIds","useMemo","enabledVisibleTabs","filter","disabled","enabledOverflowTabs","visibleIds","map","getTabProps","getPanelProps","getTabListProps","handleKeyDown","setFocusedTabId","useTabsA11y","activeItem","orientation","idBase","includePanelLinks","externalPanelId","overflowDivRef","useRef","wasKeyboardOpenedRef","useEffect","handleTabClick","isTabActive","singleTab","createElement","React","Fragment","className","label","_extends","isActive","isDisabled","tabProps","type","key","onFocus","onKeyDown","onClick","automationId","Popover","position","noBorder","disableClickToggle","onPopoverToggle","isOpen","current","focus","renderPopoverSrcElement","displayPopover","togglePopover","overflowTabProps","overflowAriaControls","getPanelId","undefined","ref","el","e","preventDefault","onMouseEnter","onMouseLeave","Icon","name","rotation","stroke","fill","renderPopoverContents","closePopoverCb","MenuList","items"],"mappings":"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"}
+{"version":3,"file":"index29.js","sources":["../src/components/Tabs/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useState, useEffect, useMemo, useRef } from 'react';\nimport { Icon } from '../Icon';\nimport { Popover } from '../Popover';\nimport { MenuList } from '../MenuList';\nimport { useStableId } from '../../utils/useStableId';\nimport { useTabsA11y, getPanelId } from '../../utils/a11y';\n\nimport './style.scss';\n\ninterface TabProps {\n  label: string;\n  id: string;\n  disabled?: boolean;\n  renderTabContent?: (tab: TabProps) => ReactNode;\n  automationId?: string;\n  ariaLabel?: string;\n}\ninterface TabsProps {\n  defaultActiveTab?: string;\n  tabs: TabProps[];\n  onTabChange?: (tabId: string) => void;\n  primaryTabCount?: number; // prop for controlling primary tabs\n  headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span'; // heading tag to render single tab as a heading element when only one tab is present\n  automationId?: string;\n  id?: string; // custom ID for baseId (passed to useStableId)\n  ariaLabel?: string; // Accessible name when no visible label exists\n  ariaLabelledBy?: string; // ID of element that labels this tablist (preferred over ariaLabel)\n  panelId?: string; // When consumer manages a single external panel, pass its id here\n}\n\nexport const Tabs: FC<TabsProps> = ({\n  defaultActiveTab,\n  tabs,\n  onTabChange,\n  primaryTabCount,\n  headingLevel: HeadingTag,\n  id,\n  ariaLabel = 'Tabs',\n  ariaLabelledBy,\n  panelId\n}) => {\n  const defaultTabId = defaultActiveTab || (tabs[0] ? tabs[0].id : '');\n  const [activeTab, setActiveTab] = useState(defaultTabId);\n  const [isIconTabHover, setIsIconTabHover] = useState(false);\n\n  const visibleTabCount = primaryTabCount ?? tabs?.length;\n  const visibleTabs = tabs.slice(0, visibleTabCount);\n  const overflowTabs = tabs.slice(visibleTabCount);\n  const activeOverflowTab = overflowTabs.find((tab) => tab.id === activeTab);\n\n  // Only render internal panels if at least one tab provides content via renderTabContent\n  const hasPanelContent = tabs.some(t => t.renderTabContent);\n\n  // A11y setup\n  const baseId = useStableId(id, 'tabs');\n  const itemIds = useMemo(() => {\n    const enabledVisibleTabs = visibleTabs.filter(t => !t.disabled);\n    const enabledOverflowTabs = overflowTabs.filter(t => !t.disabled);\n    const visibleIds = enabledVisibleTabs.map(t => t.id);\n    return enabledOverflowTabs.length > 0 ? [...visibleIds, 'overflow'] : visibleIds;\n  }, [visibleTabs, overflowTabs]);\n\n  const { getTabProps, getPanelProps, getTabListProps, handleKeyDown, setFocusedTabId } = useTabsA11y({\n    itemIds,\n    activeItem: activeTab,\n    orientation: 'horizontal',\n    idBase: baseId,\n    includePanelLinks: hasPanelContent || !!panelId,\n    externalPanelId: panelId\n  });\n\n  // Ref for the overflow button div — needed to return focus after menu closes\n  const overflowDivRef = useRef<HTMLDivElement>(null);\n  // Track whether the overflow popover was opened via keyboard — only return focus\n  // programmatically in that case (mouse-opened popovers should not trigger :focus-visible on close)\n  const wasKeyboardOpenedRef = useRef(false);\n\n  useEffect(() => {\n    setActiveTab(defaultActiveTab || '');\n  }, [defaultActiveTab]);\n\n  const handleTabClick = (tab: TabProps) => {\n    setActiveTab(tab?.id);\n    onTabChange?.(tab?.id);\n  };\n\n  const isTabActive = (tab: TabProps, activeTab: string) => {\n    return tab.id === activeTab;\n  };\n\n  if (HeadingTag && tabs.length === 1) {\n    const singleTab = tabs[0];\n    return (\n      <>\n        <HeadingTag className=\"se-design-tabs se-design-tabs-heading\">\n          {singleTab.label}\n        </HeadingTag>\n        <div className=\"se-design-tabs-content\">\n          <div className=\"tab-content block\">\n            {singleTab?.renderTabContent && singleTab?.renderTabContent(singleTab)}\n          </div>\n        </div>\n      </>\n    );\n  }\n\n  return (\n    <>\n      <div\n        className=\"se-design-tabs flex items-stretch relative border rounded-md border-[var(--color-gray-400)] w-fit\"\n        data-automation-id=\"tabs-container\"\n        {...getTabListProps({ ariaLabel, ariaLabelledBy })}\n      >\n        {visibleTabs.map((tab) => {\n          const isActive = activeTab === tab.id;\n          const isDisabled = !!tab.disabled;\n          const tabProps = getTabProps(tab.id);\n          return (\n            <button\n              type=\"button\"\n              key={tab.id}\n              {...tabProps}\n              disabled={isDisabled}\n              aria-label={tab.ariaLabel}\n              onFocus={() => !isDisabled && setFocusedTabId(tab.id)}\n              onKeyDown={handleKeyDown}\n              onClick={() => handleTabClick(tab)}\n              className={`se-design-tab-item flex items-center text-base px-3 py-0.5 min-w-0 border-l first:border-l-0 first:rounded-l-[0.3rem] last:rounded-r-[0.3rem] border-[var(--color-gray-400)] ${!isDisabled ? 'focus-outline' : ''} ${\n                isDisabled\n                  ? 'text-[var(--color-gray-400)] cursor-not-allowed'\n                  : isActive\n                  ? 'se-design-tab-item-active text-[var(--color-white)] bg-[var(--color-blue-500)] font-medium hover:cursor-pointer'\n                  : 'text-[var(--color-gray-700)] font-normal hover:bg-[var(--color-gray-50)] hover:text-[var(--color-gray-900)] cursor-pointer transition-all duration-200 ease-in-out'\n              }`}\n              data-automation-id={`tab-item-${tab.automationId || tab.id || ''}`}\n            >\n              {tab.label}\n            </button>\n          );\n        })}\n\n        {overflowTabs.length > 0 && (\n          <Popover\n            className=\"se-design-overflow-tabs\"\n            position=\"bottom-left\"\n            noBorder\n            disableClickToggle={true}\n            onPopoverToggle={(isOpen) => {\n              if (!isOpen) {\n                // Only return focus programmatically when the popover was opened via keyboard.\n                // Mouse-opened popovers must not call .focus() — programmatic focus after a\n                // pointer interaction triggers :focus-visible intermittently across browsers.\n                if (wasKeyboardOpenedRef.current) overflowDivRef.current?.focus();\n                wasKeyboardOpenedRef.current = false;\n              }\n            }}\n            renderPopoverSrcElement={({ displayPopover, togglePopover }) => {\n              const overflowTabProps = getTabProps('overflow');\n              const overflowAriaControls = activeOverflowTab\n                ? getPanelId(activeOverflowTab.id, baseId)\n                : undefined;\n\n              return (\n                <div\n                  {...overflowTabProps}\n                  ref={(el) => { overflowDivRef.current = el; overflowTabProps.ref(el); }}\n                  aria-selected={!!activeOverflowTab}\n                  aria-label={activeOverflowTab?.label ? undefined : `More tabs (${overflowTabs.length})`}\n                  aria-controls={overflowAriaControls}\n                  aria-haspopup=\"true\"\n                  aria-expanded={displayPopover}\n                  onClick={() => { wasKeyboardOpenedRef.current = false; togglePopover(true); }}\n                  onFocus={() => setFocusedTabId('overflow')}\n                  data-automation-id=\"tabs-kebab-menu\"\n                  onKeyDown={(e) => {\n                    if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n                      e.preventDefault();\n                      wasKeyboardOpenedRef.current = true;\n                      togglePopover(true);\n                    } else if (e.key === 'ArrowUp') {\n                      e.preventDefault();\n                      wasKeyboardOpenedRef.current = true;\n                      togglePopover('last');\n                    } else {\n                      handleKeyDown(e);\n                    }\n                  }}\n                  className={`overflow-tabs-src-element focus-outline border-l px-3 py-0.5 rounded-r-md font-medium hover:cursor-pointer transition-all duration-200 ease-in-out ${\n                    displayPopover ? 'bg-[var(--color-blue-100)]' : ''\n                  } ${activeOverflowTab?.label ? 'bg-[var(--color-blue-500)]' : 'hover:bg-[var(--color-gray-50)]'}`}\n                  onMouseEnter={() => setIsIconTabHover(true)}\n                  onMouseLeave={() => setIsIconTabHover(false)}\n                >\n                  {activeOverflowTab?.label ? (\n                    <>\n                      <span className=\"text-[var(--color-white)]\">{activeOverflowTab?.label}</span>\n                      <Icon\n                        name=\"chevron\"\n                        rotation={displayPopover ? '180' : '0'}\n                        stroke={isIconTabHover ? 'var(--color-gray-100)' : 'var(--color-white)'}\n                      />\n                    </>\n                  ) : (\n                    <Icon name=\"kebab-menu\" fill={isIconTabHover ? 'var(--color-gray-900)' : 'var(--color-gray-700)'} />\n                  )}\n                </div>\n              );\n            }}\n            renderPopoverContents={({ closePopoverCb }) => (\n              <MenuList\n                items={overflowTabs.map((tab) => ({\n                  id: tab?.id,\n                  label: tab?.label,\n                  automationId: tab?.automationId || tab?.id,\n                  onClick: () => {\n                    handleTabClick(tab);\n                    closePopoverCb();\n                  }\n                }))}\n              />\n            )}\n          />\n        )}\n      </div>\n\n      {hasPanelContent && (\n        <div className=\"se-design-tabs-content\">\n          {tabs.map((tab) => (\n            <div\n              key={tab.id}\n              {...getPanelProps(tab.id)}\n              className={`tab-content ${isTabActive(tab, activeTab) ? 'block' : 'hidden'}`}\n            >\n              {isTabActive(tab, activeTab) && tab.renderTabContent?.(tab)}\n            </div>\n          ))}\n        </div>\n      )}\n    </>\n  );\n};\n"],"names":["Tabs","defaultActiveTab","tabs","onTabChange","primaryTabCount","headingLevel","HeadingTag","id","ariaLabel","ariaLabelledBy","panelId","defaultTabId","activeTab","setActiveTab","useState","isIconTabHover","setIsIconTabHover","visibleTabCount","length","visibleTabs","slice","overflowTabs","activeOverflowTab","find","tab","hasPanelContent","some","t","renderTabContent","baseId","useStableId","itemIds","useMemo","enabledVisibleTabs","filter","disabled","enabledOverflowTabs","visibleIds","map","getTabProps","getPanelProps","getTabListProps","handleKeyDown","setFocusedTabId","useTabsA11y","activeItem","orientation","idBase","includePanelLinks","externalPanelId","overflowDivRef","useRef","wasKeyboardOpenedRef","useEffect","handleTabClick","isTabActive","singleTab","createElement","React","Fragment","className","label","_extends","isActive","isDisabled","tabProps","type","key","onFocus","onKeyDown","onClick","automationId","Popover","position","noBorder","disableClickToggle","onPopoverToggle","isOpen","current","focus","renderPopoverSrcElement","displayPopover","togglePopover","overflowTabProps","overflowAriaControls","getPanelId","undefined","ref","el","e","preventDefault","onMouseEnter","onMouseLeave","Icon","name","rotation","stroke","fill","renderPopoverContents","closePopoverCb","MenuList","items"],"mappings":"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"}