se-design 1.0.83-dev.5 → 1.0.84-dev.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +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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"}
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';\nimport { useLiveAnnouncer } from '../../utils/a11y/liveAnnouncer';\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 { announce } = useLiveAnnouncer();\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 useEffect(() => {\n if (isDropDownOpen && filteredOptions.length === 0 && searchQuery.trim()) {\n announce(searchResultEmptyMessage, { assertiveness: 'polite', batchId: 'dropdown-empty-state', delay: 300 });\n }\n }, [filteredOptions.length, isDropDownOpen, searchQuery]);\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)] 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 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${shouldShowSearch ? '' : ' flex flex-col max-h-80 overflow-y-auto'}`}\n {...(shouldShowSearch ? {} : {\n ...listboxProps,\n 'aria-label': `${defaultText} options`,\n style: { outline: 'none' },\n tabIndex: -1,\n 'aria-activedescendant': comboboxInputProps['aria-activedescendant'],\n onKeyDown: (e: React.KeyboardEvent) => {\n comboboxContainerProps.onKeyDownCapture?.(e as React.KeyboardEvent<HTMLElement>);\n if (e.key === ' ') {\n e.preventDefault();\n if (highlightedIndex >= 0 && filteredOptions[highlightedIndex]) {\n handleDropDownOptionClick(filteredOptions[highlightedIndex]);\n }\n return;\n }\n comboboxInputProps.onKeyDown(e);\n },\n onFocus: () => {\n if (highlightedIndex === -1 && filteredOptions.length > 0) {\n setHighlightedIndex(0);\n }\n }\n })}\n >\n {shouldShowSearch ? (\n <div\n className=\"flex flex-col max-h-80 overflow-y-auto\"\n aria-label={`${defaultText} options`}\n {...listboxProps}\n >\n {filteredOptions.length > 0 ? (\n filteredOptions.map((dropDownOption, index) => dropDownOptionJsx(dropDownOption, index))\n ) : (\n <div className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\">\n {searchResultEmptyMessage}\n </div>\n )}\n </div>\n ) : (\n filteredOptions.length > 0 ? (\n filteredOptions.map((dropDownOption, index) => dropDownOptionJsx(dropDownOption, index))\n ) : (\n <div className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\">\n {searchResultEmptyMessage}\n </div>\n )\n )}\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)] 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 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 className={`dropdown-content dropdown-options${shouldShowSearch ? '' : ' flex flex-col max-h-80 overflow-y-auto'}`}\n {...(shouldShowSearch ? {} : {\n ...multiSelectListboxProps,\n 'aria-label': `${defaultText} options`,\n 'aria-multiselectable': 'true',\n style: { outline: 'none' },\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 {shouldShowSearch ? (\n <div\n className=\"flex flex-col max-h-80 overflow-y-auto\"\n {...multiSelectListboxProps}\n aria-label={`${defaultText} options`}\n aria-multiselectable=\"true\"\n >\n {filteredOptions.length > 0 ? (\n filteredOptions.map((dropDownOption, index) => multiSelectDropdownOptionJSX(dropDownOption, index))\n ) : (\n <div className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\">\n {searchResultEmptyMessage}\n </div>\n )}\n </div>\n ) : (\n filteredOptions.length > 0 ? (\n filteredOptions.map((dropDownOption, index) => multiSelectDropdownOptionJSX(dropDownOption, index))\n ) : (\n <div className=\"px-3 py-4 text-center text-[var(--color-gray-700)] text-sm\">\n {searchResultEmptyMessage}\n </div>\n )\n )}\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 === 'ArrowDown' || e.key === 'ArrowUp' || e.key === 'Home' || e.key === 'End') {\n // Stop arrow keys from reaching Popover's handleArrowKeyNavigation\n // which would move focus out of the CTA buttons back into options\n e.stopPropagation();\n return;\n }\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 onKeyDownCapture: (e: React.KeyboardEvent<HTMLElement>) => {\n // Handle Escape/Tab BEFORE dismiss — React unmounts the popup after\n // dismiss's setState, so bubble-phase handlers never fire.\n if ((e.key === 'Escape' || e.key === 'Tab') && isDropDownOpen) {\n e.stopPropagation(); // prevent Popover wrapper + parent sidebar from seeing Escape\n popoverRef.current?.focusTrigger();\n }\n comboboxContainerProps.onKeyDownCapture?.(e);\n },\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: (e: React.KeyboardEvent<HTMLElement>) => {\n if (e.key === 'Escape' && isDropDownOpen) {\n e.stopPropagation();\n popoverRef.current?.focusTrigger();\n }\n multiSelectContainerProps.onKeyDownCapture?.(e);\n }\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 && !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 const ref = isMultiSelect ? multiSelectListboxProps.ref : listboxProps.ref;\n requestAnimationFrame(() => requestAnimationFrame(() => 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","announce","useLiveAnnouncer","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","assertiveness","batchId","delay","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","onKeyDownCapture","onFocus","map","handleMultiSelectDropdownOptionClick","isSelected","newSelectedDropDownValues","handleApplySelectedDropDownValues","togglePopover","onApply","isSearchInput","some","v","stopPropagation","multiSelectDropdownOptionJSX","optionId","role","Checkbox","ariaHidden","checked","renderMultiSelectDropdownContents","shiftKey","ref","Button","size","renderDropdownSelect","borderColor","errorBorderColor","dropDownSelectClass","dropDownSelectAutomationId","rotation","getDropdownAriaLabel","onPointerMove","onPointerDown","onPointerUp","onFocusCapture","onBlurCapture","Popover","isPopoverOpen","renderPopoverContents","contentWidth","popoverContentStyleProperty","renderPopoverSrcElement","renderSrcElement","onPopoverToggle","selectedIndex","findIndex","dropDownSrcAutomationId","popoverContentAutomationId","dropDownContentAutomationId","Boolean","join","sourceRole"],"mappings":"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"}
package/dist/index28.js CHANGED
@@ -1,4 +1,4 @@
1
- import i, { useMemo as D, useRef as j, useEffect as m } from "react";
1
+ import i, { useMemo as K, useRef as j, useEffect as m } from "react";
2
2
  import { Icon as M } from "./index6.js";
