@fluentui/react-tag-picker 9.3.6 → 9.3.7

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 (129) hide show
  1. package/CHANGELOG.md +25 -2
  2. package/lib/TagPicker.js.map +1 -1
  3. package/lib/TagPickerButton.js.map +1 -1
  4. package/lib/TagPickerControl.js.map +1 -1
  5. package/lib/TagPickerGroup.js.map +1 -1
  6. package/lib/TagPickerInput.js.map +1 -1
  7. package/lib/TagPickerList.js.map +1 -1
  8. package/lib/TagPickerOption.js.map +1 -1
  9. package/lib/TagPickerOptionGroup.js.map +1 -1
  10. package/lib/components/TagPicker/TagPicker.js.map +1 -1
  11. package/lib/components/TagPicker/TagPicker.types.js.map +1 -1
  12. package/lib/components/TagPicker/index.js.map +1 -1
  13. package/lib/components/TagPicker/renderTagPicker.js.map +1 -1
  14. package/lib/components/TagPicker/useTagPicker.js.map +1 -1
  15. package/lib/components/TagPicker/useTagPickerContextValues.js.map +1 -1
  16. package/lib/components/TagPickerButton/TagPickerButton.js.map +1 -1
  17. package/lib/components/TagPickerButton/TagPickerButton.types.js.map +1 -1
  18. package/lib/components/TagPickerButton/index.js.map +1 -1
  19. package/lib/components/TagPickerButton/renderTagPickerButton.js.map +1 -1
  20. package/lib/components/TagPickerButton/useTagPickerButton.js.map +1 -1
  21. package/lib/components/TagPickerButton/useTagPickerButtonStyles.styles.js +1 -2
  22. package/lib/components/TagPickerControl/TagPickerControl.js.map +1 -1
  23. package/lib/components/TagPickerControl/TagPickerControl.types.js.map +1 -1
  24. package/lib/components/TagPickerControl/index.js.map +1 -1
  25. package/lib/components/TagPickerControl/renderTagPickerControl.js.map +1 -1
  26. package/lib/components/TagPickerControl/useTagPickerControl.js.map +1 -1
  27. package/lib/components/TagPickerControl/useTagPickerControlStyles.styles.js +1 -2
  28. package/lib/components/TagPickerGroup/TagPickerGroup.js.map +1 -1
  29. package/lib/components/TagPickerGroup/TagPickerGroup.types.js.map +1 -1
  30. package/lib/components/TagPickerGroup/index.js.map +1 -1
  31. package/lib/components/TagPickerGroup/renderTagPickerGroup.js.map +1 -1
  32. package/lib/components/TagPickerGroup/useTagPickerGroup.js.map +1 -1
  33. package/lib/components/TagPickerGroup/useTagPickerGroupStyles.styles.js +1 -2
  34. package/lib/components/TagPickerInput/TagPickerInput.js.map +1 -1
  35. package/lib/components/TagPickerInput/TagPickerInput.types.js.map +1 -1
  36. package/lib/components/TagPickerInput/index.js.map +1 -1
  37. package/lib/components/TagPickerInput/renderTagPickerInput.js.map +1 -1
  38. package/lib/components/TagPickerInput/useTagPickerInput.js.map +1 -1
  39. package/lib/components/TagPickerInput/useTagPickerInputStyles.styles.js +1 -2
  40. package/lib/components/TagPickerList/TagPickerList.js.map +1 -1
  41. package/lib/components/TagPickerList/TagPickerList.types.js.map +1 -1
  42. package/lib/components/TagPickerList/index.js.map +1 -1
  43. package/lib/components/TagPickerList/renderTagPickerList.js.map +1 -1
  44. package/lib/components/TagPickerList/useTagPickerList.js.map +1 -1
  45. package/lib/components/TagPickerList/useTagPickerListStyles.styles.js +1 -2
  46. package/lib/components/TagPickerOption/TagPickerOption.js.map +1 -1
  47. package/lib/components/TagPickerOption/TagPickerOption.types.js.map +1 -1
  48. package/lib/components/TagPickerOption/index.js.map +1 -1
  49. package/lib/components/TagPickerOption/renderTagPickerOption.js.map +1 -1
  50. package/lib/components/TagPickerOption/useTagPickerOption.js.map +1 -1
  51. package/lib/components/TagPickerOption/useTagPickerOptionStyles.styles.js +1 -2
  52. package/lib/components/TagPickerOptionGroup/TagPickerOptionGroup.js.map +1 -1
  53. package/lib/components/TagPickerOptionGroup/TagPickerOptionGroup.types.js.map +1 -1
  54. package/lib/components/TagPickerOptionGroup/index.js.map +1 -1
  55. package/lib/components/TagPickerOptionGroup/renderTagPickerOptionGroup.js +1 -1
  56. package/lib/components/TagPickerOptionGroup/renderTagPickerOptionGroup.js.map +1 -1
  57. package/lib/components/TagPickerOptionGroup/useTagPickerOptionGroup.js.map +1 -1
  58. package/lib/components/TagPickerOptionGroup/useTagPickerOptionGroupStyles.styles.js +1 -2
  59. package/lib/contexts/TagPickerContext.js.map +1 -1
  60. package/lib/index.js.map +1 -1
  61. package/lib/utils/tagPicker2Tag.js.map +1 -1
  62. package/lib/utils/tokens.js.map +1 -1
  63. package/lib/utils/useExpandLabel.js.map +1 -1
  64. package/lib/utils/useResizeObserverRef.js.map +1 -1
  65. package/lib/utils/useTagPickerFilter.js.map +1 -1
  66. package/lib-commonjs/TagPicker.js.map +1 -1
  67. package/lib-commonjs/TagPickerButton.js.map +1 -1
  68. package/lib-commonjs/TagPickerControl.js.map +1 -1
  69. package/lib-commonjs/TagPickerGroup.js.map +1 -1
  70. package/lib-commonjs/TagPickerInput.js.map +1 -1
  71. package/lib-commonjs/TagPickerList.js.map +1 -1
  72. package/lib-commonjs/TagPickerOption.js.map +1 -1
  73. package/lib-commonjs/TagPickerOptionGroup.js.map +1 -1
  74. package/lib-commonjs/components/TagPicker/TagPicker.js.map +1 -1
  75. package/lib-commonjs/components/TagPicker/TagPicker.types.js.map +1 -1
  76. package/lib-commonjs/components/TagPicker/index.js.map +1 -1
  77. package/lib-commonjs/components/TagPicker/renderTagPicker.js.map +1 -1
  78. package/lib-commonjs/components/TagPicker/useTagPicker.js.map +1 -1
  79. package/lib-commonjs/components/TagPicker/useTagPickerContextValues.js.map +1 -1
  80. package/lib-commonjs/components/TagPickerButton/TagPickerButton.js.map +1 -1
  81. package/lib-commonjs/components/TagPickerButton/TagPickerButton.types.js.map +1 -1
  82. package/lib-commonjs/components/TagPickerButton/index.js.map +1 -1
  83. package/lib-commonjs/components/TagPickerButton/renderTagPickerButton.js.map +1 -1
  84. package/lib-commonjs/components/TagPickerButton/useTagPickerButton.js.map +1 -1
  85. package/lib-commonjs/components/TagPickerButton/useTagPickerButtonStyles.styles.js +1 -1
  86. package/lib-commonjs/components/TagPickerControl/TagPickerControl.js.map +1 -1
  87. package/lib-commonjs/components/TagPickerControl/TagPickerControl.types.js.map +1 -1
  88. package/lib-commonjs/components/TagPickerControl/index.js.map +1 -1
  89. package/lib-commonjs/components/TagPickerControl/renderTagPickerControl.js.map +1 -1
  90. package/lib-commonjs/components/TagPickerControl/useTagPickerControl.js.map +1 -1
  91. package/lib-commonjs/components/TagPickerControl/useTagPickerControlStyles.styles.js +1 -1
  92. package/lib-commonjs/components/TagPickerGroup/TagPickerGroup.js.map +1 -1
  93. package/lib-commonjs/components/TagPickerGroup/TagPickerGroup.types.js.map +1 -1
  94. package/lib-commonjs/components/TagPickerGroup/index.js.map +1 -1
  95. package/lib-commonjs/components/TagPickerGroup/renderTagPickerGroup.js.map +1 -1
  96. package/lib-commonjs/components/TagPickerGroup/useTagPickerGroup.js.map +1 -1
  97. package/lib-commonjs/components/TagPickerGroup/useTagPickerGroupStyles.styles.js +1 -1
  98. package/lib-commonjs/components/TagPickerInput/TagPickerInput.js.map +1 -1
  99. package/lib-commonjs/components/TagPickerInput/TagPickerInput.types.js.map +1 -1
  100. package/lib-commonjs/components/TagPickerInput/index.js.map +1 -1
  101. package/lib-commonjs/components/TagPickerInput/renderTagPickerInput.js.map +1 -1
  102. package/lib-commonjs/components/TagPickerInput/useTagPickerInput.js.map +1 -1
  103. package/lib-commonjs/components/TagPickerInput/useTagPickerInputStyles.styles.js +1 -1
  104. package/lib-commonjs/components/TagPickerList/TagPickerList.js.map +1 -1
  105. package/lib-commonjs/components/TagPickerList/TagPickerList.types.js.map +1 -1
  106. package/lib-commonjs/components/TagPickerList/index.js.map +1 -1
  107. package/lib-commonjs/components/TagPickerList/renderTagPickerList.js.map +1 -1
  108. package/lib-commonjs/components/TagPickerList/useTagPickerList.js.map +1 -1
  109. package/lib-commonjs/components/TagPickerList/useTagPickerListStyles.styles.js +1 -1
  110. package/lib-commonjs/components/TagPickerOption/TagPickerOption.js.map +1 -1
  111. package/lib-commonjs/components/TagPickerOption/TagPickerOption.types.js.map +1 -1
  112. package/lib-commonjs/components/TagPickerOption/index.js.map +1 -1
  113. package/lib-commonjs/components/TagPickerOption/renderTagPickerOption.js.map +1 -1
  114. package/lib-commonjs/components/TagPickerOption/useTagPickerOption.js.map +1 -1
  115. package/lib-commonjs/components/TagPickerOption/useTagPickerOptionStyles.styles.js +1 -1
  116. package/lib-commonjs/components/TagPickerOptionGroup/TagPickerOptionGroup.js.map +1 -1
  117. package/lib-commonjs/components/TagPickerOptionGroup/TagPickerOptionGroup.types.js.map +1 -1
  118. package/lib-commonjs/components/TagPickerOptionGroup/index.js.map +1 -1
  119. package/lib-commonjs/components/TagPickerOptionGroup/renderTagPickerOptionGroup.js.map +1 -1
  120. package/lib-commonjs/components/TagPickerOptionGroup/useTagPickerOptionGroup.js.map +1 -1
  121. package/lib-commonjs/components/TagPickerOptionGroup/useTagPickerOptionGroupStyles.styles.js +1 -1
  122. package/lib-commonjs/contexts/TagPickerContext.js.map +1 -1
  123. package/lib-commonjs/index.js.map +1 -1
  124. package/lib-commonjs/utils/tagPicker2Tag.js.map +1 -1
  125. package/lib-commonjs/utils/tokens.js.map +1 -1
  126. package/lib-commonjs/utils/useExpandLabel.js.map +1 -1
  127. package/lib-commonjs/utils/useResizeObserverRef.js.map +1 -1
  128. package/lib-commonjs/utils/useTagPickerFilter.js.map +1 -1
  129. package/package.json +14 -28
package/CHANGELOG.md CHANGED
@@ -1,12 +1,35 @@
1
1
  # Change Log - @fluentui/react-tag-picker
2
2
 
