@cimpress-ui/react 1.8.0 → 1.8.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 (73) hide show
  1. package/dist/commonjs/components/app-header/app-header.d.ts.map +1 -1
  2. package/dist/commonjs/components/app-header/app-header.js +1 -1
  3. package/dist/commonjs/components/app-header/app-header.js.map +1 -1
  4. package/dist/commonjs/components/copy/copy-button.d.ts +7 -0
  5. package/dist/commonjs/components/copy/copy-button.d.ts.map +1 -1
  6. package/dist/commonjs/components/copy/copy-button.js +42 -7
  7. package/dist/commonjs/components/copy/copy-button.js.map +1 -1
  8. package/dist/commonjs/components/copy/use-copy.d.ts.map +1 -1
  9. package/dist/commonjs/components/copy/use-copy.js +10 -10
  10. package/dist/commonjs/components/copy/use-copy.js.map +1 -1
  11. package/dist/commonjs/components/date-picker/views/multi-year/use-multi-year-view-state.js +4 -7
  12. package/dist/commonjs/components/date-picker/views/multi-year/use-multi-year-view-state.js.map +1 -1
  13. package/dist/commonjs/components/select/select.d.ts +7 -1
  14. package/dist/commonjs/components/select/select.d.ts.map +1 -1
  15. package/dist/commonjs/components/select/select.js +2 -2
  16. package/dist/commonjs/components/select/select.js.map +1 -1
  17. package/dist/commonjs/components/table/contexts/column-collection.d.ts.map +1 -1
  18. package/dist/commonjs/components/table/contexts/column-collection.js +0 -1
  19. package/dist/commonjs/components/table/contexts/column-collection.js.map +1 -1
  20. package/dist/commonjs/components/table/contexts/row-state.js.map +1 -1
  21. package/dist/commonjs/components/table/contexts/table-state.js.map +1 -1
  22. package/dist/commonjs/components/table/hooks/use-table-cell.js.map +1 -1
  23. package/dist/commonjs/components/tag-field/tag-field-list-box.js +5 -2
  24. package/dist/commonjs/components/tag-field/tag-field-list-box.js.map +1 -1
  25. package/dist/commonjs/components/tag-field/tag-field-tags.js +2 -0
  26. package/dist/commonjs/components/tag-field/tag-field-tags.js.map +1 -1
  27. package/dist/commonjs/components/tag-field/tag-field.js +1 -1
  28. package/dist/commonjs/components/tag-field/tag-field.js.map +1 -1
  29. package/dist/commonjs/components/toggle-button/internal-toggle-button.js +7 -7
  30. package/dist/commonjs/components/toggle-button/internal-toggle-button.js.map +1 -1
  31. package/dist/commonjs/components/toggle-button/toggle-button-group.d.ts.map +1 -1
  32. package/dist/commonjs/components/toggle-button/toggle-button-group.js +3 -0
  33. package/dist/commonjs/components/toggle-button/toggle-button-group.js.map +1 -1
  34. package/dist/esm/components/app-header/app-header.d.ts.map +1 -1
  35. package/dist/esm/components/app-header/app-header.js +1 -1
  36. package/dist/esm/components/app-header/app-header.js.map +1 -1
  37. package/dist/esm/components/copy/copy-button.d.ts +7 -0
  38. package/dist/esm/components/copy/copy-button.d.ts.map +1 -1
  39. package/dist/esm/components/copy/copy-button.js +42 -7
  40. package/dist/esm/components/copy/copy-button.js.map +1 -1
  41. package/dist/esm/components/copy/use-copy.d.ts.map +1 -1
  42. package/dist/esm/components/copy/use-copy.js +11 -11
  43. package/dist/esm/components/copy/use-copy.js.map +1 -1
  44. package/dist/esm/components/date-picker/views/multi-year/use-multi-year-view-state.js +4 -7
  45. package/dist/esm/components/date-picker/views/multi-year/use-multi-year-view-state.js.map +1 -1
  46. package/dist/esm/components/select/select.d.ts +7 -1
  47. package/dist/esm/components/select/select.d.ts.map +1 -1
  48. package/dist/esm/components/select/select.js +2 -2
  49. package/dist/esm/components/select/select.js.map +1 -1
  50. package/dist/esm/components/table/contexts/column-collection.d.ts.map +1 -1
  51. package/dist/esm/components/table/contexts/column-collection.js +0 -1
  52. package/dist/esm/components/table/contexts/column-collection.js.map +1 -1
  53. package/dist/esm/components/table/contexts/row-state.js +2 -2
  54. package/dist/esm/components/table/contexts/row-state.js.map +1 -1
  55. package/dist/esm/components/table/contexts/table-state.js +2 -2
  56. package/dist/esm/components/table/contexts/table-state.js.map +1 -1
  57. package/dist/esm/components/table/hooks/use-table-cell.js +2 -2
  58. package/dist/esm/components/table/hooks/use-table-cell.js.map +1 -1
  59. package/dist/esm/components/tag-field/tag-field-list-box.js +5 -2
  60. package/dist/esm/components/tag-field/tag-field-list-box.js.map +1 -1
  61. package/dist/esm/components/tag-field/tag-field-tags.js +2 -0
  62. package/dist/esm/components/tag-field/tag-field-tags.js.map +1 -1
  63. package/dist/esm/components/tag-field/tag-field.js +1 -1
  64. package/dist/esm/components/tag-field/tag-field.js.map +1 -1
  65. package/dist/esm/components/toggle-button/internal-toggle-button.js +7 -7
  66. package/dist/esm/components/toggle-button/internal-toggle-button.js.map +1 -1
  67. package/dist/esm/components/toggle-button/toggle-button-group.d.ts.map +1 -1
  68. package/dist/esm/components/toggle-button/toggle-button-group.js +3 -0
  69. package/dist/esm/components/toggle-button/toggle-button-group.js.map +1 -1
  70. package/dist-styles/core.css +1 -1
  71. package/dist-styles/normalize.css +1 -1
  72. package/dist-styles/styles.css +1 -1
  73. package/package.json +16 -16
@@ -21,16 +21,13 @@ export function useMultiYearViewState() {
21
21
  calendar: focusedDate.calendar.identifier,
22
22
  timeZone: calendarState.timeZone,
23
23
  });
24
- let startYear = (Math.ceil(focusedDate.year / YEARS_PER_SECTION) - 1) * YEARS_PER_SECTION + 1;
25
- let endYear = startYear + YEARS_PER_SECTION - 1;
24
+ const lowerYear = (Math.ceil(focusedDate.year / YEARS_PER_SECTION) - 1) * YEARS_PER_SECTION + 1;
25
+ const higherYear = lowerYear + YEARS_PER_SECTION - 1;
26
26
  // Years are always represented by positive numbers.
27
27
  // If era implies negative years, flip start and end.
28
28
  const isNegativeEra = focusedDate.era === 'BC';
29
- if (isNegativeEra) {
30
- const temp = startYear;
31
- startYear = endYear;
32
- endYear = temp;
33
- }
29
+ const startYear = isNegativeEra ? higherYear : lowerYear;
30
+ const endYear = isNegativeEra ? lowerYear : higherYear;
34
31
  const data = useMemo(() => {
35
32
  const rowCount = Math.ceil(YEARS_PER_SECTION / ITEMS_PER_ROW);
36
33
  const result = new Array(rowCount);
@@ -1 +1 @@
1
- {"version":3,"file":"use-multi-year-view-state.js","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/multi-year/use-multi-year-view-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { endOfYear, isSameDay, isSameYear, startOfYear, today, type CalendarDate } from '@internationalized/date';\nimport { useContext, useMemo, useState } from 'react';\nimport { useDateFormatter } from 'react-aria';\nimport { CalendarStateContext as RACCalendarStateContext } from 'react-aria-components';\nimport { useLocalizedMessages } from '../../../../i18n/index.js';\nimport { constrainValue, getEraFormat, isDateInvalid } from '../../utils.js';\nimport type { ViewGridCellData, ViewGridState } from '../types.js';\nimport { useDatePickerView } from '../view-provider.js';\n\nconst ITEMS_PER_ROW = 4;\nconst YEARS_PER_SECTION = 20;\nconst YEARS_SKIP_AMOUNT = 100;\n\n/** @internal */\nexport function useMultiYearViewState(): ViewGridState {\n const calendarState = useContext(RACCalendarStateContext)!;\n const { switchToView, focusedDate, setFocusedDate } = useDatePickerView();\n const messages = useLocalizedMessages('datePicker');\n const [isFocused, setIsFocused] = useState(true);\n\n const currentDate = useMemo(() => today(calendarState.timeZone), [calendarState.timeZone]);\n\n const yearFormatter = useDateFormatter({\n year: 'numeric',\n era: getEraFormat(focusedDate),\n calendar: focusedDate.calendar.identifier,\n timeZone: calendarState.timeZone,\n });\n\n let startYear = (Math.ceil(focusedDate.year / YEARS_PER_SECTION) - 1) * YEARS_PER_SECTION + 1;\n let endYear = startYear + YEARS_PER_SECTION - 1;\n\n // Years are always represented by positive numbers.\n // If era implies negative years, flip start and end.\n const isNegativeEra = focusedDate.era === 'BC';\n if (isNegativeEra) {\n const temp = startYear;\n startYear = endYear;\n endYear = temp;\n }\n\n const data: (ViewGridCellData | null)[][] = useMemo(() => {\n const rowCount = Math.ceil(YEARS_PER_SECTION / ITEMS_PER_ROW);\n const result: (ViewGridCellData | null)[][] = new Array(rowCount);\n\n for (let rowIdx = 0; rowIdx < rowCount; rowIdx++) {\n result[rowIdx] = new Array(ITEMS_PER_ROW).fill(null);\n }\n\n for (let yearIdx = 0; yearIdx < YEARS_PER_SECTION; yearIdx++) {\n const rowIdx = Math.floor(yearIdx / ITEMS_PER_ROW);\n const colIdx = yearIdx % ITEMS_PER_ROW;\n\n const yearToSet = startYear + (isNegativeEra ? -yearIdx : yearIdx);\n const date = focusedDate.set({ year: yearToSet });\n\n if (date.year !== yearToSet) {\n // Reached minimum/maximum date\n continue;\n }\n\n const content = yearFormatter.format(date.toDate(calendarState.timeZone));\n\n result[rowIdx]![colIdx] = {\n date,\n content,\n ariaLabel: content,\n isCurrent: isSameYear(date, currentDate),\n };\n }\n\n return result;\n }, [startYear, calendarState.timeZone, focusedDate, yearFormatter, isNegativeEra, currentDate]);\n\n const focusCell = (date: CalendarDate) => {\n setFocusedDate(constrainValue(date, calendarState.minValue, calendarState.maxValue));\n };\n\n return {\n header: yearFormatter.formatRange(\n focusedDate.set({ year: startYear }).toDate(calendarState.timeZone),\n focusedDate.set({ year: endYear }).toDate(calendarState.timeZone),\n ),\n previousLabel: messages.format('previousMultiYearSection', { yearCount: 20 }),\n nextLabel: messages.format('nextMultiYearSection', { yearCount: 20 }),\n data,\n isReadOnly: calendarState.isReadOnly,\n isDisabled: calendarState.isDisabled,\n isFocused,\n setIsFocused,\n focusedDate,\n setFocusedDate,\n timeZone: calendarState.timeZone,\n focusPreviousItem() {\n focusCell(focusedDate.subtract({ years: 1 }));\n },\n focusNextItem() {\n focusCell(focusedDate.add({ years: 1 }));\n },\n focusPreviousRow() {\n focusCell(focusedDate.subtract({ years: ITEMS_PER_ROW }));\n },\n focusNextRow() {\n focusCell(focusedDate.add({ years: ITEMS_PER_ROW }));\n },\n focusSectionStart() {\n focusCell(focusedDate.set({ year: startYear }));\n },\n focusSectionEnd() {\n focusCell(focusedDate.set({ year: endYear }));\n },\n focusPreviousSection(shouldSkip) {\n focusCell(focusedDate.subtract({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));\n },\n focusNextSection(shouldSkip) {\n focusCell(focusedDate.add({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));\n },\n isPreviousSectionInvalid() {\n const current = startOfYear(focusedDate.set({ year: startYear }));\n const prev = current.subtract({ days: 1 });\n\n return (\n isDateInvalid(current, calendarState.minValue, calendarState.maxValue) ||\n isDateInvalid(prev, calendarState.minValue, calendarState.maxValue) ||\n isSameDay(prev, current)\n );\n },\n isNextSectionInvalid() {\n const current = endOfYear(focusedDate.set({ year: endYear }));\n const next = current.add({ days: 1 });\n\n return (\n isDateInvalid(current, calendarState.minValue, calendarState.maxValue) ||\n isDateInvalid(next, calendarState.minValue, calendarState.maxValue) ||\n isSameDay(next, current)\n );\n },\n selectFocusedDate() {\n switchToView('year');\n },\n isCellDisabled(date) {\n return (\n isDateInvalid(endOfYear(date), calendarState.minValue, null) ||\n isDateInvalid(startOfYear(date), null, calendarState.maxValue)\n );\n },\n isCellSelected(date) {\n return calendarState.value !== null && isSameYear(date, calendarState.value);\n },\n isCellTabbable(date) {\n return isSameYear(date, focusedDate);\n },\n };\n}\n"]}
1
+ {"version":3,"file":"use-multi-year-view-state.js","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/multi-year/use-multi-year-view-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { endOfYear, isSameDay, isSameYear, startOfYear, today, type CalendarDate } from '@internationalized/date';\nimport { useContext, useMemo, useState } from 'react';\nimport { useDateFormatter } from 'react-aria';\nimport { CalendarStateContext as RACCalendarStateContext } from 'react-aria-components';\nimport { useLocalizedMessages } from '../../../../i18n/index.js';\nimport { constrainValue, getEraFormat, isDateInvalid } from '../../utils.js';\nimport type { ViewGridCellData, ViewGridState } from '../types.js';\nimport { useDatePickerView } from '../view-provider.js';\n\nconst ITEMS_PER_ROW = 4;\nconst YEARS_PER_SECTION = 20;\nconst YEARS_SKIP_AMOUNT = 100;\n\n/** @internal */\nexport function useMultiYearViewState(): ViewGridState {\n const calendarState = useContext(RACCalendarStateContext)!;\n const { switchToView, focusedDate, setFocusedDate } = useDatePickerView();\n const messages = useLocalizedMessages('datePicker');\n const [isFocused, setIsFocused] = useState(true);\n\n const currentDate = useMemo(() => today(calendarState.timeZone), [calendarState.timeZone]);\n\n const yearFormatter = useDateFormatter({\n year: 'numeric',\n era: getEraFormat(focusedDate),\n calendar: focusedDate.calendar.identifier,\n timeZone: calendarState.timeZone,\n });\n\n const lowerYear = (Math.ceil(focusedDate.year / YEARS_PER_SECTION) - 1) * YEARS_PER_SECTION + 1;\n const higherYear = lowerYear + YEARS_PER_SECTION - 1;\n\n // Years are always represented by positive numbers.\n // If era implies negative years, flip start and end.\n const isNegativeEra = focusedDate.era === 'BC';\n const startYear = isNegativeEra ? higherYear : lowerYear;\n const endYear = isNegativeEra ? lowerYear : higherYear;\n\n const data: (ViewGridCellData | null)[][] = useMemo(() => {\n const rowCount = Math.ceil(YEARS_PER_SECTION / ITEMS_PER_ROW);\n const result: (ViewGridCellData | null)[][] = new Array(rowCount);\n\n for (let rowIdx = 0; rowIdx < rowCount; rowIdx++) {\n result[rowIdx] = new Array(ITEMS_PER_ROW).fill(null);\n }\n\n for (let yearIdx = 0; yearIdx < YEARS_PER_SECTION; yearIdx++) {\n const rowIdx = Math.floor(yearIdx / ITEMS_PER_ROW);\n const colIdx = yearIdx % ITEMS_PER_ROW;\n\n const yearToSet = startYear + (isNegativeEra ? -yearIdx : yearIdx);\n const date = focusedDate.set({ year: yearToSet });\n\n if (date.year !== yearToSet) {\n // Reached minimum/maximum date\n continue;\n }\n\n const content = yearFormatter.format(date.toDate(calendarState.timeZone));\n\n result[rowIdx]![colIdx] = {\n date,\n content,\n ariaLabel: content,\n isCurrent: isSameYear(date, currentDate),\n };\n }\n\n return result;\n }, [startYear, calendarState.timeZone, focusedDate, yearFormatter, isNegativeEra, currentDate]);\n\n const focusCell = (date: CalendarDate) => {\n setFocusedDate(constrainValue(date, calendarState.minValue, calendarState.maxValue));\n };\n\n return {\n header: yearFormatter.formatRange(\n focusedDate.set({ year: startYear }).toDate(calendarState.timeZone),\n focusedDate.set({ year: endYear }).toDate(calendarState.timeZone),\n ),\n previousLabel: messages.format('previousMultiYearSection', { yearCount: 20 }),\n nextLabel: messages.format('nextMultiYearSection', { yearCount: 20 }),\n data,\n isReadOnly: calendarState.isReadOnly,\n isDisabled: calendarState.isDisabled,\n isFocused,\n setIsFocused,\n focusedDate,\n setFocusedDate,\n timeZone: calendarState.timeZone,\n focusPreviousItem() {\n focusCell(focusedDate.subtract({ years: 1 }));\n },\n focusNextItem() {\n focusCell(focusedDate.add({ years: 1 }));\n },\n focusPreviousRow() {\n focusCell(focusedDate.subtract({ years: ITEMS_PER_ROW }));\n },\n focusNextRow() {\n focusCell(focusedDate.add({ years: ITEMS_PER_ROW }));\n },\n focusSectionStart() {\n focusCell(focusedDate.set({ year: startYear }));\n },\n focusSectionEnd() {\n focusCell(focusedDate.set({ year: endYear }));\n },\n focusPreviousSection(shouldSkip) {\n focusCell(focusedDate.subtract({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));\n },\n focusNextSection(shouldSkip) {\n focusCell(focusedDate.add({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));\n },\n isPreviousSectionInvalid() {\n const current = startOfYear(focusedDate.set({ year: startYear }));\n const prev = current.subtract({ days: 1 });\n\n return (\n isDateInvalid(current, calendarState.minValue, calendarState.maxValue) ||\n isDateInvalid(prev, calendarState.minValue, calendarState.maxValue) ||\n isSameDay(prev, current)\n );\n },\n isNextSectionInvalid() {\n const current = endOfYear(focusedDate.set({ year: endYear }));\n const next = current.add({ days: 1 });\n\n return (\n isDateInvalid(current, calendarState.minValue, calendarState.maxValue) ||\n isDateInvalid(next, calendarState.minValue, calendarState.maxValue) ||\n isSameDay(next, current)\n );\n },\n selectFocusedDate() {\n switchToView('year');\n },\n isCellDisabled(date) {\n return (\n isDateInvalid(endOfYear(date), calendarState.minValue, null) ||\n isDateInvalid(startOfYear(date), null, calendarState.maxValue)\n );\n },\n isCellSelected(date) {\n return calendarState.value !== null && isSameYear(date, calendarState.value);\n },\n isCellTabbable(date) {\n return isSameYear(date, focusedDate);\n },\n };\n}\n"]}
@@ -1,7 +1,13 @@
1
1
  import { type UIEventHandler } from 'react';
