@solibo/solibo-ui 1.0.29 → 1.1.1

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.
Files changed (138) hide show
  1. package/dist/assets/index15.css +1 -1
  2. package/dist/assets/index18.css +1 -1
  3. package/dist/assets/index47.css +1 -1
  4. package/dist/components/aside/index.cjs +1 -1
  5. package/dist/components/aside/index.cjs.map +1 -1
  6. package/dist/components/aside/index.js +1 -1
  7. package/dist/components/aside/index.js.map +1 -1
  8. package/dist/components/avatar/index.cjs +1 -1
  9. package/dist/components/avatar/index.cjs.map +1 -1
  10. package/dist/components/avatar/index.js +1 -1
  11. package/dist/components/avatar/index.js.map +1 -1
  12. package/dist/components/badge/index.cjs +1 -1
  13. package/dist/components/badge/index.cjs.map +1 -1
  14. package/dist/components/badge/index.js +9 -9
  15. package/dist/components/badge/index.js.map +1 -1
  16. package/dist/components/button/index.cjs +1 -1
  17. package/dist/components/button/index.cjs.map +1 -1
  18. package/dist/components/button/index.js +7 -7
  19. package/dist/components/button/index.js.map +1 -1
  20. package/dist/components/checkbox/index.cjs +1 -1
  21. package/dist/components/checkbox/index.cjs.map +1 -1
  22. package/dist/components/checkbox/index.js +2 -2
  23. package/dist/components/checkbox/index.js.map +1 -1
  24. package/dist/components/chip/index.cjs +1 -1
  25. package/dist/components/chip/index.cjs.map +1 -1
  26. package/dist/components/chip/index.js +4 -4
  27. package/dist/components/chip/index.js.map +1 -1
  28. package/dist/components/collapsible/index.cjs +1 -1
  29. package/dist/components/collapsible/index.cjs.map +1 -1
  30. package/dist/components/collapsible/index.js +5 -5
  31. package/dist/components/collapsible/index.js.map +1 -1
  32. package/dist/components/controls/index.cjs +1 -1
  33. package/dist/components/controls/index.js +1 -1
  34. package/dist/components/croppable/index.cjs +1 -1
  35. package/dist/components/croppable/index.cjs.map +1 -1
  36. package/dist/components/croppable/index.js +21 -21
  37. package/dist/components/croppable/index.js.map +1 -1
  38. package/dist/components/dialog/index.cjs +1 -1
  39. package/dist/components/dialog/index.cjs.map +1 -1
  40. package/dist/components/dialog/index.js +13 -13
  41. package/dist/components/dialog/index.js.map +1 -1
  42. package/dist/components/dropdown/index.cjs +1 -1
  43. package/dist/components/dropdown/index.cjs.map +1 -1
  44. package/dist/components/dropdown/index.js +43 -43
  45. package/dist/components/dropdown/index.js.map +1 -1
  46. package/dist/components/dropzone/index.cjs +1 -1
  47. package/dist/components/dropzone/index.cjs.map +1 -1
  48. package/dist/components/dropzone/index.js +16 -16
  49. package/dist/components/dropzone/index.js.map +1 -1
  50. package/dist/components/editor/index.cjs +2 -2
  51. package/dist/components/editor/index.cjs.map +1 -1
  52. package/dist/components/editor/index.js +473 -473
  53. package/dist/components/editor/index.js.map +1 -1
  54. package/dist/components/file/index.cjs +1 -1
  55. package/dist/components/file/index.cjs.map +1 -1
  56. package/dist/components/file/index.js +34 -34
  57. package/dist/components/file/index.js.map +1 -1
  58. package/dist/components/header/index.cjs +1 -1
  59. package/dist/components/header/index.js +26 -26
  60. package/dist/components/icon/index.cjs +1 -1
  61. package/dist/components/icon/index.cjs.map +1 -1
  62. package/dist/components/icon/index.js +16 -16
  63. package/dist/components/icon/index.js.map +1 -1
  64. package/dist/components/input/index.cjs +1 -1
  65. package/dist/components/input/index.js +2 -2
  66. package/dist/components/list/index.cjs +1 -1
  67. package/dist/components/list/index.js +13 -13
  68. package/dist/components/menu/index.cjs +1 -1
  69. package/dist/components/menu/index.cjs.map +1 -1
  70. package/dist/components/menu/index.js +18 -18
  71. package/dist/components/menu/index.js.map +1 -1
  72. package/dist/components/message/index.cjs +1 -1
  73. package/dist/components/message/index.cjs.map +1 -1
  74. package/dist/components/message/index.js +20 -20
  75. package/dist/components/message/index.js.map +1 -1
  76. package/dist/components/messages/index.cjs +1 -1
  77. package/dist/components/messages/index.cjs.map +1 -1
  78. package/dist/components/messages/index.js +70 -39
  79. package/dist/components/messages/index.js.map +1 -1
  80. package/dist/components/nav/index.cjs +1 -1
  81. package/dist/components/nav/index.cjs.map +1 -1
  82. package/dist/components/nav/index.js +2 -2
  83. package/dist/components/nav/index.js.map +1 -1
  84. package/dist/components/portal/index.cjs +1 -1
  85. package/dist/components/portal/index.cjs.map +1 -1
  86. package/dist/components/portal/index.js +7 -7
  87. package/dist/components/portal/index.js.map +1 -1
  88. package/dist/components/search/index.cjs +1 -1
  89. package/dist/components/search/index.cjs.map +1 -1
  90. package/dist/components/search/index.js +3 -3
  91. package/dist/components/search/index.js.map +1 -1
  92. package/dist/components/select/index.cjs +1 -1
  93. package/dist/components/select/index.js +2 -2
  94. package/dist/components/table/index.cjs +1 -1
  95. package/dist/components/table/index.cjs.map +1 -1
  96. package/dist/components/table/index.js +11 -11
  97. package/dist/components/table/index.js.map +1 -1
  98. package/dist/components/toast/index.cjs +1 -1
  99. package/dist/components/toast/index.cjs.map +1 -1
  100. package/dist/components/toast/index.js +6 -6
  101. package/dist/components/toast/index.js.map +1 -1
  102. package/dist/components/tooltip/index.cjs +1 -1
  103. package/dist/components/tooltip/index.cjs.map +1 -1
  104. package/dist/components/tooltip/index.js +6 -6
  105. package/dist/components/tooltip/index.js.map +1 -1
  106. package/dist/icons-B_uIKmIp.cjs +2 -0
  107. package/dist/icons-B_uIKmIp.cjs.map +1 -0
  108. package/dist/icons-Dm2kyF0g.js +211 -0
  109. package/dist/icons-Dm2kyF0g.js.map +1 -0
  110. package/dist/{index-BAxpgMzb.js → index-DycOZMJl.js} +7 -7
  111. package/dist/index-DycOZMJl.js.map +1 -0
  112. package/dist/index-Y3jsTJhs.cjs +2 -0
  113. package/dist/index-Y3jsTJhs.cjs.map +1 -0
  114. package/dist/{index-DMGGDV9J.js → index-m3slpD7c.js} +3 -3
  115. package/dist/index-m3slpD7c.js.map +1 -0
  116. package/dist/index-rXfEqyt5.cjs +2 -0
  117. package/dist/index-rXfEqyt5.cjs.map +1 -0
  118. package/dist/index.cjs +1 -1
  119. package/dist/index.d.ts +161 -129
  120. package/dist/index.js +2 -2
  121. package/dist/{menu-popover-D1ALaiV5.cjs → menu-popover-CM3v5s-5.cjs} +2 -2
  122. package/dist/menu-popover-CM3v5s-5.cjs.map +1 -0
  123. package/dist/{menu-popover-DQHDIw-8.js → menu-popover-DOkciab5.js} +19 -19
  124. package/dist/menu-popover-DOkciab5.js.map +1 -0
  125. package/dist/tokens.json +1 -1
  126. package/package.json +3 -1
  127. package/dist/icons-BkaMeh-J.js +0 -176
  128. package/dist/icons-BkaMeh-J.js.map +0 -1
  129. package/dist/icons-Lq3pr85X.cjs +0 -2
  130. package/dist/icons-Lq3pr85X.cjs.map +0 -1
  131. package/dist/index-BAxpgMzb.js.map +0 -1
  132. package/dist/index-BOiGSTKz.cjs +0 -2
  133. package/dist/index-BOiGSTKz.cjs.map +0 -1
  134. package/dist/index-BlnG4Rbh.cjs +0 -2
  135. package/dist/index-BlnG4Rbh.cjs.map +0 -1
  136. package/dist/index-DMGGDV9J.js.map +0 -1
  137. package/dist/menu-popover-D1ALaiV5.cjs.map +0 -1
  138. package/dist/menu-popover-DQHDIw-8.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"file":"index-DMGGDV9J.js","sources":["../src/utils/text.ts","../src/components/input/index.tsx"],"sourcesContent":["export function capitalizeFirstLetter(value: string): string {\n return value ? `${value[0].toLocaleUpperCase()}${value.slice(1)}` : value;\n}\n\nexport function formatInlineLabel(value: string): string {\n const label = capitalizeFirstLetter(value);\n return label && !label.endsWith(':') ? `${label}:` : label;\n}\n","import cx from 'classix';\nimport { useEffect, useState } from 'react';\n\nimport { IconName, iconSVG } from '@/components/icon/icons.ts';\nimport { composeEventHandlers } from '@/utils/compose-event-handlers';\nimport { formatInlineLabel } from '@/utils/text';\nimport { useTouched } from '@/utils/use-touched';\n\nimport styles from './styles.module.css';\n\nexport type InputProps = React.ComponentPropsWithRef<'input'> & {\n defaultCountryCode?: string;\n disabled?: boolean;\n icon?: IconName;\n label?: string;\n onClick?: React.MouseEventHandler<HTMLInputElement>;\n placeholder?: string;\n variant?: 'default' | 'inline';\n type?:\n | 'date'\n | 'datetime-local'\n | 'email'\n | 'number'\n | 'password'\n | 'radio'\n | 'search'\n | 'tel'\n | 'text';\n};\n\nexport function Input({\n className,\n defaultCountryCode = '+47',\n disabled = false,\n icon,\n label,\n onBlur: onBlurProp,\n placeholder,\n ref,\n required,\n style,\n type = 'text',\n variant = 'default',\n ...props\n}: InputProps) {\n const [countryCode, setCountryCode] = useState('');\n const [phoneNumber, setPhoneNumber] = useState('');\n const { name, onChange, pattern, value, ...restProps } = props;\n const { touched, onBlur } = useTouched(value === '');\n const inputIcon = icon && type !== 'radio' && type !== 'datetime-local' ? icon : undefined;\n const displayLabel = label && variant === 'inline' ? formatInlineLabel(label) : label;\n\n type withVars =\n | (React.CSSProperties & {\n '--icon-svg'?: string;\n })\n | undefined;\n\n const withVars: withVars = inputIcon\n ? {\n ...style,\n '--icon-svg': iconSVG(inputIcon, true),\n }\n : style;\n const handleBlur = composeEventHandlers(onBlur, onBlurProp);\n\n useEffect(() => {\n if (onChange && type === 'tel') {\n const target = {\n name,\n value: phoneNumber\n ? (countryCode || defaultCountryCode).split(' ').join('') +\n phoneNumber.split(' ').join('')\n : undefined,\n } as unknown as HTMLInputElement;\n\n onChange({ target, currentTarget: target } as React.ChangeEvent<HTMLInputElement>);\n }\n }, [countryCode, defaultCountryCode, name, onChange, phoneNumber, type]);\n\n useEffect(() => {\n if (type === 'tel' && !value) {\n setPhoneNumber('');\n setCountryCode('');\n }\n }, [type, value]);\n\n const telephoneInput = (\n <>\n <input\n disabled={disabled}\n hidden\n onChange={onChange}\n pattern={undefined}\n placeholder={placeholder}\n ref={ref}\n type={type}\n value={value}\n />\n <input\n type='text'\n className={cx(styles.code, styles.input)}\n disabled={disabled}\n maxLength={5}\n onChange={(e) => setCountryCode(e.target.value)}\n placeholder={defaultCountryCode}\n value={countryCode}\n />\n <input\n {...restProps}\n type='tel'\n className={cx(styles.input, className, touched && styles.touched)}\n data-icon={inputIcon ? 'true' : undefined}\n disabled={disabled}\n maxLength={14}\n name={undefined}\n onChange={(e) => setPhoneNumber(e.target.value)}\n onBlur={handleBlur}\n pattern={pattern}\n required={required}\n style={withVars}\n value={phoneNumber}\n />\n </>\n );\n\n return (\n <label className={cx(styles.label, variant === 'inline' && styles.inline)}>\n {displayLabel && (\n <span data-required={required && variant !== 'inline' ? true : undefined}>\n {displayLabel}\n </span>\n )}\n {type === 'tel' ? (\n telephoneInput\n ) : (\n <input\n {...props}\n ref={ref}\n className={cx(styles.input, className, touched && styles.touched)}\n data-icon={inputIcon ? 'true' : undefined}\n disabled={disabled}\n onBlur={handleBlur}\n placeholder={placeholder}\n required={required}\n style={withVars}\n type={type}\n />\n )}\n </label>\n );\n}\n"],"names":["capitalizeFirstLetter","value","toLocaleUpperCase","slice","formatInlineLabel","label","endsWith","Input","className","defaultCountryCode","disabled","icon","onBlur","onBlurProp","placeholder","ref","required","style","type","variant","props","countryCode","setCountryCode","useState","phoneNumber","setPhoneNumber","name","onChange","pattern","restProps","touched","useTouched","inputIcon","undefined","displayLabel","withVars","iconSVG","handleBlur","composeEventHandlers","useEffect","target","split","join","currentTarget","telephoneInput","jsxs","Fragment","jsx","cx","styles","code","input","e","inline"],"mappings":"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"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"menu-popover-D1ALaiV5.cjs","sources":["../src/components/menu/action-list.tsx","../src/components/menu/menu-popover.tsx"],"sourcesContent":["import cx from 'classix';\nimport { cloneElement, useCallback, useEffect, useRef } from 'react';\n\nimport { type ButtonProps } from '../button';\nimport { List } from '../list';\nimport { type PopoverInitialFocus } from '../popover';\nimport styles from './styles.module.css';\n\nexport type MenuAction<T> = {\n button: React.ReactElement<ButtonProps>;\n id?: React.Key;\n isActive?: boolean;\n isDanger?: boolean;\n value: T;\n};\n\ntype MenuFocusTarget = 'first' | 'last' | 'next' | 'previous';\n\nconst getFocusableItems = (list: HTMLUListElement | HTMLOListElement | null) =>\n Array.from(list?.querySelectorAll<HTMLButtonElement>('[role=\"menuitem\"]') ?? []).filter(\n (item) => !item.disabled\n );\n\nexport function MenuActionList<T>({\n actions,\n initialFocus,\n menuAccessibleLabel,\n onSelect,\n usesMenuSemantics = false,\n}: {\n actions: MenuAction<T>[];\n initialFocus?: PopoverInitialFocus;\n menuAccessibleLabel?: string;\n onSelect: (value: T, event: React.MouseEvent<HTMLButtonElement>) => void;\n usesMenuSemantics?: boolean;\n}) {\n const listRef = useRef<HTMLUListElement | HTMLOListElement>(null);\n\n const focusItem = useCallback((target: MenuFocusTarget) => {\n const items = getFocusableItems(listRef.current);\n if (items.length === 0) return;\n\n if (target === 'first' || target === 'last') {\n items[target === 'first' ? 0 : items.length - 1].focus();\n return;\n }\n\n const currentIndex = items.indexOf(document.activeElement as HTMLButtonElement);\n const nextIndex =\n target === 'next'\n ? (currentIndex + 1) % items.length\n : (currentIndex - 1 + items.length) % items.length;\n items[nextIndex].focus();\n }, []);\n\n useEffect(() => {\n if (usesMenuSemantics) focusItem(initialFocus ?? 'first');\n }, [focusItem, initialFocus, usesMenuSemantics]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLUListElement>) => {\n if (!usesMenuSemantics) return;\n\n const targets = {\n ArrowDown: 'next',\n ArrowUp: 'previous',\n End: 'last',\n Home: 'first',\n } as const;\n const target = targets[event.key as keyof typeof targets];\n if (!target) return;\n\n event.preventDefault();\n focusItem(target);\n };\n\n return (\n <List\n aria-label={menuAccessibleLabel}\n className={styles.list}\n onKeyDown={handleKeyDown}\n ref={listRef}\n role={usesMenuSemantics ? 'menu' : undefined}\n >\n {actions.map(({ button, id, isActive, isDanger, value }, index) => (\n <li\n key={id ?? button.key ?? index}\n role={usesMenuSemantics ? 'none' : undefined}\n >\n {cloneElement(button, {\n 'aria-current': isActive ? 'true' : button.props['aria-current'],\n className: cx(\n button.props.className,\n styles.item,\n isActive && styles.active,\n isDanger && styles.danger\n ),\n onClick: (event: React.MouseEvent<HTMLButtonElement>) => {\n button.props.onClick?.(event);\n onSelect(value, event);\n },\n role: usesMenuSemantics ? 'menuitem' : button.props.role,\n variant: 'tertiary',\n })}\n </li>\n ))}\n </List>\n );\n}\n","import { Icon } from '../icon';\nimport { type IconName } from '../icon/icons';\nimport { Popover, type PopoverProps } from '../popover';\n\nexport const MenuPopover = ({\n children,\n inline,\n triggerAccessibleLabel,\n triggerIcon = 'dots',\n triggerLabel,\n}: Pick<PopoverProps, 'children' | 'inline' | 'triggerAccessibleLabel'> & {\n triggerIcon?: IconName;\n triggerLabel?: React.ReactNode;\n}) => (\n <Popover\n inline={inline}\n triggerAccessibleLabel={triggerAccessibleLabel}\n triggerAriaHasPopup='menu'\n triggerButtonContent={\n <>\n {triggerLabel}\n <Icon\n gap={triggerLabel ? 'left' : 'none'}\n name={triggerIcon}\n size='medium'\n />\n </>\n }\n >\n {children}\n </Popover>\n);\n"],"names":["getFocusableItems","list","Array","from","querySelectorAll","filter","item","disabled","MenuActionList","actions","initialFocus","menuAccessibleLabel","onSelect","usesMenuSemantics","listRef","useRef","focusItem","useCallback","target","items","current","length","focus","currentIndex","indexOf","document","activeElement","nextIndex","useEffect","handleKeyDown","event","ArrowDown","ArrowUp","End","Home","key","preventDefault","List","styles","undefined","map","button","id","isActive","isDanger","value","index","jsx","cloneElement","props","className","cx","active","danger","onClick","role","variant","MenuPopover","children","inline","triggerAccessibleLabel","triggerIcon","triggerLabel","Popover","jsxs","Fragment","Icon"],"mappings":"0VAkBMA,EAAqBC,GACzBC,MAAMC,MAAKF,GAAAA,YAAAA,EAAMG,iBAAoC,uBAAwB,CAAA,CAAE,EAAEC,OAC9EC,GAAS,CAACA,EAAKC,QAClB,EAEK,SAASC,EAAkB,CAChCC,QAAAA,EACAC,aAAAA,EACAC,oBAAAA,EACAC,SAAAA,EACAC,kBAAAA,EAAoB,EAOtB,EAAG,CACD,MAAMC,EAAUC,EAAAA,OAA4C,IAAI,EAE1DC,EAAYC,cAAaC,GAA4B,CACzD,MAAMC,EAAQnB,EAAkBc,EAAQM,OAAO,EAC/C,GAAID,EAAME,SAAW,EAAG,OAExB,GAAIH,IAAW,SAAWA,IAAW,OAAQ,CAC3CC,EAAMD,IAAW,QAAU,EAAIC,EAAME,OAAS,CAAC,EAAEC,MAAAA,EACjD,MACF,CAEA,MAAMC,EAAeJ,EAAMK,QAAQC,SAASC,aAAkC,EACxEC,EACJT,IAAW,QACNK,EAAe,GAAKJ,EAAME,QAC1BE,EAAe,EAAIJ,EAAME,QAAUF,EAAME,OAChDF,EAAMQ,CAAS,EAAEL,MAAAA,CACnB,EAAG,CAAA,CAAE,EAELM,EAAAA,UAAU,IAAM,CACVf,GAAmBG,EAAUN,GAAgB,OAAO,CAC1D,EAAG,CAACM,EAAWN,EAAcG,CAAiB,CAAC,EAE/C,MAAMgB,EAAiBC,GAAiD,CACtE,GAAI,CAACjB,EAAmB,OAQxB,MAAMK,EANU,CACda,UAAW,OACXC,QAAS,WACTC,IAAK,OACLC,KAAM,OAAA,EAEeJ,EAAMK,GAA2B,EACnDjB,IAELY,EAAMM,eAAAA,EACNpB,EAAUE,CAAM,EAClB,EAEA,aACGmB,OAAA,CACC,aAAY1B,EACZ,UAAW2B,EAAOrC,KAClB,UAAW4B,EACX,IAAKf,EACL,KAAMD,EAAoB,OAAS0B,OAAU,iBAAA,iBAE5C9B,SAAAA,EAAQ+B,IAAI,CAAC,CAAEC,OAAAA,EAAQC,GAAAA,EAAIC,SAAAA,EAAUC,SAAAA,EAAUC,MAAAA,CAAAA,EAASC,IACvDC,EAAAA,IAAC,KAAA,CAEC,KAAMlC,EAAoB,OAAS0B,OAElCS,SAAAA,EAAAA,aAAaP,EAAQ,CACpB,eAAgBE,EAAW,OAASF,EAAOQ,MAAM,cAAc,EAC/DC,UAAWC,EAAAA,EACTV,EAAOQ,MAAMC,UACbZ,EAAOhC,KACPqC,GAAYL,EAAOc,OACnBR,GAAYN,EAAOe,MACrB,EACAC,QAAUxB,GAA+C,UACvDW,GAAAA,EAAAA,EAAOQ,OAAMK,UAAbb,MAAAA,EAAAA,KAAAA,EAAuBX,GACvBlB,EAASiC,EAAOf,CAAK,CACvB,EACAyB,KAAM1C,EAAoB,WAAa4B,EAAOQ,MAAMM,KACpDC,QAAS,UAAA,CACV,CAAA,EAjBId,GAAMD,EAAON,KAAOW,CAkB3B,CACD,EACH,CAEJ,CCvGO,MAAMW,EAAcA,CAAC,CAC1BC,SAAAA,EACAC,OAAAA,EACAC,uBAAAA,EACAC,YAAAA,EAAc,OACdC,aAAAA,CAIF,UACGC,EAAAA,QAAA,CACC,OAAAJ,EACA,uBAAAC,EACA,oBAAoB,OACpB,qBACEI,EAAAA,KAAAC,EAAAA,SAAA,CACGH,SAAAA,CAAAA,EACDf,EAAAA,IAACmB,EAAAA,MACC,IAAKJ,EAAe,OAAS,OAC7B,KAAMD,EACN,KAAK,QAAA,CAAQ,CAAA,CAAA,CAEjB,EACD,iBAAA,cAEAH,SAAAA,CAAAA,CACH"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"menu-popover-DQHDIw-8.js","sources":["../src/components/menu/action-list.tsx","../src/components/menu/menu-popover.tsx"],"sourcesContent":["import cx from 'classix';\nimport { cloneElement, useCallback, useEffect, useRef } from 'react';\n\nimport { type ButtonProps } from '../button';\nimport { List } from '../list';\nimport { type PopoverInitialFocus } from '../popover';\nimport styles from './styles.module.css';\n\nexport type MenuAction<T> = {\n button: React.ReactElement<ButtonProps>;\n id?: React.Key;\n isActive?: boolean;\n isDanger?: boolean;\n value: T;\n};\n\ntype MenuFocusTarget = 'first' | 'last' | 'next' | 'previous';\n\nconst getFocusableItems = (list: HTMLUListElement | HTMLOListElement | null) =>\n Array.from(list?.querySelectorAll<HTMLButtonElement>('[role=\"menuitem\"]') ?? []).filter(\n (item) => !item.disabled\n );\n\nexport function MenuActionList<T>({\n actions,\n initialFocus,\n menuAccessibleLabel,\n onSelect,\n usesMenuSemantics = false,\n}: {\n actions: MenuAction<T>[];\n initialFocus?: PopoverInitialFocus;\n menuAccessibleLabel?: string;\n onSelect: (value: T, event: React.MouseEvent<HTMLButtonElement>) => void;\n usesMenuSemantics?: boolean;\n}) {\n const listRef = useRef<HTMLUListElement | HTMLOListElement>(null);\n\n const focusItem = useCallback((target: MenuFocusTarget) => {\n const items = getFocusableItems(listRef.current);\n if (items.length === 0) return;\n\n if (target === 'first' || target === 'last') {\n items[target === 'first' ? 0 : items.length - 1].focus();\n return;\n }\n\n const currentIndex = items.indexOf(document.activeElement as HTMLButtonElement);\n const nextIndex =\n target === 'next'\n ? (currentIndex + 1) % items.length\n : (currentIndex - 1 + items.length) % items.length;\n items[nextIndex].focus();\n }, []);\n\n useEffect(() => {\n if (usesMenuSemantics) focusItem(initialFocus ?? 'first');\n }, [focusItem, initialFocus, usesMenuSemantics]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLUListElement>) => {\n if (!usesMenuSemantics) return;\n\n const targets = {\n ArrowDown: 'next',\n ArrowUp: 'previous',\n End: 'last',\n Home: 'first',\n } as const;\n const target = targets[event.key as keyof typeof targets];\n if (!target) return;\n\n event.preventDefault();\n focusItem(target);\n };\n\n return (\n <List\n aria-label={menuAccessibleLabel}\n className={styles.list}\n onKeyDown={handleKeyDown}\n ref={listRef}\n role={usesMenuSemantics ? 'menu' : undefined}\n >\n {actions.map(({ button, id, isActive, isDanger, value }, index) => (\n <li\n key={id ?? button.key ?? index}\n role={usesMenuSemantics ? 'none' : undefined}\n >\n {cloneElement(button, {\n 'aria-current': isActive ? 'true' : button.props['aria-current'],\n className: cx(\n button.props.className,\n styles.item,\n isActive && styles.active,\n isDanger && styles.danger\n ),\n onClick: (event: React.MouseEvent<HTMLButtonElement>) => {\n button.props.onClick?.(event);\n onSelect(value, event);\n },\n role: usesMenuSemantics ? 'menuitem' : button.props.role,\n variant: 'tertiary',\n })}\n </li>\n ))}\n </List>\n );\n}\n","import { Icon } from '../icon';\nimport { type IconName } from '../icon/icons';\nimport { Popover, type PopoverProps } from '../popover';\n\nexport const MenuPopover = ({\n children,\n inline,\n triggerAccessibleLabel,\n triggerIcon = 'dots',\n triggerLabel,\n}: Pick<PopoverProps, 'children' | 'inline' | 'triggerAccessibleLabel'> & {\n triggerIcon?: IconName;\n triggerLabel?: React.ReactNode;\n}) => (\n <Popover\n inline={inline}\n triggerAccessibleLabel={triggerAccessibleLabel}\n triggerAriaHasPopup='menu'\n triggerButtonContent={\n <>\n {triggerLabel}\n <Icon\n gap={triggerLabel ? 'left' : 'none'}\n name={triggerIcon}\n size='medium'\n />\n </>\n }\n >\n {children}\n </Popover>\n);\n"],"names":["getFocusableItems","list","Array","from","querySelectorAll","filter","item","disabled","MenuActionList","actions","initialFocus","menuAccessibleLabel","onSelect","usesMenuSemantics","listRef","useRef","focusItem","useCallback","target","items","current","length","focus","currentIndex","indexOf","document","activeElement","nextIndex","useEffect","handleKeyDown","event","ArrowDown","ArrowUp","End","Home","key","preventDefault","List","styles","undefined","map","button","id","isActive","isDanger","value","index","jsx","cloneElement","props","className","cx","active","danger","onClick","role","variant","MenuPopover","children","inline","triggerAccessibleLabel","triggerIcon","triggerLabel","Popover","jsxs","Fragment","Icon"],"mappings":"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"}