3
- This log was last generated on Tue, 15 Oct 2024 17:13:32 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 11 Nov 2024 09:55:23 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.3.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-tag-picker_v9.3.7)
8
+
9
+ Mon, 11 Nov 2024 09:55:23 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tag-picker_v9.3.6..@fluentui/react-tag-picker_v9.3.7)
11
+
12
+ ### Patches
13
+
14
+ - chore: replace npm-scripts and just-scrtips with nx inferred tasks ([PR #33074](https://github.com/microsoft/fluentui/pull/33074) by martinhochel@microsoft.com)
15
+ - style: resolve exposed jsx pragma lint issues within monorepo ([PR #32975](https://github.com/microsoft/fluentui/pull/32975) by martinhochel@microsoft.com)
16
+ - Bump @fluentui/react-jsx-runtime to v9.0.46 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
17
+ - Bump @fluentui/react-shared-contexts to v9.21.0 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
18
+ - Bump @fluentui/react-theme to v9.1.22 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.18.17 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
20
+ - Bump @fluentui/react-portal to v9.4.38 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
21
+ - Bump @fluentui/react-tabster to v9.23.0 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
22
+ - Bump @fluentui/react-aria to v9.13.9 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
23
+ - Bump @fluentui/react-combobox to v9.13.11 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
24
+ - Bump @fluentui/react-tags to v9.3.21 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
25
+ - Bump @fluentui/react-context-selector to v9.1.69 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
26
+ - Bump @fluentui/react-positioning to v9.15.11 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
27
+ - Bump @fluentui/keyboard-keys to v9.0.8 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
28
+ - Bump @fluentui/react-field to v9.1.79 ([PR #31887](https://github.com/microsoft/fluentui/pull/31887) by beachball)
29
+
7
30
  ## [9.3.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-tag-picker_v9.3.6)
8
31
 
9
- Tue, 15 Oct 2024 17:13:32 GMT
32
+ Tue, 15 Oct 2024 17:17:53 GMT
10
33
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tag-picker_v9.3.5..@fluentui/react-tag-picker_v9.3.6)
11
34
 
12
35
  ### Patches
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPicker.ts"],"sourcesContent":["export * from './components/TagPicker/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,+BAA+B"}
1
+ {"version":3,"sources":["../src/TagPicker.ts"],"sourcesContent":["export * from './components/TagPicker/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,+BAA+B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerButton.ts"],"sourcesContent":["export * from './components/TagPickerButton/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,qCAAqC"}
1
+ {"version":3,"sources":["../src/TagPickerButton.ts"],"sourcesContent":["export * from './components/TagPickerButton/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,qCAAqC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerControl.ts"],"sourcesContent":["export * from './components/TagPickerControl/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,sCAAsC"}
1
+ {"version":3,"sources":["../src/TagPickerControl.ts"],"sourcesContent":["export * from './components/TagPickerControl/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,sCAAsC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerGroup.ts"],"sourcesContent":["export * from './components/TagPickerGroup/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oCAAoC"}
1
+ {"version":3,"sources":["../src/TagPickerGroup.ts"],"sourcesContent":["export * from './components/TagPickerGroup/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oCAAoC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerInput.ts"],"sourcesContent":["export * from './components/TagPickerInput/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oCAAoC"}
1
+ {"version":3,"sources":["../src/TagPickerInput.ts"],"sourcesContent":["export * from './components/TagPickerInput/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oCAAoC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerList.ts"],"sourcesContent":["export * from './components/TagPickerList/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,mCAAmC"}
1
+ {"version":3,"sources":["../src/TagPickerList.ts"],"sourcesContent":["export * from './components/TagPickerList/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,mCAAmC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerOption.ts"],"sourcesContent":["export * from './components/TagPickerOption/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,qCAAqC"}
1
+ {"version":3,"sources":["../src/TagPickerOption.ts"],"sourcesContent":["export * from './components/TagPickerOption/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,qCAAqC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerOptionGroup.ts"],"sourcesContent":["export * from './components/TagPickerOptionGroup/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,0CAA0C"}
1
+ {"version":3,"sources":["../src/TagPickerOptionGroup.ts"],"sourcesContent":["export * from './components/TagPickerOptionGroup/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,0CAA0C"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTagPicker_unstable } from './useTagPicker';\nimport { renderTagPicker_unstable } from './renderTagPicker';\nimport type { TagPickerProps } from './TagPicker.types';\nimport { useTagPickerContextValues } from './useTagPickerContextValues';\n\n/**\n * TagPicker component -\n * A TagPicker is a composite component that allows users to pick tags from a list of options.\n */\nexport const TagPicker: React.FC<TagPickerProps> = React.memo(props => {\n const state = useTagPicker_unstable(props);\n const contextValues = useTagPickerContextValues(state);\n return renderTagPicker_unstable(state, contextValues);\n});\n\nTagPicker.displayName = 'TagPicker';\n"],"names":["React","useTagPicker_unstable","renderTagPicker_unstable","useTagPickerContextValues","TagPicker","memo","props","state","contextValues","displayName"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,oBAAoB;AAE7D,SAASC,yBAAyB,QAAQ,8BAA8B;AAExE;;;CAGC,GACD,OAAO,MAAMC,0BAAsCJ,MAAMK,IAAI,CAACC,CAAAA;IAC5D,MAAMC,QAAQN,sBAAsBK;IACpC,MAAME,gBAAgBL,0BAA0BI;IAChD,OAAOL,yBAAyBK,OAAOC;AACzC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/TagPicker/TagPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTagPicker_unstable } from './useTagPicker';\nimport { renderTagPicker_unstable } from './renderTagPicker';\nimport type { TagPickerProps } from './TagPicker.types';\nimport { useTagPickerContextValues } from './useTagPickerContextValues';\n\n/**\n * TagPicker component -\n * A TagPicker is a composite component that allows users to pick tags from a list of options.\n */\nexport const TagPicker: React.FC<TagPickerProps> = React.memo(props => {\n const state = useTagPicker_unstable(props);\n const contextValues = useTagPickerContextValues(state);\n return renderTagPicker_unstable(state, contextValues);\n});\n\nTagPicker.displayName = 'TagPicker';\n"],"names":["React","useTagPicker_unstable","renderTagPicker_unstable","useTagPickerContextValues","TagPicker","memo","props","state","contextValues","displayName"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,oBAAoB;AAE7D,SAASC,yBAAyB,QAAQ,8BAA8B;AAExE;;;CAGC,GACD,OAAO,MAAMC,0BAAsCJ,MAAMK,IAAI,CAACC,CAAAA;IAC5D,MAAMC,QAAQN,sBAAsBK;IACpC,MAAME,gBAAgBL,0BAA0BI;IAChD,OAAOL,yBAAyBK,OAAOC;AACzC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPicker.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState, EventData, EventHandler } from '@fluentui/react-utilities';\nimport type { ComboboxProps, ComboboxState, ListboxContextValue } from '@fluentui/react-combobox';\nimport type { TagPickerContextValue } from '../../contexts/TagPickerContext';\nimport type { ActiveDescendantContextValue } from '@fluentui/react-aria';\n\nexport type TagPickerSlots = {};\n\nexport type TagPickerSize = 'medium' | 'large' | 'extra-large';\n\n/**\n * Event data for the `onOptionSelect` event.\n *\n * * value - The value of the selected option that triggered the event\n * * selectedOptions - The list of selected options\n */\nexport type TagPickerOnOptionSelectData = {\n value: string;\n selectedOptions: string[];\n} & (EventData<'click', React.MouseEvent<HTMLDivElement>> | EventData<'keydown', React.KeyboardEvent<HTMLDivElement>>);\n\nexport type TagPickerOnOpenChangeData = { open: boolean } & (\n | EventData<'click', React.MouseEvent<HTMLDivElement>>\n | EventData<'keydown', React.KeyboardEvent<HTMLDivElement>>\n);\n\n/**\n * Picker Props\n */\nexport type TagPickerProps = ComponentProps<TagPickerSlots> &\n Pick<\n ComboboxProps,\n 'positioning' | 'disabled' | 'defaultOpen' | 'selectedOptions' | 'defaultSelectedOptions' | 'open'\n > &\n Pick<Partial<TagPickerContextValue>, 'size' | 'appearance'> & {\n /**\n * By default, when a single children is provided, the TagPicker will assume that the children\n * is a popover. By setting this prop to true, the children will be treated as a trigger instead.\n *\n * @default false\n */\n noPopover?: boolean;\n onOpenChange?: EventHandler<TagPickerOnOpenChangeData>;\n onOptionSelect?: EventHandler<TagPickerOnOptionSelectData>;\n\n /**\n * Can contain two children including a trigger and a popover\n */\n children: [JSX.Element, JSX.Element | undefined | false] | JSX.Element;\n /**\n * TagPickers are rendered out of DOM order on `document.body` by default,\n * use this to render the popover in DOM order\n *\n * @default false\n */\n inline?: boolean;\n };\n\n/**\n * State used in rendering Picker\n */\nexport type TagPickerState = ComponentState<TagPickerSlots> &\n Pick<\n ComboboxState,\n | 'open'\n | 'activeDescendantController'\n | 'mountNode'\n | 'onOptionClick'\n | 'registerOption'\n | 'selectedOptions'\n | 'selectOption'\n | 'value'\n | 'setValue'\n | 'setOpen'\n | 'setHasFocus'\n | 'appearance'\n | 'clearSelection'\n | 'getOptionById'\n | 'getOptionsMatchingValue'\n | 'disabled'\n > &\n Pick<\n TagPickerContextValue,\n | 'triggerRef'\n | 'secondaryActionRef'\n | 'popoverId'\n | 'popoverRef'\n | 'targetRef'\n | 'tagPickerGroupRef'\n | 'size'\n | 'noPopover'\n > & {\n trigger: React.ReactNode;\n popover?: React.ReactNode;\n inline: boolean;\n };\n\nexport type TagPickerContextValues = {\n picker: TagPickerContextValue;\n activeDescendant: ActiveDescendantContextValue;\n listbox: ListboxContextValue;\n};\n"],"names":[],"rangeMappings":"","mappings":"AAiGA,WAIE"}
1
+ {"version":3,"sources":["../src/components/TagPicker/TagPicker.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState, EventData, EventHandler } from '@fluentui/react-utilities';\nimport type { ComboboxProps, ComboboxState, ListboxContextValue } from '@fluentui/react-combobox';\nimport type { TagPickerContextValue } from '../../contexts/TagPickerContext';\nimport type { ActiveDescendantContextValue } from '@fluentui/react-aria';\n\nexport type TagPickerSlots = {};\n\nexport type TagPickerSize = 'medium' | 'large' | 'extra-large';\n\n/**\n * Event data for the `onOptionSelect` event.\n *\n * * value - The value of the selected option that triggered the event\n * * selectedOptions - The list of selected options\n */\nexport type TagPickerOnOptionSelectData = {\n value: string;\n selectedOptions: string[];\n} & (EventData<'click', React.MouseEvent<HTMLDivElement>> | EventData<'keydown', React.KeyboardEvent<HTMLDivElement>>);\n\nexport type TagPickerOnOpenChangeData = { open: boolean } & (\n | EventData<'click', React.MouseEvent<HTMLDivElement>>\n | EventData<'keydown', React.KeyboardEvent<HTMLDivElement>>\n);\n\n/**\n * Picker Props\n */\nexport type TagPickerProps = ComponentProps<TagPickerSlots> &\n Pick<\n ComboboxProps,\n 'positioning' | 'disabled' | 'defaultOpen' | 'selectedOptions' | 'defaultSelectedOptions' | 'open'\n > &\n Pick<Partial<TagPickerContextValue>, 'size' | 'appearance'> & {\n /**\n * By default, when a single children is provided, the TagPicker will assume that the children\n * is a popover. By setting this prop to true, the children will be treated as a trigger instead.\n *\n * @default false\n */\n noPopover?: boolean;\n onOpenChange?: EventHandler<TagPickerOnOpenChangeData>;\n onOptionSelect?: EventHandler<TagPickerOnOptionSelectData>;\n\n /**\n * Can contain two children including a trigger and a popover\n */\n children: [JSX.Element, JSX.Element | undefined | false] | JSX.Element;\n /**\n * TagPickers are rendered out of DOM order on `document.body` by default,\n * use this to render the popover in DOM order\n *\n * @default false\n */\n inline?: boolean;\n };\n\n/**\n * State used in rendering Picker\n */\nexport type TagPickerState = ComponentState<TagPickerSlots> &\n Pick<\n ComboboxState,\n | 'open'\n | 'activeDescendantController'\n | 'mountNode'\n | 'onOptionClick'\n | 'registerOption'\n | 'selectedOptions'\n | 'selectOption'\n | 'value'\n | 'setValue'\n | 'setOpen'\n | 'setHasFocus'\n | 'appearance'\n | 'clearSelection'\n | 'getOptionById'\n | 'getOptionsMatchingValue'\n | 'disabled'\n > &\n Pick<\n TagPickerContextValue,\n | 'triggerRef'\n | 'secondaryActionRef'\n | 'popoverId'\n | 'popoverRef'\n | 'targetRef'\n | 'tagPickerGroupRef'\n | 'size'\n | 'noPopover'\n > & {\n trigger: React.ReactNode;\n popover?: React.ReactNode;\n inline: boolean;\n };\n\nexport type TagPickerContextValues = {\n picker: TagPickerContextValue;\n activeDescendant: ActiveDescendantContextValue;\n listbox: ListboxContextValue;\n};\n"],"names":[],"rangeMappings":"","mappings":"AAiGA,WAIE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TagPicker';\nexport * from './TagPicker.types';\nexport * from './renderTagPicker';\nexport * from './useTagPicker';\n"],"names":[],"rangeMappings":";;;","mappings":"AAAA,cAAc,cAAc;AAC5B,cAAc,oBAAoB;AAClC,cAAc,oBAAoB;AAClC,cAAc,iBAAiB"}
1
+ {"version":3,"sources":["../src/components/TagPicker/index.ts"],"sourcesContent":["export * from './TagPicker';\nexport * from './TagPicker.types';\nexport * from './renderTagPicker';\nexport * from './useTagPicker';\n"],"names":[],"rangeMappings":";;;","mappings":"AAAA,cAAc,cAAc;AAC5B,cAAc,oBAAoB;AAClC,cAAc,oBAAoB;AAClC,cAAc,iBAAiB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTagPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { TagPickerState, TagPickerContextValues, TagPickerSlots } from './TagPicker.types';\nimport { ActiveDescendantContextProvider } from '@fluentui/react-aria';\nimport { ListboxProvider } from '@fluentui/react-combobox';\nimport { Portal } from '@fluentui/react-portal';\nimport { TagPickerContextProvider } from '../../contexts/TagPickerContext';\nimport { assertSlots } from '@fluentui/react-utilities';\n\n/**\n * Render the final JSX of Picker\n */\nexport const renderTagPicker_unstable = (state: TagPickerState, contexts: TagPickerContextValues) => {\n assertSlots<TagPickerSlots>(state);\n return (\n <TagPickerContextProvider value={contexts.picker}>\n <ActiveDescendantContextProvider value={contexts.activeDescendant}>\n <ListboxProvider value={contexts.listbox}>\n {state.trigger}\n {state.inline ? state.popover : <Portal mountNode={state.mountNode}>{state.popover}</Portal>}\n </ListboxProvider>\n </ActiveDescendantContextProvider>\n </TagPickerContextProvider>\n );\n};\n"],"names":["React","ActiveDescendantContextProvider","ListboxProvider","Portal","TagPickerContextProvider","assertSlots","renderTagPicker_unstable","state","contexts","value","picker","activeDescendant","listbox","trigger","inline","popover","mountNode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,+BAA+B,QAAQ,uBAAuB;AACvE,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,MAAM,QAAQ,yBAAyB;AAChD,SAASC,wBAAwB,QAAQ,kCAAkC;AAC3E,SAASC,WAAW,QAAQ,4BAA4B;AAExD;;CAEC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAAuBC;IAC9DH,YAA4BE;IAC5B,qBACE,oBAACH;QAAyBK,OAAOD,SAASE,MAAM;qBAC9C,oBAACT;QAAgCQ,OAAOD,SAASG,gBAAgB;qBAC/D,oBAACT;QAAgBO,OAAOD,SAASI,OAAO;OACrCL,MAAMM,OAAO,EACbN,MAAMO,MAAM,GAAGP,MAAMQ,OAAO,iBAAG,oBAACZ;QAAOa,WAAWT,MAAMS,SAAS;OAAGT,MAAMQ,OAAO;AAK5F,EAAE"}
1
+ {"version":3,"sources":["../src/components/TagPicker/renderTagPicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { TagPickerState, TagPickerContextValues, TagPickerSlots } from './TagPicker.types';\nimport { ActiveDescendantContextProvider } from '@fluentui/react-aria';\nimport { ListboxProvider } from '@fluentui/react-combobox';\nimport { Portal } from '@fluentui/react-portal';\nimport { TagPickerContextProvider } from '../../contexts/TagPickerContext';\nimport { assertSlots } from '@fluentui/react-utilities';\n\n/**\n * Render the final JSX of Picker\n */\nexport const renderTagPicker_unstable = (state: TagPickerState, contexts: TagPickerContextValues) => {\n assertSlots<TagPickerSlots>(state);\n return (\n <TagPickerContextProvider value={contexts.picker}>\n <ActiveDescendantContextProvider value={contexts.activeDescendant}>\n <ListboxProvider value={contexts.listbox}>\n {state.trigger}\n {state.inline ? state.popover : <Portal mountNode={state.mountNode}>{state.popover}</Portal>}\n </ListboxProvider>\n </ActiveDescendantContextProvider>\n </TagPickerContextProvider>\n );\n};\n"],"names":["React","ActiveDescendantContextProvider","ListboxProvider","Portal","TagPickerContextProvider","assertSlots","renderTagPicker_unstable","state","contexts","value","picker","activeDescendant","listbox","trigger","inline","popover","mountNode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,+BAA+B,QAAQ,uBAAuB;AACvE,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,MAAM,QAAQ,yBAAyB;AAChD,SAASC,wBAAwB,QAAQ,kCAAkC;AAC3E,SAASC,WAAW,QAAQ,4BAA4B;AAExD;;CAEC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAAuBC;IAC9DH,YAA4BE;IAC5B,qBACE,oBAACH;QAAyBK,OAAOD,SAASE,MAAM;qBAC9C,oBAACT;QAAgCQ,OAAOD,SAASG,gBAAgB;qBAC/D,oBAACT;QAAgBO,OAAOD,SAASI,OAAO;OACrCL,MAAMM,OAAO,EACbN,MAAMO,MAAM,GAAGP,MAAMQ,OAAO,iBAAG,oBAACZ;QAAOa,WAAWT,MAAMS,SAAS;OAAGT,MAAMQ,OAAO;AAK5F,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagPicker.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport type {\n TagPickerOnOpenChangeData,\n TagPickerOnOptionSelectData,\n TagPickerProps,\n TagPickerState,\n} from './TagPicker.types';\nimport { optionClassNames } from '@fluentui/react-combobox';\nimport { PositioningShorthandValue, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { useComboboxBaseState } from '@fluentui/react-combobox';\n\n// Set a default set of fallback positions to try if the dropdown does not fit on screen\nconst fallbackPositions: PositioningShorthandValue[] = ['above', 'after', 'after-top', 'before', 'before-top'];\n\n/**\n * Create the state required to render Picker.\n *\n * The returned state can be modified with hooks such as usePickerStyles_unstable,\n * before being passed to renderPicker_unstable.\n *\n * @param props - props from this instance of Picker\n */\nexport const useTagPicker_unstable = (props: TagPickerProps): TagPickerState => {\n const popoverId = useId('picker-listbox');\n const triggerInnerRef = React.useRef<HTMLInputElement | HTMLButtonElement>(null);\n const secondaryActionRef = React.useRef<HTMLSpanElement>(null);\n const tagPickerGroupRef = React.useRef<HTMLDivElement>(null);\n const { positioning, size = 'medium', inline = false, noPopover = false } = props;\n\n const { targetRef, containerRef } = usePositioning({\n position: 'below' as const,\n align: 'start' as const,\n offset: { crossAxis: 0, mainAxis: 2 },\n fallbackPositions,\n matchTargetSize: 'width' as const,\n ...resolvePositioningShorthand(positioning),\n });\n\n const {\n controller: activeDescendantController,\n activeParentRef,\n listboxRef,\n } = useActiveDescendant<HTMLInputElement, HTMLDivElement>({\n matchOption: el => el.classList.contains(optionClassNames.root),\n });\n\n const comboboxState = useComboboxBaseState({\n ...props,\n onOptionSelect: useEventCallback((event, data) =>\n props.onOptionSelect?.(event, {\n selectedOptions: data.selectedOptions,\n value: data.optionValue,\n type: event.type,\n event,\n } as TagPickerOnOptionSelectData),\n ),\n onOpenChange: useEventCallback((event, data) =>\n props.onOpenChange?.(event, {\n ...data,\n type: event.type,\n event,\n } as TagPickerOnOpenChangeData),\n ),\n activeDescendantController,\n editable: true,\n multiselect: true,\n size: 'medium',\n });\n\n const { trigger, popover } = childrenToTriggerAndPopover(props.children, noPopover);\n\n return {\n activeDescendantController,\n components: {},\n trigger,\n popover: comboboxState.open || comboboxState.hasFocus ? popover : undefined,\n popoverId,\n noPopover,\n disabled: comboboxState.disabled,\n triggerRef: useMergedRefs(triggerInnerRef, activeParentRef),\n popoverRef: useMergedRefs(listboxRef, containerRef),\n secondaryActionRef,\n tagPickerGroupRef,\n targetRef,\n size,\n inline,\n open: comboboxState.open,\n mountNode: comboboxState.mountNode,\n onOptionClick: useEventCallback(event => {\n comboboxState.onOptionClick(event);\n comboboxState.setOpen(event, false);\n }),\n appearance: comboboxState.appearance,\n clearSelection: comboboxState.clearSelection,\n getOptionById: comboboxState.getOptionById,\n getOptionsMatchingValue: comboboxState.getOptionsMatchingValue,\n registerOption: comboboxState.registerOption,\n selectedOptions: comboboxState.selectedOptions,\n selectOption: comboboxState.selectOption,\n setHasFocus: comboboxState.setHasFocus,\n setOpen: comboboxState.setOpen,\n setValue: comboboxState.setValue,\n value: comboboxState.value,\n };\n};\n\nconst childrenToTriggerAndPopover = (children: React.ReactNode, noPopover: boolean) => {\n const childrenArray = React.Children.toArray(children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (childrenArray.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('TagPicker must contain at least one child');\n }\n\n if (childrenArray.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('TagPicker must contain at most two children');\n }\n }\n\n if (noPopover) {\n return { trigger: childrenArray[0] };\n }\n\n let trigger: React.ReactElement | undefined = undefined;\n let popover: React.ReactElement | undefined = undefined;\n\n if (childrenArray.length === 2) {\n trigger = childrenArray[0];\n popover = childrenArray[1];\n } else if (childrenArray.length === 1) {\n popover = childrenArray[0];\n }\n\n return { trigger, popover };\n};\n"],"names":["React","useEventCallback","useId","useMergedRefs","optionClassNames","resolvePositioningShorthand","usePositioning","useActiveDescendant","useComboboxBaseState","fallbackPositions","useTagPicker_unstable","props","popoverId","triggerInnerRef","useRef","secondaryActionRef","tagPickerGroupRef","positioning","size","inline","noPopover","targetRef","containerRef","position","align","offset","crossAxis","mainAxis","matchTargetSize","controller","activeDescendantController","activeParentRef","listboxRef","matchOption","el","classList","contains","root","comboboxState","onOptionSelect","event","data","selectedOptions","value","optionValue","type","onOpenChange","editable","multiselect","trigger","popover","childrenToTriggerAndPopover","children","components","open","hasFocus","undefined","disabled","triggerRef","popoverRef","mountNode","onOptionClick","setOpen","appearance","clearSelection","getOptionById","getOptionsMatchingValue","registerOption","selectOption","setHasFocus","setValue","childrenArray","Children","toArray","process","env","NODE_ENV","length","console","warn"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,EAAEC,KAAK,EAAEC,aAAa,QAAQ,4BAA4B;AAOnF,SAASC,gBAAgB,QAAQ,2BAA2B;AAC5D,SAAoCC,2BAA2B,EAAEC,cAAc,QAAQ,8BAA8B;AACrH,SAASC,mBAAmB,QAAQ,uBAAuB;AAC3D,SAASC,oBAAoB,QAAQ,2BAA2B;AAEhE,wFAAwF;AACxF,MAAMC,oBAAiD;IAAC;IAAS;IAAS;IAAa;IAAU;CAAa;AAE9G;;;;;;;CAOC,GACD,OAAO,MAAMC,wBAAwB,CAACC;IACpC,MAAMC,YAAYV,MAAM;IACxB,MAAMW,kBAAkBb,MAAMc,MAAM,CAAuC;IAC3E,MAAMC,qBAAqBf,MAAMc,MAAM,CAAkB;IACzD,MAAME,oBAAoBhB,MAAMc,MAAM,CAAiB;IACvD,MAAM,EAAEG,WAAW,EAAEC,OAAO,QAAQ,EAAEC,SAAS,KAAK,EAAEC,YAAY,KAAK,EAAE,GAAGT;IAE5E,MAAM,EAAEU,SAAS,EAAEC,YAAY,EAAE,GAAGhB,eAAe;QACjDiB,UAAU;QACVC,OAAO;QACPC,QAAQ;YAAEC,WAAW;YAAGC,UAAU;QAAE;QACpClB;QACAmB,iBAAiB;QACjB,GAAGvB,4BAA4BY,YAAY;IAC7C;IAEA,MAAM,EACJY,YAAYC,0BAA0B,EACtCC,eAAe,EACfC,UAAU,EACX,GAAGzB,oBAAsD;QACxD0B,aAAaC,CAAAA,KAAMA,GAAGC,SAAS,CAACC,QAAQ,CAAChC,iBAAiBiC,IAAI;IAChE;IAEA,MAAMC,gBAAgB9B,qBAAqB;QACzC,GAAGG,KAAK;QACR4B,gBAAgBtC,iBAAiB,CAACuC,OAAOC;gBACvC9B;oBAAAA,wBAAAA,MAAM4B,cAAc,cAApB5B,4CAAAA,2BAAAA,OAAuB6B,OAAO;gBAC5BE,iBAAiBD,KAAKC,eAAe;gBACrCC,OAAOF,KAAKG,WAAW;gBACvBC,MAAML,MAAMK,IAAI;gBAChBL;YACF;;QAEFM,cAAc7C,iBAAiB,CAACuC,OAAOC;gBACrC9B;oBAAAA,sBAAAA,MAAMmC,YAAY,cAAlBnC,0CAAAA,yBAAAA,OAAqB6B,OAAO;gBAC1B,GAAGC,IAAI;gBACPI,MAAML,MAAMK,IAAI;gBAChBL;YACF;;QAEFV;QACAiB,UAAU;QACVC,aAAa;QACb9B,MAAM;IACR;IAEA,MAAM,EAAE+B,OAAO,EAAEC,OAAO,EAAE,GAAGC,4BAA4BxC,MAAMyC,QAAQ,EAAEhC;IAEzE,OAAO;QACLU;QACAuB,YAAY,CAAC;QACbJ;QACAC,SAASZ,cAAcgB,IAAI,IAAIhB,cAAciB,QAAQ,GAAGL,UAAUM;QAClE5C;QACAQ;QACAqC,UAAUnB,cAAcmB,QAAQ;QAChCC,YAAYvD,cAAcU,iBAAiBkB;QAC3C4B,YAAYxD,cAAc6B,YAAYV;QACtCP;QACAC;QACAK;QACAH;QACAC;QACAmC,MAAMhB,cAAcgB,IAAI;QACxBM,WAAWtB,cAAcsB,SAAS;QAClCC,eAAe5D,iBAAiBuC,CAAAA;YAC9BF,cAAcuB,aAAa,CAACrB;YAC5BF,cAAcwB,OAAO,CAACtB,OAAO;QAC/B;QACAuB,YAAYzB,cAAcyB,UAAU;QACpCC,gBAAgB1B,cAAc0B,cAAc;QAC5CC,eAAe3B,cAAc2B,aAAa;QAC1CC,yBAAyB5B,cAAc4B,uBAAuB;QAC9DC,gBAAgB7B,cAAc6B,cAAc;QAC5CzB,iBAAiBJ,cAAcI,eAAe;QAC9C0B,cAAc9B,cAAc8B,YAAY;QACxCC,aAAa/B,cAAc+B,WAAW;QACtCP,SAASxB,cAAcwB,OAAO;QAC9BQ,UAAUhC,cAAcgC,QAAQ;QAChC3B,OAAOL,cAAcK,KAAK;IAC5B;AACF,EAAE;AAEF,MAAMQ,8BAA8B,CAACC,UAA2BhC;IAC9D,MAAMmD,gBAAgBvE,MAAMwE,QAAQ,CAACC,OAAO,CAACrB;IAE7C,IAAIsB,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAIL,cAAcM,MAAM,KAAK,GAAG;YAC9B,sCAAsC;YACtCC,QAAQC,IAAI,CAAC;QACf;QAEA,IAAIR,cAAcM,MAAM,GAAG,GAAG;YAC5B,sCAAsC;YACtCC,QAAQC,IAAI,CAAC;QACf;IACF;IAEA,IAAI3D,WAAW;QACb,OAAO;YAAE6B,SAASsB,aAAa,CAAC,EAAE;QAAC;IACrC;IAEA,IAAItB,UAA0CO;IAC9C,IAAIN,UAA0CM;IAE9C,IAAIe,cAAcM,MAAM,KAAK,GAAG;QAC9B5B,UAAUsB,aAAa,CAAC,EAAE;QAC1BrB,UAAUqB,aAAa,CAAC,EAAE;IAC5B,OAAO,IAAIA,cAAcM,MAAM,KAAK,GAAG;QACrC3B,UAAUqB,aAAa,CAAC,EAAE;IAC5B;IAEA,OAAO;QAAEtB;QAASC;IAAQ;AAC5B"}
1
+ {"version":3,"sources":["../src/components/TagPicker/useTagPicker.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport type {\n TagPickerOnOpenChangeData,\n TagPickerOnOptionSelectData,\n TagPickerProps,\n TagPickerState,\n} from './TagPicker.types';\nimport { optionClassNames } from '@fluentui/react-combobox';\nimport { PositioningShorthandValue, resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { useComboboxBaseState } from '@fluentui/react-combobox';\n\n// Set a default set of fallback positions to try if the dropdown does not fit on screen\nconst fallbackPositions: PositioningShorthandValue[] = ['above', 'after', 'after-top', 'before', 'before-top'];\n\n/**\n * Create the state required to render Picker.\n *\n * The returned state can be modified with hooks such as usePickerStyles_unstable,\n * before being passed to renderPicker_unstable.\n *\n * @param props - props from this instance of Picker\n */\nexport const useTagPicker_unstable = (props: TagPickerProps): TagPickerState => {\n const popoverId = useId('picker-listbox');\n const triggerInnerRef = React.useRef<HTMLInputElement | HTMLButtonElement>(null);\n const secondaryActionRef = React.useRef<HTMLSpanElement>(null);\n const tagPickerGroupRef = React.useRef<HTMLDivElement>(null);\n const { positioning, size = 'medium', inline = false, noPopover = false } = props;\n\n const { targetRef, containerRef } = usePositioning({\n position: 'below' as const,\n align: 'start' as const,\n offset: { crossAxis: 0, mainAxis: 2 },\n fallbackPositions,\n matchTargetSize: 'width' as const,\n ...resolvePositioningShorthand(positioning),\n });\n\n const {\n controller: activeDescendantController,\n activeParentRef,\n listboxRef,\n } = useActiveDescendant<HTMLInputElement, HTMLDivElement>({\n matchOption: el => el.classList.contains(optionClassNames.root),\n });\n\n const comboboxState = useComboboxBaseState({\n ...props,\n onOptionSelect: useEventCallback((event, data) =>\n props.onOptionSelect?.(event, {\n selectedOptions: data.selectedOptions,\n value: data.optionValue,\n type: event.type,\n event,\n } as TagPickerOnOptionSelectData),\n ),\n onOpenChange: useEventCallback((event, data) =>\n props.onOpenChange?.(event, {\n ...data,\n type: event.type,\n event,\n } as TagPickerOnOpenChangeData),\n ),\n activeDescendantController,\n editable: true,\n multiselect: true,\n size: 'medium',\n });\n\n const { trigger, popover } = childrenToTriggerAndPopover(props.children, noPopover);\n\n return {\n activeDescendantController,\n components: {},\n trigger,\n popover: comboboxState.open || comboboxState.hasFocus ? popover : undefined,\n popoverId,\n noPopover,\n disabled: comboboxState.disabled,\n triggerRef: useMergedRefs(triggerInnerRef, activeParentRef),\n popoverRef: useMergedRefs(listboxRef, containerRef),\n secondaryActionRef,\n tagPickerGroupRef,\n targetRef,\n size,\n inline,\n open: comboboxState.open,\n mountNode: comboboxState.mountNode,\n onOptionClick: useEventCallback(event => {\n comboboxState.onOptionClick(event);\n comboboxState.setOpen(event, false);\n }),\n appearance: comboboxState.appearance,\n clearSelection: comboboxState.clearSelection,\n getOptionById: comboboxState.getOptionById,\n getOptionsMatchingValue: comboboxState.getOptionsMatchingValue,\n registerOption: comboboxState.registerOption,\n selectedOptions: comboboxState.selectedOptions,\n selectOption: comboboxState.selectOption,\n setHasFocus: comboboxState.setHasFocus,\n setOpen: comboboxState.setOpen,\n setValue: comboboxState.setValue,\n value: comboboxState.value,\n };\n};\n\nconst childrenToTriggerAndPopover = (children: React.ReactNode, noPopover: boolean) => {\n const childrenArray = React.Children.toArray(children) as React.ReactElement[];\n\n if (process.env.NODE_ENV !== 'production') {\n if (childrenArray.length === 0) {\n // eslint-disable-next-line no-console\n console.warn('TagPicker must contain at least one child');\n }\n\n if (childrenArray.length > 2) {\n // eslint-disable-next-line no-console\n console.warn('TagPicker must contain at most two children');\n }\n }\n\n if (noPopover) {\n return { trigger: childrenArray[0] };\n }\n\n let trigger: React.ReactElement | undefined = undefined;\n let popover: React.ReactElement | undefined = undefined;\n\n if (childrenArray.length === 2) {\n trigger = childrenArray[0];\n popover = childrenArray[1];\n } else if (childrenArray.length === 1) {\n popover = childrenArray[0];\n }\n\n return { trigger, popover };\n};\n"],"names":["React","useEventCallback","useId","useMergedRefs","optionClassNames","resolvePositioningShorthand","usePositioning","useActiveDescendant","useComboboxBaseState","fallbackPositions","useTagPicker_unstable","props","popoverId","triggerInnerRef","useRef","secondaryActionRef","tagPickerGroupRef","positioning","size","inline","noPopover","targetRef","containerRef","position","align","offset","crossAxis","mainAxis","matchTargetSize","controller","activeDescendantController","activeParentRef","listboxRef","matchOption","el","classList","contains","root","comboboxState","onOptionSelect","event","data","selectedOptions","value","optionValue","type","onOpenChange","editable","multiselect","trigger","popover","childrenToTriggerAndPopover","children","components","open","hasFocus","undefined","disabled","triggerRef","popoverRef","mountNode","onOptionClick","setOpen","appearance","clearSelection","getOptionById","getOptionsMatchingValue","registerOption","selectOption","setHasFocus","setValue","childrenArray","Children","toArray","process","env","NODE_ENV","length","console","warn"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagPickerContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport { TagPickerContextValues, TagPickerState } from './TagPicker.types';\n\nexport function useTagPickerContextValues(state: TagPickerState): TagPickerContextValues {\n const {\n onOptionClick,\n registerOption,\n selectedOptions,\n selectOption,\n value,\n triggerRef,\n secondaryActionRef,\n tagPickerGroupRef,\n targetRef,\n size,\n setValue,\n setOpen,\n setHasFocus,\n popoverRef,\n appearance,\n clearSelection,\n getOptionById,\n getOptionsMatchingValue,\n open,\n popoverId,\n disabled,\n noPopover,\n } = state;\n return {\n activeDescendant: React.useMemo(\n () => ({ controller: state.activeDescendantController }),\n [state.activeDescendantController],\n ),\n listbox: {\n onOptionClick,\n registerOption,\n getOptionById,\n getOptionsMatchingValue,\n selectedOptions,\n selectOption,\n focusVisible: false,\n setActiveOption: noop,\n },\n picker: {\n value,\n triggerRef,\n targetRef,\n secondaryActionRef,\n tagPickerGroupRef,\n size,\n setValue,\n setOpen,\n setHasFocus,\n selectOption,\n popoverRef,\n selectedOptions,\n appearance,\n clearSelection,\n getOptionById,\n open,\n popoverId,\n disabled,\n noPopover,\n },\n };\n}\n\nconst noop = () => {\n /** noop */\n};\n"],"names":["React","useTagPickerContextValues","state","onOptionClick","registerOption","selectedOptions","selectOption","value","triggerRef","secondaryActionRef","tagPickerGroupRef","targetRef","size","setValue","setOpen","setHasFocus","popoverRef","appearance","clearSelection","getOptionById","getOptionsMatchingValue","open","popoverId","disabled","noPopover","activeDescendant","useMemo","controller","activeDescendantController","listbox","focusVisible","setActiveOption","noop","picker"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,0BAA0BC,KAAqB;IAC7D,MAAM,EACJC,aAAa,EACbC,cAAc,EACdC,eAAe,EACfC,YAAY,EACZC,KAAK,EACLC,UAAU,EACVC,kBAAkB,EAClBC,iBAAiB,EACjBC,SAAS,EACTC,IAAI,EACJC,QAAQ,EACRC,OAAO,EACPC,WAAW,EACXC,UAAU,EACVC,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,uBAAuB,EACvBC,IAAI,EACJC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACV,GAAGtB;IACJ,OAAO;QACLuB,kBAAkBzB,MAAM0B,OAAO,CAC7B,IAAO,CAAA;gBAAEC,YAAYzB,MAAM0B,0BAA0B;YAAC,CAAA,GACtD;YAAC1B,MAAM0B,0BAA0B;SAAC;QAEpCC,SAAS;YACP1B;YACAC;YACAe;YACAC;YACAf;YACAC;YACAwB,cAAc;YACdC,iBAAiBC;QACnB;QACAC,QAAQ;YACN1B;YACAC;YACAG;YACAF;YACAC;YACAE;YACAC;YACAC;YACAC;YACAT;YACAU;YACAX;YACAY;YACAC;YACAC;YACAE;YACAC;YACAC;YACAC;QACF;IACF;AACF;AAEA,MAAMQ,OAAO;AACX,SAAS,GACX"}
1
+ {"version":3,"sources":["../src/components/TagPicker/useTagPickerContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport { TagPickerContextValues, TagPickerState } from './TagPicker.types';\n\nexport function useTagPickerContextValues(state: TagPickerState): TagPickerContextValues {\n const {\n onOptionClick,\n registerOption,\n selectedOptions,\n selectOption,\n value,\n triggerRef,\n secondaryActionRef,\n tagPickerGroupRef,\n targetRef,\n size,\n setValue,\n setOpen,\n setHasFocus,\n popoverRef,\n appearance,\n clearSelection,\n getOptionById,\n getOptionsMatchingValue,\n open,\n popoverId,\n disabled,\n noPopover,\n } = state;\n return {\n activeDescendant: React.useMemo(\n () => ({ controller: state.activeDescendantController }),\n [state.activeDescendantController],\n ),\n listbox: {\n onOptionClick,\n registerOption,\n getOptionById,\n getOptionsMatchingValue,\n selectedOptions,\n selectOption,\n focusVisible: false,\n setActiveOption: noop,\n },\n picker: {\n value,\n triggerRef,\n targetRef,\n secondaryActionRef,\n tagPickerGroupRef,\n size,\n setValue,\n setOpen,\n setHasFocus,\n selectOption,\n popoverRef,\n selectedOptions,\n appearance,\n clearSelection,\n getOptionById,\n open,\n popoverId,\n disabled,\n noPopover,\n },\n };\n}\n\nconst noop = () => {\n /** noop */\n};\n"],"names":["React","useTagPickerContextValues","state","onOptionClick","registerOption","selectedOptions","selectOption","value","triggerRef","secondaryActionRef","tagPickerGroupRef","targetRef","size","setValue","setOpen","setHasFocus","popoverRef","appearance","clearSelection","getOptionById","getOptionsMatchingValue","open","popoverId","disabled","noPopover","activeDescendant","useMemo","controller","activeDescendantController","listbox","focusVisible","setActiveOption","noop","picker"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,0BAA0BC,KAAqB;IAC7D,MAAM,EACJC,aAAa,EACbC,cAAc,EACdC,eAAe,EACfC,YAAY,EACZC,KAAK,EACLC,UAAU,EACVC,kBAAkB,EAClBC,iBAAiB,EACjBC,SAAS,EACTC,IAAI,EACJC,QAAQ,EACRC,OAAO,EACPC,WAAW,EACXC,UAAU,EACVC,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,uBAAuB,EACvBC,IAAI,EACJC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACV,GAAGtB;IACJ,OAAO;QACLuB,kBAAkBzB,MAAM0B,OAAO,CAC7B,IAAO,CAAA;gBAAEC,YAAYzB,MAAM0B,0BAA0B;YAAC,CAAA,GACtD;YAAC1B,MAAM0B,0BAA0B;SAAC;QAEpCC,SAAS;YACP1B;YACAC;YACAe;YACAC;YACAf;YACAC;YACAwB,cAAc;YACdC,iBAAiBC;QACnB;QACAC,QAAQ;YACN1B;YACAC;YACAG;YACAF;YACAC;YACAE;YACAC;YACAC;YACAC;YACAT;YACAU;YACAX;YACAY;YACAC;YACAC;YACAE;YACAC;YACAC;YACAC;QACF;IACF;AACF;AAEA,MAAMQ,OAAO;AACX,SAAS,GACX"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerButton_unstable } from './useTagPickerButton';\nimport { renderTagPickerButton_unstable } from './renderTagPickerButton';\nimport { useTagPickerButtonStyles_unstable } from './useTagPickerButtonStyles.styles';\nimport type { TagPickerButtonProps } from './TagPickerButton.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerButton component -\n * A TagPickerButton is an alternative to TagPickerInput that does not include an input field.\n */\nexport const TagPickerButton: ForwardRefComponent<TagPickerButtonProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerButton_unstable(props, ref);\n\n useTagPickerButtonStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerButtonStyles_unstable')(state);\n return renderTagPickerButton_unstable(state);\n});\n\nTagPickerButton.displayName = 'TagPickerButton';\n"],"names":["React","useTagPickerButton_unstable","renderTagPickerButton_unstable","useTagPickerButtonStyles_unstable","useCustomStyleHook_unstable","TagPickerButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,iCAAiC,QAAQ,oCAAoC;AAEtF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,gCAA6DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQR,4BAA4BM,OAAOC;IAEjDL,kCAAkCM;IAClCL,4BAA4B,qCAAqCK;IACjE,OAAOP,+BAA+BO;AACxC,GAAG;AAEHJ,gBAAgBK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/TagPickerButton/TagPickerButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerButton_unstable } from './useTagPickerButton';\nimport { renderTagPickerButton_unstable } from './renderTagPickerButton';\nimport { useTagPickerButtonStyles_unstable } from './useTagPickerButtonStyles.styles';\nimport type { TagPickerButtonProps } from './TagPickerButton.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerButton component -\n * A TagPickerButton is an alternative to TagPickerInput that does not include an input field.\n */\nexport const TagPickerButton: ForwardRefComponent<TagPickerButtonProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerButton_unstable(props, ref);\n\n useTagPickerButtonStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerButtonStyles_unstable')(state);\n return renderTagPickerButton_unstable(state);\n});\n\nTagPickerButton.displayName = 'TagPickerButton';\n"],"names":["React","useTagPickerButton_unstable","renderTagPickerButton_unstable","useTagPickerButtonStyles_unstable","useCustomStyleHook_unstable","TagPickerButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,iCAAiC,QAAQ,oCAAoC;AAEtF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,gCAA6DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQR,4BAA4BM,OAAOC;IAEjDL,kCAAkCM;IAClCL,4BAA4B,qCAAqCK;IACjE,OAAOP,+BAA+BO;AACxC,GAAG;AAEHJ,gBAAgBK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerButton.types.ts"],"sourcesContent":["import { DropdownProps } from '@fluentui/react-combobox';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\n\nexport type TagPickerButtonSlots = {\n root: Slot<'button'>;\n};\n\n/**\n * PickerButton Props\n */\nexport type TagPickerButtonProps = ComponentProps<TagPickerButtonSlots> &\n Pick<DropdownProps, 'size' | 'appearance'> & {\n disabled?: boolean;\n };\n\n/**\n * State used in rendering PickerButton\n */\nexport type TagPickerButtonState = ComponentState<TagPickerButtonSlots> &\n Pick<TagPickerContextValue, 'size'> & {\n hasSelectedOption: boolean;\n };\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC,GACD,WAGI"}
1
+ {"version":3,"sources":["../src/components/TagPickerButton/TagPickerButton.types.ts"],"sourcesContent":["import { DropdownProps } from '@fluentui/react-combobox';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\n\nexport type TagPickerButtonSlots = {\n root: Slot<'button'>;\n};\n\n/**\n * PickerButton Props\n */\nexport type TagPickerButtonProps = ComponentProps<TagPickerButtonSlots> &\n Pick<DropdownProps, 'size' | 'appearance'> & {\n disabled?: boolean;\n };\n\n/**\n * State used in rendering PickerButton\n */\nexport type TagPickerButtonState = ComponentState<TagPickerButtonSlots> &\n Pick<TagPickerContextValue, 'size'> & {\n hasSelectedOption: boolean;\n };\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC,GACD,WAGI"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TagPickerButton';\nexport * from './TagPickerButton.types';\nexport * from './renderTagPickerButton';\nexport * from './useTagPickerButton';\nexport * from './useTagPickerButtonStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,oBAAoB;AAClC,cAAc,0BAA0B;AACxC,cAAc,0BAA0B;AACxC,cAAc,uBAAuB;AACrC,cAAc,oCAAoC"}
1
+ {"version":3,"sources":["../src/components/TagPickerButton/index.ts"],"sourcesContent":["export * from './TagPickerButton';\nexport * from './TagPickerButton.types';\nexport * from './renderTagPickerButton';\nexport * from './useTagPickerButton';\nexport * from './useTagPickerButtonStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,oBAAoB;AAClC,cAAc,0BAA0B;AACxC,cAAc,0BAA0B;AACxC,cAAc,uBAAuB;AACrC,cAAc,oCAAoC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTagPickerButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagPickerButtonState, TagPickerButtonSlots } from './TagPickerButton.types';\n\n/**\n * Render the final JSX of PickerButton\n */\nexport const renderTagPickerButton_unstable = (state: TagPickerButtonState) => {\n assertSlots<TagPickerButtonSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderTagPickerButton_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7CF,YAAkCE;IAElC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1
+ {"version":3,"sources":["../src/components/TagPickerButton/renderTagPickerButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagPickerButtonState, TagPickerButtonSlots } from './TagPickerButton.types';\n\n/**\n * Render the final JSX of PickerButton\n */\nexport const renderTagPickerButton_unstable = (state: TagPickerButtonState) => {\n assertSlots<TagPickerButtonSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderTagPickerButton_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,iCAAiC,CAACC;IAC7CF,YAAkCE;IAElC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagPickerButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useActiveDescendantContext } from '@fluentui/react-aria';\nimport type { TagPickerButtonProps, TagPickerButtonState } from './TagPickerButton.types';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { useButtonTriggerSlot } from '@fluentui/react-combobox';\n\n/**\n * Create the state required to render PickerButton.\n *\n * The returned state can be modified with hooks such as usePickerButtonStyles_unstable,\n * before being passed to renderPickerButton_unstable.\n *\n * @param props - props from this instance of PickerButton\n * @param ref - reference to root HTMLDivElement of PickerButton\n */\nexport const useTagPickerButton_unstable = (\n props: TagPickerButtonProps,\n ref: React.Ref<HTMLButtonElement>,\n): TagPickerButtonState => {\n const { controller: activeDescendantController } = useActiveDescendantContext();\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const open = useTagPickerContext_unstable(ctx => ctx.open);\n const value = useTagPickerContext_unstable(ctx => ctx.value);\n const hasSelectedOption = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length > 0);\n const popoverId = useTagPickerContext_unstable(ctx => ctx.popoverId);\n const getOptionById = useTagPickerContext_unstable(ctx => ctx.getOptionById);\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const setHasFocus = useTagPickerContext_unstable(ctx => ctx.setHasFocus);\n const setOpen = useTagPickerContext_unstable(ctx => ctx.setOpen);\n\n // casting is required here as triggerRef can either be button or input,\n // but in this case we can assure it's a button\n const root = useButtonTriggerSlot(props, triggerRef as React.RefObject<HTMLButtonElement>, {\n activeDescendantController,\n defaultProps: {\n type: 'button',\n tabIndex: 0,\n children: value || props.placeholder,\n 'aria-controls': open ? popoverId : undefined,\n ref,\n },\n state: {\n getOptionById,\n open,\n selectOption,\n setHasFocus,\n setOpen,\n multiselect: true,\n },\n });\n\n const size = useTagPickerContext_unstable(ctx => ctx.size);\n\n const state: TagPickerButtonState = {\n components: {\n root: 'button',\n },\n root,\n size,\n hasSelectedOption,\n };\n\n return state;\n};\n"],"names":["React","useActiveDescendantContext","useTagPickerContext_unstable","useButtonTriggerSlot","useTagPickerButton_unstable","props","ref","controller","activeDescendantController","triggerRef","ctx","open","value","hasSelectedOption","selectedOptions","length","popoverId","getOptionById","selectOption","setHasFocus","setOpen","root","defaultProps","type","tabIndex","children","placeholder","undefined","state","multiselect","size","components"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,uBAAuB;AAElE,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,oBAAoB,QAAQ,2BAA2B;AAEhE;;;;;;;;CAQC,GACD,OAAO,MAAMC,8BAA8B,CACzCC,OACAC;IAEA,MAAM,EAAEC,YAAYC,0BAA0B,EAAE,GAAGP;IACnD,MAAMQ,aAAaP,6BAA6BQ,CAAAA,MAAOA,IAAID,UAAU;IACrE,MAAME,OAAOT,6BAA6BQ,CAAAA,MAAOA,IAAIC,IAAI;IACzD,MAAMC,QAAQV,6BAA6BQ,CAAAA,MAAOA,IAAIE,KAAK;IAC3D,MAAMC,oBAAoBX,6BAA6BQ,CAAAA,MAAOA,IAAII,eAAe,CAACC,MAAM,GAAG;IAC3F,MAAMC,YAAYd,6BAA6BQ,CAAAA,MAAOA,IAAIM,SAAS;IACnE,MAAMC,gBAAgBf,6BAA6BQ,CAAAA,MAAOA,IAAIO,aAAa;IAC3E,MAAMC,eAAehB,6BAA6BQ,CAAAA,MAAOA,IAAIQ,YAAY;IACzE,MAAMC,cAAcjB,6BAA6BQ,CAAAA,MAAOA,IAAIS,WAAW;IACvE,MAAMC,UAAUlB,6BAA6BQ,CAAAA,MAAOA,IAAIU,OAAO;IAE/D,wEAAwE;IACxE,+CAA+C;IAC/C,MAAMC,OAAOlB,qBAAqBE,OAAOI,YAAkD;QACzFD;QACAc,cAAc;YACZC,MAAM;YACNC,UAAU;YACVC,UAAUb,SAASP,MAAMqB,WAAW;YACpC,iBAAiBf,OAAOK,YAAYW;YACpCrB;QACF;QACAsB,OAAO;YACLX;YACAN;YACAO;YACAC;YACAC;YACAS,aAAa;QACf;IACF;IAEA,MAAMC,OAAO5B,6BAA6BQ,CAAAA,MAAOA,IAAIoB,IAAI;IAEzD,MAAMF,QAA8B;QAClCG,YAAY;YACVV,MAAM;QACR;QACAA;QACAS;QACAjB;IACF;IAEA,OAAOe;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/TagPickerButton/useTagPickerButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useActiveDescendantContext } from '@fluentui/react-aria';\nimport type { TagPickerButtonProps, TagPickerButtonState } from './TagPickerButton.types';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { useButtonTriggerSlot } from '@fluentui/react-combobox';\n\n/**\n * Create the state required to render PickerButton.\n *\n * The returned state can be modified with hooks such as usePickerButtonStyles_unstable,\n * before being passed to renderPickerButton_unstable.\n *\n * @param props - props from this instance of PickerButton\n * @param ref - reference to root HTMLDivElement of PickerButton\n */\nexport const useTagPickerButton_unstable = (\n props: TagPickerButtonProps,\n ref: React.Ref<HTMLButtonElement>,\n): TagPickerButtonState => {\n const { controller: activeDescendantController } = useActiveDescendantContext();\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const open = useTagPickerContext_unstable(ctx => ctx.open);\n const value = useTagPickerContext_unstable(ctx => ctx.value);\n const hasSelectedOption = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length > 0);\n const popoverId = useTagPickerContext_unstable(ctx => ctx.popoverId);\n const getOptionById = useTagPickerContext_unstable(ctx => ctx.getOptionById);\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const setHasFocus = useTagPickerContext_unstable(ctx => ctx.setHasFocus);\n const setOpen = useTagPickerContext_unstable(ctx => ctx.setOpen);\n\n // casting is required here as triggerRef can either be button or input,\n // but in this case we can assure it's a button\n const root = useButtonTriggerSlot(props, triggerRef as React.RefObject<HTMLButtonElement>, {\n activeDescendantController,\n defaultProps: {\n type: 'button',\n tabIndex: 0,\n children: value || props.placeholder,\n 'aria-controls': open ? popoverId : undefined,\n ref,\n },\n state: {\n getOptionById,\n open,\n selectOption,\n setHasFocus,\n setOpen,\n multiselect: true,\n },\n });\n\n const size = useTagPickerContext_unstable(ctx => ctx.size);\n\n const state: TagPickerButtonState = {\n components: {\n root: 'button',\n },\n root,\n size,\n hasSelectedOption,\n };\n\n return state;\n};\n"],"names":["React","useActiveDescendantContext","useTagPickerContext_unstable","useButtonTriggerSlot","useTagPickerButton_unstable","props","ref","controller","activeDescendantController","triggerRef","ctx","open","value","hasSelectedOption","selectedOptions","length","popoverId","getOptionById","selectOption","setHasFocus","setOpen","root","defaultProps","type","tabIndex","children","placeholder","undefined","state","multiselect","size","components"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,uBAAuB;AAElE,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,oBAAoB,QAAQ,2BAA2B;AAEhE;;;;;;;;CAQC,GACD,OAAO,MAAMC,8BAA8B,CACzCC,OACAC;IAEA,MAAM,EAAEC,YAAYC,0BAA0B,EAAE,GAAGP;IACnD,MAAMQ,aAAaP,6BAA6BQ,CAAAA,MAAOA,IAAID,UAAU;IACrE,MAAME,OAAOT,6BAA6BQ,CAAAA,MAAOA,IAAIC,IAAI;IACzD,MAAMC,QAAQV,6BAA6BQ,CAAAA,MAAOA,IAAIE,KAAK;IAC3D,MAAMC,oBAAoBX,6BAA6BQ,CAAAA,MAAOA,IAAII,eAAe,CAACC,MAAM,GAAG;IAC3F,MAAMC,YAAYd,6BAA6BQ,CAAAA,MAAOA,IAAIM,SAAS;IACnE,MAAMC,gBAAgBf,6BAA6BQ,CAAAA,MAAOA,IAAIO,aAAa;IAC3E,MAAMC,eAAehB,6BAA6BQ,CAAAA,MAAOA,IAAIQ,YAAY;IACzE,MAAMC,cAAcjB,6BAA6BQ,CAAAA,MAAOA,IAAIS,WAAW;IACvE,MAAMC,UAAUlB,6BAA6BQ,CAAAA,MAAOA,IAAIU,OAAO;IAE/D,wEAAwE;IACxE,+CAA+C;IAC/C,MAAMC,OAAOlB,qBAAqBE,OAAOI,YAAkD;QACzFD;QACAc,cAAc;YACZC,MAAM;YACNC,UAAU;YACVC,UAAUb,SAASP,MAAMqB,WAAW;YACpC,iBAAiBf,OAAOK,YAAYW;YACpCrB;QACF;QACAsB,OAAO;YACLX;YACAN;YACAO;YACAC;YACAC;YACAS,aAAa;QACf;IACF;IAEA,MAAMC,OAAO5B,6BAA6BQ,CAAAA,MAAOA,IAAIoB,IAAI;IAEzD,MAAMF,QAA8B;QAClCG,YAAY;YACVV,MAAM;QACR;QACAA;QACAS;QACAjB;IACF;IAEA,OAAOe;AACT,EAAE"}
@@ -255,5 +255,4 @@ export const useTagPickerButtonStyles_unstable = state => {
255
255
  const styles = useStyles();
256
256
  state.root.className = mergeClasses(tagPickerButtonClassNames.root, styles.button, styles[state.size], state.hasSelectedOption && styles.visuallyHidden, state.root.className);
257
257
  return state;
258
- };
259
- //# sourceMappingURL=useTagPickerButtonStyles.styles.js.map
258
+ };
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerControl.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerControl_unstable } from './useTagPickerControl';\nimport { renderTagPickerControl_unstable } from './renderTagPickerControl';\nimport { useTagPickerControlStyles_unstable } from './useTagPickerControlStyles.styles';\nimport type { TagPickerControlProps } from './TagPickerControl.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerControl component -\n * A TagPickerControl is a composite component that controls actions and state for a TagPicker.\n */\nexport const TagPickerControl: ForwardRefComponent<TagPickerControlProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerControl_unstable(props, ref);\n\n useTagPickerControlStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerControlStyles_unstable')(state);\n return renderTagPickerControl_unstable(state);\n});\n\nTagPickerControl.displayName = 'TagPickerControl';\n"],"names":["React","useTagPickerControl_unstable","renderTagPickerControl_unstable","useTagPickerControlStyles_unstable","useCustomStyleHook_unstable","TagPickerControl","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,qCAAqC;AAExF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,iCAA+DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACnG,MAAMC,QAAQR,6BAA6BM,OAAOC;IAElDL,mCAAmCM;IACnCL,4BAA4B,sCAAsCK;IAClE,OAAOP,gCAAgCO;AACzC,GAAG;AAEHJ,iBAAiBK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/TagPickerControl/TagPickerControl.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerControl_unstable } from './useTagPickerControl';\nimport { renderTagPickerControl_unstable } from './renderTagPickerControl';\nimport { useTagPickerControlStyles_unstable } from './useTagPickerControlStyles.styles';\nimport type { TagPickerControlProps } from './TagPickerControl.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerControl component -\n * A TagPickerControl is a composite component that controls actions and state for a TagPicker.\n */\nexport const TagPickerControl: ForwardRefComponent<TagPickerControlProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerControl_unstable(props, ref);\n\n useTagPickerControlStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerControlStyles_unstable')(state);\n return renderTagPickerControl_unstable(state);\n});\n\nTagPickerControl.displayName = 'TagPickerControl';\n"],"names":["React","useTagPickerControl_unstable","renderTagPickerControl_unstable","useTagPickerControlStyles_unstable","useCustomStyleHook_unstable","TagPickerControl","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,qCAAqC;AAExF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,iCAA+DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACnG,MAAMC,QAAQR,6BAA6BM,OAAOC;IAElDL,mCAAmCM;IACnCL,4BAA4B,sCAAsCK;IAClE,OAAOP,gCAAgCO;AACzC,GAAG;AAEHJ,iBAAiBK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerControl.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\nimport { ComboboxSlots } from '@fluentui/react-combobox';\nimport * as React from 'react';\n\nexport type TagPickerControlSlots = {\n root: Slot<ExtractSlotProps<Slot<'div'> & { style?: TagPickerControlCSSProperties }>>;\n /**\n * A secondary action should be a button-like element to be rendered right after\n * the trigger responsible for opening/closing the tag picker popover.\n */\n secondaryAction: Slot<'span'>;\n} & Pick<ComboboxSlots, 'expandIcon'>;\n\nexport type TagPickerControlInternalSlots = {\n aside?: NonNullable<Slot<'span'>>;\n};\n\nexport type TagPickerControlCSSProperties = React.CSSProperties & {\n '--fui-TagPickerControl-aside-width'?: string | number;\n};\n\n/**\n * PickerControl Props\n */\nexport type TagPickerControlProps = ComponentProps<Partial<TagPickerControlSlots>>;\n\n/**\n * State used in rendering PickerControl\n */\nexport type TagPickerControlState = ComponentState<TagPickerControlSlots & TagPickerControlInternalSlots> &\n Pick<TagPickerContextValue, 'size' | 'appearance' | 'disabled'> & {\n invalid: boolean;\n };\n"],"names":["React"],"rangeMappings":"","mappings":"AAGA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/TagPickerControl/TagPickerControl.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, ExtractSlotProps, Slot } from '@fluentui/react-utilities';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\nimport { ComboboxSlots } from '@fluentui/react-combobox';\nimport * as React from 'react';\n\nexport type TagPickerControlSlots = {\n root: Slot<ExtractSlotProps<Slot<'div'> & { style?: TagPickerControlCSSProperties }>>;\n /**\n * A secondary action should be a button-like element to be rendered right after\n * the trigger responsible for opening/closing the tag picker popover.\n */\n secondaryAction: Slot<'span'>;\n} & Pick<ComboboxSlots, 'expandIcon'>;\n\nexport type TagPickerControlInternalSlots = {\n aside?: NonNullable<Slot<'span'>>;\n};\n\nexport type TagPickerControlCSSProperties = React.CSSProperties & {\n '--fui-TagPickerControl-aside-width'?: string | number;\n};\n\n/**\n * PickerControl Props\n */\nexport type TagPickerControlProps = ComponentProps<Partial<TagPickerControlSlots>>;\n\n/**\n * State used in rendering PickerControl\n */\nexport type TagPickerControlState = ComponentState<TagPickerControlSlots & TagPickerControlInternalSlots> &\n Pick<TagPickerContextValue, 'size' | 'appearance' | 'disabled'> & {\n invalid: boolean;\n };\n"],"names":["React"],"rangeMappings":"","mappings":"AAGA,YAAYA,WAAW,QAAQ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TagPickerControl';\nexport * from './TagPickerControl.types';\nexport * from './renderTagPickerControl';\nexport * from './useTagPickerControl';\nexport * from './useTagPickerControlStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,qBAAqB;AACnC,cAAc,2BAA2B;AACzC,cAAc,2BAA2B;AACzC,cAAc,wBAAwB;AACtC,cAAc,qCAAqC"}
1
+ {"version":3,"sources":["../src/components/TagPickerControl/index.ts"],"sourcesContent":["export * from './TagPickerControl';\nexport * from './TagPickerControl.types';\nexport * from './renderTagPickerControl';\nexport * from './useTagPickerControl';\nexport * from './useTagPickerControlStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,qBAAqB;AACnC,cAAc,2BAA2B;AACzC,cAAc,2BAA2B;AACzC,cAAc,wBAAwB;AACtC,cAAc,qCAAqC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTagPickerControl.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type {\n TagPickerControlState,\n TagPickerControlSlots,\n TagPickerControlInternalSlots,\n} from './TagPickerControl.types';\n\n/**\n * Render the final JSX of PickerControl\n */\nexport const renderTagPickerControl_unstable = (state: TagPickerControlState) => {\n assertSlots<TagPickerControlSlots & TagPickerControlInternalSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.aside && (\n <state.aside>\n {state.secondaryAction && <state.secondaryAction />}\n {state.expandIcon && <state.expandIcon />}\n </state.aside>\n )}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderTagPickerControl_unstable","state","root","children","aside","secondaryAction","expandIcon"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAOxD;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9CF,YAAmEE;IAEnE,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAMC,IAAI,CAACC,QAAQ;YACnBF,MAAMG,KAAK,kBACV,MAACH,MAAMG,KAAK;;oBACTH,MAAMI,eAAe,kBAAI,KAACJ,MAAMI,eAAe;oBAC/CJ,MAAMK,UAAU,kBAAI,KAACL,MAAMK,UAAU;;;;;AAKhD,EAAE"}
1
+ {"version":3,"sources":["../src/components/TagPickerControl/renderTagPickerControl.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type {\n TagPickerControlState,\n TagPickerControlSlots,\n TagPickerControlInternalSlots,\n} from './TagPickerControl.types';\n\n/**\n * Render the final JSX of PickerControl\n */\nexport const renderTagPickerControl_unstable = (state: TagPickerControlState) => {\n assertSlots<TagPickerControlSlots & TagPickerControlInternalSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.aside && (\n <state.aside>\n {state.secondaryAction && <state.secondaryAction />}\n {state.expandIcon && <state.expandIcon />}\n </state.aside>\n )}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderTagPickerControl_unstable","state","root","children","aside","secondaryAction","expandIcon"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAOxD;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9CF,YAAmEE;IAEnE,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAMC,IAAI,CAACC,QAAQ;YACnBF,MAAMG,KAAK,kBACV,MAACH,MAAMG,KAAK;;oBACTH,MAAMI,eAAe,kBAAI,KAACJ,MAAMI,eAAe;oBAC/CJ,MAAMK,UAAU,kBAAI,KAACL,MAAMK,UAAU;;;;;AAKhD,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagPickerControl.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n ExtractSlotProps,\n Slot,\n elementContains,\n getIntrinsicElementProps,\n slot,\n useEventCallback,\n useId,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TagPickerControlProps, TagPickerControlState } from './TagPickerControl.types';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport { useResizeObserverRef } from '../../utils/useResizeObserverRef';\nimport { tagPickerControlAsideWidthToken } from './useTagPickerControlStyles.styles';\nimport { useFieldContext_unstable } from '@fluentui/react-field';\nimport { useExpandLabel } from '../../utils/useExpandLabel';\n\n/**\n * Create the state required to render PickerControl.\n *\n * The returned state can be modified with hooks such as usePickerControlStyles_unstable,\n * before being passed to renderPickerControl_unstable.\n *\n * @param props - props from this instance of PickerControl\n * @param ref - reference to root HTMLDivElement of PickerControl\n */\nexport const useTagPickerControl_unstable = (\n props: TagPickerControlProps,\n ref: React.Ref<HTMLDivElement>,\n): TagPickerControlState => {\n const targetRef = useTagPickerContext_unstable(ctx => ctx.targetRef);\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n const open = useTagPickerContext_unstable(ctx => ctx.open);\n const popoverId = useTagPickerContext_unstable(ctx => ctx.popoverId);\n const setOpen = useTagPickerContext_unstable(ctx => ctx.setOpen);\n const secondaryInnerActionRef = useTagPickerContext_unstable(ctx => ctx.secondaryActionRef);\n const size = useTagPickerContext_unstable(ctx => ctx.size);\n const appearance = useTagPickerContext_unstable(ctx => ctx.appearance);\n const disabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n const invalid = useFieldContext_unstable()?.validationState === 'error';\n const noPopover = useTagPickerContext_unstable(ctx => ctx.noPopover ?? false);\n\n const tagPickerId = useId('tagPicker-');\n\n const innerRef = React.useRef<HTMLDivElement>(null);\n const expandIconRef = React.useRef<HTMLSpanElement>(null);\n const asideRef = React.useRef<HTMLSpanElement>(null);\n\n const secondaryAction = slot.optional(props.secondaryAction, {\n elementType: 'span',\n });\n const secondaryActionRef = useMergedRefs(secondaryInnerActionRef, secondaryAction?.ref);\n if (secondaryAction) {\n secondaryAction.ref = secondaryActionRef;\n }\n\n const expandIcon = slot.optional(props.expandIcon, {\n renderByDefault: !noPopover,\n defaultProps: {\n 'aria-expanded': open,\n children: <ChevronDownRegular />,\n role: 'button',\n },\n elementType: 'span',\n });\n\n const expandIconMergeRef = useMergedRefs(expandIcon?.ref, expandIconRef);\n if (expandIcon) {\n expandIcon.ref = expandIconMergeRef;\n }\n\n const observerRef = useResizeObserverRef<HTMLSpanElement>(([entry]) => {\n innerRef.current?.style.setProperty(tagPickerControlAsideWidthToken, `${entry.contentRect.width}px`);\n });\n const aside = slot.optional<ExtractSlotProps<Slot<'span'>>>(undefined, {\n elementType: 'span',\n renderByDefault: Boolean(secondaryAction || expandIcon),\n defaultProps: {\n ref: observerRef,\n },\n });\n const mergedAsideRefs = useMergedRefs(asideRef, aside?.ref);\n if (aside) {\n aside.ref = mergedAsideRefs;\n }\n\n const handleMouseDown = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n if (event.isDefaultPrevented()) {\n return;\n }\n if (\n elementContains(expandIconRef.current, event.target as Node) ||\n event.target === innerRef.current ||\n event.target === tagPickerGroupRef.current ||\n event.target === asideRef.current\n ) {\n event.preventDefault();\n setOpen(event, !open);\n triggerRef.current?.focus();\n }\n });\n\n const state: TagPickerControlState = {\n components: {\n root: 'div',\n expandIcon: 'span',\n secondaryAction: 'span',\n aside: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, targetRef, innerRef),\n 'aria-owns': open && !noPopover ? popoverId : undefined,\n ...props,\n onMouseDown: handleMouseDown,\n }),\n { elementType: 'div' },\n ),\n aside,\n expandIcon,\n secondaryAction,\n size,\n appearance,\n disabled,\n invalid,\n };\n\n const expandIconLabelRef = useExpandLabel({ tagPickerId, state: state as Pick<TagPickerControlState, 'expandIcon'> });\n\n const expandIconLabelMergeRef = useMergedRefs(expandIcon?.ref, expandIconLabelRef);\n if (state.expandIcon) {\n state.expandIcon.ref = expandIconLabelMergeRef;\n }\n\n return state;\n};\n"],"names":["React","elementContains","getIntrinsicElementProps","slot","useEventCallback","useId","useMergedRefs","useTagPickerContext_unstable","ChevronDownRegular","useResizeObserverRef","tagPickerControlAsideWidthToken","useFieldContext_unstable","useExpandLabel","useTagPickerControl_unstable","props","ref","targetRef","ctx","triggerRef","tagPickerGroupRef","open","popoverId","setOpen","secondaryInnerActionRef","secondaryActionRef","size","appearance","disabled","invalid","validationState","noPopover","tagPickerId","innerRef","useRef","expandIconRef","asideRef","secondaryAction","optional","elementType","expandIcon","renderByDefault","defaultProps","children","role","expandIconMergeRef","observerRef","entry","current","style","setProperty","contentRect","width","aside","undefined","Boolean","mergedAsideRefs","handleMouseDown","event","isDefaultPrevented","target","preventDefault","focus","state","components","root","always","onMouseDown","expandIconLabelRef","expandIconLabelMergeRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["../src/components/TagPickerControl/useTagPickerControl.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n ExtractSlotProps,\n Slot,\n elementContains,\n getIntrinsicElementProps,\n slot,\n useEventCallback,\n useId,\n useMergedRefs,\n} from '@fluentui/react-utilities';\nimport type { TagPickerControlProps, TagPickerControlState } from './TagPickerControl.types';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport { useResizeObserverRef } from '../../utils/useResizeObserverRef';\nimport { tagPickerControlAsideWidthToken } from './useTagPickerControlStyles.styles';\nimport { useFieldContext_unstable } from '@fluentui/react-field';\nimport { useExpandLabel } from '../../utils/useExpandLabel';\n\n/**\n * Create the state required to render PickerControl.\n *\n * The returned state can be modified with hooks such as usePickerControlStyles_unstable,\n * before being passed to renderPickerControl_unstable.\n *\n * @param props - props from this instance of PickerControl\n * @param ref - reference to root HTMLDivElement of PickerControl\n */\nexport const useTagPickerControl_unstable = (\n props: TagPickerControlProps,\n ref: React.Ref<HTMLDivElement>,\n): TagPickerControlState => {\n const targetRef = useTagPickerContext_unstable(ctx => ctx.targetRef);\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n const open = useTagPickerContext_unstable(ctx => ctx.open);\n const popoverId = useTagPickerContext_unstable(ctx => ctx.popoverId);\n const setOpen = useTagPickerContext_unstable(ctx => ctx.setOpen);\n const secondaryInnerActionRef = useTagPickerContext_unstable(ctx => ctx.secondaryActionRef);\n const size = useTagPickerContext_unstable(ctx => ctx.size);\n const appearance = useTagPickerContext_unstable(ctx => ctx.appearance);\n const disabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n const invalid = useFieldContext_unstable()?.validationState === 'error';\n const noPopover = useTagPickerContext_unstable(ctx => ctx.noPopover ?? false);\n\n const tagPickerId = useId('tagPicker-');\n\n const innerRef = React.useRef<HTMLDivElement>(null);\n const expandIconRef = React.useRef<HTMLSpanElement>(null);\n const asideRef = React.useRef<HTMLSpanElement>(null);\n\n const secondaryAction = slot.optional(props.secondaryAction, {\n elementType: 'span',\n });\n const secondaryActionRef = useMergedRefs(secondaryInnerActionRef, secondaryAction?.ref);\n if (secondaryAction) {\n secondaryAction.ref = secondaryActionRef;\n }\n\n const expandIcon = slot.optional(props.expandIcon, {\n renderByDefault: !noPopover,\n defaultProps: {\n 'aria-expanded': open,\n children: <ChevronDownRegular />,\n role: 'button',\n },\n elementType: 'span',\n });\n\n const expandIconMergeRef = useMergedRefs(expandIcon?.ref, expandIconRef);\n if (expandIcon) {\n expandIcon.ref = expandIconMergeRef;\n }\n\n const observerRef = useResizeObserverRef<HTMLSpanElement>(([entry]) => {\n innerRef.current?.style.setProperty(tagPickerControlAsideWidthToken, `${entry.contentRect.width}px`);\n });\n const aside = slot.optional<ExtractSlotProps<Slot<'span'>>>(undefined, {\n elementType: 'span',\n renderByDefault: Boolean(secondaryAction || expandIcon),\n defaultProps: {\n ref: observerRef,\n },\n });\n const mergedAsideRefs = useMergedRefs(asideRef, aside?.ref);\n if (aside) {\n aside.ref = mergedAsideRefs;\n }\n\n const handleMouseDown = useEventCallback((event: React.MouseEvent<HTMLDivElement>) => {\n if (event.isDefaultPrevented()) {\n return;\n }\n if (\n elementContains(expandIconRef.current, event.target as Node) ||\n event.target === innerRef.current ||\n event.target === tagPickerGroupRef.current ||\n event.target === asideRef.current\n ) {\n event.preventDefault();\n setOpen(event, !open);\n triggerRef.current?.focus();\n }\n });\n\n const state: TagPickerControlState = {\n components: {\n root: 'div',\n expandIcon: 'span',\n secondaryAction: 'span',\n aside: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref: useMergedRefs(ref, targetRef, innerRef),\n 'aria-owns': open && !noPopover ? popoverId : undefined,\n ...props,\n onMouseDown: handleMouseDown,\n }),\n { elementType: 'div' },\n ),\n aside,\n expandIcon,\n secondaryAction,\n size,\n appearance,\n disabled,\n invalid,\n };\n\n const expandIconLabelRef = useExpandLabel({ tagPickerId, state: state as Pick<TagPickerControlState, 'expandIcon'> });\n\n const expandIconLabelMergeRef = useMergedRefs(expandIcon?.ref, expandIconLabelRef);\n if (state.expandIcon) {\n state.expandIcon.ref = expandIconLabelMergeRef;\n }\n\n return state;\n};\n"],"names":["React","elementContains","getIntrinsicElementProps","slot","useEventCallback","useId","useMergedRefs","useTagPickerContext_unstable","ChevronDownRegular","useResizeObserverRef","tagPickerControlAsideWidthToken","useFieldContext_unstable","useExpandLabel","useTagPickerControl_unstable","props","ref","targetRef","ctx","triggerRef","tagPickerGroupRef","open","popoverId","setOpen","secondaryInnerActionRef","secondaryActionRef","size","appearance","disabled","invalid","validationState","noPopover","tagPickerId","innerRef","useRef","expandIconRef","asideRef","secondaryAction","optional","elementType","expandIcon","renderByDefault","defaultProps","children","role","expandIconMergeRef","observerRef","entry","current","style","setProperty","contentRect","width","aside","undefined","Boolean","mergedAsideRefs","handleMouseDown","event","isDefaultPrevented","target","preventDefault","focus","state","components","root","always","onMouseDown","expandIconLabelRef","expandIconLabelMergeRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -296,5 +296,4 @@ export const useTagPickerControlStyles_unstable = state => {
296
296
  state.secondaryAction.className = mergeClasses(tagPickerControlClassNames.secondaryAction, state.secondaryAction.className);
297
297
  }
298
298
  return state;
299
- };
300
- //# sourceMappingURL=useTagPickerControlStyles.styles.js.map
299
+ };
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerGroup_unstable } from './useTagPickerGroup';\nimport type { TagPickerGroupProps } from './TagPickerGroup.types';\nimport { useTagGroupContextValues_unstable } from '@fluentui/react-tags';\nimport { renderTagPickerGroup_unstable } from './renderTagPickerGroup';\nimport { useTagPickerGroupStyles_unstable } from './useTagPickerGroupStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerGroup component -\n * A TagPickerGroup is a composite component that allows users to group tags together.\n */\nexport const TagPickerGroup: ForwardRefComponent<TagPickerGroupProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerGroup_unstable(props, ref);\n\n useTagPickerGroupStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerGroupStyles_unstable')(state);\n return renderTagPickerGroup_unstable(state, useTagGroupContextValues_unstable(state));\n});\n\nTagPickerGroup.displayName = 'TagPickerGroup';\n"],"names":["React","useTagPickerGroup_unstable","useTagGroupContextValues_unstable","renderTagPickerGroup_unstable","useTagPickerGroupStyles_unstable","useCustomStyleHook_unstable","TagPickerGroup","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,0BAA0B,QAAQ,sBAAsB;AAEjE,SAASC,iCAAiC,QAAQ,uBAAuB;AACzE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AACpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDL,iCAAiCM;IACjCL,4BAA4B,oCAAoCK;IAChE,OAAOP,8BAA8BO,OAAOR,kCAAkCQ;AAChF,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/TagPickerGroup/TagPickerGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerGroup_unstable } from './useTagPickerGroup';\nimport type { TagPickerGroupProps } from './TagPickerGroup.types';\nimport { useTagGroupContextValues_unstable } from '@fluentui/react-tags';\nimport { renderTagPickerGroup_unstable } from './renderTagPickerGroup';\nimport { useTagPickerGroupStyles_unstable } from './useTagPickerGroupStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerGroup component -\n * A TagPickerGroup is a composite component that allows users to group tags together.\n */\nexport const TagPickerGroup: ForwardRefComponent<TagPickerGroupProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerGroup_unstable(props, ref);\n\n useTagPickerGroupStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerGroupStyles_unstable')(state);\n return renderTagPickerGroup_unstable(state, useTagGroupContextValues_unstable(state));\n});\n\nTagPickerGroup.displayName = 'TagPickerGroup';\n"],"names":["React","useTagPickerGroup_unstable","useTagGroupContextValues_unstable","renderTagPickerGroup_unstable","useTagPickerGroupStyles_unstable","useCustomStyleHook_unstable","TagPickerGroup","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,0BAA0B,QAAQ,sBAAsB;AAEjE,SAASC,iCAAiC,QAAQ,uBAAuB;AACzE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AACpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDL,iCAAiCM;IACjCL,4BAA4B,oCAAoCK;IAChE,OAAOP,8BAA8BO,OAAOR,kCAAkCQ;AAChF,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerGroup.types.ts"],"sourcesContent":["import type { TagGroupSlots, TagGroupState } from '@fluentui/react-tags';\nimport type { ComponentProps } from '@fluentui/react-utilities';\n\nexport type TagPickerGroupSlots = TagGroupSlots;\n\n/**\n * TagPickerGroup Props\n */\nexport type TagPickerGroupProps = ComponentProps<TagPickerGroupSlots>;\n\n/**\n * State used in rendering TagPickerGroup\n */\nexport type TagPickerGroupState = TagGroupState & {\n hasSelectedOptions: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAUA;;CAEC,GACD,WAEE"}
1
+ {"version":3,"sources":["../src/components/TagPickerGroup/TagPickerGroup.types.ts"],"sourcesContent":["import type { TagGroupSlots, TagGroupState } from '@fluentui/react-tags';\nimport type { ComponentProps } from '@fluentui/react-utilities';\n\nexport type TagPickerGroupSlots = TagGroupSlots;\n\n/**\n * TagPickerGroup Props\n */\nexport type TagPickerGroupProps = ComponentProps<TagPickerGroupSlots>;\n\n/**\n * State used in rendering TagPickerGroup\n */\nexport type TagPickerGroupState = TagGroupState & {\n hasSelectedOptions: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAUA;;CAEC,GACD,WAEE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TagPickerGroup';\nexport * from './TagPickerGroup.types';\nexport * from './renderTagPickerGroup';\nexport * from './useTagPickerGroup';\nexport * from './useTagPickerGroupStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC"}
1
+ {"version":3,"sources":["../src/components/TagPickerGroup/index.ts"],"sourcesContent":["export * from './TagPickerGroup';\nexport * from './TagPickerGroup.types';\nexport * from './renderTagPickerGroup';\nexport * from './useTagPickerGroup';\nexport * from './useTagPickerGroupStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTagPickerGroup.ts"],"sourcesContent":["import { TagPickerGroupState } from './TagPickerGroup.types';\nimport { renderTagGroup_unstable, type TagGroupContextValues } from '@fluentui/react-tags';\n\nexport function renderTagPickerGroup_unstable(state: TagPickerGroupState, contexts: TagGroupContextValues) {\n if (!state.hasSelectedOptions) {\n return null;\n }\n\n return renderTagGroup_unstable(state, contexts);\n}\n"],"names":["renderTagGroup_unstable","renderTagPickerGroup_unstable","state","contexts","hasSelectedOptions"],"rangeMappings":";;;;;;","mappings":"AACA,SAASA,uBAAuB,QAAoC,uBAAuB;AAE3F,OAAO,SAASC,8BAA8BC,KAA0B,EAAEC,QAA+B;IACvG,IAAI,CAACD,MAAME,kBAAkB,EAAE;QAC7B,OAAO;IACT;IAEA,OAAOJ,wBAAwBE,OAAOC;AACxC"}
1
+ {"version":3,"sources":["../src/components/TagPickerGroup/renderTagPickerGroup.ts"],"sourcesContent":["import { TagPickerGroupState } from './TagPickerGroup.types';\nimport { renderTagGroup_unstable, type TagGroupContextValues } from '@fluentui/react-tags';\n\nexport function renderTagPickerGroup_unstable(state: TagPickerGroupState, contexts: TagGroupContextValues) {\n if (!state.hasSelectedOptions) {\n return null;\n }\n\n return renderTagGroup_unstable(state, contexts);\n}\n"],"names":["renderTagGroup_unstable","renderTagPickerGroup_unstable","state","contexts","hasSelectedOptions"],"rangeMappings":";;;;;;","mappings":"AACA,SAASA,uBAAuB,QAAoC,uBAAuB;AAE3F,OAAO,SAASC,8BAA8BC,KAA0B,EAAEC,QAA+B;IACvG,IAAI,CAACD,MAAME,kBAAkB,EAAE;QAC7B,OAAO;IACT;IAEA,OAAOJ,wBAAwBE,OAAOC;AACxC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagPickerGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TagPickerGroupProps, TagPickerGroupState } from './TagPickerGroup.types';\nimport { useTagGroup_unstable } from '@fluentui/react-tags';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { isHTMLElement, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { tagPickerAppearanceToTagAppearance, tagPickerSizeToTagSize } from '../../utils/tagPicker2Tag';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { ArrowRight } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render TagPickerGroup.\n *\n * The returned state can be modified with hooks such as usePickerTagGroupStyles_unstable,\n * before being passed to renderPickerTagGroup_unstable.\n *\n * @param props - props from this instance of TagPickerGroup\n * @param ref - reference to root HTMLDivElement of TagPickerGroup\n */\nexport const useTagPickerGroup_unstable = (\n props: TagPickerGroupProps,\n ref: React.Ref<HTMLDivElement>,\n): TagPickerGroupState => {\n const hasSelectedOptions = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length > 0);\n const hasOneSelectedOption = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length === 1);\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const size = useTagPickerContext_unstable(ctx => tagPickerSizeToTagSize(ctx.size));\n const appearance = useTagPickerContext_unstable(ctx => ctx.appearance);\n const disabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: false,\n axis: 'both',\n memorizeCurrent: true,\n });\n\n const state = useTagGroup_unstable(\n {\n role: 'listbox',\n disabled,\n ...props,\n ...arrowNavigationProps,\n size,\n appearance: tagPickerAppearanceToTagAppearance(appearance),\n dismissible: true,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (isHTMLElement(event.target) && event.key === ArrowRight) {\n triggerRef.current?.focus();\n }\n }),\n onDismiss: useEventCallback((event, data) => {\n selectOption(event as React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, {\n value: data.value,\n // These values no longer exist because the option has unregistered itself\n // for the purposes of selection - these values aren't actually used\n id: 'ERROR_DO_NOT_USE',\n text: 'ERROR_DO_NOT_USE',\n });\n if (hasOneSelectedOption && !event.isDefaultPrevented()) {\n triggerRef.current?.focus();\n }\n }),\n },\n useMergedRefs(ref, tagPickerGroupRef),\n );\n\n return {\n ...state,\n hasSelectedOptions,\n };\n};\n"],"names":["React","useTagGroup_unstable","useTagPickerContext_unstable","isHTMLElement","useEventCallback","useMergedRefs","tagPickerAppearanceToTagAppearance","tagPickerSizeToTagSize","useArrowNavigationGroup","ArrowRight","useTagPickerGroup_unstable","props","ref","hasSelectedOptions","ctx","selectedOptions","length","hasOneSelectedOption","triggerRef","tagPickerGroupRef","selectOption","size","appearance","disabled","arrowNavigationProps","circular","axis","memorizeCurrent","state","role","dismissible","onKeyDown","event","target","key","current","focus","onDismiss","data","value","id","text","isDefaultPrevented"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,oBAAoB,QAAQ,uBAAuB;AAC5D,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,aAAa,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAC3F,SAASC,kCAAkC,EAAEC,sBAAsB,QAAQ,4BAA4B;AACvG,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,UAAU,QAAQ,0BAA0B;AAErD;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,qBAAqBX,6BAA6BY,CAAAA,MAAOA,IAAIC,eAAe,CAACC,MAAM,GAAG;IAC5F,MAAMC,uBAAuBf,6BAA6BY,CAAAA,MAAOA,IAAIC,eAAe,CAACC,MAAM,KAAK;IAChG,MAAME,aAAahB,6BAA6BY,CAAAA,MAAOA,IAAII,UAAU;IACrE,MAAMC,oBAAoBjB,6BAA6BY,CAAAA,MAAOA,IAAIK,iBAAiB;IACnF,MAAMC,eAAelB,6BAA6BY,CAAAA,MAAOA,IAAIM,YAAY;IACzE,MAAMC,OAAOnB,6BAA6BY,CAAAA,MAAOP,uBAAuBO,IAAIO,IAAI;IAChF,MAAMC,aAAapB,6BAA6BY,CAAAA,MAAOA,IAAIQ,UAAU;IACrE,MAAMC,WAAWrB,6BAA6BY,CAAAA,MAAOA,IAAIS,QAAQ;IAEjE,MAAMC,uBAAuBhB,wBAAwB;QACnDiB,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,MAAMC,QAAQ3B,qBACZ;QACE4B,MAAM;QACNN;QACA,GAAGZ,KAAK;QACR,GAAGa,oBAAoB;QACvBH;QACAC,YAAYhB,mCAAmCgB;QAC/CQ,aAAa;QACbC,WAAW3B,iBAAiB4B,CAAAA;gBAC1BrB;aAAAA,mBAAAA,MAAMoB,SAAS,cAAfpB,uCAAAA,sBAAAA,OAAkBqB;YAClB,IAAI7B,cAAc6B,MAAMC,MAAM,KAAKD,MAAME,GAAG,KAAKzB,YAAY;oBAC3DS;iBAAAA,sBAAAA,WAAWiB,OAAO,cAAlBjB,0CAAAA,oBAAoBkB,KAAK;YAC3B;QACF;QACAC,WAAWjC,iBAAiB,CAAC4B,OAAOM;YAClClB,aAAaY,OAAiF;gBAC5FO,OAAOD,KAAKC,KAAK;gBACjB,0EAA0E;gBAC1E,oEAAoE;gBACpEC,IAAI;gBACJC,MAAM;YACR;YACA,IAAIxB,wBAAwB,CAACe,MAAMU,kBAAkB,IAAI;oBACvDxB;iBAAAA,sBAAAA,WAAWiB,OAAO,cAAlBjB,0CAAAA,oBAAoBkB,KAAK;YAC3B;QACF;IACF,GACA/B,cAAcO,KAAKO;IAGrB,OAAO;QACL,GAAGS,KAAK;QACRf;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/TagPickerGroup/useTagPickerGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport type { TagPickerGroupProps, TagPickerGroupState } from './TagPickerGroup.types';\nimport { useTagGroup_unstable } from '@fluentui/react-tags';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { isHTMLElement, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { tagPickerAppearanceToTagAppearance, tagPickerSizeToTagSize } from '../../utils/tagPicker2Tag';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { ArrowRight } from '@fluentui/keyboard-keys';\n\n/**\n * Create the state required to render TagPickerGroup.\n *\n * The returned state can be modified with hooks such as usePickerTagGroupStyles_unstable,\n * before being passed to renderPickerTagGroup_unstable.\n *\n * @param props - props from this instance of TagPickerGroup\n * @param ref - reference to root HTMLDivElement of TagPickerGroup\n */\nexport const useTagPickerGroup_unstable = (\n props: TagPickerGroupProps,\n ref: React.Ref<HTMLDivElement>,\n): TagPickerGroupState => {\n const hasSelectedOptions = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length > 0);\n const hasOneSelectedOption = useTagPickerContext_unstable(ctx => ctx.selectedOptions.length === 1);\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const size = useTagPickerContext_unstable(ctx => tagPickerSizeToTagSize(ctx.size));\n const appearance = useTagPickerContext_unstable(ctx => ctx.appearance);\n const disabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: false,\n axis: 'both',\n memorizeCurrent: true,\n });\n\n const state = useTagGroup_unstable(\n {\n role: 'listbox',\n disabled,\n ...props,\n ...arrowNavigationProps,\n size,\n appearance: tagPickerAppearanceToTagAppearance(appearance),\n dismissible: true,\n onKeyDown: useEventCallback(event => {\n props.onKeyDown?.(event);\n if (isHTMLElement(event.target) && event.key === ArrowRight) {\n triggerRef.current?.focus();\n }\n }),\n onDismiss: useEventCallback((event, data) => {\n selectOption(event as React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>, {\n value: data.value,\n // These values no longer exist because the option has unregistered itself\n // for the purposes of selection - these values aren't actually used\n id: 'ERROR_DO_NOT_USE',\n text: 'ERROR_DO_NOT_USE',\n });\n if (hasOneSelectedOption && !event.isDefaultPrevented()) {\n triggerRef.current?.focus();\n }\n }),\n },\n useMergedRefs(ref, tagPickerGroupRef),\n );\n\n return {\n ...state,\n hasSelectedOptions,\n };\n};\n"],"names":["React","useTagGroup_unstable","useTagPickerContext_unstable","isHTMLElement","useEventCallback","useMergedRefs","tagPickerAppearanceToTagAppearance","tagPickerSizeToTagSize","useArrowNavigationGroup","ArrowRight","useTagPickerGroup_unstable","props","ref","hasSelectedOptions","ctx","selectedOptions","length","hasOneSelectedOption","triggerRef","tagPickerGroupRef","selectOption","size","appearance","disabled","arrowNavigationProps","circular","axis","memorizeCurrent","state","role","dismissible","onKeyDown","event","target","key","current","focus","onDismiss","data","value","id","text","isDefaultPrevented"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,oBAAoB,QAAQ,uBAAuB;AAC5D,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,aAAa,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAC3F,SAASC,kCAAkC,EAAEC,sBAAsB,QAAQ,4BAA4B;AACvG,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,UAAU,QAAQ,0BAA0B;AAErD;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAMC,qBAAqBX,6BAA6BY,CAAAA,MAAOA,IAAIC,eAAe,CAACC,MAAM,GAAG;IAC5F,MAAMC,uBAAuBf,6BAA6BY,CAAAA,MAAOA,IAAIC,eAAe,CAACC,MAAM,KAAK;IAChG,MAAME,aAAahB,6BAA6BY,CAAAA,MAAOA,IAAII,UAAU;IACrE,MAAMC,oBAAoBjB,6BAA6BY,CAAAA,MAAOA,IAAIK,iBAAiB;IACnF,MAAMC,eAAelB,6BAA6BY,CAAAA,MAAOA,IAAIM,YAAY;IACzE,MAAMC,OAAOnB,6BAA6BY,CAAAA,MAAOP,uBAAuBO,IAAIO,IAAI;IAChF,MAAMC,aAAapB,6BAA6BY,CAAAA,MAAOA,IAAIQ,UAAU;IACrE,MAAMC,WAAWrB,6BAA6BY,CAAAA,MAAOA,IAAIS,QAAQ;IAEjE,MAAMC,uBAAuBhB,wBAAwB;QACnDiB,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,MAAMC,QAAQ3B,qBACZ;QACE4B,MAAM;QACNN;QACA,GAAGZ,KAAK;QACR,GAAGa,oBAAoB;QACvBH;QACAC,YAAYhB,mCAAmCgB;QAC/CQ,aAAa;QACbC,WAAW3B,iBAAiB4B,CAAAA;gBAC1BrB;aAAAA,mBAAAA,MAAMoB,SAAS,cAAfpB,uCAAAA,sBAAAA,OAAkBqB;YAClB,IAAI7B,cAAc6B,MAAMC,MAAM,KAAKD,MAAME,GAAG,KAAKzB,YAAY;oBAC3DS;iBAAAA,sBAAAA,WAAWiB,OAAO,cAAlBjB,0CAAAA,oBAAoBkB,KAAK;YAC3B;QACF;QACAC,WAAWjC,iBAAiB,CAAC4B,OAAOM;YAClClB,aAAaY,OAAiF;gBAC5FO,OAAOD,KAAKC,KAAK;gBACjB,0EAA0E;gBAC1E,oEAAoE;gBACpEC,IAAI;gBACJC,MAAM;YACR;YACA,IAAIxB,wBAAwB,CAACe,MAAMU,kBAAkB,IAAI;oBACvDxB;iBAAAA,sBAAAA,WAAWiB,OAAO,cAAlBjB,0CAAAA,oBAAoBkB,KAAK;YAC3B;QACF;IACF,GACA/B,cAAcO,KAAKO;IAGrB,OAAO;QACL,GAAGS,KAAK;QACRf;IACF;AACF,EAAE"}
@@ -69,5 +69,4 @@ export const useTagPickerGroupStyles_unstable = state => {
69
69
  const styles = useStyles();
70
70
  state.root.className = mergeClasses(tagPickerGroupClassNames.root, styles[tagSizeToTagPickerSize(state.size)], styles.root, state.root.className);
71
71
  return state;
72
- };
73
- //# sourceMappingURL=useTagPickerGroupStyles.styles.js.map
72
+ };
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerInput_unstable } from './useTagPickerInput';\nimport { renderTagPickerInput_unstable } from './renderTagPickerInput';\nimport { useTagPickerInputStyles_unstable } from './useTagPickerInputStyles.styles';\nimport type { TagPickerInputProps } from './TagPickerInput.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerInput component -\n * A TagPickerInput is a composite component that allows users to query tags.\n */\nexport const TagPickerInput: ForwardRefComponent<TagPickerInputProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerInput_unstable(props, ref);\n\n useTagPickerInputStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerInputStyles_unstable')(state);\n\n return renderTagPickerInput_unstable(state);\n});\n\nTagPickerInput.displayName = 'TagPickerInput';\n"],"names":["React","useTagPickerInput_unstable","renderTagPickerInput_unstable","useTagPickerInputStyles_unstable","useCustomStyleHook_unstable","TagPickerInput","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAEpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,+BAA2DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQR,2BAA2BM,OAAOC;IAEhDL,iCAAiCM;IACjCL,4BAA4B,oCAAoCK;IAEhE,OAAOP,8BAA8BO;AACvC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/TagPickerInput/TagPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerInput_unstable } from './useTagPickerInput';\nimport { renderTagPickerInput_unstable } from './renderTagPickerInput';\nimport { useTagPickerInputStyles_unstable } from './useTagPickerInputStyles.styles';\nimport type { TagPickerInputProps } from './TagPickerInput.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerInput component -\n * A TagPickerInput is a composite component that allows users to query tags.\n */\nexport const TagPickerInput: ForwardRefComponent<TagPickerInputProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerInput_unstable(props, ref);\n\n useTagPickerInputStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerInputStyles_unstable')(state);\n\n return renderTagPickerInput_unstable(state);\n});\n\nTagPickerInput.displayName = 'TagPickerInput';\n"],"names":["React","useTagPickerInput_unstable","renderTagPickerInput_unstable","useTagPickerInputStyles_unstable","useCustomStyleHook_unstable","TagPickerInput","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AAEpF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,+BAA2DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQR,2BAA2BM,OAAOC;IAEhDL,iCAAiCM;IACjCL,4BAA4B,oCAAoCK;IAEhE,OAAOP,8BAA8BO;AACvC,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerInput.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { ComboboxProps } from '@fluentui/react-combobox';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\n\nexport type TagPickerInputSlots = {\n root: NonNullable<Slot<'input'>>;\n};\n\n/**\n * TagPickerInput Props\n */\nexport type TagPickerInputProps = Omit<\n ComponentProps<Partial<TagPickerInputSlots>>,\n 'children' | 'size' | 'defaultValue'\n> &\n Pick<ComboboxProps, 'clearable' | 'appearance'> & {\n disabled?: boolean;\n value?: string;\n };\n\n/**\n * State used in rendering TagPickerInput\n */\nexport type TagPickerInputState = ComponentState<TagPickerInputSlots> &\n Pick<TagPickerContextValue, 'size' | 'disabled'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAoBA;;CAEC,GACD,WACmD"}
1
+ {"version":3,"sources":["../src/components/TagPickerInput/TagPickerInput.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { ComboboxProps } from '@fluentui/react-combobox';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\n\nexport type TagPickerInputSlots = {\n root: NonNullable<Slot<'input'>>;\n};\n\n/**\n * TagPickerInput Props\n */\nexport type TagPickerInputProps = Omit<\n ComponentProps<Partial<TagPickerInputSlots>>,\n 'children' | 'size' | 'defaultValue'\n> &\n Pick<ComboboxProps, 'clearable' | 'appearance'> & {\n disabled?: boolean;\n value?: string;\n };\n\n/**\n * State used in rendering TagPickerInput\n */\nexport type TagPickerInputState = ComponentState<TagPickerInputSlots> &\n Pick<TagPickerContextValue, 'size' | 'disabled'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAoBA;;CAEC,GACD,WACmD"}
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TagPickerInput';\nexport * from './TagPickerInput.types';\nexport * from './renderTagPickerInput';\nexport * from './useTagPickerInput';\nexport * from './useTagPickerInputStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC"}
1
+ {"version":3,"sources":["../src/components/TagPickerInput/index.ts"],"sourcesContent":["export * from './TagPickerInput';\nexport * from './TagPickerInput.types';\nexport * from './renderTagPickerInput';\nexport * from './useTagPickerInput';\nexport * from './useTagPickerInputStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["renderTagPickerInput.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagPickerInputState, TagPickerInputSlots } from './TagPickerInput.types';\n\n/**\n * Render the final JSX of TagPickerInput\n */\nexport const renderTagPickerInput_unstable = (state: TagPickerInputState) => {\n assertSlots<TagPickerInputSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderTagPickerInput_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5CF,YAAiCE;IAEjC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1
+ {"version":3,"sources":["../src/components/TagPickerInput/renderTagPickerInput.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagPickerInputState, TagPickerInputSlots } from './TagPickerInput.types';\n\n/**\n * Render the final JSX of TagPickerInput\n */\nexport const renderTagPickerInput_unstable = (state: TagPickerInputState) => {\n assertSlots<TagPickerInputSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderTagPickerInput_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5CF,YAAiCE;IAEjC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport type { TagPickerInputProps, TagPickerInputState } from './TagPickerInput.types';\nimport { useActiveDescendantContext } from '@fluentui/react-aria';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport {\n useMergedRefs,\n getIntrinsicElementProps,\n useEventCallback,\n useIsomorphicLayoutEffect,\n} from '@fluentui/react-utilities';\nimport { ArrowLeft, Backspace, Enter, Space } from '@fluentui/keyboard-keys';\nimport { useInputTriggerSlot } from '@fluentui/react-combobox';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { tagPickerInputCSSRules } from '../../utils/tokens';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render TagPickerInput.\n *\n * The returned state can be modified with hooks such as useTagPickerInputStyles_unstable,\n * before being passed to renderTagPickerInput_unstable.\n *\n * @param props - props from this instance of TagPickerInput\n * @param ref - reference to root HTMLDivElement of TagPickerInput\n */\nexport const useTagPickerInput_unstable = (\n propsArg: TagPickerInputProps,\n ref: React.Ref<HTMLInputElement>,\n): TagPickerInputState => {\n const props = useFieldControlProps_unstable(propsArg, {\n supportsLabelFor: true,\n supportsRequired: true,\n supportsSize: true,\n });\n const { controller: activeDescendantController } = useActiveDescendantContext();\n const size = useTagPickerContext_unstable(ctx => ctx.size);\n const contextDisabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef as React.RefObject<HTMLInputElement>);\n const selectedOptions = useTagPickerContext_unstable(ctx => ctx.selectedOptions);\n const setValue = useTagPickerContext_unstable(ctx => ctx.setValue);\n const setOpen = useTagPickerContext_unstable(ctx => ctx.setOpen);\n const setHasFocus = useTagPickerContext_unstable(ctx => ctx.setHasFocus);\n const clearSelection = useTagPickerContext_unstable(ctx => ctx.clearSelection);\n const open = useTagPickerContext_unstable(ctx => ctx.open);\n const popoverId = useTagPickerContext_unstable(ctx => (ctx.noPopover ? undefined : ctx.popoverId));\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const getOptionById = useTagPickerContext_unstable(ctx => ctx.getOptionById);\n const contextValue = useTagPickerContext_unstable(ctx => ctx.value);\n\n useIsomorphicLayoutEffect(() => {\n if (!triggerRef.current) {\n return;\n }\n setTagPickerInputStretchStyle(triggerRef.current);\n }, [selectedOptions, triggerRef]);\n\n useIsomorphicLayoutEffect(() => {\n if (triggerRef.current) {\n const input = triggerRef.current;\n const cb = () => setTagPickerInputStretchStyle(input);\n input.addEventListener('input', cb);\n return () => {\n input.removeEventListener('input', cb);\n };\n }\n }, [triggerRef]);\n\n const { value = contextValue, disabled = contextDisabled } = props;\n const { findLastFocusable } = useFocusFinders();\n\n const isTypingRef = React.useRef(false);\n\n const root = useInputTriggerSlot(\n {\n type: 'text',\n value: value ?? '',\n 'aria-controls': open ? popoverId : undefined,\n disabled,\n ...getIntrinsicElementProps('input', props),\n onKeyDown: useEventCallback((event: React.KeyboardEvent<HTMLInputElement>) => {\n props.onKeyDown?.(event);\n if (\n (event.key === ArrowLeft || event.key === Backspace) &&\n event.currentTarget.selectionStart === 0 &&\n event.currentTarget.selectionEnd === 0 &&\n tagPickerGroupRef.current\n ) {\n findLastFocusable(tagPickerGroupRef.current)?.focus();\n } else if (event.key === Space) {\n if (open && !isTypingRef.current) {\n setOpen(event, false);\n }\n } else if (event.key === Enter) {\n if (open) {\n ReactDOM.unstable_batchedUpdates(() => {\n setValue(undefined);\n setOpen(event, false);\n });\n } else {\n setOpen(event, true);\n }\n }\n isTypingRef.current =\n event.key.length === 1 && event.code !== Space && !event.altKey && !event.ctrlKey && !event.metaKey;\n }),\n },\n useMergedRefs(triggerRef, ref),\n {\n activeDescendantController,\n freeform: false,\n state: {\n clearSelection,\n getOptionById,\n open,\n selectedOptions,\n selectOption,\n setHasFocus,\n setOpen,\n setValue,\n multiselect: true,\n value: props.value,\n },\n },\n );\n\n const state: TagPickerInputState = {\n components: {\n root: 'input',\n },\n root,\n disabled,\n size,\n };\n\n return state;\n};\n\n/**\n * while typing the user might need a bit more of space to see the text,\n * which means the input should stretch to 100% width\n * occupying a whole new line.\n *\n * This function will set the CSS variable `--width` to `100%` if the scrollWidth is greater than the offsetWidth,\n * meaning the text is overflowing the input.\n *\n * @param input - input element to apply the style\n * @returns void\n */\nconst setTagPickerInputStretchStyle = (input: HTMLInputElement) => {\n // first we need to remove the CSS variable\n // to properly calculate the difference between scrollWidth and offsetWidth\n input.style.removeProperty(tagPickerInputCSSRules.width);\n if (input.scrollWidth > input.offsetWidth + 1) {\n input.style.setProperty(tagPickerInputCSSRules.width, '100%');\n } else {\n input.style.removeProperty(tagPickerInputCSSRules.width);\n }\n};\n"],"names":["React","ReactDOM","useActiveDescendantContext","useTagPickerContext_unstable","useMergedRefs","getIntrinsicElementProps","useEventCallback","useIsomorphicLayoutEffect","ArrowLeft","Backspace","Enter","Space","useInputTriggerSlot","useFieldControlProps_unstable","tagPickerInputCSSRules","useFocusFinders","useTagPickerInput_unstable","propsArg","ref","props","supportsLabelFor","supportsRequired","supportsSize","controller","activeDescendantController","size","ctx","contextDisabled","disabled","tagPickerGroupRef","triggerRef","selectedOptions","setValue","setOpen","setHasFocus","clearSelection","open","popoverId","noPopover","undefined","selectOption","getOptionById","contextValue","value","current","setTagPickerInputStretchStyle","input","cb","addEventListener","removeEventListener","findLastFocusable","isTypingRef","useRef","root","type","onKeyDown","event","key","currentTarget","selectionStart","selectionEnd","focus","unstable_batchedUpdates","length","code","altKey","ctrlKey","metaKey","freeform","state","multiselect","components","style","removeProperty","width","scrollWidth","offsetWidth","setProperty"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["../src/components/TagPickerInput/useTagPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport type { TagPickerInputProps, TagPickerInputState } from './TagPickerInput.types';\nimport { useActiveDescendantContext } from '@fluentui/react-aria';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport {\n useMergedRefs,\n getIntrinsicElementProps,\n useEventCallback,\n useIsomorphicLayoutEffect,\n} from '@fluentui/react-utilities';\nimport { ArrowLeft, Backspace, Enter, Space } from '@fluentui/keyboard-keys';\nimport { useInputTriggerSlot } from '@fluentui/react-combobox';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { tagPickerInputCSSRules } from '../../utils/tokens';\nimport { useFocusFinders } from '@fluentui/react-tabster';\n\n/**\n * Create the state required to render TagPickerInput.\n *\n * The returned state can be modified with hooks such as useTagPickerInputStyles_unstable,\n * before being passed to renderTagPickerInput_unstable.\n *\n * @param props - props from this instance of TagPickerInput\n * @param ref - reference to root HTMLDivElement of TagPickerInput\n */\nexport const useTagPickerInput_unstable = (\n propsArg: TagPickerInputProps,\n ref: React.Ref<HTMLInputElement>,\n): TagPickerInputState => {\n const props = useFieldControlProps_unstable(propsArg, {\n supportsLabelFor: true,\n supportsRequired: true,\n supportsSize: true,\n });\n const { controller: activeDescendantController } = useActiveDescendantContext();\n const size = useTagPickerContext_unstable(ctx => ctx.size);\n const contextDisabled = useTagPickerContext_unstable(ctx => ctx.disabled);\n const tagPickerGroupRef = useTagPickerContext_unstable(ctx => ctx.tagPickerGroupRef);\n\n const triggerRef = useTagPickerContext_unstable(ctx => ctx.triggerRef as React.RefObject<HTMLInputElement>);\n const selectedOptions = useTagPickerContext_unstable(ctx => ctx.selectedOptions);\n const setValue = useTagPickerContext_unstable(ctx => ctx.setValue);\n const setOpen = useTagPickerContext_unstable(ctx => ctx.setOpen);\n const setHasFocus = useTagPickerContext_unstable(ctx => ctx.setHasFocus);\n const clearSelection = useTagPickerContext_unstable(ctx => ctx.clearSelection);\n const open = useTagPickerContext_unstable(ctx => ctx.open);\n const popoverId = useTagPickerContext_unstable(ctx => (ctx.noPopover ? undefined : ctx.popoverId));\n const selectOption = useTagPickerContext_unstable(ctx => ctx.selectOption);\n const getOptionById = useTagPickerContext_unstable(ctx => ctx.getOptionById);\n const contextValue = useTagPickerContext_unstable(ctx => ctx.value);\n\n useIsomorphicLayoutEffect(() => {\n if (!triggerRef.current) {\n return;\n }\n setTagPickerInputStretchStyle(triggerRef.current);\n }, [selectedOptions, triggerRef]);\n\n useIsomorphicLayoutEffect(() => {\n if (triggerRef.current) {\n const input = triggerRef.current;\n const cb = () => setTagPickerInputStretchStyle(input);\n input.addEventListener('input', cb);\n return () => {\n input.removeEventListener('input', cb);\n };\n }\n }, [triggerRef]);\n\n const { value = contextValue, disabled = contextDisabled } = props;\n const { findLastFocusable } = useFocusFinders();\n\n const isTypingRef = React.useRef(false);\n\n const root = useInputTriggerSlot(\n {\n type: 'text',\n value: value ?? '',\n 'aria-controls': open ? popoverId : undefined,\n disabled,\n ...getIntrinsicElementProps('input', props),\n onKeyDown: useEventCallback((event: React.KeyboardEvent<HTMLInputElement>) => {\n props.onKeyDown?.(event);\n if (\n (event.key === ArrowLeft || event.key === Backspace) &&\n event.currentTarget.selectionStart === 0 &&\n event.currentTarget.selectionEnd === 0 &&\n tagPickerGroupRef.current\n ) {\n findLastFocusable(tagPickerGroupRef.current)?.focus();\n } else if (event.key === Space) {\n if (open && !isTypingRef.current) {\n setOpen(event, false);\n }\n } else if (event.key === Enter) {\n if (open) {\n ReactDOM.unstable_batchedUpdates(() => {\n setValue(undefined);\n setOpen(event, false);\n });\n } else {\n setOpen(event, true);\n }\n }\n isTypingRef.current =\n event.key.length === 1 && event.code !== Space && !event.altKey && !event.ctrlKey && !event.metaKey;\n }),\n },\n useMergedRefs(triggerRef, ref),\n {\n activeDescendantController,\n freeform: false,\n state: {\n clearSelection,\n getOptionById,\n open,\n selectedOptions,\n selectOption,\n setHasFocus,\n setOpen,\n setValue,\n multiselect: true,\n value: props.value,\n },\n },\n );\n\n const state: TagPickerInputState = {\n components: {\n root: 'input',\n },\n root,\n disabled,\n size,\n };\n\n return state;\n};\n\n/**\n * while typing the user might need a bit more of space to see the text,\n * which means the input should stretch to 100% width\n * occupying a whole new line.\n *\n * This function will set the CSS variable `--width` to `100%` if the scrollWidth is greater than the offsetWidth,\n * meaning the text is overflowing the input.\n *\n * @param input - input element to apply the style\n * @returns void\n */\nconst setTagPickerInputStretchStyle = (input: HTMLInputElement) => {\n // first we need to remove the CSS variable\n // to properly calculate the difference between scrollWidth and offsetWidth\n input.style.removeProperty(tagPickerInputCSSRules.width);\n if (input.scrollWidth > input.offsetWidth + 1) {\n input.style.setProperty(tagPickerInputCSSRules.width, '100%');\n } else {\n input.style.removeProperty(tagPickerInputCSSRules.width);\n }\n};\n"],"names":["React","ReactDOM","useActiveDescendantContext","useTagPickerContext_unstable","useMergedRefs","getIntrinsicElementProps","useEventCallback","useIsomorphicLayoutEffect","ArrowLeft","Backspace","Enter","Space","useInputTriggerSlot","useFieldControlProps_unstable","tagPickerInputCSSRules","useFocusFinders","useTagPickerInput_unstable","propsArg","ref","props","supportsLabelFor","supportsRequired","supportsSize","controller","activeDescendantController","size","ctx","contextDisabled","disabled","tagPickerGroupRef","triggerRef","selectedOptions","setValue","setOpen","setHasFocus","clearSelection","open","popoverId","noPopover","undefined","selectOption","getOptionById","contextValue","value","current","setTagPickerInputStretchStyle","input","cb","addEventListener","removeEventListener","findLastFocusable","isTypingRef","useRef","root","type","onKeyDown","event","key","currentTarget","selectionStart","selectionEnd","focus","unstable_batchedUpdates","length","code","altKey","ctrlKey","metaKey","freeform","state","multiselect","components","style","removeProperty","width","scrollWidth","offsetWidth","setProperty"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -67,5 +67,4 @@ export const useTagPickerInputStyles_unstable = state => {
67
67
  const styles = useStyles();
68
68
  state.root.className = mergeClasses(tagPickerInputClassNames.root, baseStyle, styles[state.size], state.disabled && styles.disabled, state.root.className);
69
69
  return state;
70
- };
71
- //# sourceMappingURL=useTagPickerInputStyles.styles.js.map
70
+ };
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerList.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerList_unstable } from './useTagPickerList';\nimport { renderTagPickerList_unstable } from './renderTagPickerList';\nimport { useTagPickerListStyles_unstable } from './useTagPickerListStyles.styles';\nimport type { TagPickerListProps } from './TagPickerList.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerList component -\n * A TagPickerList is a composite component that allows users to display a list of tag options to be selected.\n */\nexport const TagPickerList: ForwardRefComponent<TagPickerListProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerList_unstable(props, ref);\n\n useTagPickerListStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerListStyles_unstable')(state);\n return renderTagPickerList_unstable(state);\n});\n\nTagPickerList.displayName = 'TagPickerList';\n"],"names":["React","useTagPickerList_unstable","renderTagPickerList_unstable","useTagPickerListStyles_unstable","useCustomStyleHook_unstable","TagPickerList","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAElF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,4BAA4B,mCAAmCK;IAC/D,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/TagPickerList/TagPickerList.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useTagPickerList_unstable } from './useTagPickerList';\nimport { renderTagPickerList_unstable } from './renderTagPickerList';\nimport { useTagPickerListStyles_unstable } from './useTagPickerListStyles.styles';\nimport type { TagPickerListProps } from './TagPickerList.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * TagPickerList component -\n * A TagPickerList is a composite component that allows users to display a list of tag options to be selected.\n */\nexport const TagPickerList: ForwardRefComponent<TagPickerListProps> = React.forwardRef((props, ref) => {\n const state = useTagPickerList_unstable(props, ref);\n\n useTagPickerListStyles_unstable(state);\n useCustomStyleHook_unstable('useTagPickerListStyles_unstable')(state);\n return renderTagPickerList_unstable(state);\n});\n\nTagPickerList.displayName = 'TagPickerList';\n"],"names":["React","useTagPickerList_unstable","renderTagPickerList_unstable","useTagPickerListStyles_unstable","useCustomStyleHook_unstable","TagPickerList","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAElF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,4BAA4B,mCAAmCK;IAC/D,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["TagPickerList.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { Listbox } from '@fluentui/react-combobox';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\n\nexport type TagPickerListSlots = {\n root: Slot<typeof Listbox>;\n};\n\n/**\n * TagPickerList Props\n */\nexport type TagPickerListProps = ComponentProps<TagPickerListSlots>;\n\n/**\n * State used in rendering TagPickerList\n */\nexport type TagPickerListState = ComponentState<TagPickerListSlots> & Pick<TagPickerContextValue, 'open'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAaA;;CAEC,GACD,WAA0G"}
1
+ {"version":3,"sources":["../src/components/TagPickerList/TagPickerList.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { Listbox } from '@fluentui/react-combobox';\nimport { TagPickerContextValue } from '../../contexts/TagPickerContext';\n\nexport type TagPickerListSlots = {\n root: Slot<typeof Listbox>;\n};\n\n/**\n * TagPickerList Props\n */\nexport type TagPickerListProps = ComponentProps<TagPickerListSlots>;\n\n/**\n * State used in rendering TagPickerList\n */\nexport type TagPickerListState = ComponentState<TagPickerListSlots> & Pick<TagPickerContextValue, 'open'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAaA;;CAEC,GACD,WAA0G"}