2
2
  import { type ListBoxItemProps as RACListBoxItemProps, type SelectProps as RACSelectProps } from 'react-aria-components';
3
3
  import type { ApiProps, AsyncItemLoadingProps, CollectionItem, CollectionProps, CommonProps, FieldProps, Key, StringLikeChildren } from '../types.js';
4
- export interface SelectProps<T extends CollectionItem = CollectionItem> extends CommonProps, FieldProps<Key>, CollectionProps<T>, AsyncItemLoadingProps, ApiProps<SelectApi>, Pick<RACSelectProps<T>, 'isDisabled' | 'isRequired' | 'isInvalid' | 'selectedKey' | 'defaultSelectedKey' | 'autoComplete' | 'autoFocus' | 'onSelectionChange' | 'placeholder' | 'onFocus' | 'onBlur' | 'onOpenChange'> {
4
+ export interface SelectProps<T extends CollectionItem = CollectionItem> extends CommonProps, FieldProps<Key>, CollectionProps<T>, AsyncItemLoadingProps, ApiProps<SelectApi>, Pick<RACSelectProps<T>, 'isDisabled' | 'isRequired' | 'isInvalid' | 'autoComplete' | 'autoFocus' | 'placeholder' | 'onFocus' | 'onBlur' | 'onOpenChange'> {
5
+ /** The currently selected key in the collection (controlled). */
6
+ selectedKey?: Key | null;
7
+ /** The initial selected key in the collection (uncontrolled). */
8
+ defaultSelectedKey?: Key;
9
+ /** Handler that is called when the selection changes. */
10
+ onSelectionChange?: (key: Key | null) => void;
5
11
  /**
6
12
  * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.
7
13
  * @default false
@@ -1 +1 @@
1
- {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,KAAK,cAAc,EAA+B,MAAM,OAAO,CAAC;AAC5F,OAAO,EAaL,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,WAAW,IAAI,cAAc,EAEnC,MAAM,uBAAuB,CAAC;AAW/B,OAAO,KAAK,EACV,QAAQ,EACR,qBAAqB,EACrB,cAAc,EACd,eAAe,EACf,WAAW,EACX,UAAU,EACV,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAWrB,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACpE,SAAQ,WAAW,EACjB,UAAU,CAAC,GAAG,CAAC,EACf,eAAe,CAAC,CAAC,CAAC,EAClB,qBAAqB,EACrB,QAAQ,CAAC,SAAS,CAAC,EACnB,IAAI,CACF,cAAc,CAAC,CAAC,CAAC,EACf,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,aAAa,GACb,oBAAoB,GACpB,cAAc,GACd,WAAW,GACX,mBAAmB,GACnB,aAAa,GACb,SAAS,GACT,QAAQ,GACR,cAAc,CACjB;IACH;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CAC3C;AAED,4DAA4D;AAC5D,MAAM,WAAW,SAAS;IACxB,8DAA8D;IAC9D,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AA0FD;;;;GAIG;AACH,QAAA,MAAM,OAAO,GA7FG,CAAC,SAAS,cAAc,+JA6FoB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAE7B,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;IAC9G,0EAA0E;IAC1E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,2CAA2C;IAC3C,QAAQ,EAAE,kBAAkB,CAAC;CAC9B;AAED,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAgBjE;yBAhBe,UAAU;;;AAoB1B,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACtF,6EAA6E;IAC7E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wDAAwD;AACxD,wBAAgB,aAAa,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,CAAC,CAAC,2CAelH;yBAfe,aAAa"}
1
+ {"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAqB,KAAK,cAAc,EAA+B,MAAM,OAAO,CAAC;AAC5F,OAAO,EAaL,KAAK,gBAAgB,IAAI,mBAAmB,EAC5C,KAAK,WAAW,IAAI,cAAc,EAEnC,MAAM,uBAAuB,CAAC;AAW/B,OAAO,KAAK,EACV,QAAQ,EACR,qBAAqB,EACrB,cAAc,EACd,eAAe,EACf,WAAW,EACX,UAAU,EACV,GAAG,EACH,kBAAkB,EACnB,MAAM,aAAa,CAAC;AAWrB,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,cAAc,GAAG,cAAc,CACpE,SAAQ,WAAW,EACjB,UAAU,CAAC,GAAG,CAAC,EACf,eAAe,CAAC,CAAC,CAAC,EAClB,qBAAqB,EACrB,QAAQ,CAAC,SAAS,CAAC,EACnB,IAAI,CACF,cAAc,CAAC,CAAC,CAAC,EACf,YAAY,GACZ,YAAY,GACZ,WAAW,GACX,cAAc,GACd,WAAW,GACX,aAAa,GACb,SAAS,GACT,QAAQ,GACR,cAAc,CACjB;IACH,iEAAiE;IACjE,WAAW,CAAC,EAAE,GAAG,GAAG,IAAI,CAAC;IACzB,iEAAiE;IACjE,kBAAkB,CAAC,EAAE,GAAG,CAAC;IACzB,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CAC3C;AAED,4DAA4D;AAC5D,MAAM,WAAW,SAAS;IACxB,8DAA8D;IAC9D,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB;AAqGD;;;;GAIG;AACH,QAAA,MAAM,OAAO,GAxGG,CAAC,SAAS,cAAc,+JAwGoB,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAE7B,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,YAAY,GAAG,cAAc,GAAG,YAAY,CAAC;IAC9G,0EAA0E;IAC1E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,2CAA2C;IAC3C,QAAQ,EAAE,kBAAkB,CAAC;CAC9B;AAED,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAgBjE;yBAhBe,UAAU;;;AAoB1B,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,eAAe,CAAC,CAAC,CAAC;IACtF,6EAA6E;IAC7E,EAAE,CAAC,EAAE,GAAG,CAAC;IACT,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wDAAwD;AACxD,wBAAgB,aAAa,CAAC,CAAC,SAAS,cAAc,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,CAAC,CAAC,CAAC,2CAelH;yBAfe,aAAa"}
@@ -21,7 +21,7 @@ const VIRTUAL_LAYOUT_OPTIONS = {
21
21
  padding: 0,
22
22
  gap: 0,
23
23
  };
24
- function Select({ children, items, label, description, error, UNSAFE_className, UNSAFE_style, onScroll, isVirtualized = false, apiRef, UNSTABLE_isLoading: isLoading, UNSTABLE_onLoadMore: onLoadMore, ...props }, ref) {
24
+ function Select({ children, items, label, description, error, UNSAFE_className, UNSAFE_style, onScroll, isVirtualized = false, apiRef, UNSTABLE_isLoading: isLoading, UNSTABLE_onLoadMore: onLoadMore, selectedKey, defaultSelectedKey, onSelectionChange, ...props }, ref) {
25
25
  const triggerRef = useRef(null);
26
26
  const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;
27
27
  useProductionWarning(() => {
@@ -37,7 +37,7 @@ function Select({ children, items, label, description, error, UNSAFE_className,
37
37
  focus: () => triggerRef.current?.focus(),
38
38
  }), []);
39
39
  const listBox = (_jsxs(RACListBox, { className: "cim-select-listbox", onScroll: onScroll, renderEmptyState: () => isLoading ? _jsx(Spinner, { "aria-label": collectionMessages.format('loading'), size: "small", marginY: 8 }) : null, children: [_jsx(RACCollection, { items: items, children: children }), _jsx(RACListBoxLoadMoreItem, { onLoadMore: onLoadMore, isLoading: isLoading, children: _jsx(Spinner, { "aria-label": collectionMessages.format('loadingMore'), size: "small", marginY: 8 }) })] }));
40
- return (_jsxs(RACSelect, { ...props, ref: ref, className: clsx('cim-select', UNSAFE_className), style: UNSAFE_style, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACButton, { ref: triggerRef, className: "cim-select-button", children: [_jsx(RACSelectValue, { className: (values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' })), children: ({ selectedText }) => selectedText }), _jsx(IconChevronDown, {})] }), _jsx(FormFieldError, { children: error }), _jsx(FormFieldDescription, { children: description }), _jsx(CollapsibleList, { offset: 5, maxHeight: 315, children: isVirtualized ? (_jsx(RACVirtualizer, { layout: RACListLayout, layoutOptions: VIRTUAL_LAYOUT_OPTIONS, children: listBox })) : (listBox) })] }));
40
+ return (_jsxs(RACSelect, { ...props, ref: ref, className: clsx('cim-select', UNSAFE_className), style: UNSAFE_style, value: selectedKey, defaultValue: defaultSelectedKey, onChange: onSelectionChange, children: [_jsx(FormFieldLabel, { isRequired: props.isRequired, isDisabled: props.isDisabled, children: label }), _jsxs(RACButton, { ref: triggerRef, className: "cim-select-button", children: [_jsx(RACSelectValue, { className: (values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' })), children: ({ selectedText }) => selectedText }), _jsx(IconChevronDown, {})] }), _jsx(FormFieldError, { children: error }), _jsx(FormFieldDescription, { children: description }), _jsx(CollapsibleList, { offset: 5, maxHeight: 315, children: isVirtualized ? (_jsx(RACVirtualizer, { layout: RACListLayout, layoutOptions: VIRTUAL_LAYOUT_OPTIONS, children: listBox })) : (listBox) })] }));
41
41
  }
42
42
  /**
43
43
  * Allows users to select one item from a collapsible list.
@@ -1 +1 @@
1
- {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAA0C,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC5F,OAAO,EACL,MAAM,IAAI,SAAS,EACnB,UAAU,IAAI,aAAa,EAC3B,MAAM,IAAI,SAAS,EACnB,OAAO,IAAI,UAAU,EACrB,mBAAmB,IAAI,sBAAsB,EAC7C,WAAW,IAAI,cAAc,EAC7B,cAAc,IAAI,iBAAiB,EACnC,UAAU,IAAI,aAAa,EAE3B,MAAM,IAAI,SAAS,EACnB,WAAW,IAAI,cAAc,EAC7B,IAAI,IAAI,OAAO,EAGf,WAAW,IAAI,cAAc,GAC9B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAC5D,OAAO,EAAE,0BAA0B,EAAE,MAAM,+CAA+C,CAAC;AAC3F,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,eAAe,EAAE,MAAM,kDAAkD,CAAC;AACnF,OAAO,EAAE,oBAAoB,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAC5G,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAWhD,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAEnD,MAAM,sBAAsB,GAAyB;IACnD,SAAS,EAAE,EAAE;IACb,aAAa,EAAE,EAAE;IACjB,YAAY,EAAE,EAAE;IAChB,OAAO,EAAE,CAAC;IACV,GAAG,EAAE,CAAC;CACP,CAAC;AAsCF,SAAS,MAAM,CACb,EACE,QAAQ,EACR,KAAK,EACL,KAAK,EACL,WAAW,EACX,KAAK,EACL,gBAAgB,EAChB,YAAY,EACZ,QAAQ,EACR,aAAa,GAAG,KAAK,EACrB,MAAM,EACN,kBAAkB,EAAE,SAAS,EAC7B,mBAAmB,EAAE,UAAU,EAC/B,GAAG,KAAK,EACO,EACjB,GAAiC;IAEjC,MAAM,UAAU,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEnD,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,GAAG,KAAK,CAAC;IAE7E,oBAAoB,CAAC,GAAG,EAAE;QACxB,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,cAAc,EAAE,CAAC;YAC5C,OAAO,CAAC,IAAI,CAAC,+EAA+E,CAAC,CAAC;QAChG,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC;IAEvC,IAAI,CAAC,YAAY,EAAE,IAAI,KAAK,IAAI,IAAI,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;QACvE,OAAO,CAAC,IAAI,CAAC,uEAAuE,CAAC,CAAC;IACxF,CAAC;IAED,MAAM,kBAAkB,GAAG,oBAAoB,CAAC,qBAAqB,CAAC,CAAC;IAEvE,mBAAmB,CACjB,MAAM,EACN,GAAG,EAAE,CAAC,CAAC;QACL,KAAK,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE;KACzC,CAAC,EACF,EAAE,CACH,CAAC;IAEF,MAAM,OAAO,GAAG,CACd,MAAC,UAAU,IACT,SAAS,EAAC,oBAAoB,EAC9B,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,GAAG,EAAE,CACrB,SAAS,CAAC,CAAC,CAAC,KAAC,OAAO,kBAAa,kBAAkB,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,GAAI,CAAC,CAAC,CAAC,IAAI,aAG3G,KAAC,aAAa,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAiB,EACvD,KAAC,sBAAsB,IAAC,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,SAAS,YAClE,KAAC,OAAO,kBAAa,kBAAkB,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,CAAC,GAAI,GACnE,IACd,CACd,CAAC;IAEF,OAAO,CACL,MAAC,SAAS,OAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,YAAY,EAAE,gBAAgB,CAAC,EAAE,KAAK,EAAE,YAAY,aAClG,KAAC,cAAc,IAAC,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,YACvE,KAAK,GACS,EACjB,MAAC,SAAS,IAAC,GAAG,EAAE,UAAU,EAAE,SAAS,EAAC,mBAAmB,aACvD,KAAC,cAAc,IACb,SAAS,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAAC,YAEvG,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,YAAY,GACpB,EACjB,KAAC,eAAe,KAAG,IACT,EACZ,KAAC,cAAc,cAAE,KAAK,GAAkB,EACxC,KAAC,oBAAoB,cAAE,WAAW,GAAwB,EAC1D,KAAC,eAAe,IACd,MAAM,EAAE,CAAC,EACT,SAAS,EAAE,GAAG,YAEb,aAAa,CAAC,CAAC,CAAC,CACf,KAAC,cAAc,IAAC,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,sBAAsB,YACzE,OAAO,GACO,CAClB,CAAC,CAAC,CAAC,CACF,OAAO,CACR,GACe,IACR,CACb,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,OAAO,GAAG,cAAc,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE,QAAQ,CAAC,CAAC;AAE7D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,CAAC;AAS7B,kDAAkD;AAClD,MAAM,UAAU,UAAU,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAmB;IAChE,MAAM,SAAS,GAAG,0BAA0B,CAAC,QAAQ,CAAC,CAAC;IAEvD,OAAO,CACL,KAAC,cAAc,OAAK,KAAK,EAAE,SAAS,EAAC,iBAAiB,EAAC,SAAS,EAAE,SAAS,YACxE,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC,CACnB,8BACE,KAAC,SAAS,KAAG,EAEb,KAAC,OAAO,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC,YACjG,QAAQ,GACD,IACT,CACJ,GACc,CAClB,CAAC;AACJ,CAAC;AAED,UAAU,CAAC,WAAW,GAAG,YAAY,CAAC;AAStC,wDAAwD;AACxD,MAAM,UAAU,aAAa,CAA2B,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAyB;IACjH,IAAI,CAAC,YAAY,EAAE,IAAI,KAAK,IAAI,IAAI,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;QACvE,OAAO,CAAC,IAAI,CAAC,8EAA8E,CAAC,CAAC;IAC/F,CAAC;IAED,OAAO,CACL,MAAC,iBAAiB,OAAK,KAAK,EAAE,SAAS,EAAC,oBAAoB,aAC1D,KAAC,SAAS,IACR,SAAS,EAAE,IAAI,CAAC,2BAA2B,EAAE,SAAS,CAAC,EAAE,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,YAErG,KAAK,GACI,EACZ,KAAC,aAAa,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAiB,IACrC,CACrB,CAAC;AACJ,CAAC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type ForwardedRef, type UIEventHandler, useImperativeHandle, useRef } from 'react';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n Header as RACHeader,\n ListBox as RACListBox,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n Text as RACText,\n type ListBoxItemProps as RACListBoxItemProps,\n type SelectProps as RACSelectProps,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheck, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { Spinner } from '../spinner/spinner.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n rowHeight: 40,\n headingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\nexport interface SelectProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n FieldProps<Key>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<SelectApi>,\n Pick<\n RACSelectProps<T>,\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'selectedKey'\n | 'defaultSelectedKey'\n | 'autoComplete'\n | 'autoFocus'\n | 'onSelectionChange'\n | 'placeholder'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n > {\n /**\n * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n */\n isVirtualized?: boolean;\n /** Handler that is called when the list of items is scrolled. */\n onScroll?: UIEventHandler<HTMLDivElement>;\n}\n\n/** The imperative API exposed by the `Select` component. */\nexport interface SelectApi {\n /** Focuses the trigger button and opens the list of items. */\n focus: () => void;\n}\n\nfunction Select<T extends CollectionItem>(\n {\n children,\n items,\n label,\n description,\n error,\n UNSAFE_className,\n UNSAFE_style,\n onScroll,\n isVirtualized = false,\n apiRef,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n ...props\n }: SelectProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const triggerRef = useRef<HTMLButtonElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('Select requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`Select` requires `children` to be a function when using `items` prop');\n }\n\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => triggerRef.current?.focus(),\n }),\n [],\n );\n\n const listBox = (\n <RACListBox\n className=\"cim-select-listbox\"\n onScroll={onScroll}\n renderEmptyState={() =>\n isLoading ? <Spinner aria-label={collectionMessages.format('loading')} size=\"small\" marginY={8} /> : null\n }\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format('loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\n );\n\n return (\n <RACSelect {...props} ref={ref} className={clsx('cim-select', UNSAFE_className)} style={UNSAFE_style}>\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <RACButton ref={triggerRef} className=\"cim-select-button\">\n <RACSelectValue\n className={(values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' }))}\n >\n {({ selectedText }) => selectedText}\n </RACSelectValue>\n <IconChevronDown />\n </RACButton>\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <CollapsibleList\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\n </CollapsibleList>\n </RACSelect>\n );\n}\n\n/**\n * Allows users to select one item from a collapsible list.\n *\n * See [select usage guidelines](https://ui.cimpress.io/components/select/).\n */\nconst _Select = withStyleProps(forwardRef(Select), 'Select');\n\nexport { _Select as Select };\n\nexport interface SelectItemProps extends Pick<RACListBoxItemProps, 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n /** The ID of the item. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the label. */\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `Select`. */\nexport function SelectItem({ children, ...props }: SelectItemProps) {\n const textValue = stringLikeChildrenToString(children);\n\n return (\n <RACListBoxItem {...props} className=\"cim-select-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheck />\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nSelectItem.displayName = 'SelectItem';\n\nexport interface SelectSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `Select` into a section. */\nexport function SelectSection<T extends CollectionItem>({ title, children, items, ...props }: SelectSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`SelectSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-select-section\">\n <RACHeader\n className={clsx('cim-select-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nSelectSection.displayName = 'SelectSection';\n"]}
1
+ {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport clsx from 'clsx';\nimport { type ForwardedRef, type UIEventHandler, useImperativeHandle, useRef } from 'react';\nimport {\n Button as RACButton,\n Collection as RACCollection,\n Header as RACHeader,\n ListBox as RACListBox,\n ListBoxLoadMoreItem as RACListBoxLoadMoreItem,\n ListBoxItem as RACListBoxItem,\n ListBoxSection as RACListBoxSection,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n Select as RACSelect,\n SelectValue as RACSelectValue,\n Text as RACText,\n type ListBoxItemProps as RACListBoxItemProps,\n type SelectProps as RACSelectProps,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport { forwardRef } from '../../forward-ref.js';\nimport { useLocalizedMessages } from '../../i18n/index.js';\nimport { IconCheck, IconChevronDown } from '../../icons/index.js';\nimport { isProduction } from '../../utils/is-production.js';\nimport { stringLikeChildrenToString } from '../../utils/string-like-children-to-string.js';\nimport { useProductionWarning } from '../../utils/use-production-warning.js';\nimport { withStyleProps } from '../../with-style-props.js';\nimport { CollapsibleList } from '../internal/collapsible-list/collapsible-list.js';\nimport { FormFieldDescription, FormFieldError, FormFieldLabel } from '../internal/form-field/form-field.js';\nimport { Spinner } from '../spinner/spinner.js';\nimport type {\n ApiProps,\n AsyncItemLoadingProps,\n CollectionItem,\n CollectionProps,\n CommonProps,\n FieldProps,\n Key,\n StringLikeChildren,\n} from '../types.js';\nimport { textStyle } from '../typography/utils.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n rowHeight: 40,\n headingHeight: 32,\n loaderHeight: 40,\n padding: 0,\n gap: 0,\n};\n\nexport interface SelectProps<T extends CollectionItem = CollectionItem>\n extends CommonProps,\n FieldProps<Key>,\n CollectionProps<T>,\n AsyncItemLoadingProps,\n ApiProps<SelectApi>,\n Pick<\n RACSelectProps<T>,\n | 'isDisabled'\n | 'isRequired'\n | 'isInvalid'\n | 'autoComplete'\n | 'autoFocus'\n | 'placeholder'\n | 'onFocus'\n | 'onBlur'\n | 'onOpenChange'\n > {\n /** The currently selected key in the collection (controlled). */\n selectedKey?: Key | null;\n /** The initial selected key in the collection (uncontrolled). */\n defaultSelectedKey?: Key;\n /** Handler that is called when the selection changes. */\n onSelectionChange?: (key: Key | null) => void;\n /**\n * Whether the list of options should be virtualized. Use this as a performance optimization for large lists.\n * @default false\n */\n isVirtualized?: boolean;\n /** Handler that is called when the list of items is scrolled. */\n onScroll?: UIEventHandler<HTMLDivElement>;\n}\n\n/** The imperative API exposed by the `Select` component. */\nexport interface SelectApi {\n /** Focuses the trigger button and opens the list of items. */\n focus: () => void;\n}\n\nfunction Select<T extends CollectionItem>(\n {\n children,\n items,\n label,\n description,\n error,\n UNSAFE_className,\n UNSAFE_style,\n onScroll,\n isVirtualized = false,\n apiRef,\n UNSTABLE_isLoading: isLoading,\n UNSTABLE_onLoadMore: onLoadMore,\n selectedKey,\n defaultSelectedKey,\n onSelectionChange,\n ...props\n }: SelectProps<T>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const triggerRef = useRef<HTMLButtonElement>(null);\n\n const { 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy } = props;\n\n useProductionWarning(() => {\n if (!label && !ariaLabel && !ariaLabelledBy) {\n console.warn('Select requires one of label / aria-label / aria-labelledby for accessibility');\n }\n }, [label, ariaLabel, ariaLabelledBy]);\n\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`Select` requires `children` to be a function when using `items` prop');\n }\n\n const collectionMessages = useLocalizedMessages('UNSTABLE_collection');\n\n useImperativeHandle(\n apiRef,\n () => ({\n focus: () => triggerRef.current?.focus(),\n }),\n [],\n );\n\n const listBox = (\n <RACListBox\n className=\"cim-select-listbox\"\n onScroll={onScroll}\n renderEmptyState={() =>\n isLoading ? <Spinner aria-label={collectionMessages.format('loading')} size=\"small\" marginY={8} /> : null\n }\n >\n <RACCollection items={items}>{children}</RACCollection>\n <RACListBoxLoadMoreItem onLoadMore={onLoadMore} isLoading={isLoading}>\n <Spinner aria-label={collectionMessages.format('loadingMore')} size=\"small\" marginY={8} />\n </RACListBoxLoadMoreItem>\n </RACListBox>\n );\n\n return (\n <RACSelect\n {...props}\n ref={ref}\n className={clsx('cim-select', UNSAFE_className)}\n style={UNSAFE_style}\n value={selectedKey}\n defaultValue={defaultSelectedKey}\n onChange={onSelectionChange}\n >\n <FormFieldLabel isRequired={props.isRequired} isDisabled={props.isDisabled}>\n {label}\n </FormFieldLabel>\n <RACButton ref={triggerRef} className=\"cim-select-button\">\n <RACSelectValue\n className={(values) => clsx(values.defaultClassName, textStyle({ variant: 'body', alignment: 'start' }))}\n >\n {({ selectedText }) => selectedText}\n </RACSelectValue>\n <IconChevronDown />\n </RACButton>\n <FormFieldError>{error}</FormFieldError>\n <FormFieldDescription>{description}</FormFieldDescription>\n <CollapsibleList\n offset={5} // 1px border + 4px actual offset\n maxHeight={315}\n >\n {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\n </CollapsibleList>\n </RACSelect>\n );\n}\n\n/**\n * Allows users to select one item from a collapsible list.\n *\n * See [select usage guidelines](https://ui.cimpress.io/components/select/).\n */\nconst _Select = withStyleProps(forwardRef(Select), 'Select');\n\nexport { _Select as Select };\n\nexport interface SelectItemProps extends Pick<RACListBoxItemProps, 'isDisabled' | 'onHoverStart' | 'onHoverEnd'> {\n /** The ID of the item. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the label. */\n children: StringLikeChildren;\n}\n\n/** Renders a single list item within `Select`. */\nexport function SelectItem({ children, ...props }: SelectItemProps) {\n const textValue = stringLikeChildrenToString(children);\n\n return (\n <RACListBoxItem {...props} className=\"cim-select-item\" textValue={textValue}>\n {({ isDisabled }) => (\n <>\n <IconCheck />\n\n <RACText slot=\"label\" className={textStyle({ variant: 'body', tone: isDisabled ? 'muted' : 'base' })}>\n {children}\n </RACText>\n </>\n )}\n </RACListBoxItem>\n );\n}\n\nSelectItem.displayName = 'SelectItem';\n\nexport interface SelectSectionProps<T extends CollectionItem> extends CollectionProps<T> {\n /** The ID of the section. Has to be unique across all sections and items. */\n id?: Key;\n /** The content to display as the section title. */\n title: string;\n}\n\n/** Groups list items within `Select` into a section. */\nexport function SelectSection<T extends CollectionItem>({ title, children, items, ...props }: SelectSectionProps<T>) {\n if (!isProduction() && items != null && typeof children !== 'function') {\n console.warn('`SelectSection` requires `children` to be a function when using `items` prop');\n }\n\n return (\n <RACListBoxSection {...props} className=\"cim-select-section\">\n <RACHeader\n className={clsx('cim-select-section-header', textStyle({ variant: 'small-semibold', tone: 'subtle' }))}\n >\n {title}\n </RACHeader>\n <RACCollection items={items}>{children}</RACCollection>\n </RACListBoxSection>\n );\n}\n\nSelectSection.displayName = 'SelectSection';\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"column-collection.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/contexts/column-collection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAyC,MAAM,OAAO,CAAC;AAQ7G,UAAU,UAAU;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,gBAAgB,EAAE,sBAAsB,CAAC;CAC1C;AAED,2EAA2E;AAC3E,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAMhE,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAsB7E;AAED,KAAK,iBAAiB,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,KAAK,MAAM,IAAI,CAAC;AAGvE,wBAAgB,qBAAqB,IAAI,iBAAiB,CAuBzD;AAGD,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC,GAAG,SAAS,CAO3E;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAGD,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,SAAS,CAAC,oBAAoB,GAAG,IAAI,CAAC,GAAG,iBAAiB,CAchG"}
1
+ {"version":3,"file":"column-collection.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/contexts/column-collection.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,SAAS,EAAE,KAAK,SAAS,EAAyC,MAAM,OAAO,CAAC;AAQ7G,UAAU,UAAU;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,gBAAgB,EAAE,sBAAsB,CAAC;CAC1C;AAED,2EAA2E;AAC3E,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAMhE,wBAAgB,wBAAwB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAsB7E;AAED,KAAK,iBAAiB,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,UAAU,KAAK,MAAM,IAAI,CAAC;AAGvE,wBAAgB,qBAAqB,IAAI,iBAAiB,CAsBzD;AAGD,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC,GAAG,SAAS,CAO3E;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAGD,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,SAAS,CAAC,oBAAoB,GAAG,IAAI,CAAC,GAAG,iBAAiB,CAchG"}
@@ -37,7 +37,6 @@ export function useColumnRegistration() {
37
37
  const { columns } = columnCollection;
38
38
  if (columns[key] === data) {
39
39
  // This is a temporary deletion before a context update, so this is fine
40
- // eslint-disable-next-line react-hooks/react-compiler
41
40
  delete columns[key];
42
41
  columnCollection.setColumns({ ...columns });
43
42
  }
@@ -1 +1 @@
1
- {"version":3,"file":"column-collection.js","sourceRoot":"","sources":["../../../../../src/components/table/contexts/column-collection.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext, type ReactNode, type RefObject, useContext, useMemo, useRef, useState } from 'react';\nimport { useServerEffectEvent } from '../../../utils/use-server-effect-event.js';\n\ninterface ColumnCollection {\n columns: Record<string, ColumnData>;\n setColumns: (columns: Record<string, ColumnData>) => void;\n}\n\ninterface ColumnData {\n number?: number;\n width?: string | number;\n contentAlignment: ColumnContentAlignment;\n}\n\n/** Represents the direction of content alignment within a table column. */\nexport type ColumnContentAlignment = 'start' | 'center' | 'end';\n\nconst ColumnCollectionContext = createContext<ColumnCollection | null>(null);\n\nconst EMPTY_OBJECT = {};\n\nexport function ColumnCollectionProvider({ children }: { children: ReactNode }) {\n // When column collection is updated, we want to trigger a re-render,\n // but we also want immediate access to the updated collection during SSR.\n // Hence why it is stored as both a ref and a state.\n const columnsRef = useRef<Record<string, ColumnData>>(EMPTY_OBJECT);\n const [_columns, _setColumns] = useState<Record<string, ColumnData>>(EMPTY_OBJECT);\n\n const collection: ColumnCollection = useMemo(\n () => ({\n get columns() {\n return columnsRef.current;\n },\n setColumns: (columns) => {\n columnsRef.current = columns;\n _setColumns(columns);\n },\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [_columns],\n );\n\n return <ColumnCollectionContext.Provider value={collection}>{children}</ColumnCollectionContext.Provider>;\n}\n\ntype ColumnRegistrator = (key: string, data: ColumnData) => () => void;\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useColumnRegistration(): ColumnRegistrator {\n const columnCollection = useContext(ColumnCollectionContext);\n if (!columnCollection) {\n throw new Error('Cannot use column registration outside of a table');\n }\n\n return useServerEffectEvent((key, data) => {\n columnCollection.setColumns({\n ...columnCollection.columns,\n [key]: data,\n });\n\n return () => {\n const { columns } = columnCollection;\n\n if (columns[key] === data) {\n // This is a temporary deletion before a context update, so this is fine\n // eslint-disable-next-line react-hooks/react-compiler\n delete columns[key];\n columnCollection.setColumns({ ...columns });\n }\n };\n });\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useColumnData(key: string): Readonly<ColumnData> | undefined {\n const columnCollection = useContext(ColumnCollectionContext);\n if (!columnCollection) {\n throw new Error('Cannot use column data outside of a table');\n }\n\n return columnCollection.columns[key];\n}\n\nexport interface UseEmptyStateCell {\n columnKey: string;\n colSpan: number;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useEmptyStateCell(ref: RefObject<HTMLTableCellElement | null>): UseEmptyStateCell {\n const columnCollection = useContext(ColumnCollectionContext);\n if (!columnCollection) {\n throw new Error('Cannot use empty state cell outside of a table');\n }\n\n // Empty state cell should have the same column key as the first column in the table, so find it\n const parentTableElement = ref.current?.closest('table');\n const firstColumn = parentTableElement?.querySelector('[data-cell-row-key][data-cell-column-key]');\n\n return {\n columnKey: (firstColumn as HTMLTableCellElement | undefined)?.dataset.cellColumnKey ?? '???',\n colSpan: Object.keys(columnCollection.columns).length,\n };\n}\n"]}
1
+ {"version":3,"file":"column-collection.js","sourceRoot":"","sources":["../../../../../src/components/table/contexts/column-collection.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext, type ReactNode, type RefObject, useContext, useMemo, useRef, useState } from 'react';\nimport { useServerEffectEvent } from '../../../utils/use-server-effect-event.js';\n\ninterface ColumnCollection {\n columns: Record<string, ColumnData>;\n setColumns: (columns: Record<string, ColumnData>) => void;\n}\n\ninterface ColumnData {\n number?: number;\n width?: string | number;\n contentAlignment: ColumnContentAlignment;\n}\n\n/** Represents the direction of content alignment within a table column. */\nexport type ColumnContentAlignment = 'start' | 'center' | 'end';\n\nconst ColumnCollectionContext = createContext<ColumnCollection | null>(null);\n\nconst EMPTY_OBJECT = {};\n\nexport function ColumnCollectionProvider({ children }: { children: ReactNode }) {\n // When column collection is updated, we want to trigger a re-render,\n // but we also want immediate access to the updated collection during SSR.\n // Hence why it is stored as both a ref and a state.\n const columnsRef = useRef<Record<string, ColumnData>>(EMPTY_OBJECT);\n const [_columns, _setColumns] = useState<Record<string, ColumnData>>(EMPTY_OBJECT);\n\n const collection: ColumnCollection = useMemo(\n () => ({\n get columns() {\n return columnsRef.current;\n },\n setColumns: (columns) => {\n columnsRef.current = columns;\n _setColumns(columns);\n },\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [_columns],\n );\n\n return <ColumnCollectionContext.Provider value={collection}>{children}</ColumnCollectionContext.Provider>;\n}\n\ntype ColumnRegistrator = (key: string, data: ColumnData) => () => void;\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useColumnRegistration(): ColumnRegistrator {\n const columnCollection = useContext(ColumnCollectionContext);\n if (!columnCollection) {\n throw new Error('Cannot use column registration outside of a table');\n }\n\n return useServerEffectEvent((key, data) => {\n columnCollection.setColumns({\n ...columnCollection.columns,\n [key]: data,\n });\n\n return () => {\n const { columns } = columnCollection;\n\n if (columns[key] === data) {\n // This is a temporary deletion before a context update, so this is fine\n delete columns[key];\n columnCollection.setColumns({ ...columns });\n }\n };\n });\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useColumnData(key: string): Readonly<ColumnData> | undefined {\n const columnCollection = useContext(ColumnCollectionContext);\n if (!columnCollection) {\n throw new Error('Cannot use column data outside of a table');\n }\n\n return columnCollection.columns[key];\n}\n\nexport interface UseEmptyStateCell {\n columnKey: string;\n colSpan: number;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useEmptyStateCell(ref: RefObject<HTMLTableCellElement | null>): UseEmptyStateCell {\n const columnCollection = useContext(ColumnCollectionContext);\n if (!columnCollection) {\n throw new Error('Cannot use empty state cell outside of a table');\n }\n\n // Empty state cell should have the same column key as the first column in the table, so find it\n const parentTableElement = ref.current?.closest('table');\n const firstColumn = parentTableElement?.querySelector('[data-cell-row-key][data-cell-column-key]');\n\n return {\n columnKey: (firstColumn as HTMLTableCellElement | undefined)?.dataset.cellColumnKey ?? '???',\n colSpan: Object.keys(columnCollection.columns).length,\n };\n}\n"]}
@@ -1,9 +1,9 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useEffectEvent } from '@react-aria/utils';
2
+ import { useEffectEvent as useRACEffectEvent } from '@react-aria/utils';
3
3
  import { createContext, useContext, useMemo } from 'react';
4
4
  const TableRowStateContext = createContext(null);
5
5
  export function TableRowStateProvider({ children, rowKey, isSelected, onSelectionToggle, }) {
6
- const onSelectionToggleMemoized = useEffectEvent(onSelectionToggle);
6
+ const onSelectionToggleMemoized = useRACEffectEvent(onSelectionToggle);
7
7
  const tableRowState = useMemo(() => ({
8
8
  rowKey,
9
9
  isSelected,
@@ -1 +1 @@
1
- {"version":3,"file":"row-state.js","sourceRoot":"","sources":["../../../../../src/components/table/contexts/row-state.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,aAAa,EAAkB,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAQ3E,MAAM,oBAAoB,GAAG,aAAa,CAAuB,IAAI,CAAC,CAAC;AAEvE,MAAM,UAAU,qBAAqB,CAAC,EACpC,QAAQ,EACR,MAAM,EACN,UAAU,EACV,iBAAiB,GAMlB;IACC,MAAM,yBAAyB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAC;IAEpE,MAAM,aAAa,GAAkB,OAAO,CAC1C,GAAG,EAAE,CAAC,CAAC;QACL,MAAM;QACN,UAAU;QACV,iBAAiB,EAAE,yBAAyB;KAC7C,CAAC,EACF,CAAC,MAAM,EAAE,UAAU,EAAE,yBAAyB,CAAC,CAChD,CAAC;IAEF,OAAO,KAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAAG,QAAQ,GAAiC,CAAC;AACzG,CAAC;AAED,gEAAgE;AAChE,MAAM,UAAU,gBAAgB;IAC9B,MAAM,aAAa,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACvD,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,MAAM,IAAI,KAAK,CAAC,mDAAmD,CAAC,CAAC;IACvE,CAAC;IAED,OAAO,aAAa,CAAC;AACvB,CAAC","sourcesContent":["import { useEffectEvent } from '@react-aria/utils';\nimport { createContext, type ReactNode, useContext, useMemo } from 'react';\n\nexport interface TableRowState {\n rowKey: string;\n isSelected?: boolean;\n onSelectionToggle?: (value?: boolean) => void;\n}\n\nconst TableRowStateContext = createContext<TableRowState | null>(null);\n\nexport function TableRowStateProvider({\n children,\n rowKey,\n isSelected,\n onSelectionToggle,\n}: {\n children: ReactNode;\n rowKey: string;\n isSelected?: boolean;\n onSelectionToggle?: (value?: boolean) => void;\n}) {\n const onSelectionToggleMemoized = useEffectEvent(onSelectionToggle);\n\n const tableRowState: TableRowState = useMemo(\n () => ({\n rowKey,\n isSelected,\n onSelectionToggle: onSelectionToggleMemoized,\n }),\n [rowKey, isSelected, onSelectionToggleMemoized],\n );\n\n return <TableRowStateContext.Provider value={tableRowState}>{children}</TableRowStateContext.Provider>;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useTableRowState(): TableRowState {\n const tableRowState = useContext(TableRowStateContext);\n if (!tableRowState) {\n throw new Error('Cannot use table row state outside of a table row');\n }\n\n return tableRowState;\n}\n"]}
1
+ {"version":3,"file":"row-state.js","sourceRoot":"","sources":["../../../../../src/components/table/contexts/row-state.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,IAAI,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACxE,OAAO,EAAE,aAAa,EAAkB,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAQ3E,MAAM,oBAAoB,GAAG,aAAa,CAAuB,IAAI,CAAC,CAAC;AAEvE,MAAM,UAAU,qBAAqB,CAAC,EACpC,QAAQ,EACR,MAAM,EACN,UAAU,EACV,iBAAiB,GAMlB;IACC,MAAM,yBAAyB,GAAG,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IAEvE,MAAM,aAAa,GAAkB,OAAO,CAC1C,GAAG,EAAE,CAAC,CAAC;QACL,MAAM;QACN,UAAU;QACV,iBAAiB,EAAE,yBAAyB;KAC7C,CAAC,EACF,CAAC,MAAM,EAAE,UAAU,EAAE,yBAAyB,CAAC,CAChD,CAAC;IAEF,OAAO,KAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAAG,QAAQ,GAAiC,CAAC;AACzG,CAAC;AAED,gEAAgE;AAChE,MAAM,UAAU,gBAAgB;IAC9B,MAAM,aAAa,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACvD,IAAI,CAAC,aAAa,EAAE,CAAC;QACnB,MAAM,IAAI,KAAK,CAAC,mDAAmD,CAAC,CAAC;IACvE,CAAC;IAED,OAAO,aAAa,CAAC;AACvB,CAAC","sourcesContent":["import { useEffectEvent as useRACEffectEvent } from '@react-aria/utils';\nimport { createContext, type ReactNode, useContext, useMemo } from 'react';\n\nexport interface TableRowState {\n rowKey: string;\n isSelected?: boolean;\n onSelectionToggle?: (value?: boolean) => void;\n}\n\nconst TableRowStateContext = createContext<TableRowState | null>(null);\n\nexport function TableRowStateProvider({\n children,\n rowKey,\n isSelected,\n onSelectionToggle,\n}: {\n children: ReactNode;\n rowKey: string;\n isSelected?: boolean;\n onSelectionToggle?: (value?: boolean) => void;\n}) {\n const onSelectionToggleMemoized = useRACEffectEvent(onSelectionToggle);\n\n const tableRowState: TableRowState = useMemo(\n () => ({\n rowKey,\n isSelected,\n onSelectionToggle: onSelectionToggleMemoized,\n }),\n [rowKey, isSelected, onSelectionToggleMemoized],\n );\n\n return <TableRowStateContext.Provider value={tableRowState}>{children}</TableRowStateContext.Provider>;\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useTableRowState(): TableRowState {\n const tableRowState = useContext(TableRowStateContext);\n if (!tableRowState) {\n throw new Error('Cannot use table row state outside of a table row');\n }\n\n return tableRowState;\n}\n"]}
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { useEffectEvent, useId } from '@react-aria/utils';
2
+ import { useEffectEvent as useRACEffectEvent, useId } from '@react-aria/utils';
3
3
  import { createContext, useContext, useMemo, useRef, useState } from 'react';
4
4
  import { useLocalizedMessages } from '../../../i18n/localization-provider.js';
5
5
  const TableStateContext = createContext(null);
@@ -11,7 +11,7 @@ export function TableStateProvider({ children, rowSelectionMode, areAllRowsSelec
11
11
  const [_pendingRowSelectionState, _setPendingRowSelectionState] = useState(undefined);
12
12
  const sortLabelId = useId();
13
13
  const messages = useLocalizedMessages('table');
14
- const onAllRowsSelectionToggleMemoized = useEffectEvent(onAllRowsSelectionToggle);
14
+ const onAllRowsSelectionToggleMemoized = useRACEffectEvent(onAllRowsSelectionToggle);
15
15
  const tableState = useMemo(() => ({
16
16
  sortLabelId,
17
17
  rowSelectionMode,
@@ -1 +1 @@
1
- {"version":3,"file":"table-state.js","sourceRoot":"","sources":["../../../../../src/components/table/contexts/table-state.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAkB,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,EAAE,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAgB9E,MAAM,iBAAiB,GAAG,aAAa,CAAoB,IAAI,CAAC,CAAC;AAEjE,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACnB,wBAAwB,GAOzB;IACC,+EAA+E;IAC/E,sDAAsD;IACtD,oDAAoD;IACpD,MAAM,2BAA2B,GAAG,MAAM,CAAsB,SAAS,CAAC,CAAC;IAC3E,MAAM,CAAC,yBAAyB,EAAE,4BAA4B,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAC;IAE3G,MAAM,WAAW,GAAG,KAAK,EAAE,CAAC;IAC5B,MAAM,QAAQ,GAAG,oBAAoB,CAAC,OAAO,CAAC,CAAC;IAE/C,MAAM,gCAAgC,GAAG,cAAc,CAAC,wBAAwB,CAAC,CAAC;IAElF,MAAM,UAAU,GAAe,OAAO,CACpC,GAAG,EAAE,CAAC,CAAC;QACL,WAAW;QACX,gBAAgB;QAChB,kBAAkB;QAClB,mBAAmB;QACnB,wBAAwB,EAAE,gCAAgC;QAC1D,IAAI,wBAAwB;YAC1B,OAAO,2BAA2B,CAAC,OAAO,CAAC;QAC7C,CAAC;QACD,2BAA2B,CAAC,wBAA6C;YACvE,2BAA2B,CAAC,OAAO,GAAG,wBAAwB,CAAC;YAC/D,4BAA4B,CAAC,wBAAwB,CAAC,CAAC;QACzD,CAAC;KACF,CAAC;IACF,uDAAuD;IACvD;QACE,WAAW;QACX,gBAAgB;QAChB,kBAAkB;QAClB,mBAAmB;QACnB,gCAAgC;QAChC,yBAAyB;KAC1B,CACF,CAAC;IAEF,OAAO,CACL,MAAC,iBAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,UAAU,aAC1C,QAAQ,EACT,eAAM,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,WAAW,YAC9C,QAAQ,CAAC,MAAM,CAAC,uBAAuB,CAAC,GACpC,IACoB,CAC9B,CAAC;AACJ,CAAC;AAED,gEAAgE;AAChE,MAAM,UAAU,aAAa;IAC3B,MAAM,UAAU,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IACjD,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;IAC/D,CAAC;IAED,OAAO,UAAU,CAAC;AACpB,CAAC","sourcesContent":["import { useEffectEvent, useId } from '@react-aria/utils';\nimport { createContext, type ReactNode, useContext, useMemo, useRef, useState } from 'react';\nimport { useLocalizedMessages } from '../../../i18n/localization-provider.js';\n\n/** Represents the type of row selection allowed within a table. */\nexport type RowSelectionMode = 'single' | 'multiple' | 'none';\n\nexport interface TableState {\n sortLabelId: string;\n rowSelectionMode: RowSelectionMode;\n areAllRowsSelected?: boolean;\n areSomeRowsSelected?: boolean;\n onAllRowsSelectionToggle?: (value?: boolean) => void;\n /** The selection state that will be applied to the next focused row. */\n pendingRowSelectionState?: boolean;\n setPendingRowSelectionState: (value: boolean | undefined) => void;\n}\n\nconst TableStateContext = createContext<TableState | null>(null);\n\nexport function TableStateProvider({\n children,\n rowSelectionMode,\n areAllRowsSelected,\n areSomeRowsSelected,\n onAllRowsSelectionToggle,\n}: {\n children: ReactNode;\n rowSelectionMode: RowSelectionMode;\n areAllRowsSelected?: boolean;\n areSomeRowsSelected?: boolean;\n onAllRowsSelectionToggle?: (value?: boolean) => void;\n}) {\n // When the pending selection state is updated, we want to trigger a re-render,\n // but we also want immediate access to the new value.\n // Hence why it is stored as both a ref and a state.\n const pendingRowSelectionStateRef = useRef<boolean | undefined>(undefined);\n const [_pendingRowSelectionState, _setPendingRowSelectionState] = useState<boolean | undefined>(undefined);\n\n const sortLabelId = useId();\n const messages = useLocalizedMessages('table');\n\n const onAllRowsSelectionToggleMemoized = useEffectEvent(onAllRowsSelectionToggle);\n\n const tableState: TableState = useMemo(\n () => ({\n sortLabelId,\n rowSelectionMode,\n areAllRowsSelected,\n areSomeRowsSelected,\n onAllRowsSelectionToggle: onAllRowsSelectionToggleMemoized,\n get pendingRowSelectionState() {\n return pendingRowSelectionStateRef.current;\n },\n setPendingRowSelectionState(pendingRowSelectionState: boolean | undefined) {\n pendingRowSelectionStateRef.current = pendingRowSelectionState;\n _setPendingRowSelectionState(pendingRowSelectionState);\n },\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n sortLabelId,\n rowSelectionMode,\n areAllRowsSelected,\n areSomeRowsSelected,\n onAllRowsSelectionToggleMemoized,\n _pendingRowSelectionState,\n ],\n );\n\n return (\n <TableStateContext.Provider value={tableState}>\n {children}\n <span style={{ display: 'none' }} id={sortLabelId}>\n {messages.format('toggleColumnSortOrder')}\n </span>\n </TableStateContext.Provider>\n );\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useTableState(): TableState {\n const tableState = useContext(TableStateContext);\n if (!tableState) {\n throw new Error('Cannot use table state outside of a table');\n }\n\n return tableState;\n}\n"]}
1
+ {"version":3,"file":"table-state.js","sourceRoot":"","sources":["../../../../../src/components/table/contexts/table-state.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,cAAc,IAAI,iBAAiB,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAkB,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC7F,OAAO,EAAE,oBAAoB,EAAE,MAAM,wCAAwC,CAAC;AAgB9E,MAAM,iBAAiB,GAAG,aAAa,CAAoB,IAAI,CAAC,CAAC;AAEjE,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACnB,wBAAwB,GAOzB;IACC,+EAA+E;IAC/E,sDAAsD;IACtD,oDAAoD;IACpD,MAAM,2BAA2B,GAAG,MAAM,CAAsB,SAAS,CAAC,CAAC;IAC3E,MAAM,CAAC,yBAAyB,EAAE,4BAA4B,CAAC,GAAG,QAAQ,CAAsB,SAAS,CAAC,CAAC;IAE3G,MAAM,WAAW,GAAG,KAAK,EAAE,CAAC;IAC5B,MAAM,QAAQ,GAAG,oBAAoB,CAAC,OAAO,CAAC,CAAC;IAE/C,MAAM,gCAAgC,GAAG,iBAAiB,CAAC,wBAAwB,CAAC,CAAC;IAErF,MAAM,UAAU,GAAe,OAAO,CACpC,GAAG,EAAE,CAAC,CAAC;QACL,WAAW;QACX,gBAAgB;QAChB,kBAAkB;QAClB,mBAAmB;QACnB,wBAAwB,EAAE,gCAAgC;QAC1D,IAAI,wBAAwB;YAC1B,OAAO,2BAA2B,CAAC,OAAO,CAAC;QAC7C,CAAC;QACD,2BAA2B,CAAC,wBAA6C;YACvE,2BAA2B,CAAC,OAAO,GAAG,wBAAwB,CAAC;YAC/D,4BAA4B,CAAC,wBAAwB,CAAC,CAAC;QACzD,CAAC;KACF,CAAC;IACF,uDAAuD;IACvD;QACE,WAAW;QACX,gBAAgB;QAChB,kBAAkB;QAClB,mBAAmB;QACnB,gCAAgC;QAChC,yBAAyB;KAC1B,CACF,CAAC;IAEF,OAAO,CACL,MAAC,iBAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,UAAU,aAC1C,QAAQ,EACT,eAAM,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,WAAW,YAC9C,QAAQ,CAAC,MAAM,CAAC,uBAAuB,CAAC,GACpC,IACoB,CAC9B,CAAC;AACJ,CAAC;AAED,gEAAgE;AAChE,MAAM,UAAU,aAAa;IAC3B,MAAM,UAAU,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IACjD,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,MAAM,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC;IAC/D,CAAC;IAED,OAAO,UAAU,CAAC;AACpB,CAAC","sourcesContent":["import { useEffectEvent as useRACEffectEvent, useId } from '@react-aria/utils';\nimport { createContext, type ReactNode, useContext, useMemo, useRef, useState } from 'react';\nimport { useLocalizedMessages } from '../../../i18n/localization-provider.js';\n\n/** Represents the type of row selection allowed within a table. */\nexport type RowSelectionMode = 'single' | 'multiple' | 'none';\n\nexport interface TableState {\n sortLabelId: string;\n rowSelectionMode: RowSelectionMode;\n areAllRowsSelected?: boolean;\n areSomeRowsSelected?: boolean;\n onAllRowsSelectionToggle?: (value?: boolean) => void;\n /** The selection state that will be applied to the next focused row. */\n pendingRowSelectionState?: boolean;\n setPendingRowSelectionState: (value: boolean | undefined) => void;\n}\n\nconst TableStateContext = createContext<TableState | null>(null);\n\nexport function TableStateProvider({\n children,\n rowSelectionMode,\n areAllRowsSelected,\n areSomeRowsSelected,\n onAllRowsSelectionToggle,\n}: {\n children: ReactNode;\n rowSelectionMode: RowSelectionMode;\n areAllRowsSelected?: boolean;\n areSomeRowsSelected?: boolean;\n onAllRowsSelectionToggle?: (value?: boolean) => void;\n}) {\n // When the pending selection state is updated, we want to trigger a re-render,\n // but we also want immediate access to the new value.\n // Hence why it is stored as both a ref and a state.\n const pendingRowSelectionStateRef = useRef<boolean | undefined>(undefined);\n const [_pendingRowSelectionState, _setPendingRowSelectionState] = useState<boolean | undefined>(undefined);\n\n const sortLabelId = useId();\n const messages = useLocalizedMessages('table');\n\n const onAllRowsSelectionToggleMemoized = useRACEffectEvent(onAllRowsSelectionToggle);\n\n const tableState: TableState = useMemo(\n () => ({\n sortLabelId,\n rowSelectionMode,\n areAllRowsSelected,\n areSomeRowsSelected,\n onAllRowsSelectionToggle: onAllRowsSelectionToggleMemoized,\n get pendingRowSelectionState() {\n return pendingRowSelectionStateRef.current;\n },\n setPendingRowSelectionState(pendingRowSelectionState: boolean | undefined) {\n pendingRowSelectionStateRef.current = pendingRowSelectionState;\n _setPendingRowSelectionState(pendingRowSelectionState);\n },\n }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n sortLabelId,\n rowSelectionMode,\n areAllRowsSelected,\n areSomeRowsSelected,\n onAllRowsSelectionToggleMemoized,\n _pendingRowSelectionState,\n ],\n );\n\n return (\n <TableStateContext.Provider value={tableState}>\n {children}\n <span style={{ display: 'none' }} id={sortLabelId}>\n {messages.format('toggleColumnSortOrder')}\n </span>\n </TableStateContext.Provider>\n );\n}\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useTableState(): TableState {\n const tableState = useContext(TableStateContext);\n if (!tableState) {\n throw new Error('Cannot use table state outside of a table');\n }\n\n return tableState;\n}\n"]}
@@ -1,6 +1,6 @@
1
1
  import { getFocusableTreeWalker, useFocusRing } from '@react-aria/focus';
2
2
  import { isFocusVisible } from '@react-aria/interactions';
3
- import { mergeProps, useEffectEvent, useLayoutEffect } from '@react-aria/utils';
3
+ import { mergeProps, useEffectEvent as useRACEffectEvent, useLayoutEffect } from '@react-aria/utils';
4
4
  import { useEffect } from 'react';
5
5
  import { useTableFocus } from '../contexts/focus.js';
6
6
  import { useTableRowState } from '../contexts/row-state.js';
@@ -50,7 +50,7 @@ export function useTableCell(ref, rowKey, columnKey) {
50
50
  }
51
51
  // eslint-disable-next-line react-hooks/exhaustive-deps
52
52
  }, [ref, isTabbable]);
53
- const resetIfFocused = useEffectEvent(() => {
53
+ const resetIfFocused = useRACEffectEvent(() => {
54
54
  if (isTabbable) {
55
55
  tableFocus.setFocus('', '');
56
56
  }
@@ -1 +1 @@
1
- {"version":3,"file":"use-table-cell.js","sourceRoot":"","sources":["../../../../../src/components/table/hooks/use-table-cell.ts"],"names":[],"mappings":"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","sourcesContent":["import { getFocusableTreeWalker, useFocusRing } from '@react-aria/focus';\nimport { isFocusVisible } from '@react-aria/interactions';\nimport { mergeProps, useEffectEvent, useLayoutEffect } from '@react-aria/utils';\nimport { type KeyboardEventHandler, type FocusEventHandler, type RefObject, useEffect } from 'react';\nimport type { FocusableElement, NativeElementProps } from '../../types.js';\nimport { useTableFocus } from '../contexts/focus.js';\nimport { useTableRowState } from '../contexts/row-state.js';\nimport { useTableState } from '../contexts/table-state.js';\nimport { focusTableChild } from '../utils/focus-table-child.js';\n\nexport interface UseTableCell {\n cellProps: NativeElementProps<HTMLTableCellElement>;\n}\n\nexport function useTableCell(\n ref: RefObject<HTMLTableCellElement | null>,\n rowKey: string,\n columnKey: string,\n): UseTableCell {\n const tableFocus = useTableFocus();\n const { pendingRowSelectionState, setPendingRowSelectionState } = useTableState();\n const { onSelectionToggle } = useTableRowState();\n\n const { focusProps, isFocusVisible: isCellFocusVisible } = useFocusRing();\n\n const isTabbable = rowKey === tableFocus.focusedRowKey && columnKey === tableFocus.focusedColumnKey;\n\n // Handles focusing the cell.\n // If there is a focusable child, it is focused, otherwise the cell itself is focused.\n const focusCell = () => {\n if (!ref.current) {\n return;\n }\n\n // If there's a pending selection state, apply it to this cell's row.\n // If this cell is a header cell, `onSelectionToggle` will be undefined, but we still want to clear the pending selection state.\n if (pendingRowSelectionState !== undefined) {\n onSelectionToggle?.(pendingRowSelectionState);\n setPendingRowSelectionState(undefined);\n }\n\n // If focus is already on a focusable child within the cell, early return so we don't shift focus\n if (ref.current.contains(document.activeElement) && ref.current !== document.activeElement) {\n return;\n }\n\n const treeWalker = getFocusableTreeWalker(ref.current);\n const focusable = tableFocus.childFocusStrategy === 'last' ? treeWalker.lastChild() : treeWalker.firstChild();\n\n if (focusable) {\n // Cell has focusable children, focus the child\n focusTableChild(focusable as FocusableElement);\n } else if (!ref.current.contains(document.activeElement)) {\n // Cell has no focusable children and current focus is outside of the cell, focus the cell itself\n focusTableChild(ref.current);\n } else if (ref.current === document.activeElement && !isTabbable) {\n // Focus is on the current cell, but table focus is elsewhere, update table focus state\n tableFocus.setFocus(rowKey, columnKey);\n }\n };\n\n // Focus the cell DOM node when table focus moves to this cell\n useLayoutEffect(() => {\n if (isTabbable && !ref.current!.contains(document.activeElement)) {\n focusCell();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [ref, isTabbable]);\n\n const resetIfFocused = useEffectEvent(() => {\n if (isTabbable) {\n tableFocus.setFocus('', '');\n }\n });\n\n // Reset table focus when the focused cell unmounts\n useEffect(\n () => () => {\n resetIfFocused();\n },\n [resetIfFocused],\n );\n\n const onFocus: FocusEventHandler = (e) => {\n // Ignore focus events bubbling through portals\n if (!e.currentTarget.contains(e.target)) {\n return;\n }\n\n // If cell is already focused, return early.\n // However, if focus happens as a result of a press, we need to re-run the child-focusing logic,\n // otherwise `useFocusRing` will force the cell itself to become focused.\n if (e.currentTarget.contains(e.relatedTarget) && isFocusVisible()) {\n return;\n }\n\n // There are 3 scenarios for why a cell might receive focus:\n // - focus happens through a press, we need to update table focus state to the current cell\n // - focus happens through arrow key navigation within the table,\n // we do nothing as table focus state would have already been updated earlier\n // - focus happens through tabbing into the table from outside,\n // we do nothing because we want to restore focus to the previously focused cell,\n // and overriding table focus state would make that impossible\n if (!isFocusVisible()) {\n tableFocus.setFocus(rowKey, columnKey);\n }\n\n if (e.target === ref.current) {\n // If the cell itself receives focus, wait a frame so that focus finishes propagating\n // up to the tree, and move focus to a focusable child if possible.\n requestAnimationFrame(() => {\n if (document.activeElement === ref.current) {\n focusCell();\n }\n });\n }\n };\n\n // Handles keyboard navigation between focusable children within the cell.\n const onKeyDownCapture: KeyboardEventHandler = (e) => {\n // Ignore keyboard events bubbling through portals\n if (!e.currentTarget.contains(e.target as Element) || !ref.current || !document.activeElement) {\n return;\n }\n\n const walker = getFocusableTreeWalker(ref.current);\n walker.currentNode = document.activeElement;\n\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n // Move to the previous/next focusable element within the cell\n const childElementToFocus = e.key === 'ArrowLeft' ? walker.previousNode() : walker.nextNode();\n\n if (childElementToFocus && childElementToFocus !== ref.current) {\n focusTableChild(childElementToFocus as FocusableElement);\n } else {\n // If there is no previous/next focusable element within the current cell, focus should move to the previous/next cell.\n // This is handled by `useTable`, so we need to let the event bubble up to it.\n // But we also don't want this event to reach children of the current cell, as arrow keys should be used exclusively for table navigation.\n // Solution: re-dispatch the event from a parent element of the current cell.\n ref.current.parentElement!.dispatchEvent(new KeyboardEvent(e.nativeEvent.type, e.nativeEvent));\n }\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n // Move to the previous/next cell in the current column.\n // This is handled by `useTable`, so we need to let the event bubble up to it.\n // But we also don't want this event to reach children of the current cell, as arrow keys should be used exclusively for table navigation.\n // Solution: re-dispatch the event from a parent element of the current cell.\n ref.current.parentElement?.dispatchEvent(new KeyboardEvent(e.nativeEvent.type, e.nativeEvent));\n } else {\n // if we didn't handle anything, return early so we don't stop propagation and preventDefault\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n };\n\n const customProps: NativeElementProps<HTMLTableCellElement> = {\n tabIndex: isTabbable ? 0 : -1,\n onFocus,\n onKeyDownCapture,\n 'data-cell-row-key': rowKey,\n 'data-cell-column-key': columnKey,\n 'data-focus-visible': isCellFocusVisible || undefined,\n };\n\n return {\n cellProps: mergeProps(focusProps, customProps),\n };\n}\n"]}
1
+ {"version":3,"file":"use-table-cell.js","sourceRoot":"","sources":["../../../../../src/components/table/hooks/use-table-cell.ts"],"names":[],"mappings":"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","sourcesContent":["import { getFocusableTreeWalker, useFocusRing } from '@react-aria/focus';\nimport { isFocusVisible } from '@react-aria/interactions';\nimport { mergeProps, useEffectEvent as useRACEffectEvent, useLayoutEffect } from '@react-aria/utils';\nimport { type KeyboardEventHandler, type FocusEventHandler, type RefObject, useEffect } from 'react';\nimport type { FocusableElement, NativeElementProps } from '../../types.js';\nimport { useTableFocus } from '../contexts/focus.js';\nimport { useTableRowState } from '../contexts/row-state.js';\nimport { useTableState } from '../contexts/table-state.js';\nimport { focusTableChild } from '../utils/focus-table-child.js';\n\nexport interface UseTableCell {\n cellProps: NativeElementProps<HTMLTableCellElement>;\n}\n\nexport function useTableCell(\n ref: RefObject<HTMLTableCellElement | null>,\n rowKey: string,\n columnKey: string,\n): UseTableCell {\n const tableFocus = useTableFocus();\n const { pendingRowSelectionState, setPendingRowSelectionState } = useTableState();\n const { onSelectionToggle } = useTableRowState();\n\n const { focusProps, isFocusVisible: isCellFocusVisible } = useFocusRing();\n\n const isTabbable = rowKey === tableFocus.focusedRowKey && columnKey === tableFocus.focusedColumnKey;\n\n // Handles focusing the cell.\n // If there is a focusable child, it is focused, otherwise the cell itself is focused.\n const focusCell = () => {\n if (!ref.current) {\n return;\n }\n\n // If there's a pending selection state, apply it to this cell's row.\n // If this cell is a header cell, `onSelectionToggle` will be undefined, but we still want to clear the pending selection state.\n if (pendingRowSelectionState !== undefined) {\n onSelectionToggle?.(pendingRowSelectionState);\n setPendingRowSelectionState(undefined);\n }\n\n // If focus is already on a focusable child within the cell, early return so we don't shift focus\n if (ref.current.contains(document.activeElement) && ref.current !== document.activeElement) {\n return;\n }\n\n const treeWalker = getFocusableTreeWalker(ref.current);\n const focusable = tableFocus.childFocusStrategy === 'last' ? treeWalker.lastChild() : treeWalker.firstChild();\n\n if (focusable) {\n // Cell has focusable children, focus the child\n focusTableChild(focusable as FocusableElement);\n } else if (!ref.current.contains(document.activeElement)) {\n // Cell has no focusable children and current focus is outside of the cell, focus the cell itself\n focusTableChild(ref.current);\n } else if (ref.current === document.activeElement && !isTabbable) {\n // Focus is on the current cell, but table focus is elsewhere, update table focus state\n tableFocus.setFocus(rowKey, columnKey);\n }\n };\n\n // Focus the cell DOM node when table focus moves to this cell\n useLayoutEffect(() => {\n if (isTabbable && !ref.current!.contains(document.activeElement)) {\n focusCell();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [ref, isTabbable]);\n\n const resetIfFocused = useRACEffectEvent(() => {\n if (isTabbable) {\n tableFocus.setFocus('', '');\n }\n });\n\n // Reset table focus when the focused cell unmounts\n useEffect(\n () => () => {\n resetIfFocused();\n },\n [resetIfFocused],\n );\n\n const onFocus: FocusEventHandler = (e) => {\n // Ignore focus events bubbling through portals\n if (!e.currentTarget.contains(e.target)) {\n return;\n }\n\n // If cell is already focused, return early.\n // However, if focus happens as a result of a press, we need to re-run the child-focusing logic,\n // otherwise `useFocusRing` will force the cell itself to become focused.\n if (e.currentTarget.contains(e.relatedTarget) && isFocusVisible()) {\n return;\n }\n\n // There are 3 scenarios for why a cell might receive focus:\n // - focus happens through a press, we need to update table focus state to the current cell\n // - focus happens through arrow key navigation within the table,\n // we do nothing as table focus state would have already been updated earlier\n // - focus happens through tabbing into the table from outside,\n // we do nothing because we want to restore focus to the previously focused cell,\n // and overriding table focus state would make that impossible\n if (!isFocusVisible()) {\n tableFocus.setFocus(rowKey, columnKey);\n }\n\n if (e.target === ref.current) {\n // If the cell itself receives focus, wait a frame so that focus finishes propagating\n // up to the tree, and move focus to a focusable child if possible.\n requestAnimationFrame(() => {\n if (document.activeElement === ref.current) {\n focusCell();\n }\n });\n }\n };\n\n // Handles keyboard navigation between focusable children within the cell.\n const onKeyDownCapture: KeyboardEventHandler = (e) => {\n // Ignore keyboard events bubbling through portals\n if (!e.currentTarget.contains(e.target as Element) || !ref.current || !document.activeElement) {\n return;\n }\n\n const walker = getFocusableTreeWalker(ref.current);\n walker.currentNode = document.activeElement;\n\n if (e.key === 'ArrowLeft' || e.key === 'ArrowRight') {\n // Move to the previous/next focusable element within the cell\n const childElementToFocus = e.key === 'ArrowLeft' ? walker.previousNode() : walker.nextNode();\n\n if (childElementToFocus && childElementToFocus !== ref.current) {\n focusTableChild(childElementToFocus as FocusableElement);\n } else {\n // If there is no previous/next focusable element within the current cell, focus should move to the previous/next cell.\n // This is handled by `useTable`, so we need to let the event bubble up to it.\n // But we also don't want this event to reach children of the current cell, as arrow keys should be used exclusively for table navigation.\n // Solution: re-dispatch the event from a parent element of the current cell.\n ref.current.parentElement!.dispatchEvent(new KeyboardEvent(e.nativeEvent.type, e.nativeEvent));\n }\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n // Move to the previous/next cell in the current column.\n // This is handled by `useTable`, so we need to let the event bubble up to it.\n // But we also don't want this event to reach children of the current cell, as arrow keys should be used exclusively for table navigation.\n // Solution: re-dispatch the event from a parent element of the current cell.\n ref.current.parentElement?.dispatchEvent(new KeyboardEvent(e.nativeEvent.type, e.nativeEvent));\n } else {\n // if we didn't handle anything, return early so we don't stop propagation and preventDefault\n return;\n }\n\n e.preventDefault();\n e.stopPropagation();\n };\n\n const customProps: NativeElementProps<HTMLTableCellElement> = {\n tabIndex: isTabbable ? 0 : -1,\n onFocus,\n onKeyDownCapture,\n 'data-cell-row-key': rowKey,\n 'data-cell-column-key': columnKey,\n 'data-focus-visible': isCellFocusVisible || undefined,\n };\n\n return {\n cellProps: mergeProps(focusProps, customProps),\n };\n}\n"]}
@@ -18,13 +18,15 @@ export function TagFieldListBox({ children, inputId, selectedKeys, setSelectedKe
18
18
  if (!listState || !listState.selectionManager) {
19
19
  return listState;
20
20
  }
21
- // @ts-expect-error `selectionManager.state` is private
22
21
  // This is a temporary mutation before a context update, so this is fine
23
- // eslint-disable-next-line react-hooks/react-compiler
22
+ // @ts-expect-error `selectionManager.state` is private
23
+ // eslint-disable-next-line react-hooks/immutability
24
24
  listState.selectionManager.state.selectionMode = 'multiple';
25
25
  // @ts-expect-error `selectionManager.state` is private
26
+ // eslint-disable-next-line react-hooks/immutability
26
27
  listState.selectionManager.state.selectedKeys = selectedKeys;
27
28
  // @ts-expect-error `selectionManager.state` is private
29
+ // eslint-disable-next-line react-hooks/immutability
28
30
  listState.selectionManager.state.setSelectedKeys = (keys) => {
29
31
  if (keys === 'all') {
30
32
  // When the end-user presses Ctrl/Cmd + A on a list which has `selectionMode` set to `'multiple'`,
@@ -38,6 +40,7 @@ export function TagFieldListBox({ children, inputId, selectedKeys, setSelectedKe
38
40
  }
39
41
  };
40
42
  // @ts-expect-error `selectionManager.state` is private
43
+ // eslint-disable-next-line react-hooks/immutability
41
44
  listState.selectionManager.state.disallowEmptySelection = false;
42
45
  return {
43
46
  ...listState,
@@ -1 +1 @@
1
- {"version":3,"file":"tag-field-list-box.js","sourceRoot":"","sources":["../../../../src/components/tag-field/tag-field-list-box.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EACL,oBAAoB,IAAI,uBAAuB,EAC/C,OAAO,IAAI,UAAU,EACrB,UAAU,IAAI,aAAa,EAE3B,gBAAgB,IAAI,mBAAmB,EACvC,WAAW,IAAI,cAAc,GAC9B,MAAM,uBAAuB,CAAC;AAI/B,MAAM,sBAAsB,GAAyB;IACnD,SAAS,EAAE,EAAE;IACb,aAAa,EAAE,EAAE;IACjB,OAAO,EAAE,CAAC;IACV,GAAG,EAAE,CAAC;CACP,CAAC;AAEF,gBAAgB;AAChB,MAAM,UAAU,eAAe,CAA2B,EACxD,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,eAAe,EACf,KAAK,EACL,QAAQ,EACR,aAAa,GAKd;IACC,MAAM,aAAa,GAAG,UAAU,CAAC,uBAAuB,CAAC,CAAC;IAC1D,MAAM,SAAS,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAElD,gBAAgB,CAAC,EAAE,UAAU,EAAE,CAAC,aAAa,EAAE,MAAM,EAAE,CAAC,CAAC;IAEzD,2EAA2E;IAC3E,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE;QACpC,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC;YAC9C,OAAO,SAAS,CAAC;QACnB,CAAC;QAED,uDAAuD;QACvD,wEAAwE;QACxE,sDAAsD;QACtD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,aAAa,GAAG,UAAU,CAAC;QAC5D,uDAAuD;QACvD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,YAAY,GAAG,YAAY,CAAC;QAC7D,uDAAuD;QACvD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,eAAe,GAAG,CAAC,IAAsB,EAAE,EAAE;YAC5E,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;gBACnB,kGAAkG;gBAClG,uFAAuF;gBACvF,iFAAiF;gBACjF,yEAAyE;gBACxE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAA6B,EAAE,MAAM,EAAE,CAAC;YAC1E,CAAC;iBAAM,CAAC;gBACN,eAAe,CAAC,IAAI,CAAC,CAAC;YACxB,CAAC;QACH,CAAC,CAAC;QACF,uDAAuD;QACvD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,sBAAsB,GAAG,KAAK,CAAC;QAEhE,OAAO;YACL,GAAG,SAAS;SACb,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,EAAE,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC;IAExD,MAAM,OAAO,GAAG,CACd,KAAC,UAAU,IAAC,SAAS,EAAC,uBAAuB,EAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,YAC3E,QAAQ,GACE,CACd,CAAC;IAEF,OAAO,CACL,KAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,gBAAgB,YAClD,aAAa,CAAC,CAAC,CAAC,CACf,KAAC,cAAc,IAAC,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,sBAAsB,YACzE,OAAO,GACO,CAClB,CAAC,CAAC,CAAC,CACF,OAAO,CACR,GAC4B,CAChC,CAAC;AACJ,CAAC","sourcesContent":["import { useContext, useMemo } from 'react';\nimport { usePreventScroll } from 'react-aria';\nimport {\n ComboBoxStateContext as RACComboBoxStateContext,\n ListBox as RACListBox,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n ListStateContext as RACListStateContext,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport type { CollectionItem, Key } from '../types.js';\nimport type { TagFieldProps } from './tag-field.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n rowHeight: 36,\n headingHeight: 32,\n padding: 0,\n gap: 0,\n};\n\n/** @internal */\nexport function TagFieldListBox<T extends CollectionItem>({\n children,\n inputId,\n selectedKeys,\n setSelectedKeys,\n items,\n onScroll,\n isVirtualized,\n}: Pick<TagFieldProps<T>, 'children' | 'items' | 'onScroll' | 'isVirtualized'> & {\n inputId: string;\n selectedKeys: Set<Key>;\n setSelectedKeys: (keys: Set<Key>) => void;\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n const listState = useContext(RACListStateContext);\n\n usePreventScroll({ isDisabled: !comboBoxState?.isOpen });\n\n // Override RACListStateContext to allow multiple selection within the list\n const updatedListState = useMemo(() => {\n if (!listState || !listState.selectionManager) {\n return listState;\n }\n\n // @ts-expect-error `selectionManager.state` is private\n // This is a temporary mutation before a context update, so this is fine\n // eslint-disable-next-line react-hooks/react-compiler\n listState.selectionManager.state.selectionMode = 'multiple';\n // @ts-expect-error `selectionManager.state` is private\n listState.selectionManager.state.selectedKeys = selectedKeys;\n // @ts-expect-error `selectionManager.state` is private\n listState.selectionManager.state.setSelectedKeys = (keys: Set<Key> | 'all') => {\n if (keys === 'all') {\n // When the end-user presses Ctrl/Cmd + A on a list which has `selectionMode` set to `'multiple'`,\n // the selection manager emits the `'all'` string as an indication to select all items.\n // We don't want to do that - instead, we select the contents of the input field.\n // Querying by ID because RACInputContext has a null ref for some reason.\n (document.getElementById(inputId) as HTMLInputElement | null)?.select();\n } else {\n setSelectedKeys(keys);\n }\n };\n // @ts-expect-error `selectionManager.state` is private\n listState.selectionManager.state.disallowEmptySelection = false;\n\n return {\n ...listState,\n };\n }, [listState, selectedKeys, setSelectedKeys, inputId]);\n\n const listBox = (\n <RACListBox className=\"cim-combo-box-listbox\" onScroll={onScroll} items={items}>\n {children}\n </RACListBox>\n );\n\n return (\n <RACListStateContext.Provider value={updatedListState}>\n {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\n </RACListStateContext.Provider>\n );\n}\n"]}
1
+ {"version":3,"file":"tag-field-list-box.js","sourceRoot":"","sources":["../../../../src/components/tag-field/tag-field-list-box.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EACL,oBAAoB,IAAI,uBAAuB,EAC/C,OAAO,IAAI,UAAU,EACrB,UAAU,IAAI,aAAa,EAE3B,gBAAgB,IAAI,mBAAmB,EACvC,WAAW,IAAI,cAAc,GAC9B,MAAM,uBAAuB,CAAC;AAI/B,MAAM,sBAAsB,GAAyB;IACnD,SAAS,EAAE,EAAE;IACb,aAAa,EAAE,EAAE;IACjB,OAAO,EAAE,CAAC;IACV,GAAG,EAAE,CAAC;CACP,CAAC;AAEF,gBAAgB;AAChB,MAAM,UAAU,eAAe,CAA2B,EACxD,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,eAAe,EACf,KAAK,EACL,QAAQ,EACR,aAAa,GAKd;IACC,MAAM,aAAa,GAAG,UAAU,CAAC,uBAAuB,CAAC,CAAC;IAC1D,MAAM,SAAS,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAElD,gBAAgB,CAAC,EAAE,UAAU,EAAE,CAAC,aAAa,EAAE,MAAM,EAAE,CAAC,CAAC;IAEzD,2EAA2E;IAC3E,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE;QACpC,IAAI,CAAC,SAAS,IAAI,CAAC,SAAS,CAAC,gBAAgB,EAAE,CAAC;YAC9C,OAAO,SAAS,CAAC;QACnB,CAAC;QAED,wEAAwE;QACxE,uDAAuD;QACvD,oDAAoD;QACpD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,aAAa,GAAG,UAAU,CAAC;QAC5D,uDAAuD;QACvD,oDAAoD;QACpD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,YAAY,GAAG,YAAY,CAAC;QAC7D,uDAAuD;QACvD,oDAAoD;QACpD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,eAAe,GAAG,CAAC,IAAsB,EAAE,EAAE;YAC5E,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;gBACnB,kGAAkG;gBAClG,uFAAuF;gBACvF,iFAAiF;gBACjF,yEAAyE;gBACxE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAA6B,EAAE,MAAM,EAAE,CAAC;YAC1E,CAAC;iBAAM,CAAC;gBACN,eAAe,CAAC,IAAI,CAAC,CAAC;YACxB,CAAC;QACH,CAAC,CAAC;QACF,uDAAuD;QACvD,oDAAoD;QACpD,SAAS,CAAC,gBAAgB,CAAC,KAAK,CAAC,sBAAsB,GAAG,KAAK,CAAC;QAEhE,OAAO;YACL,GAAG,SAAS;SACb,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,YAAY,EAAE,eAAe,EAAE,OAAO,CAAC,CAAC,CAAC;IAExD,MAAM,OAAO,GAAG,CACd,KAAC,UAAU,IAAC,SAAS,EAAC,uBAAuB,EAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,YAC3E,QAAQ,GACE,CACd,CAAC;IAEF,OAAO,CACL,KAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,gBAAgB,YAClD,aAAa,CAAC,CAAC,CAAC,CACf,KAAC,cAAc,IAAC,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,sBAAsB,YACzE,OAAO,GACO,CAClB,CAAC,CAAC,CAAC,CACF,OAAO,CACR,GAC4B,CAChC,CAAC;AACJ,CAAC","sourcesContent":["import { useContext, useMemo } from 'react';\nimport { usePreventScroll } from 'react-aria';\nimport {\n ComboBoxStateContext as RACComboBoxStateContext,\n ListBox as RACListBox,\n ListLayout as RACListLayout,\n type ListLayoutOptions as RACListLayoutOptions,\n ListStateContext as RACListStateContext,\n Virtualizer as RACVirtualizer,\n} from 'react-aria-components';\nimport type { CollectionItem, Key } from '../types.js';\nimport type { TagFieldProps } from './tag-field.js';\n\nconst VIRTUAL_LAYOUT_OPTIONS: RACListLayoutOptions = {\n rowHeight: 36,\n headingHeight: 32,\n padding: 0,\n gap: 0,\n};\n\n/** @internal */\nexport function TagFieldListBox<T extends CollectionItem>({\n children,\n inputId,\n selectedKeys,\n setSelectedKeys,\n items,\n onScroll,\n isVirtualized,\n}: Pick<TagFieldProps<T>, 'children' | 'items' | 'onScroll' | 'isVirtualized'> & {\n inputId: string;\n selectedKeys: Set<Key>;\n setSelectedKeys: (keys: Set<Key>) => void;\n}) {\n const comboBoxState = useContext(RACComboBoxStateContext);\n const listState = useContext(RACListStateContext);\n\n usePreventScroll({ isDisabled: !comboBoxState?.isOpen });\n\n // Override RACListStateContext to allow multiple selection within the list\n const updatedListState = useMemo(() => {\n if (!listState || !listState.selectionManager) {\n return listState;\n }\n\n // This is a temporary mutation before a context update, so this is fine\n // @ts-expect-error `selectionManager.state` is private\n // eslint-disable-next-line react-hooks/immutability\n listState.selectionManager.state.selectionMode = 'multiple';\n // @ts-expect-error `selectionManager.state` is private\n // eslint-disable-next-line react-hooks/immutability\n listState.selectionManager.state.selectedKeys = selectedKeys;\n // @ts-expect-error `selectionManager.state` is private\n // eslint-disable-next-line react-hooks/immutability\n listState.selectionManager.state.setSelectedKeys = (keys: Set<Key> | 'all') => {\n if (keys === 'all') {\n // When the end-user presses Ctrl/Cmd + A on a list which has `selectionMode` set to `'multiple'`,\n // the selection manager emits the `'all'` string as an indication to select all items.\n // We don't want to do that - instead, we select the contents of the input field.\n // Querying by ID because RACInputContext has a null ref for some reason.\n (document.getElementById(inputId) as HTMLInputElement | null)?.select();\n } else {\n setSelectedKeys(keys);\n }\n };\n // @ts-expect-error `selectionManager.state` is private\n // eslint-disable-next-line react-hooks/immutability\n listState.selectionManager.state.disallowEmptySelection = false;\n\n return {\n ...listState,\n };\n }, [listState, selectedKeys, setSelectedKeys, inputId]);\n\n const listBox = (\n <RACListBox className=\"cim-combo-box-listbox\" onScroll={onScroll} items={items}>\n {children}\n </RACListBox>\n );\n\n return (\n <RACListStateContext.Provider value={updatedListState}>\n {isVirtualized ? (\n <RACVirtualizer layout={RACListLayout} layoutOptions={VIRTUAL_LAYOUT_OPTIONS}>\n {listBox}\n </RACVirtualizer>\n ) : (\n listBox\n )}\n </RACListStateContext.Provider>\n );\n}\n"]}
@@ -6,6 +6,8 @@ import { Tag } from '../tag/tag.js';
6
6
  /** @internal */
7
7
  export function TagFieldTags({ inputId, selectedKeys, isDisabled, isReadOnly, renderEmptyState, onRemove, }) {
8
8
  const listState = useContext(RACListStateContext);
9
+ // The plugin doesn't see `selectedKeys` as a legitimate dependency
10
+ // eslint-disable-next-line react-hooks/preserve-manual-memoization
9
11
  const selectedItems = useMemo(() => {
10
12
  return [...selectedKeys.values()]
11
13
  .map((key) => listState?.selectionManager.collection.getItem(key))
@@ -1 +1 @@
1
- {"version":3,"file":"tag-field-tags.js","sourceRoot":"","sources":["../../../../src/components/tag-field/tag-field-tags.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EACL,aAAa,IAAI,gBAAgB,EACjC,YAAY,IAAI,eAAe,EAC/B,gBAAgB,IAAI,mBAAmB,EACvC,QAAQ,IAAI,WAAW,EACvB,WAAW,IAAI,cAAc,GAC9B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAiB,MAAM,eAAe,CAAC;AAInD,gBAAgB;AAChB,MAAM,UAAU,YAAY,CAA2B,EACrD,OAAO,EACP,YAAY,EACZ,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,GAKT;IACC,MAAM,SAAS,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAElD,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,CAAC;aAC9B,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,EAAE,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;aACjE,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC,CAAC;IAE3D,OAAO,CACL,KAAC,WAAW,IACV,MAAM,EAAE;YACN,4EAA4E;YAC5E,CAAC,eAAe,EAAE,IAAI,CAAC;YACvB,CAAC,gBAAgB,EAAE,IAAI,CAAC;YACxB,CAAC,cAAc,EAAE,IAAI,CAAC;YACtB,CAAC,mBAAmB,EAAE,IAAI,CAAC;SAC5B,YAED,KAAC,QAAQ,uBACU,OAAO,EACxB,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EACnD,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EACN,UAAU;gBACR,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE;oBACP,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;gBACzB,CAAC,YAGN,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,KAAC,GAAG,IAAgB,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,UAAU,EAAG,IAAI,CAAC,KAAkB,CAAC,UAAU,YAC9E,IAAI,CAAC,SAAS,IADP,IAAI,CAAC,GAAG,CAEZ,CACP,CAAC,GACO,GACC,CACf,CAAC;AACJ,CAAC","sourcesContent":["import { useContext, useMemo } from 'react';\nimport {\n ButtonContext as RACButtonContext,\n LabelContext as RACLabelContext,\n ListStateContext as RACListStateContext,\n Provider as RACProvider,\n TextContext as RACTextContext,\n} from 'react-aria-components';\nimport { TagGroup } from '../tag/tag-group.js';\nimport { Tag, type TagProps } from '../tag/tag.js';\nimport type { CollectionItem, Key } from '../types.js';\nimport type { TagFieldProps } from './tag-field.js';\n\n/** @internal */\nexport function TagFieldTags<T extends CollectionItem>({\n inputId,\n selectedKeys,\n isDisabled,\n isReadOnly,\n renderEmptyState,\n onRemove,\n}: Pick<TagFieldProps<T>, 'isDisabled' | 'isReadOnly' | 'renderEmptyState'> & {\n inputId: string;\n selectedKeys: Set<Key>;\n onRemove: (key: Key) => void;\n}) {\n const listState = useContext(RACListStateContext);\n\n const selectedItems = useMemo(() => {\n return [...selectedKeys.values()]\n .map((key) => listState?.selectionManager.collection.getItem(key))\n .filter((value) => !!value);\n }, [selectedKeys, listState?.selectionManager.collection]);\n\n return (\n <RACProvider\n values={[\n // Reset contexts so that TagGroup doesn't inherit any data from RACComboBox\n [RACLabelContext, null],\n [RACButtonContext, null],\n [RACTextContext, null],\n [RACListStateContext, null],\n ]}\n >\n <TagGroup\n aria-labelledby={inputId}\n disabledKeys={isDisabled ? selectedKeys : undefined}\n renderEmptyState={renderEmptyState}\n onRemove={\n isReadOnly\n ? undefined\n : (keys) => {\n keys.forEach(onRemove);\n }\n }\n >\n {selectedItems.map((item) => (\n <Tag key={item.key} id={item.key} isDisabled={(item.props as TagProps).isDisabled}>\n {item.textValue}\n </Tag>\n ))}\n </TagGroup>\n </RACProvider>\n );\n}\n"]}
1
+ {"version":3,"file":"tag-field-tags.js","sourceRoot":"","sources":["../../../../src/components/tag-field/tag-field-tags.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EACL,aAAa,IAAI,gBAAgB,EACjC,YAAY,IAAI,eAAe,EAC/B,gBAAgB,IAAI,mBAAmB,EACvC,QAAQ,IAAI,WAAW,EACvB,WAAW,IAAI,cAAc,GAC9B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,GAAG,EAAiB,MAAM,eAAe,CAAC;AAInD,gBAAgB;AAChB,MAAM,UAAU,YAAY,CAA2B,EACrD,OAAO,EACP,YAAY,EACZ,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,GAKT;IACC,MAAM,SAAS,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAElD,mEAAmE;IACnE,mEAAmE;IACnE,MAAM,aAAa,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,OAAO,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,CAAC;aAC9B,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,SAAS,EAAE,gBAAgB,CAAC,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC;aACjE,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC,CAAC;IAE3D,OAAO,CACL,KAAC,WAAW,IACV,MAAM,EAAE;YACN,4EAA4E;YAC5E,CAAC,eAAe,EAAE,IAAI,CAAC;YACvB,CAAC,gBAAgB,EAAE,IAAI,CAAC;YACxB,CAAC,cAAc,EAAE,IAAI,CAAC;YACtB,CAAC,mBAAmB,EAAE,IAAI,CAAC;SAC5B,YAED,KAAC,QAAQ,uBACU,OAAO,EACxB,YAAY,EAAE,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,EACnD,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EACN,UAAU;gBACR,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE;oBACP,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;gBACzB,CAAC,YAGN,aAAa,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC3B,KAAC,GAAG,IAAgB,EAAE,EAAE,IAAI,CAAC,GAAG,EAAE,UAAU,EAAG,IAAI,CAAC,KAAkB,CAAC,UAAU,YAC9E,IAAI,CAAC,SAAS,IADP,IAAI,CAAC,GAAG,CAEZ,CACP,CAAC,GACO,GACC,CACf,CAAC;AACJ,CAAC","sourcesContent":["import { useContext, useMemo } from 'react';\nimport {\n ButtonContext as RACButtonContext,\n LabelContext as RACLabelContext,\n ListStateContext as RACListStateContext,\n Provider as RACProvider,\n TextContext as RACTextContext,\n} from 'react-aria-components';\nimport { TagGroup } from '../tag/tag-group.js';\nimport { Tag, type TagProps } from '../tag/tag.js';\nimport type { CollectionItem, Key } from '../types.js';\nimport type { TagFieldProps } from './tag-field.js';\n\n/** @internal */\nexport function TagFieldTags<T extends CollectionItem>({\n inputId,\n selectedKeys,\n isDisabled,\n isReadOnly,\n renderEmptyState,\n onRemove,\n}: Pick<TagFieldProps<T>, 'isDisabled' | 'isReadOnly' | 'renderEmptyState'> & {\n inputId: string;\n selectedKeys: Set<Key>;\n onRemove: (key: Key) => void;\n}) {\n const listState = useContext(RACListStateContext);\n\n // The plugin doesn't see `selectedKeys` as a legitimate dependency\n // eslint-disable-next-line react-hooks/preserve-manual-memoization\n const selectedItems = useMemo(() => {\n return [...selectedKeys.values()]\n .map((key) => listState?.selectionManager.collection.getItem(key))\n .filter((value) => !!value);\n }, [selectedKeys, listState?.selectionManager.collection]);\n\n return (\n <RACProvider\n values={[\n // Reset contexts so that TagGroup doesn't inherit any data from RACComboBox\n [RACLabelContext, null],\n [RACButtonContext, null],\n [RACTextContext, null],\n [RACListStateContext, null],\n ]}\n >\n <TagGroup\n aria-labelledby={inputId}\n disabledKeys={isDisabled ? selectedKeys : undefined}\n renderEmptyState={renderEmptyState}\n onRemove={\n isReadOnly\n ? undefined\n : (keys) => {\n keys.forEach(onRemove);\n }\n }\n >\n {selectedItems.map((item) => (\n <Tag key={item.key} id={item.key} isDisabled={(item.props as TagProps).isDisabled}>\n {item.textValue}\n </Tag>\n ))}\n </TagGroup>\n </RACProvider>\n );\n}\n"]}
@@ -88,7 +88,7 @@ function TagField({ label, description, error, items, children, placeholder, UNS
88
88
  const onItemSelectionChange = (key) => {
89
89
  if (selectedSet.has(key)) {
90
90
  // This is a temporary mutation followed immediately by a state update, so this is fine
91
- // eslint-disable-next-line react-hooks/react-compiler
91
+ // eslint-disable-next-line react-hooks/immutability
92
92
  selectedSet.delete(key);
93
93
  }
94
94
  else {