@react-spectrum/s2 0.9.0 → 0.9.2

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 (272) hide show
  1. package/dist/Accordion.cjs +2 -2
  2. package/dist/Accordion.css +2 -2
  3. package/dist/Accordion.mjs +2 -2
  4. package/dist/ActionBar.cjs +60 -60
  5. package/dist/ActionBar.css +59 -59
  6. package/dist/ActionBar.mjs +60 -60
  7. package/dist/ActionButton.cjs +187 -187
  8. package/dist/ActionButton.cjs.map +1 -1
  9. package/dist/ActionButton.css +134 -134
  10. package/dist/ActionButton.css.map +1 -1
  11. package/dist/ActionButton.mjs +187 -187
  12. package/dist/ActionButton.mjs.map +1 -1
  13. package/dist/ActionButtonGroup.cjs +15 -15
  14. package/dist/ActionButtonGroup.css +9 -9
  15. package/dist/ActionButtonGroup.mjs +15 -15
  16. package/dist/Add.cjs +10 -10
  17. package/dist/Add.css +6 -6
  18. package/dist/Add.mjs +10 -10
  19. package/dist/AlertDialog.cjs +3 -3
  20. package/dist/AlertDialog.css +3 -3
  21. package/dist/AlertDialog.mjs +3 -3
  22. package/dist/Asterisk.cjs +6 -6
  23. package/dist/Asterisk.css +4 -4
  24. package/dist/Asterisk.mjs +6 -6
  25. package/dist/Avatar.cjs +14 -14
  26. package/dist/Avatar.css +14 -14
  27. package/dist/Avatar.mjs +14 -14
  28. package/dist/AvatarGroup.cjs +120 -120
  29. package/dist/AvatarGroup.css +37 -37
  30. package/dist/AvatarGroup.mjs +120 -120
  31. package/dist/Badge.cjs +196 -196
  32. package/dist/Badge.css +129 -129
  33. package/dist/Badge.mjs +196 -196
  34. package/dist/Breadcrumbs.cjs +231 -231
  35. package/dist/Breadcrumbs.css +102 -102
  36. package/dist/Breadcrumbs.mjs +231 -231
  37. package/dist/Button.cjs +328 -328
  38. package/dist/Button.cjs.map +1 -1
  39. package/dist/Button.css +176 -176
  40. package/dist/Button.css.map +1 -1
  41. package/dist/Button.mjs +328 -328
  42. package/dist/Button.mjs.map +1 -1
  43. package/dist/ButtonGroup.cjs +20 -20
  44. package/dist/ButtonGroup.css +15 -15
  45. package/dist/ButtonGroup.mjs +20 -20
  46. package/dist/Card.cjs +294 -294
  47. package/dist/Card.css +205 -205
  48. package/dist/Card.mjs +294 -294
  49. package/dist/CardView.cjs +17 -17
  50. package/dist/CardView.css +17 -17
  51. package/dist/CardView.mjs +17 -17
  52. package/dist/CenterBaseline.cjs +1 -1
  53. package/dist/CenterBaseline.css +2 -2
  54. package/dist/CenterBaseline.mjs +1 -1
  55. package/dist/Checkbox.cjs +160 -160
  56. package/dist/Checkbox.css +94 -94
  57. package/dist/Checkbox.mjs +160 -160
  58. package/dist/CheckboxGroup.cjs +43 -43
  59. package/dist/CheckboxGroup.css +41 -41
  60. package/dist/CheckboxGroup.mjs +43 -43
  61. package/dist/Checkmark.cjs +12 -12
  62. package/dist/Checkmark.css +8 -8
  63. package/dist/Checkmark.mjs +12 -12
  64. package/dist/Chevron.cjs +12 -12
  65. package/dist/Chevron.css +10 -10
  66. package/dist/Chevron.mjs +12 -12
  67. package/dist/ClearButton.cjs +29 -29
  68. package/dist/ClearButton.css +29 -29
  69. package/dist/ClearButton.mjs +29 -29
  70. package/dist/CloseButton.cjs +54 -54
  71. package/dist/CloseButton.css +46 -46
  72. package/dist/CloseButton.mjs +54 -54
  73. package/dist/ColorArea.cjs +16 -16
  74. package/dist/ColorArea.css +16 -16
  75. package/dist/ColorArea.mjs +16 -16
  76. package/dist/ColorField.cjs +31 -31
  77. package/dist/ColorField.css +31 -31
  78. package/dist/ColorField.mjs +31 -31
  79. package/dist/ColorHandle.cjs +27 -27
  80. package/dist/ColorHandle.css +42 -42
  81. package/dist/ColorHandle.mjs +27 -27
  82. package/dist/ColorSlider.cjs +108 -108
  83. package/dist/ColorSlider.css +56 -56
  84. package/dist/ColorSlider.mjs +108 -108
  85. package/dist/ColorSwatch.cjs +29 -29
  86. package/dist/ColorSwatch.css +29 -29
  87. package/dist/ColorSwatch.mjs +29 -29
  88. package/dist/ColorSwatchPicker.cjs +27 -27
  89. package/dist/ColorSwatchPicker.css +46 -46
  90. package/dist/ColorSwatchPicker.mjs +27 -27
  91. package/dist/ColorWheel.cjs +26 -26
  92. package/dist/ColorWheel.css +17 -17
  93. package/dist/ColorWheel.mjs +26 -26
  94. package/dist/ComboBox.cjs +378 -376
  95. package/dist/ComboBox.cjs.map +1 -1
  96. package/dist/ComboBox.css +179 -179
  97. package/dist/ComboBox.css.map +1 -1
  98. package/dist/ComboBox.mjs +378 -376
  99. package/dist/ComboBox.mjs.map +1 -1
  100. package/dist/ContextualHelp.cjs +5 -5
  101. package/dist/ContextualHelp.cjs.map +1 -1
  102. package/dist/ContextualHelp.css +49 -49
  103. package/dist/ContextualHelp.css.map +1 -1
  104. package/dist/ContextualHelp.mjs +5 -5
  105. package/dist/ContextualHelp.mjs.map +1 -1
  106. package/dist/Cross.cjs +14 -14
  107. package/dist/Cross.css +10 -10
  108. package/dist/Cross.mjs +14 -14
  109. package/dist/CustomDialog.cjs +25 -25
  110. package/dist/CustomDialog.css +25 -25
  111. package/dist/CustomDialog.mjs +25 -25
  112. package/dist/Dash.cjs +10 -10
  113. package/dist/Dash.css +6 -6
  114. package/dist/Dash.mjs +10 -10
  115. package/dist/Dialog.cjs +17 -17
  116. package/dist/Dialog.css +70 -70
  117. package/dist/Dialog.mjs +17 -17
  118. package/dist/Disclosure.cjs +129 -129
  119. package/dist/Disclosure.css +104 -104
  120. package/dist/Disclosure.mjs +129 -129
  121. package/dist/Divider.cjs +25 -25
  122. package/dist/Divider.css +25 -25
  123. package/dist/Divider.mjs +25 -25
  124. package/dist/DropZone.cjs +58 -58
  125. package/dist/DropZone.css +54 -54
  126. package/dist/DropZone.mjs +58 -58
  127. package/dist/Field.cjs +340 -340
  128. package/dist/Field.cjs.map +1 -1
  129. package/dist/Field.css +144 -144
  130. package/dist/Field.mjs +340 -340
  131. package/dist/Field.mjs.map +1 -1
  132. package/dist/Form.cjs +9 -9
  133. package/dist/Form.css +9 -9
  134. package/dist/Form.mjs +9 -9
  135. package/dist/FullscreenDialog.cjs +5 -5
  136. package/dist/FullscreenDialog.css +79 -79
  137. package/dist/FullscreenDialog.mjs +5 -5
  138. package/dist/IllustratedMessage.cjs +219 -219
  139. package/dist/IllustratedMessage.css +74 -74
  140. package/dist/IllustratedMessage.mjs +219 -219
  141. package/dist/Image.cjs +14 -14
  142. package/dist/Image.cjs.map +1 -1
  143. package/dist/Image.css +14 -14
  144. package/dist/Image.css.map +1 -1
  145. package/dist/Image.mjs +14 -14
  146. package/dist/Image.mjs.map +1 -1
  147. package/dist/InlineAlert.cjs +108 -108
  148. package/dist/InlineAlert.css +90 -90
  149. package/dist/InlineAlert.mjs +108 -108
  150. package/dist/Link.cjs +49 -49
  151. package/dist/Link.css +41 -41
  152. package/dist/Link.mjs +49 -49
  153. package/dist/LinkOut.cjs +8 -8
  154. package/dist/LinkOut.css +8 -8
  155. package/dist/LinkOut.mjs +8 -8
  156. package/dist/Menu.cjs +422 -422
  157. package/dist/Menu.css +180 -180
  158. package/dist/Menu.mjs +422 -422
  159. package/dist/Meter.cjs +153 -153
  160. package/dist/Meter.css +95 -95
  161. package/dist/Meter.mjs +153 -153
  162. package/dist/Modal.cjs +58 -58
  163. package/dist/Modal.css +50 -50
  164. package/dist/Modal.mjs +58 -58
  165. package/dist/NotificationBadge.cjs +56 -56
  166. package/dist/NotificationBadge.css +51 -51
  167. package/dist/NotificationBadge.mjs +56 -56
  168. package/dist/NumberField.cjs +114 -118
  169. package/dist/NumberField.cjs.map +1 -1
  170. package/dist/NumberField.css +103 -103
  171. package/dist/NumberField.css.map +1 -1
  172. package/dist/NumberField.mjs +115 -119
  173. package/dist/NumberField.mjs.map +1 -1
  174. package/dist/Picker.cjs +273 -271
  175. package/dist/Picker.cjs.map +1 -1
  176. package/dist/Picker.css +169 -169
  177. package/dist/Picker.css.map +1 -1
  178. package/dist/Picker.mjs +273 -271
  179. package/dist/Picker.mjs.map +1 -1
  180. package/dist/Popover.cjs +85 -85
  181. package/dist/Popover.css +66 -66
  182. package/dist/Popover.mjs +85 -85
  183. package/dist/ProgressBar.cjs +163 -163
  184. package/dist/ProgressBar.css +103 -103
  185. package/dist/ProgressBar.mjs +163 -163
  186. package/dist/ProgressCircle.cjs +17 -17
  187. package/dist/ProgressCircle.css +17 -17
  188. package/dist/ProgressCircle.mjs +17 -17
  189. package/dist/Provider.cjs +10 -10
  190. package/dist/Provider.css +9 -9
  191. package/dist/Provider.mjs +10 -10
  192. package/dist/Radio.cjs +144 -144
  193. package/dist/Radio.css +81 -81
  194. package/dist/Radio.mjs +144 -144
  195. package/dist/RadioGroup.cjs +41 -41
  196. package/dist/RadioGroup.css +41 -41
  197. package/dist/RadioGroup.mjs +41 -41
  198. package/dist/SearchField.cjs +41 -41
  199. package/dist/SearchField.css +49 -49
  200. package/dist/SearchField.mjs +41 -41
  201. package/dist/SegmentedControl.cjs +171 -171
  202. package/dist/SegmentedControl.css +120 -120
  203. package/dist/SegmentedControl.mjs +171 -171
  204. package/dist/Slider.cjs +288 -288
  205. package/dist/Slider.css +152 -152
  206. package/dist/Slider.mjs +288 -288
  207. package/dist/StatusLight.cjs +115 -115
  208. package/dist/StatusLight.css +63 -63
  209. package/dist/StatusLight.mjs +115 -115
  210. package/dist/Switch.cjs +152 -152
  211. package/dist/Switch.css +76 -76
  212. package/dist/Switch.mjs +152 -152
  213. package/dist/TableView.cjs +310 -310
  214. package/dist/TableView.css +172 -172
  215. package/dist/TableView.mjs +310 -310
  216. package/dist/Tabs.cjs +113 -110
  217. package/dist/Tabs.cjs.map +1 -1
  218. package/dist/Tabs.css +92 -92
  219. package/dist/Tabs.css.map +1 -1
  220. package/dist/Tabs.mjs +113 -110
  221. package/dist/Tabs.mjs.map +1 -1
  222. package/dist/TabsPicker.cjs +123 -123
  223. package/dist/TabsPicker.css +112 -112
  224. package/dist/TabsPicker.mjs +123 -123
  225. package/dist/TagGroup.cjs +202 -202
  226. package/dist/TagGroup.cjs.map +1 -1
  227. package/dist/TagGroup.css +147 -147
  228. package/dist/TagGroup.css.map +1 -1
  229. package/dist/TagGroup.mjs +202 -202
  230. package/dist/TagGroup.mjs.map +1 -1
  231. package/dist/TextField.cjs +57 -57
  232. package/dist/TextField.css +57 -57
  233. package/dist/TextField.mjs +57 -57
  234. package/dist/Toast.cjs +118 -118
  235. package/dist/Toast.css +105 -105
  236. package/dist/Toast.mjs +118 -118
  237. package/dist/ToggleButton.cjs +3 -3
  238. package/dist/ToggleButton.css +12 -12
  239. package/dist/ToggleButton.mjs +3 -3
  240. package/dist/Tooltip.cjs +81 -81
  241. package/dist/Tooltip.css +68 -68
  242. package/dist/Tooltip.mjs +81 -81
  243. package/dist/TreeView.cjs +143 -149
  244. package/dist/TreeView.cjs.map +1 -1
  245. package/dist/TreeView.css +143 -143
  246. package/dist/TreeView.css.map +1 -1
  247. package/dist/TreeView.mjs +143 -149
  248. package/dist/TreeView.mjs.map +1 -1
  249. package/dist/types.d.ts +2 -2
  250. package/dist/types.d.ts.map +1 -1
  251. package/icons/Icon.cjs +10 -10
  252. package/icons/Icon.css +9 -9
  253. package/icons/Icon.mjs +10 -10
  254. package/icons/Skeleton.cjs +4 -3
  255. package/icons/Skeleton.cjs.map +1 -1
  256. package/icons/Skeleton.css +6 -6
  257. package/icons/Skeleton.css.map +1 -1
  258. package/icons/Skeleton.mjs +4 -3
  259. package/icons/Skeleton.mjs.map +1 -1
  260. package/package.json +45 -26
  261. package/src/ActionButton.tsx +1 -1
  262. package/src/Button.tsx +3 -3
  263. package/src/ComboBox.tsx +3 -2
  264. package/src/ContextualHelp.tsx +2 -2
  265. package/src/Image.tsx +1 -1
  266. package/src/NumberField.tsx +0 -2
  267. package/src/Picker.tsx +3 -2
  268. package/src/Skeleton.tsx +2 -1
  269. package/src/Tabs.tsx +7 -5
  270. package/src/TagGroup.tsx +1 -1
  271. package/src/TreeView.tsx +1 -6
  272. package/style/__tests__/style-macro.test.js +56 -56
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/s2/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ComboBox as AriaComboBox,\n ComboBoxProps as AriaComboBoxProps,\n ListBoxSection as AriaListBoxSection,\n PopoverProps as AriaPopoverProps,\n Button,\n ButtonRenderProps,\n Collection,\n ComboBoxStateContext,\n ContextValue,\n InputContext,\n ListBox,\n ListBoxItem,\n ListBoxItemProps,\n ListBoxProps,\n ListLayout,\n ListStateContext,\n Provider,\n SectionProps,\n UNSTABLE_ListBoxLoadingSentinel,\n Virtualizer\n} from 'react-aria-components';\nimport {AsyncLoadable, HelpTextProps, LoadingState, SpectrumLabelableProps} from '@react-types/shared';\nimport {baseColor, edgeToText, focusRing, space, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, control, controlBorderRadius, controlFont, controlSize, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n checkmark,\n description,\n icon,\n iconCenterWrapper,\n label,\n sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {createLeafComponent} from '@react-aria/collections';\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {forwardRefType} from './types';\nimport {HeaderContext, HeadingContext, Text, TextContext} from './Content';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeRefs, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {Node} from 'react-stately';\nimport {Placement} from 'react-aria';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {ProgressCircle} from './ProgressCircle';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useScale} from './utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ComboboxStyleProps {\n /**\n * The size of the Combobox.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\nexport interface ComboBoxProps<T extends object> extends\n Omit<AriaComboBoxProps<T>, 'children' | 'style' | 'className' | 'defaultFilter' | 'allowsEmptyCollection'>,\n ComboboxStyleProps,\n StyleProps,\n SpectrumLabelableProps,\n HelpTextProps,\n Pick<ListBoxProps<T>, 'items'>,\n Pick<AriaPopoverProps, 'shouldFlip'>,\n Pick<AsyncLoadable, 'onLoadMore'> {\n /** The contents of the collection. */\n children: ReactNode | ((item: T) => ReactNode),\n /**\n * Direction the menu will render relative to the ComboBox.\n *\n * @default 'bottom'\n */\n direction?: 'bottom' | 'top',\n /**\n * Alignment of the menu relative to the input target.\n *\n * @default 'start'\n */\n align?: 'start' | 'end',\n /** Width of the menu. By default, matches width of the trigger. Note that the minimum width of the dropdown is always equal to the trigger's width. */\n menuWidth?: number,\n /** The current loading state of the ComboBox. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState\n}\n\nexport const ComboBoxContext = createContext<ContextValue<Partial<ComboBoxProps<any>>, TextFieldRef>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n ...controlBorderRadius('sm'),\n display: 'flex',\n outlineStyle: 'none',\n textAlign: 'center',\n borderStyle: 'none',\n alignItems: 'center',\n justifyContent: 'center',\n size: {\n size: {\n S: 16,\n M: 20,\n L: 24,\n XL: 32\n }\n },\n marginStart: 'text-to-control',\n aspectRatio: 'square',\n flexShrink: 0,\n transition: {\n default: 'default',\n forcedColors: 'none'\n },\n backgroundColor: {\n default: baseColor('gray-100'),\n isOpen: 'gray-200',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isOpen: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n color: {\n default: baseColor('neutral'),\n isDisabled: 'disabled',\n forcedColors: 'ButtonFace'\n }\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: 90,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst loadingWrapperStyles = style({\n gridColumnStart: '1',\n gridColumnEnd: '-1',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n marginY: 8\n});\n\nconst progressCircleStyles = style({\n size: {\n size: {\n S: 16,\n M: 20,\n L: 22,\n XL: 26\n }\n },\n marginStart: {\n isInput: 'text-to-visual'\n }\n});\n\nconst emptyStateText = style({\n height: {\n size: {\n S: 24,\n M: 32,\n L: 40,\n XL: 48\n }\n },\n font: {\n size: {\n S: 'ui-sm',\n M: 'ui',\n L: 'ui-lg',\n XL: 'ui-xl'\n }\n },\n display: 'flex',\n alignItems: 'center',\n paddingStart: 'edge-to-text'\n});\n\nexport let listbox = style<{size: 'S' | 'M' | 'L' | 'XL'}>({\n width: 'full',\n boxSizing: 'border-box',\n maxHeight: '[inherit]',\n // TODO: Might help with horizontal scrolling happening on Windows, will need to check somehow. Otherwise, revert back to overflow: auto\n overflowY: 'auto',\n overflowX: 'hidden',\n fontFamily: 'sans',\n fontSize: controlFont()\n});\n\nexport let listboxItem = style({\n ...focusRing(),\n ...control({shape: 'default', wrap: true, icon: true}),\n columnGap: 0,\n paddingX: 0,\n paddingBottom: '--labelPadding',\n backgroundColor: {\n default: 'transparent',\n isFocused: baseColor('gray-100').isFocusVisible\n },\n color: {\n default: baseColor('neutral'),\n isDisabled: {\n default: 'disabled',\n forcedColors: 'GrayText'\n }\n },\n position: 'relative',\n gridColumnStart: 1,\n gridColumnEnd: -1,\n display: 'grid',\n gridTemplateAreas: [\n '. checkmark icon label .',\n '. . . description .'\n ],\n gridTemplateColumns: {\n size: {\n S: [edgeToText(24), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(24)],\n M: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(32)],\n L: [edgeToText(40), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(40)],\n XL: [edgeToText(48), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(48)]\n }\n },\n gridTemplateRows: {\n // min-content prevents second row from 'auto'ing to a size larger then 0 when empty\n default: 'auto minmax(0, min-content)',\n ':has([slot=description])': 'auto auto'\n },\n rowGap: {\n ':has([slot=description])': space(1)\n },\n alignItems: 'baseline',\n minHeight: controlSize(),\n height: 'min',\n textDecoration: 'none',\n cursor: {\n default: 'default',\n isLink: 'pointer'\n },\n transition: 'default'\n}, getAllowedOverrides());\n\nexport let listboxHeader = style<{size?: 'S' | 'M' | 'L' | 'XL'}>({\n color: 'neutral',\n boxSizing: 'border-box',\n minHeight: controlSize(),\n paddingY: centerPadding(),\n marginX: {\n size: {\n S: `[${edgeToText(24)}]`,\n M: `[${edgeToText(32)}]`,\n L: `[${edgeToText(40)}]`,\n XL: `[${edgeToText(48)}]`\n }\n }\n});\n\nconst separatorWrapper = style({\n display: 'flex',\n marginX: {\n size: {\n S: `[${edgeToText(24)}]`,\n M: `[${edgeToText(32)}]`,\n L: `[${edgeToText(40)}]`,\n XL: `[${edgeToText(48)}]`\n }\n },\n height: 12,\n alignItems: 'center'\n});\n\nconst dividerStyle = style({\n backgroundColor: {\n default: 'gray-200',\n forcedColors: 'ButtonBorder'\n },\n borderRadius: 'full',\n height: '[2px]',\n width: 'full'\n});\n\n// Not from any design, just following the sizing of the existing rows\nexport const LOADER_ROW_HEIGHTS = {\n S: {\n medium: 24,\n large: 30\n },\n M: {\n medium: 32,\n large: 40\n },\n L: {\n medium: 40,\n large: 50\n },\n XL: {\n medium: 48,\n large: 60\n }\n};\n\nlet InternalComboboxContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\n\n/**\n * ComboBox allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: Ref<TextFieldRef>) {\n [props, ref] = useSpectrumContextProps(props, ref, ComboBoxContext);\n\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n size = 'M',\n labelPosition = 'top',\n UNSAFE_className = '',\n UNSAFE_style,\n loadingState,\n ...comboBoxProps\n } = props;\n\n return (\n <AriaComboBox\n {...comboBoxProps}\n allowsEmptyCollection={loadingState != null}\n style={UNSAFE_style}\n className={UNSAFE_className + style(field(), getAllowedOverrides())({\n isInForm: !!formContext,\n labelPosition,\n size\n }, props.styles)}>\n {({isDisabled, isOpen, isRequired, isInvalid}) => (\n <ComboboxInner {...props} isDisabled={isDisabled} isOpen={isOpen} isRequired={isRequired} isInvalid={isInvalid} ref={ref} />\n )}\n </AriaComboBox>\n );\n});\n\nexport interface ComboBoxItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n children: ReactNode\n}\n\nconst checkmarkIconSize = {\n S: 'XS',\n M: 'M',\n L: 'L',\n XL: 'XL'\n} as const;\n\nexport function ComboBoxItem(props: ComboBoxItemProps): ReactNode {\n let ref = useRef(null);\n let isLink = props.href != null;\n let {size} = useContext(InternalComboboxContext);\n return (\n <ListBoxItem\n {...props}\n ref={ref}\n textValue={props.textValue || (typeof props.children === 'string' ? props.children as string : undefined)}\n style={pressScale(ref, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + listboxItem({...renderProps, size, isLink}, props.styles)}>\n {(renderProps) => {\n let {children} = props;\n return (\n <>\n <Provider\n values={[\n [IconContext, {\n slots: {\n icon: {render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}), styles: icon}\n }\n }],\n [TextContext, {\n slots: {\n label: {styles: label({size})},\n description: {styles: description({...renderProps, size})}\n }\n }]\n ]}>\n {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n {typeof children === 'string' ? <Text slot=\"label\">{children}</Text> : children}\n </Provider>\n </>\n );\n }}\n </ListBoxItem>\n );\n}\n\nexport interface ComboBoxSectionProps<T extends object> extends SectionProps<T> {}\nexport function ComboBoxSection<T extends object>(props: ComboBoxSectionProps<T>): ReactNode {\n let {size} = useContext(InternalComboboxContext);\n return (\n <>\n <AriaListBoxSection\n {...props}>\n {props.children}\n </AriaListBoxSection>\n <Divider size={size} />\n </>\n );\n}\n\nconst ComboboxInner = forwardRef(function ComboboxInner(props: ComboBoxProps<any> & {isOpen: boolean}, ref: ForwardedRef<TextFieldRef | null>) {\n let {\n direction = 'bottom',\n align = 'start',\n shouldFlip = true,\n menuWidth,\n label,\n description: descriptionMessage,\n errorMessage,\n children,\n defaultItems,\n items,\n size = 'M',\n labelPosition = 'top',\n labelAlign = 'start',\n necessityIndicator,\n loadingState,\n isDisabled,\n isOpen,\n isRequired,\n isInvalid,\n menuTrigger,\n onLoadMore\n } = props;\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let inputRef = useRef<HTMLInputElement>(null);\n let domRef = useRef<HTMLDivElement>(null);\n let buttonRef = useRef<HTMLButtonElement>(null);\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef.current;\n }\n }));\n\n // Better way to encode this into a style? need to account for flipping\n let menuOffset: number;\n if (size === 'S') {\n menuOffset = 6;\n } else if (size === 'M') {\n menuOffset = 6;\n } else if (size === 'L') {\n menuOffset = 7;\n } else {\n menuOffset = 8;\n }\n\n let triggerRef = useRef<HTMLDivElement>(null);\n // Make menu width match input + button\n let [triggerWidth, setTriggerWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (triggerRef.current) {\n let inputRect = triggerRef.current.getBoundingClientRect();\n let minX = inputRect.left;\n let maxX = inputRect.right;\n setTriggerWidth((maxX - minX) + 'px');\n }\n }, [triggerRef, setTriggerWidth]);\n\n useResizeObserver({\n ref: triggerRef,\n onResize: onResize\n });\n\n let state = useContext(ComboBoxStateContext);\n let timeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n let [showLoading, setShowLoading] = useState(false);\n let isLoadingOrFiltering = loadingState === 'loading' || loadingState === 'filtering';\n {/* Logic copied from S1 */}\n let showFieldSpinner = useMemo(() => showLoading && (isOpen || menuTrigger === 'manual' || loadingState === 'loading'), [showLoading, isOpen, menuTrigger, loadingState]);\n let spinnerId = useSlotId([showFieldSpinner]);\n\n let inputValue = state?.inputValue;\n let lastInputValue = useRef(inputValue);\n useEffect(() => {\n if (isLoadingOrFiltering && !showLoading) {\n if (timeout.current === null) {\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n\n // If user is typing, clear the timer and restart since it is a new request\n if (inputValue !== lastInputValue.current) {\n clearTimeout(timeout.current);\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n } else if (!isLoadingOrFiltering) {\n // If loading is no longer happening, clear any timers and hide the loading circle\n setShowLoading(false);\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n }\n\n lastInputValue.current = inputValue;\n }, [isLoadingOrFiltering, showLoading, inputValue]);\n\n useEffect(() => {\n return () => {\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n };\n }, []);\n\n let renderer;\n let listBoxLoadingCircle = (\n <UNSTABLE_ListBoxLoadingSentinel\n // Only show the spinner in the list when loading more\n isLoading={loadingState === 'loadingMore'}\n onLoadMore={onLoadMore}\n className={loadingWrapperStyles}>\n <ProgressCircle\n isIndeterminate\n size=\"S\"\n styles={progressCircleStyles({size})}\n // Same loading string as table\n aria-label={stringFormatter.format('table.loadingMore')} />\n </UNSTABLE_ListBoxLoadingSentinel>\n );\n\n if (typeof children === 'function') {\n renderer = (\n <>\n <Collection items={items ?? defaultItems}>\n {children}\n </Collection>\n {listBoxLoadingCircle}\n </>\n );\n } else {\n // TODO: is there a case where the user might provide items to the Combobox but doesn't provide a function renderer?\n // Same case for other components that have this logic (TableView/CardView/Picker)\n renderer = (\n <>\n {children}\n {listBoxLoadingCircle}\n </>\n );\n }\n let scale = useScale();\n\n return (\n <>\n <InternalComboboxContext.Provider value={{size}}>\n <FieldLabel\n isDisabled={isDisabled}\n isRequired={isRequired}\n size={size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n necessityIndicator={necessityIndicator}\n contextualHelp={props.contextualHelp}>\n {label}\n </FieldLabel>\n <FieldGroup\n ref={triggerRef}\n role=\"presentation\"\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n size={size}\n styles={style({\n ...fieldInput(),\n paddingStart: 'edge-to-text',\n // better way to do this one? it's not actually half, they are\n // [9, 4], [12, 6], [15, 8], [18, 8]\n // also noticed that our measurement is including the border, making the padding too much\n paddingEnd: 'calc(self(height, self(minHeight)) * 3 / 16)'\n })({size})}>\n <InputContext.Consumer>\n {ctx => (\n <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n <Input aria-describedby={spinnerId} />\n </InputContext.Provider>\n )}\n </InputContext.Consumer>\n {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n {showFieldSpinner && (\n <ProgressCircle\n id={spinnerId}\n isIndeterminate\n size=\"S\"\n styles={progressCircleStyles({size, isInput: true})}\n aria-label={stringFormatter.format('table.loading')} />\n )}\n <Button\n ref={buttonRef}\n // Prevent press scale from sticking while ComboBox is open.\n // @ts-ignore\n isPressed={false}\n style={renderProps => pressScale(buttonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n size,\n isOpen\n })}>\n <ChevronIcon\n size={size}\n className={iconStyles} />\n </Button>\n </FieldGroup>\n <HelpText\n size={size}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n description={descriptionMessage}>\n {errorMessage}\n </HelpText>\n <PopoverBase\n hideArrow\n triggerRef={triggerRef}\n offset={menuOffset}\n placement={`${direction} ${align}` as Placement}\n shouldFlip={shouldFlip}\n UNSAFE_style={{\n width: menuWidth ? `${menuWidth}px` : undefined,\n // manually subtract border as we can't set Popover to border-box, it causes the contents to spill out\n '--trigger-width': `calc(${triggerWidth} - 2px)`\n } as CSSProperties}\n styles={style({\n minWidth: '--trigger-width',\n width: '--trigger-width'\n })}>\n <Provider\n values={[\n [HeaderContext, {styles: listboxHeader({size})}],\n [HeadingContext, {\n // @ts-ignore\n role: 'presentation',\n styles: sectionHeading\n }],\n [TextContext, {\n slots: {\n 'description': {styles: description({size})}\n }\n }]\n ]}>\n <Virtualizer\n layout={ListLayout}\n layoutOptions={{\n estimatedRowHeight: 32,\n padding: 8,\n estimatedHeadingHeight: 50,\n loaderHeight: LOADER_ROW_HEIGHTS[size][scale]\n }}>\n <ListBox\n renderEmptyState={() => (\n <span className={emptyStateText({size})}>\n {loadingState === 'loading' ? stringFormatter.format('table.loading') : stringFormatter.format('combobox.noResults')}\n </span>\n )}\n items={items}\n className={listbox({size})}>\n {renderer}\n </ListBox>\n </Virtualizer>\n </Provider>\n </PopoverBase>\n </InternalComboboxContext.Provider>\n </>\n );\n});\n\nexport const Divider = /*#__PURE__*/ createLeafComponent('separator', function Divider({size}: {size?: 'S' | 'M' | 'L' | 'XL'}, ref: ForwardedRef<HTMLDivElement>, node: Node<unknown>) {\n let listState = useContext(ListStateContext)!;\n\n let nextNode = node.nextKey != null && listState.collection.getItem(node.nextKey);\n if (node.prevKey == null || !nextNode || nextNode.type === 'separator' || (nextNode.type === 'loader' && nextNode.nextKey == null)) {\n return null;\n }\n\n return (\n <div className={separatorWrapper({size})}>\n <div ref={ref} className={dividerStyle} />\n </div>\n );\n});\n"],"names":[],"version":3,"file":"ComboBox.cjs.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/s2/src/ComboBox.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n ComboBox as AriaComboBox,\n ComboBoxProps as AriaComboBoxProps,\n ListBoxSection as AriaListBoxSection,\n PopoverProps as AriaPopoverProps,\n Button,\n ButtonRenderProps,\n Collection,\n ComboBoxStateContext,\n ContextValue,\n InputContext,\n ListBox,\n ListBoxItem,\n ListBoxItemProps,\n ListBoxProps,\n ListLayout,\n ListStateContext,\n Provider,\n SectionProps,\n UNSTABLE_ListBoxLoadingSentinel,\n Virtualizer\n} from 'react-aria-components';\nimport {AsyncLoadable, HelpTextProps, LoadingState, SpectrumLabelableProps} from '@react-types/shared';\nimport {baseColor, edgeToText, focusRing, space, style} from '../style' with {type: 'macro'};\nimport {centerBaseline} from './CenterBaseline';\nimport {centerPadding, control, controlBorderRadius, controlFont, controlSize, field, fieldInput, getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {\n checkmark,\n description,\n icon,\n iconCenterWrapper,\n label,\n sectionHeading\n} from './Menu';\nimport CheckmarkIcon from '../ui-icons/Checkmark';\nimport ChevronIcon from '../ui-icons/Chevron';\nimport {createContext, CSSProperties, ForwardedRef, forwardRef, ReactNode, Ref, useCallback, useContext, useEffect, useImperativeHandle, useMemo, useRef, useState} from 'react';\nimport {createFocusableRef} from '@react-spectrum/utils';\nimport {createLeafComponent} from '@react-aria/collections';\nimport {FieldErrorIcon, FieldGroup, FieldLabel, HelpText, Input} from './Field';\nimport {FormContext, useFormProps} from './Form';\nimport {forwardRefType} from './types';\nimport {HeaderContext, HeadingContext, Text, TextContext} from './Content';\nimport {IconContext} from './Icon';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeRefs, useResizeObserver, useSlotId} from '@react-aria/utils';\nimport {Node} from 'react-stately';\nimport {Placement} from 'react-aria';\nimport {PopoverBase} from './Popover';\nimport {pressScale} from './pressScale';\nimport {ProgressCircle} from './ProgressCircle';\nimport {TextFieldRef} from '@react-types/textfield';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useScale} from './utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ComboboxStyleProps {\n /**\n * The size of the Combobox.\n *\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL'\n}\nexport interface ComboBoxProps<T extends object> extends\n Omit<AriaComboBoxProps<T>, 'children' | 'style' | 'className' | 'defaultFilter' | 'allowsEmptyCollection'>,\n ComboboxStyleProps,\n StyleProps,\n SpectrumLabelableProps,\n HelpTextProps,\n Pick<ListBoxProps<T>, 'items' | 'dependencies'>,\n Pick<AriaPopoverProps, 'shouldFlip'>,\n Pick<AsyncLoadable, 'onLoadMore'> {\n /** The contents of the collection. */\n children: ReactNode | ((item: T) => ReactNode),\n /**\n * Direction the menu will render relative to the ComboBox.\n *\n * @default 'bottom'\n */\n direction?: 'bottom' | 'top',\n /**\n * Alignment of the menu relative to the input target.\n *\n * @default 'start'\n */\n align?: 'start' | 'end',\n /** Width of the menu. By default, matches width of the trigger. Note that the minimum width of the dropdown is always equal to the trigger's width. */\n menuWidth?: number,\n /** The current loading state of the ComboBox. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState\n}\n\nexport const ComboBoxContext = createContext<ContextValue<Partial<ComboBoxProps<any>>, TextFieldRef>>(null);\n\nconst inputButton = style<ButtonRenderProps & {isOpen: boolean, size: 'S' | 'M' | 'L' | 'XL'}>({\n ...controlBorderRadius('sm'),\n display: 'flex',\n outlineStyle: 'none',\n textAlign: 'center',\n borderStyle: 'none',\n alignItems: 'center',\n justifyContent: 'center',\n size: {\n size: {\n S: 16,\n M: 20,\n L: 24,\n XL: 32\n }\n },\n marginStart: 'text-to-control',\n aspectRatio: 'square',\n flexShrink: 0,\n transition: {\n default: 'default',\n forcedColors: 'none'\n },\n backgroundColor: {\n default: baseColor('gray-100'),\n isOpen: 'gray-200',\n isDisabled: 'disabled',\n forcedColors: {\n default: 'ButtonText',\n isHovered: 'Highlight',\n isOpen: 'Highlight',\n isDisabled: 'GrayText'\n }\n },\n color: {\n default: baseColor('neutral'),\n isDisabled: 'disabled',\n forcedColors: 'ButtonFace'\n }\n});\n\nconst iconStyles = style({\n flexShrink: 0,\n rotate: 90,\n '--iconPrimary': {\n type: 'fill',\n value: 'currentColor'\n }\n});\n\nconst loadingWrapperStyles = style({\n gridColumnStart: '1',\n gridColumnEnd: '-1',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n marginY: 8\n});\n\nconst progressCircleStyles = style({\n size: {\n size: {\n S: 16,\n M: 20,\n L: 22,\n XL: 26\n }\n },\n marginStart: {\n isInput: 'text-to-visual'\n }\n});\n\nconst emptyStateText = style({\n height: {\n size: {\n S: 24,\n M: 32,\n L: 40,\n XL: 48\n }\n },\n font: {\n size: {\n S: 'ui-sm',\n M: 'ui',\n L: 'ui-lg',\n XL: 'ui-xl'\n }\n },\n display: 'flex',\n alignItems: 'center',\n paddingStart: 'edge-to-text'\n});\n\nexport let listbox = style<{size: 'S' | 'M' | 'L' | 'XL'}>({\n width: 'full',\n boxSizing: 'border-box',\n maxHeight: '[inherit]',\n // TODO: Might help with horizontal scrolling happening on Windows, will need to check somehow. Otherwise, revert back to overflow: auto\n overflowY: 'auto',\n overflowX: 'hidden',\n fontFamily: 'sans',\n fontSize: controlFont()\n});\n\nexport let listboxItem = style({\n ...focusRing(),\n ...control({shape: 'default', wrap: true, icon: true}),\n columnGap: 0,\n paddingX: 0,\n paddingBottom: '--labelPadding',\n backgroundColor: {\n default: 'transparent',\n isFocused: baseColor('gray-100').isFocusVisible\n },\n color: {\n default: baseColor('neutral'),\n isDisabled: {\n default: 'disabled',\n forcedColors: 'GrayText'\n }\n },\n position: 'relative',\n gridColumnStart: 1,\n gridColumnEnd: -1,\n display: 'grid',\n gridTemplateAreas: [\n '. checkmark icon label .',\n '. . . description .'\n ],\n gridTemplateColumns: {\n size: {\n S: [edgeToText(24), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(24)],\n M: [edgeToText(32), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(32)],\n L: [edgeToText(40), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(40)],\n XL: [edgeToText(48), 'auto', 'auto', 'minmax(0, 1fr)', edgeToText(48)]\n }\n },\n gridTemplateRows: {\n // min-content prevents second row from 'auto'ing to a size larger then 0 when empty\n default: 'auto minmax(0, min-content)',\n ':has([slot=description])': 'auto auto'\n },\n rowGap: {\n ':has([slot=description])': space(1)\n },\n alignItems: 'baseline',\n minHeight: controlSize(),\n height: 'min',\n textDecoration: 'none',\n cursor: {\n default: 'default',\n isLink: 'pointer'\n },\n transition: 'default'\n}, getAllowedOverrides());\n\nexport let listboxHeader = style<{size?: 'S' | 'M' | 'L' | 'XL'}>({\n color: 'neutral',\n boxSizing: 'border-box',\n minHeight: controlSize(),\n paddingY: centerPadding(),\n marginX: {\n size: {\n S: `[${edgeToText(24)}]`,\n M: `[${edgeToText(32)}]`,\n L: `[${edgeToText(40)}]`,\n XL: `[${edgeToText(48)}]`\n }\n }\n});\n\nconst separatorWrapper = style({\n display: 'flex',\n marginX: {\n size: {\n S: `[${edgeToText(24)}]`,\n M: `[${edgeToText(32)}]`,\n L: `[${edgeToText(40)}]`,\n XL: `[${edgeToText(48)}]`\n }\n },\n height: 12,\n alignItems: 'center'\n});\n\nconst dividerStyle = style({\n backgroundColor: {\n default: 'gray-200',\n forcedColors: 'ButtonBorder'\n },\n borderRadius: 'full',\n height: '[2px]',\n width: 'full'\n});\n\n// Not from any design, just following the sizing of the existing rows\nexport const LOADER_ROW_HEIGHTS = {\n S: {\n medium: 24,\n large: 30\n },\n M: {\n medium: 32,\n large: 40\n },\n L: {\n medium: 40,\n large: 50\n },\n XL: {\n medium: 48,\n large: 60\n }\n};\n\nlet InternalComboboxContext = createContext<{size: 'S' | 'M' | 'L' | 'XL'}>({size: 'M'});\n\n/**\n * ComboBox allow users to choose a single option from a collapsible list of options when space is limited.\n */\nexport const ComboBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ComboBox<T extends object>(props: ComboBoxProps<T>, ref: Ref<TextFieldRef>) {\n [props, ref] = useSpectrumContextProps(props, ref, ComboBoxContext);\n\n let formContext = useContext(FormContext);\n props = useFormProps(props);\n let {\n size = 'M',\n labelPosition = 'top',\n UNSAFE_className = '',\n UNSAFE_style,\n loadingState,\n ...comboBoxProps\n } = props;\n\n return (\n <AriaComboBox\n {...comboBoxProps}\n allowsEmptyCollection={loadingState != null}\n style={UNSAFE_style}\n className={UNSAFE_className + style(field(), getAllowedOverrides())({\n isInForm: !!formContext,\n labelPosition,\n size\n }, props.styles)}>\n {({isDisabled, isOpen, isRequired, isInvalid}) => (\n <ComboboxInner {...props} isDisabled={isDisabled} isOpen={isOpen} isRequired={isRequired} isInvalid={isInvalid} ref={ref} />\n )}\n </AriaComboBox>\n );\n});\n\nexport interface ComboBoxItemProps extends Omit<ListBoxItemProps, 'children' | 'style' | 'className'>, StyleProps {\n children: ReactNode\n}\n\nconst checkmarkIconSize = {\n S: 'XS',\n M: 'M',\n L: 'L',\n XL: 'XL'\n} as const;\n\nexport function ComboBoxItem(props: ComboBoxItemProps): ReactNode {\n let ref = useRef(null);\n let isLink = props.href != null;\n let {size} = useContext(InternalComboboxContext);\n return (\n <ListBoxItem\n {...props}\n ref={ref}\n textValue={props.textValue || (typeof props.children === 'string' ? props.children as string : undefined)}\n style={pressScale(ref, props.UNSAFE_style)}\n className={renderProps => (props.UNSAFE_className || '') + listboxItem({...renderProps, size, isLink}, props.styles)}>\n {(renderProps) => {\n let {children} = props;\n return (\n <>\n <Provider\n values={[\n [IconContext, {\n slots: {\n icon: {render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}), styles: icon}\n }\n }],\n [TextContext, {\n slots: {\n label: {styles: label({size})},\n description: {styles: description({...renderProps, size})}\n }\n }]\n ]}>\n {!isLink && <CheckmarkIcon size={checkmarkIconSize[size]} className={checkmark({...renderProps, size})} />}\n {typeof children === 'string' ? <Text slot=\"label\">{children}</Text> : children}\n </Provider>\n </>\n );\n }}\n </ListBoxItem>\n );\n}\n\nexport interface ComboBoxSectionProps<T extends object> extends SectionProps<T> {}\nexport function ComboBoxSection<T extends object>(props: ComboBoxSectionProps<T>): ReactNode {\n let {size} = useContext(InternalComboboxContext);\n return (\n <>\n <AriaListBoxSection\n {...props}>\n {props.children}\n </AriaListBoxSection>\n <Divider size={size} />\n </>\n );\n}\n\nconst ComboboxInner = forwardRef(function ComboboxInner(props: ComboBoxProps<any> & {isOpen: boolean}, ref: ForwardedRef<TextFieldRef | null>) {\n let {\n direction = 'bottom',\n align = 'start',\n shouldFlip = true,\n menuWidth,\n label,\n description: descriptionMessage,\n errorMessage,\n children,\n defaultItems,\n items,\n size = 'M',\n labelPosition = 'top',\n labelAlign = 'start',\n necessityIndicator,\n loadingState,\n isDisabled,\n isOpen,\n isRequired,\n isInvalid,\n menuTrigger,\n onLoadMore\n } = props;\n\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n let inputRef = useRef<HTMLInputElement>(null);\n let domRef = useRef<HTMLDivElement>(null);\n let buttonRef = useRef<HTMLButtonElement>(null);\n // Expose imperative interface for ref\n useImperativeHandle(ref, () => ({\n ...createFocusableRef(domRef, inputRef),\n select() {\n if (inputRef.current) {\n inputRef.current.select();\n }\n },\n getInputElement() {\n return inputRef.current;\n }\n }));\n\n // Better way to encode this into a style? need to account for flipping\n let menuOffset: number;\n if (size === 'S') {\n menuOffset = 6;\n } else if (size === 'M') {\n menuOffset = 6;\n } else if (size === 'L') {\n menuOffset = 7;\n } else {\n menuOffset = 8;\n }\n\n let triggerRef = useRef<HTMLDivElement>(null);\n // Make menu width match input + button\n let [triggerWidth, setTriggerWidth] = useState<string | null>(null);\n let onResize = useCallback(() => {\n if (triggerRef.current) {\n let inputRect = triggerRef.current.getBoundingClientRect();\n let minX = inputRect.left;\n let maxX = inputRect.right;\n setTriggerWidth((maxX - minX) + 'px');\n }\n }, [triggerRef, setTriggerWidth]);\n\n useResizeObserver({\n ref: triggerRef,\n onResize: onResize\n });\n\n let state = useContext(ComboBoxStateContext);\n let timeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n let [showLoading, setShowLoading] = useState(false);\n let isLoadingOrFiltering = loadingState === 'loading' || loadingState === 'filtering';\n {/* Logic copied from S1 */}\n let showFieldSpinner = useMemo(() => showLoading && (isOpen || menuTrigger === 'manual' || loadingState === 'loading'), [showLoading, isOpen, menuTrigger, loadingState]);\n let spinnerId = useSlotId([showFieldSpinner]);\n\n let inputValue = state?.inputValue;\n let lastInputValue = useRef(inputValue);\n useEffect(() => {\n if (isLoadingOrFiltering && !showLoading) {\n if (timeout.current === null) {\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n\n // If user is typing, clear the timer and restart since it is a new request\n if (inputValue !== lastInputValue.current) {\n clearTimeout(timeout.current);\n timeout.current = setTimeout(() => {\n setShowLoading(true);\n }, 500);\n }\n } else if (!isLoadingOrFiltering) {\n // If loading is no longer happening, clear any timers and hide the loading circle\n setShowLoading(false);\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n }\n\n lastInputValue.current = inputValue;\n }, [isLoadingOrFiltering, showLoading, inputValue]);\n\n useEffect(() => {\n return () => {\n if (timeout.current) {\n clearTimeout(timeout.current);\n }\n timeout.current = null;\n };\n }, []);\n\n let renderer;\n let listBoxLoadingCircle = (\n <UNSTABLE_ListBoxLoadingSentinel\n // Only show the spinner in the list when loading more\n isLoading={loadingState === 'loadingMore'}\n onLoadMore={onLoadMore}\n className={loadingWrapperStyles}>\n <ProgressCircle\n isIndeterminate\n size=\"S\"\n styles={progressCircleStyles({size})}\n // Same loading string as table\n aria-label={stringFormatter.format('table.loadingMore')} />\n </UNSTABLE_ListBoxLoadingSentinel>\n );\n\n if (typeof children === 'function') {\n renderer = (\n <>\n <Collection items={items ?? defaultItems} dependencies={props.dependencies}>\n {children}\n </Collection>\n {listBoxLoadingCircle}\n </>\n );\n } else {\n // TODO: is there a case where the user might provide items to the Combobox but doesn't provide a function renderer?\n // Same case for other components that have this logic (TableView/CardView/Picker)\n renderer = (\n <>\n {children}\n {listBoxLoadingCircle}\n </>\n );\n }\n let scale = useScale();\n\n return (\n <>\n <InternalComboboxContext.Provider value={{size}}>\n <FieldLabel\n isDisabled={isDisabled}\n isRequired={isRequired}\n size={size}\n labelPosition={labelPosition}\n labelAlign={labelAlign}\n necessityIndicator={necessityIndicator}\n contextualHelp={props.contextualHelp}>\n {label}\n </FieldLabel>\n <FieldGroup\n ref={triggerRef}\n role=\"presentation\"\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n size={size}\n styles={style({\n ...fieldInput(),\n paddingStart: 'edge-to-text',\n // better way to do this one? it's not actually half, they are\n // [9, 4], [12, 6], [15, 8], [18, 8]\n // also noticed that our measurement is including the border, making the padding too much\n paddingEnd: 'calc(self(height, self(minHeight)) * 3 / 16)'\n })({size})}>\n <InputContext.Consumer>\n {ctx => (\n <InputContext.Provider value={{...ctx, ref: mergeRefs((ctx as any)?.ref, inputRef)}}>\n <Input aria-describedby={spinnerId} />\n </InputContext.Provider>\n )}\n </InputContext.Consumer>\n {isInvalid && <FieldErrorIcon isDisabled={isDisabled} />}\n {showFieldSpinner && (\n <ProgressCircle\n id={spinnerId}\n isIndeterminate\n size=\"S\"\n styles={progressCircleStyles({size, isInput: true})}\n aria-label={stringFormatter.format('table.loading')} />\n )}\n <Button\n ref={buttonRef}\n // Prevent press scale from sticking while ComboBox is open.\n // @ts-ignore\n isPressed={false}\n style={renderProps => pressScale(buttonRef)(renderProps)}\n className={renderProps => inputButton({\n ...renderProps,\n size,\n isOpen\n })}>\n <ChevronIcon\n size={size}\n className={iconStyles} />\n </Button>\n </FieldGroup>\n <HelpText\n size={size}\n isDisabled={isDisabled}\n isInvalid={isInvalid}\n description={descriptionMessage}>\n {errorMessage}\n </HelpText>\n <PopoverBase\n hideArrow\n triggerRef={triggerRef}\n offset={menuOffset}\n placement={`${direction} ${align}` as Placement}\n shouldFlip={shouldFlip}\n UNSAFE_style={{\n width: menuWidth ? `${menuWidth}px` : undefined,\n // manually subtract border as we can't set Popover to border-box, it causes the contents to spill out\n '--trigger-width': `calc(${triggerWidth} - 2px)`\n } as CSSProperties}\n styles={style({\n minWidth: '--trigger-width',\n width: '--trigger-width'\n })}>\n <Provider\n values={[\n [HeaderContext, {styles: listboxHeader({size})}],\n [HeadingContext, {\n // @ts-ignore\n role: 'presentation',\n styles: sectionHeading\n }],\n [TextContext, {\n slots: {\n 'description': {styles: description({size})}\n }\n }]\n ]}>\n <Virtualizer\n layout={ListLayout}\n layoutOptions={{\n estimatedRowHeight: 32,\n padding: 8,\n estimatedHeadingHeight: 50,\n loaderHeight: LOADER_ROW_HEIGHTS[size][scale]\n }}>\n <ListBox\n dependencies={props.dependencies}\n renderEmptyState={() => (\n <span className={emptyStateText({size})}>\n {loadingState === 'loading' ? stringFormatter.format('table.loading') : stringFormatter.format('combobox.noResults')}\n </span>\n )}\n items={items}\n className={listbox({size})}>\n {renderer}\n </ListBox>\n </Virtualizer>\n </Provider>\n </PopoverBase>\n </InternalComboboxContext.Provider>\n </>\n );\n});\n\nexport const Divider = /*#__PURE__*/ createLeafComponent('separator', function Divider({size}: {size?: 'S' | 'M' | 'L' | 'XL'}, ref: ForwardedRef<HTMLDivElement>, node: Node<unknown>) {\n let listState = useContext(ListStateContext)!;\n\n let nextNode = node.nextKey != null && listState.collection.getItem(node.nextKey);\n if (node.prevKey == null || !nextNode || nextNode.type === 'separator' || (nextNode.type === 'loader' && nextNode.nextKey == null)) {\n return null;\n }\n\n return (\n <div className={separatorWrapper({size})}>\n <div ref={ref} className={dividerStyle} />\n </div>\n );\n});\n"],"names":[],"version":3,"file":"ComboBox.cjs.map"}