3
3
  import { getA11yNameAttributes as $ } from "./index81.js";
4
4
  import { useFocusTrap as k } from "./index72.js";
@@ -7,42 +7,42 @@ import { useFocusSentinel as T } from "./index216.js";
7
7
  /* empty css */
8
8
  function u() {
9
9
  return u = Object.assign ? Object.assign.bind() : function(s) {
10
- for (var o = 1; o < arguments.length; o++) {
11
- var n = arguments[o];
12
- for (var r in n) ({}).hasOwnProperty.call(n, r) && (s[r] = n[r]);
10
+ for (var n = 1; n < arguments.length; n++) {
11
+ var o = arguments[n];
12
+ for (var r in o) ({}).hasOwnProperty.call(o, r) && (s[r] = o[r]);
13
13
  }
14
14
  return s;
15
15
  }, u.apply(null, arguments);
16
16
  }
17
- const V = (s) => {
17
+ const W = (s) => {
18
18
  const {
19
- content: o,
20
- className: n = "",
19
+ content: n,
20
+ className: o = "",
21
21
  alignment: r,
22
- noShadow: R,
22
+ noShadow: E,
23
23
  position: f = "fixed",
24
24
  isOpen: e,
25
- displayCloseSidebar: C,
26
- onClose: d,
25
+ displayCloseSidebar: R,
26
+ onClose: l,
27
27
  onSidebarUnmount: b,
28
- onPathChange: p,
29
- style: c,
30
- automationId: E,
28
+ onPathChange: y,
29
+ style: d,
30
+ automationId: C,
31
31
  id: N,
32
- currentPath: y = "",
33
- closeSidebarIcon: O = "close",
34
- closeAriaLabel: P = "Close sidebar",
35
- animateSidebar: x = !0,
36
- a11yRole: F,
32
+ currentPath: p = "",
33
+ closeSidebarIcon: D = "close",
34
+ closeAriaLabel: O = "Close sidebar",
35
+ animateSidebar: P = !0,
36
+ a11yRole: x,
37
37
  ariaLabel: g,
38
38
  ariaLabelledBy: v,
39
39
  ariaDescribedBy: h,
40
- returnFocusRef: S
41
- } = s, w = F ?? "complementary", t = w === "dialog", I = D(() => $({
40
+ returnFocusRef: w
41
+ } = s, S = x ?? "complementary", t = S === "dialog", F = K(() => $({
42
42
  ariaLabel: g,
43
43
  ariaLabelledBy: v,
44
44
  ariaDescribedBy: h
45
- }), [g, v, h]), l = j(null);
45
+ }), [g, v, h]), c = j(null);
46
46
  m(() => () => {
47
47
  b && b();
48
48
  }, []), m(() => {
@@ -51,17 +51,20 @@ const V = (s) => {
51
51
  document.body.style.overflow = "";
52
52
  };
53
53
  }, [e, t]), m(() => {
54
- p && p(y);
55
- }, [y]), z({
56
- containerRef: l,
57
- onDismiss: d,
54
+ y && y(p);
55
+ }, [p]);
56
+ const {
57
+ onKeyDown: I
58
+ } = z({
59
+ onDismiss: l,
58
60
  enabled: e
59
- }), k({
60
- enabled: !!(t && e && d),
61
- containerRef: l,
61
+ });
62
+ k({
63
+ enabled: !!(t && e && l),
64
+ containerRef: c,
62
65
  restoreFocus: !0,
63
66
  initialFocus: "first",
64
- returnFocusRef: S
67
+ returnFocusRef: w
65
68
  });
66
69
  const {
67
70
  startSentinelProps: _,
@@ -69,42 +72,43 @@ const V = (s) => {
69
72
  } = T({
70
73
  isOpen: e,
71
74
  isModal: t,
72
- containerRef: l,
73
- returnFocusRef: S
75
+ containerRef: c,
76
+ returnFocusRef: w
74
77
  }), L = () => {
75
78
  let a = "se-design-sidebar-overlay-container z-[1000]";
76
- return a += n.length > 0 ? ` ${n}` : "", a += r === "left" ? " left-aligned" : " right-aligned", a += R ? " no-shadow" : "", a += f.length > 0 ? ` ${f}` : "", a += e ? " open-sidebar" : " closed-sidebar", x || (a += e ? "" : " hidden"), a;
79
+ return a += o.length > 0 ? ` ${o}` : "", a += r === "left" ? " left-aligned" : " right-aligned", a += E ? " no-shadow" : "", a += f.length > 0 ? ` ${f}` : "", a += e ? " open-sidebar" : " closed-sidebar", P || (a += e ? "" : " hidden"), a;
77
80
  }, B = () => ({
78
- ...c,
79
- ...e && c?.width ? {
80
- width: c?.width
81
+ ...d,
82
+ ...e && d?.width ? {
83
+ width: d?.width
81
84
  } : {
82
85
  width: "0px"
83
86
  }
84
87
  });
85
88
  return /* @__PURE__ */ i.createElement("div", u({
86
- ref: l,
89
+ ref: c,
87
90
  id: N,
88
91
  className: L(),
89
92
  style: B(),
90
- "data-automation-id": E,
93
+ "data-automation-id": C,
91
94
  tabIndex: -1,
92
- role: w,
95
+ role: S,
93
96
  "aria-modal": t ? "true" : void 0,
94
97
  "aria-hidden": e ? void 0 : "true"
95
- }, I, {
98
+ }, F, {
99
+ onKeyDown: I,
96
100
  inert: e ? void 0 : ""
97
101
  }), /* @__PURE__ */ i.createElement("div", {
98
102
  className: "overlay-content"
99
- }, !t && /* @__PURE__ */ i.createElement("div", _), C && /* @__PURE__ */ i.createElement(M, {
100
- name: O,
101
- onClick: d,
103
+ }, !t && /* @__PURE__ */ i.createElement("div", _), R && /* @__PURE__ */ i.createElement(M, {
104
+ name: D,
105
+ onClick: l,
102
106
  className: "overlay-close",
103
- ariaLabel: P,
107
+ ariaLabel: O,
104
108
  automationId: "sidebar_overlay_close"
105
- }), o, !t && /* @__PURE__ */ i.createElement("div", A)));
109
+ }), n, !t && /* @__PURE__ */ i.createElement("div", A)));
106
110
  };
107
111
  export {
108
- V as SidebarOverlay
112
+ W as SidebarOverlay
109
113
  };
110
114
  //# sourceMappingURL=index28.js.map
@@ -1 +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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"}
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 const { onKeyDown: onEscapeKeyDown } = useDismissOnEscape({\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 onKeyDown={onEscapeKeyDown}\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","onKeyDown","onEscapeKeyDown","useDismissOnEscape","onDismiss","enabled","useFocusTrap","Boolean","containerRef","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/index31.js CHANGED
@@ -1,73 +1,80 @@
1
- import n from "react";
2
- import { Icon as f } from "./index6.js";
3
- const c = {
1
+ import s, { useEffect as N } from "react";
2
+ import { Icon as g } from "./index6.js";
3
+ import { announce as k } from "./index75.js";
4
+ const m = {
4
5
  pageNavigation: "px-[6px] py-[6px] flex items-center justify-center",
5
6
  pageItem: "px-[7px] py-[1px] min-w-[24px] text-sm flex items-center justify-center rounded border hover:cursor-pointer appearance-none focus-outline"
6
- }, k = ({
7
+ }, C = ({
7
8
  currentPage: a,
8
9
  itemsPerPage: l,
9
10
  totalItems: i,
10
11
  onPageChange: p,
11
- mobileView: m = !1,
12
- ariaLabel: x = "Pagination Controls"
12
+ mobileView: u = !1,
13
+ ariaLabel: b = "Pagination Controls"
13
14
  }) => {
14
- const o = Math.ceil(i / l), d = 1, b = o, g = (a - 1) * l + 1, u = Math.min(a * l, i), v = u < i, y = a > 1, E = () => {
15
- const e = [], t = (s) => {
16
- const h = a === s;
17
- return /* @__PURE__ */ n.createElement("li", {
18
- key: s
19
- }, /* @__PURE__ */ n.createElement("button", {
15
+ const o = Math.ceil(i / l), d = 1, v = o, h = (a - 1) * l + 1, c = Math.min(a * l, i), y = c < i, $ = a > 1, f = `Showing ${h}-${c} of ${i}`;
16
+ N(() => {
17
+ k(f, {
18
+ batchId: "pagination-status"
19
+ });
20
+ }, [f]);
21
+ const E = () => {
22
+ const e = [], t = (n) => {
23
+ const x = a === n;
24
+ return /* @__PURE__ */ s.createElement("li", {
25
+ key: n
26
+ }, /* @__PURE__ */ s.createElement("button", {
20
27
  type: "button",
21
- onClick: () => p(s),
22
- className: `${c.pageItem} ${h ? "bg-[var(--color-gray-100)] border-[var(--color-gray-300)]" : "border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]"}`,
23
- "aria-label": `Page ${s}`,
24
- "aria-current": h ? "page" : void 0,
25
- "data-automation-id": `page-number-${s}`
26
- }, s));
27
- }, r = (s) => /* @__PURE__ */ n.createElement("li", {
28
- key: s,
28
+ onClick: () => p(n),
29
+ className: `${m.pageItem} ${x ? "bg-[var(--color-gray-100)] border-[var(--color-gray-300)]" : "border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]"}`,
30
+ "aria-label": `Page ${n}`,
31
+ "aria-current": x ? "page" : void 0,
32
+ "data-automation-id": `page-number-${n}`
33
+ }, n));
34
+ }, r = (n) => /* @__PURE__ */ s.createElement("li", {
35
+ key: n,
29
36
  "aria-hidden": "true"
30
- }, /* @__PURE__ */ n.createElement("span", {
37
+ }, /* @__PURE__ */ s.createElement("span", {
31
38
  className: "w-5 h-5 text-sm rounded border border-[var(--color-gray-200)] flex items-end justify-center"
32
39
  }, "..."));
33
- if (m)
40
+ if (u)
34
41
  return e.push(t(a)), e;
35
42
  if (a <= 3) {
36
- for (let s = 1; s <= Math.min(3, o); s++)
37
- e.push(t(s));
43
+ for (let n = 1; n <= Math.min(3, o); n++)
44
+ e.push(t(n));
38
45
  o > 3 && (e.push(r("ellipsis-end")), e.push(t(o)));
39
- } else a >= o - 2 ? (e.push(t(d)), e.push(r("ellipsis-start")), e.push(t(o - 2)), e.push(t(o - 1)), e.push(t(o))) : (e.push(t(d)), e.push(r("ellipsis-start")), e.push(t(a - 1)), e.push(t(a)), e.push(t(a + 1)), e.push(r("ellipsis-end")), e.push(t(b)));
46
+ } else a >= o - 2 ? (e.push(t(d)), e.push(r("ellipsis-start")), e.push(t(o - 2)), e.push(t(o - 1)), e.push(t(o))) : (e.push(t(d)), e.push(r("ellipsis-start")), e.push(t(a - 1)), e.push(t(a)), e.push(t(a + 1)), e.push(r("ellipsis-end")), e.push(t(v)));
40
47
  return e;
41
48
  };
42
- return /* @__PURE__ */ n.createElement("nav", {
43
- "aria-label": x,
49
+ return /* @__PURE__ */ s.createElement("nav", {
50
+ "aria-label": b,
44
51
  "data-automation-id": "pagination-container",
45
52
  className: "flex items-center gap-1 font-normal"
46
- }, /* @__PURE__ */ n.createElement("span", {
53
+ }, /* @__PURE__ */ s.createElement("span", {
47
54
  className: "text-sm text-[var(--color-gray-700)] mr-1",
48
55
  "data-automation-id": "pagination-items-info"
49
- }, `${m ? "" : "Showing "}${g}-${u} of ${i}`), /* @__PURE__ */ n.createElement(f, {
56
+ }, `${u ? "" : "Showing "}${h}-${c} of ${i}`), /* @__PURE__ */ s.createElement(g, {
50
57
  name: "next",
51
58
  size: 12,
52
59
  ariaLabel: "Previous page",
53
60
  rotation: "180",
54
- disabled: !y,
61
+ disabled: !$,
55
62
  onClick: () => p(a - 1),
56
- className: `stroke-[var(--color-gray-600)] ${c.pageNavigation}`,
63
+ className: `stroke-[var(--color-gray-600)] ${m.pageNavigation}`,
57
64
  automationId: "pagination-previous-button"
58
- }), /* @__PURE__ */ n.createElement("ul", {
65
+ }), /* @__PURE__ */ s.createElement("ul", {
59
66
  className: "flex items-center gap-1"
60
- }, E()), /* @__PURE__ */ n.createElement(f, {
67
+ }, E()), /* @__PURE__ */ s.createElement(g, {
61
68
  name: "next",
62
69
  size: 12,
63
70
  ariaLabel: "Next page",
64
- disabled: !v,
71
+ disabled: !y,
65
72
  onClick: () => p(a + 1),
66
- className: c.pageNavigation,
73
+ className: m.pageNavigation,
67
74
  automationId: "pagination-next-button"
68
75
  }));
69
76
  };
70
77
  export {
71
- k as Pagination
78
+ C as Pagination
72
79
  };
73
80
  //# sourceMappingURL=index31.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index31.js","sources":["../src/components/Pagination/index.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Icon } from 'components/Icon';\n\ninterface PaginationProps {\n currentPage: number;\n itemsPerPage: number;\n totalItems: number;\n onPageChange: (page: number) => void;\n mobileView?: boolean;\n ariaLabel?: string;\n}\n\nconst paginationClassNames = {\n pageNavigation: \"px-[6px] py-[6px] flex items-center justify-center\",\n pageItem: \"px-[7px] py-[1px] min-w-[24px] text-sm flex items-center justify-center rounded border hover:cursor-pointer appearance-none focus-outline\"\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({ currentPage, itemsPerPage, totalItems, onPageChange, mobileView = false, ariaLabel = 'Pagination Controls' }) => {\n const totalPages = Math.ceil(totalItems / itemsPerPage);\n const firstPage = 1;\n const lastPage = totalPages;\n const startItem = (currentPage - 1) * itemsPerPage + 1;\n const endItem = Math.min(currentPage * itemsPerPage, totalItems);\n const hasNextPage = endItem < totalItems;\n const hasPrevPage = currentPage > 1;\n\n const renderPageNumbers = () => {\n const pages: React.ReactNode[] = [];\n\n const renderPageNumber = (pageNum: number) => {\n const isActive = currentPage === pageNum;\n return (\n <li key={pageNum}>\n <button\n type=\"button\"\n onClick={() => onPageChange(pageNum)}\n className={`${paginationClassNames.pageItem} ${isActive ? 'bg-[var(--color-gray-100)] border-[var(--color-gray-300)]' : 'border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]'}`}\n aria-label={`Page ${pageNum}`}\n aria-current={isActive ? 'page' : undefined}\n data-automation-id={`page-number-${pageNum}`}\n >\n {pageNum}\n </button>\n </li>\n );\n };\n\n const renderEllipsis = (key: string) => {\n return (\n <li key={key} aria-hidden=\"true\">\n <span className=\"w-5 h-5 text-sm rounded border border-[var(--color-gray-200)] flex items-end justify-center\">\n ...\n </span>\n </li>\n );\n };\n\n if (mobileView) {\n pages.push(renderPageNumber(currentPage));\n return pages;\n }\n if (currentPage <= 3) {\n for (let i = 1; i <= Math.min(3, totalPages); i++) {\n pages.push(renderPageNumber(i));\n }\n\n if (totalPages > 3) {\n pages.push(renderEllipsis(\"ellipsis-end\"));\n pages.push(renderPageNumber(totalPages));\n }\n } else if (currentPage >= totalPages - 2) {\n pages.push(renderPageNumber(firstPage));\n pages.push(renderEllipsis(\"ellipsis-start\"));\n pages.push(renderPageNumber(totalPages - 2));\n pages.push(renderPageNumber(totalPages - 1));\n pages.push(renderPageNumber(totalPages));\n } else {\n pages.push(renderPageNumber(firstPage));\n pages.push(renderEllipsis(\"ellipsis-start\"));\n pages.push(renderPageNumber(currentPage - 1));\n pages.push(renderPageNumber(currentPage));\n pages.push(renderPageNumber(currentPage + 1));\n pages.push(renderEllipsis(\"ellipsis-end\"));\n pages.push(renderPageNumber(lastPage));\n }\n\n return pages;\n };\n\n return (\n <nav aria-label={ariaLabel} data-automation-id=\"pagination-container\" className=\"flex items-center gap-1 font-normal\">\n <span\n className=\"text-sm text-[var(--color-gray-700)] mr-1\"\n data-automation-id=\"pagination-items-info\"\n >\n {`${mobileView ? \"\" : \"Showing \"}${startItem}-${endItem} of ${totalItems}`}\n </span>\n <Icon\n name=\"next\"\n size={12}\n ariaLabel=\"Previous page\"\n rotation=\"180\"\n disabled={!hasPrevPage}\n onClick={() => onPageChange(currentPage - 1)}\n className={`stroke-[var(--color-gray-600)] ${paginationClassNames.pageNavigation}`}\n automationId=\"pagination-previous-button\"\n />\n <ul className=\"flex items-center gap-1\">\n {renderPageNumbers()}\n </ul>\n <Icon\n name=\"next\"\n size={12}\n ariaLabel=\"Next page\"\n disabled={!hasNextPage}\n onClick={() => onPageChange(currentPage + 1)}\n className={paginationClassNames.pageNavigation}\n automationId=\"pagination-next-button\"\n />\n </nav>\n );\n};\n"],"names":["React__default","Icon","paginationClassNames","pageNavigation","pageItem","Pagination","currentPage","itemsPerPage","totalItems","onPageChange","mobileView","ariaLabel","totalPages","Math","ceil","firstPage","lastPage","startItem","endItem","min","hasNextPage","hasPrevPage","renderPageNumbers","pages","renderPageNumber","pageNum","isActive","React","createElement","key","type","onClick","className","undefined","renderEllipsis","push","i","name","size","rotation","disabled","automationId"],"mappings":"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"}
1
+ {"version":3,"file":"index31.js","sources":["../src/components/Pagination/index.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n\nimport { Icon } from 'components/Icon';\nimport { announce } from 'src/utils/a11y/liveAnnouncer/LiveAnnouncer';\n\ninterface PaginationProps {\n currentPage: number;\n itemsPerPage: number;\n totalItems: number;\n onPageChange: (page: number) => void;\n mobileView?: boolean;\n ariaLabel?: string;\n}\n\nconst paginationClassNames = {\n pageNavigation: \"px-[6px] py-[6px] flex items-center justify-center\",\n pageItem: \"px-[7px] py-[1px] min-w-[24px] text-sm flex items-center justify-center rounded border hover:cursor-pointer appearance-none focus-outline\"\n}\n\nexport const Pagination: React.FC<PaginationProps> = ({ currentPage, itemsPerPage, totalItems, onPageChange, mobileView = false, ariaLabel = 'Pagination Controls' }) => {\n const totalPages = Math.ceil(totalItems / itemsPerPage);\n const firstPage = 1;\n const lastPage = totalPages;\n const startItem = (currentPage - 1) * itemsPerPage + 1;\n const endItem = Math.min(currentPage * itemsPerPage, totalItems);\n const hasNextPage = endItem < totalItems;\n const hasPrevPage = currentPage > 1;\n\n const showingText = `Showing ${startItem}-${endItem} of ${totalItems}`;\n\n useEffect(() => {\n announce(showingText, { batchId: 'pagination-status' });\n }, [showingText]);\n\n const renderPageNumbers = () => {\n const pages: React.ReactNode[] = [];\n\n const renderPageNumber = (pageNum: number) => {\n const isActive = currentPage === pageNum;\n return (\n <li key={pageNum}>\n <button\n type=\"button\"\n onClick={() => onPageChange(pageNum)}\n className={`${paginationClassNames.pageItem} ${isActive ? 'bg-[var(--color-gray-100)] border-[var(--color-gray-300)]' : 'border-[var(--color-gray-200)] hover:bg-[var(--color-gray-50)]'}`}\n aria-label={`Page ${pageNum}`}\n aria-current={isActive ? 'page' : undefined}\n data-automation-id={`page-number-${pageNum}`}\n >\n {pageNum}\n </button>\n </li>\n );\n };\n\n const renderEllipsis = (key: string) => {\n return (\n <li key={key} aria-hidden=\"true\">\n <span className=\"w-5 h-5 text-sm rounded border border-[var(--color-gray-200)] flex items-end justify-center\">\n ...\n </span>\n </li>\n );\n };\n\n if (mobileView) {\n pages.push(renderPageNumber(currentPage));\n return pages;\n }\n if (currentPage <= 3) {\n for (let i = 1; i <= Math.min(3, totalPages); i++) {\n pages.push(renderPageNumber(i));\n }\n\n if (totalPages > 3) {\n pages.push(renderEllipsis(\"ellipsis-end\"));\n pages.push(renderPageNumber(totalPages));\n }\n } else if (currentPage >= totalPages - 2) {\n pages.push(renderPageNumber(firstPage));\n pages.push(renderEllipsis(\"ellipsis-start\"));\n pages.push(renderPageNumber(totalPages - 2));\n pages.push(renderPageNumber(totalPages - 1));\n pages.push(renderPageNumber(totalPages));\n } else {\n pages.push(renderPageNumber(firstPage));\n pages.push(renderEllipsis(\"ellipsis-start\"));\n pages.push(renderPageNumber(currentPage - 1));\n pages.push(renderPageNumber(currentPage));\n pages.push(renderPageNumber(currentPage + 1));\n pages.push(renderEllipsis(\"ellipsis-end\"));\n pages.push(renderPageNumber(lastPage));\n }\n\n return pages;\n };\n\n return (\n <nav aria-label={ariaLabel} data-automation-id=\"pagination-container\" className=\"flex items-center gap-1 font-normal\">\n <span\n className=\"text-sm text-[var(--color-gray-700)] mr-1\"\n data-automation-id=\"pagination-items-info\"\n >\n {`${mobileView ? \"\" : \"Showing \"}${startItem}-${endItem} of ${totalItems}`}\n </span>\n <Icon\n name=\"next\"\n size={12}\n ariaLabel=\"Previous page\"\n rotation=\"180\"\n disabled={!hasPrevPage}\n onClick={() => onPageChange(currentPage - 1)}\n className={`stroke-[var(--color-gray-600)] ${paginationClassNames.pageNavigation}`}\n automationId=\"pagination-previous-button\"\n />\n <ul className=\"flex items-center gap-1\">\n {renderPageNumbers()}\n </ul>\n <Icon\n name=\"next\"\n size={12}\n ariaLabel=\"Next page\"\n disabled={!hasNextPage}\n onClick={() => onPageChange(currentPage + 1)}\n className={paginationClassNames.pageNavigation}\n automationId=\"pagination-next-button\"\n />\n </nav>\n );\n};\n"],"names":["React__default","useEffect","Icon","announce","paginationClassNames","pageNavigation","pageItem","Pagination","currentPage","itemsPerPage","totalItems","onPageChange","mobileView","ariaLabel","totalPages","Math","ceil","firstPage","lastPage","startItem","endItem","min","hasNextPage","hasPrevPage","showingText","batchId","renderPageNumbers","pages","renderPageNumber","pageNum","isActive","React","createElement","key","type","onClick","className","undefined","renderEllipsis","push","i","name","size","rotation","disabled","automationId"],"mappings":"AAcA,OAAAA,KAAA,aAAAC,SAAA;AAAA,SAAA,QAAAC,SAAA;AAAA,SAAA,YAAAC,SAAA;AAAA,MAAMC,IAAuB;AAAA,EAC3BC,gBAAgB;AAAA,EAChBC,UAAU;AACZ,GAEaC,IAAwCA,CAAC;AAAA,EAAEC,aAAAA;AAAAA,EAAaC,cAAAA;AAAAA,EAAcC,YAAAA;AAAAA,EAAYC,cAAAA;AAAAA,EAAcC,YAAAA,IAAa;AAAA,EAAOC,WAAAA,IAAY;AAAsB,MAAM;AACvK,QAAMC,IAAaC,KAAKC,KAAKN,IAAaD,CAAY,GAChDQ,IAAY,GACZC,IAAWJ,GACXK,KAAaX,IAAc,KAAKC,IAAe,GAC/CW,IAAUL,KAAKM,IAAIb,IAAcC,GAAcC,CAAU,GACzDY,IAAcF,IAAUV,GACxBa,IAAcf,IAAc,GAE5BgB,IAAc,WAAWL,CAAS,IAAIC,CAAO,OAAOV,CAAU;AAEpET,EAAAA,EAAU,MAAM;AACdE,IAAAA,EAASqB,GAAa;AAAA,MAAEC,SAAS;AAAA,IAAA,CAAqB;AAAA,EACxD,GAAG,CAACD,CAAW,CAAC;AAEhB,QAAME,IAAoBA,MAAM;AAC9B,UAAMC,IAA2B,CAAA,GAE3BC,IAAmBA,CAACC,MAAoB;AAC5C,YAAMC,IAAWtB,MAAgBqB;AACjC,aACEE,gBAAAA,EAAAC,cAAA,MAAA;AAAA,QAAIC,KAAKJ;AAAAA,MAAAA,GACPE,gBAAAA,EAAAC,cAAA,UAAA;AAAA,QACEE,MAAK;AAAA,QACLC,SAASA,MAAMxB,EAAakB,CAAO;AAAA,QACnCO,WAAW,GAAGhC,EAAqBE,QAAQ,IAAIwB,IAAW,8DAA8D,gEAAgE;AAAA,QACxL,cAAY,QAAQD,CAAO;AAAA,QAC3B,gBAAcC,IAAW,SAASO;AAAAA,QAClC,sBAAoB,eAAeR,CAAO;AAAA,MAAA,GAEzCA,CACK,CACN;AAAA,IAER,GAEMS,IAAiBA,CAACL,MAEpBF,gBAAAA,EAAAC,cAAA,MAAA;AAAA,MAAIC,KAAAA;AAAAA,MAAU,eAAY;AAAA,IAAA,GACxBF,gBAAAA,EAAAC,cAAA,QAAA;AAAA,MAAMI,WAAU;AAAA,IAAA,GAA8F,KAExG,CACJ;AAIR,QAAIxB;AACFe,aAAAA,EAAMY,KAAKX,EAAiBpB,CAAW,CAAC,GACjCmB;AAET,QAAInB,KAAe,GAAG;AACpB,eAASgC,IAAI,GAAGA,KAAKzB,KAAKM,IAAI,GAAGP,CAAU,GAAG0B;AAC5Cb,QAAAA,EAAMY,KAAKX,EAAiBY,CAAC,CAAC;AAGhC,MAAI1B,IAAa,MACfa,EAAMY,KAAKD,EAAe,cAAc,CAAC,GACzCX,EAAMY,KAAKX,EAAiBd,CAAU,CAAC;AAAA,IAE3C,MAAA,CAAWN,KAAeM,IAAa,KACrCa,EAAMY,KAAKX,EAAiBX,CAAS,CAAC,GACtCU,EAAMY,KAAKD,EAAe,gBAAgB,CAAC,GAC3CX,EAAMY,KAAKX,EAAiBd,IAAa,CAAC,CAAC,GAC3Ca,EAAMY,KAAKX,EAAiBd,IAAa,CAAC,CAAC,GAC3Ca,EAAMY,KAAKX,EAAiBd,CAAU,CAAC,MAEvCa,EAAMY,KAAKX,EAAiBX,CAAS,CAAC,GACtCU,EAAMY,KAAKD,EAAe,gBAAgB,CAAC,GAC3CX,EAAMY,KAAKX,EAAiBpB,IAAc,CAAC,CAAC,GAC5CmB,EAAMY,KAAKX,EAAiBpB,CAAW,CAAC,GACxCmB,EAAMY,KAAKX,EAAiBpB,IAAc,CAAC,CAAC,GAC5CmB,EAAMY,KAAKD,EAAe,cAAc,CAAC,GACzCX,EAAMY,KAAKX,EAAiBV,CAAQ,CAAC;AAGvC,WAAOS;AAAAA,EACT;AAEA,SACEI,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAK,cAAYnB;AAAAA,IAAW,sBAAmB;AAAA,IAAuBuB,WAAU;AAAA,EAAA,GAC9EL,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IACEI,WAAU;AAAA,IACV,sBAAmB;AAAA,EAAA,GAElB,GAAGxB,IAAa,KAAK,UAAU,GAAGO,CAAS,IAAIC,CAAO,OAAOV,CAAU,EACpE,GACNqB,gBAAAA,EAAAC,cAAC9B,GAAI;AAAA,IACHuC,MAAK;AAAA,IACLC,MAAM;AAAA,IACN7B,WAAU;AAAA,IACV8B,UAAS;AAAA,IACTC,UAAU,CAACrB;AAAAA,IACXY,SAASA,MAAMxB,EAAaH,IAAc,CAAC;AAAA,IAC3C4B,WAAW,kCAAkChC,EAAqBC,cAAc;AAAA,IAChFwC,cAAa;AAAA,EAAA,CACd,GACDd,gBAAAA,EAAAC,cAAA,MAAA;AAAA,IAAII,WAAU;AAAA,EAAA,GACXV,EAAAA,CACC,GACJK,gBAAAA,EAAAC,cAAC9B,GAAI;AAAA,IACHuC,MAAK;AAAA,IACLC,MAAM;AAAA,IACN7B,WAAU;AAAA,IACV+B,UAAU,CAACtB;AAAAA,IACXa,SAASA,MAAMxB,EAAaH,IAAc,CAAC;AAAA,IAC3C4B,WAAWhC,EAAqBC;AAAAA,IAChCwC,cAAa;AAAA,EAAA,CACd,CACE;AAET;"}