@fluentui/react-tag-picker 9.9.0 → 9.74.3-experimental.esm.20260709-49ee7a20cf.0

package/lib/TagPickerControl.js

@@ -1 +1 @@
-export { TagPickerControl, iconSizes, renderTagPickerControl_unstable, tagPickerControlAsideWidthToken, tagPickerControlClassNames, useTagPickerControlStyles_unstable, useTagPickerControl_unstable, useTagPickerControlBase_unstable } from './components/TagPickerControl/index';
+export { TagPickerControl, iconSizes, renderTagPickerControl_unstable, tagPickerControlAsideWidthToken, tagPickerControlClassNames, useTagPickerControlStyles_unstable, useTagPickerControl_unstable, useTagPickerControlBase_unstable } from "./components/TagPickerControl/index.js";

package/lib/TagPickerControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TagPickerControl.ts"],"sourcesContent":["export type {\n  TagPickerControlBaseState,\n  TagPickerControlCSSProperties,\n  TagPickerControlInternalSlots,\n  TagPickerControlProps,\n  TagPickerControlSlots,\n  TagPickerControlState,\n} from './components/TagPickerControl/index';\nexport {\n  TagPickerControl,\n  iconSizes,\n  renderTagPickerControl_unstable,\n  tagPickerControlAsideWidthToken,\n  tagPickerControlClassNames,\n  useTagPickerControlStyles_unstable,\n  useTagPickerControl_unstable,\n  useTagPickerControlBase_unstable,\n} from './components/TagPickerControl/index';\n"],"names":["TagPickerControl","iconSizes","renderTagPickerControl_unstable","tagPickerControlAsideWidthToken","tagPickerControlClassNames","useTagPickerControlStyles_unstable","useTagPickerControl_unstable","useTagPickerControlBase_unstable"],"mappings":"AAQA,SACEA,gBAAgB,EAChBC,SAAS,EACTC,+BAA+B,EAC/BC,+BAA+B,EAC/BC,0BAA0B,EAC1BC,kCAAkC,EAClCC,4BAA4B,EAC5BC,gCAAgC,QAC3B,sCAAsC"}
+{"version":3,"sources":["../src/TagPickerControl.ts"],"sourcesContent":["export type {\n  TagPickerControlBaseState,\n  TagPickerControlCSSProperties,\n  TagPickerControlInternalSlots,\n  TagPickerControlProps,\n  TagPickerControlSlots,\n  TagPickerControlState,\n} from './components/TagPickerControl/index';\nexport {\n  TagPickerControl,\n  iconSizes,\n  renderTagPickerControl_unstable,\n  tagPickerControlAsideWidthToken,\n  tagPickerControlClassNames,\n  useTagPickerControlStyles_unstable,\n  useTagPickerControl_unstable,\n  useTagPickerControlBase_unstable,\n} from './components/TagPickerControl/index';\n"],"names":["TagPickerControl","iconSizes","renderTagPickerControl_unstable","tagPickerControlAsideWidthToken","tagPickerControlClassNames","useTagPickerControlStyles_unstable","useTagPickerControl_unstable","useTagPickerControlBase_unstable"],"mappings":"AAQA,SACEA,gBAAgB,EAChBC,SAAS,EACTC,+BAA+B,EAC/BC,+BAA+B,EAC/BC,0BAA0B,EAC1BC,kCAAkC,EAClCC,4BAA4B,EAC5BC,gCAAgC,QAC3B,yCAAsC"}

package/lib/TagPickerGroup.js

@@ -1 +1 @@
-export { TagPickerGroup, renderTagPickerGroup_unstable, tagPickerGroupClassNames, useTagPickerGroupStyles_unstable, useTagPickerGroup_unstable } from './components/TagPickerGroup/index';
+export { TagPickerGroup, renderTagPickerGroup_unstable, tagPickerGroupClassNames, useTagPickerGroupStyles_unstable, useTagPickerGroup_unstable } from "./components/TagPickerGroup/index.js";

package/lib/TagPickerGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TagPickerGroup.ts"],"sourcesContent":["export type { TagPickerGroupProps, TagPickerGroupSlots, TagPickerGroupState } from './components/TagPickerGroup/index';\nexport {\n  TagPickerGroup,\n  renderTagPickerGroup_unstable,\n  tagPickerGroupClassNames,\n  useTagPickerGroupStyles_unstable,\n  useTagPickerGroup_unstable,\n} from './components/TagPickerGroup/index';\n"],"names":["TagPickerGroup","renderTagPickerGroup_unstable","tagPickerGroupClassNames","useTagPickerGroupStyles_unstable","useTagPickerGroup_unstable"],"mappings":"AACA,SACEA,cAAc,EACdC,6BAA6B,EAC7BC,wBAAwB,EACxBC,gCAAgC,EAChCC,0BAA0B,QACrB,oCAAoC"}
+{"version":3,"sources":["../src/TagPickerGroup.ts"],"sourcesContent":["export type { TagPickerGroupProps, TagPickerGroupSlots, TagPickerGroupState } from './components/TagPickerGroup/index';\nexport {\n  TagPickerGroup,\n  renderTagPickerGroup_unstable,\n  tagPickerGroupClassNames,\n  useTagPickerGroupStyles_unstable,\n  useTagPickerGroup_unstable,\n} from './components/TagPickerGroup/index';\n"],"names":["TagPickerGroup","renderTagPickerGroup_unstable","tagPickerGroupClassNames","useTagPickerGroupStyles_unstable","useTagPickerGroup_unstable"],"mappings":"AACA,SACEA,cAAc,EACdC,6BAA6B,EAC7BC,wBAAwB,EACxBC,gCAAgC,EAChCC,0BAA0B,QACrB,uCAAoC"}

package/lib/TagPickerInput.js

@@ -1 +1 @@
-export { TagPickerInput, renderTagPickerInput_unstable, tagPickerInputClassNames, useTagPickerInputStyles_unstable, useTagPickerInput_unstable, useTagPickerInputBase_unstable } from './components/TagPickerInput/index';
+export { TagPickerInput, renderTagPickerInput_unstable, tagPickerInputClassNames, useTagPickerInputStyles_unstable, useTagPickerInput_unstable, useTagPickerInputBase_unstable } from "./components/TagPickerInput/index.js";

package/lib/TagPickerInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TagPickerInput.ts"],"sourcesContent":["export type {\n  TagPickerInputBaseProps,\n  TagPickerInputBaseState,\n  TagPickerInputProps,\n  TagPickerInputSlots,\n  TagPickerInputState,\n} from './components/TagPickerInput/index';\nexport {\n  TagPickerInput,\n  renderTagPickerInput_unstable,\n  tagPickerInputClassNames,\n  useTagPickerInputStyles_unstable,\n  useTagPickerInput_unstable,\n  useTagPickerInputBase_unstable,\n} from './components/TagPickerInput/index';\n"],"names":["TagPickerInput","renderTagPickerInput_unstable","tagPickerInputClassNames","useTagPickerInputStyles_unstable","useTagPickerInput_unstable","useTagPickerInputBase_unstable"],"mappings":"AAOA,SACEA,cAAc,EACdC,6BAA6B,EAC7BC,wBAAwB,EACxBC,gCAAgC,EAChCC,0BAA0B,EAC1BC,8BAA8B,QACzB,oCAAoC"}
+{"version":3,"sources":["../src/TagPickerInput.ts"],"sourcesContent":["export type {\n  TagPickerInputBaseProps,\n  TagPickerInputBaseState,\n  TagPickerInputProps,\n  TagPickerInputSlots,\n  TagPickerInputState,\n} from './components/TagPickerInput/index';\nexport {\n  TagPickerInput,\n  renderTagPickerInput_unstable,\n  tagPickerInputClassNames,\n  useTagPickerInputStyles_unstable,\n  useTagPickerInput_unstable,\n  useTagPickerInputBase_unstable,\n} from './components/TagPickerInput/index';\n"],"names":["TagPickerInput","renderTagPickerInput_unstable","tagPickerInputClassNames","useTagPickerInputStyles_unstable","useTagPickerInput_unstable","useTagPickerInputBase_unstable"],"mappings":"AAOA,SACEA,cAAc,EACdC,6BAA6B,EAC7BC,wBAAwB,EACxBC,gCAAgC,EAChCC,0BAA0B,EAC1BC,8BAA8B,QACzB,uCAAoC"}

package/lib/TagPickerList.js

@@ -1 +1 @@
-export { TagPickerList, renderTagPickerList_unstable, tagPickerListClassNames, useTagPickerListStyles_unstable, useTagPickerList_unstable } from './components/TagPickerList/index';
+export { TagPickerList, renderTagPickerList_unstable, tagPickerListClassNames, useTagPickerListStyles_unstable, useTagPickerList_unstable } from "./components/TagPickerList/index.js";

package/lib/TagPickerList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TagPickerList.ts"],"sourcesContent":["export type { TagPickerListProps, TagPickerListSlots, TagPickerListState } from './components/TagPickerList/index';\nexport {\n  TagPickerList,\n  renderTagPickerList_unstable,\n  tagPickerListClassNames,\n  useTagPickerListStyles_unstable,\n  useTagPickerList_unstable,\n} from './components/TagPickerList/index';\n"],"names":["TagPickerList","renderTagPickerList_unstable","tagPickerListClassNames","useTagPickerListStyles_unstable","useTagPickerList_unstable"],"mappings":"AACA,SACEA,aAAa,EACbC,4BAA4B,EAC5BC,uBAAuB,EACvBC,+BAA+B,EAC/BC,yBAAyB,QACpB,mCAAmC"}
+{"version":3,"sources":["../src/TagPickerList.ts"],"sourcesContent":["export type { TagPickerListProps, TagPickerListSlots, TagPickerListState } from './components/TagPickerList/index';\nexport {\n  TagPickerList,\n  renderTagPickerList_unstable,\n  tagPickerListClassNames,\n  useTagPickerListStyles_unstable,\n  useTagPickerList_unstable,\n} from './components/TagPickerList/index';\n"],"names":["TagPickerList","renderTagPickerList_unstable","tagPickerListClassNames","useTagPickerListStyles_unstable","useTagPickerList_unstable"],"mappings":"AACA,SACEA,aAAa,EACbC,4BAA4B,EAC5BC,uBAAuB,EACvBC,+BAA+B,EAC/BC,yBAAyB,QACpB,sCAAmC"}

package/lib/TagPickerOption.js

@@ -1 +1 @@
-export { TagPickerOption, renderTagPickerOption_unstable, tagPickerOptionClassNames, useTagPickerOptionStyles_unstable, useTagPickerOption_unstable } from './components/TagPickerOption/index';
+export { TagPickerOption, renderTagPickerOption_unstable, tagPickerOptionClassNames, useTagPickerOptionStyles_unstable, useTagPickerOption_unstable } from "./components/TagPickerOption/index.js";

package/lib/TagPickerOption.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TagPickerOption.ts"],"sourcesContent":["export type {\n  TagPickerOptionProps,\n  TagPickerOptionSlots,\n  TagPickerOptionState,\n} from './components/TagPickerOption/index';\nexport {\n  TagPickerOption,\n  renderTagPickerOption_unstable,\n  tagPickerOptionClassNames,\n  useTagPickerOptionStyles_unstable,\n  useTagPickerOption_unstable,\n} from './components/TagPickerOption/index';\n"],"names":["TagPickerOption","renderTagPickerOption_unstable","tagPickerOptionClassNames","useTagPickerOptionStyles_unstable","useTagPickerOption_unstable"],"mappings":"AAKA,SACEA,eAAe,EACfC,8BAA8B,EAC9BC,yBAAyB,EACzBC,iCAAiC,EACjCC,2BAA2B,QACtB,qCAAqC"}
+{"version":3,"sources":["../src/TagPickerOption.ts"],"sourcesContent":["export type {\n  TagPickerOptionProps,\n  TagPickerOptionSlots,\n  TagPickerOptionState,\n} from './components/TagPickerOption/index';\nexport {\n  TagPickerOption,\n  renderTagPickerOption_unstable,\n  tagPickerOptionClassNames,\n  useTagPickerOptionStyles_unstable,\n  useTagPickerOption_unstable,\n} from './components/TagPickerOption/index';\n"],"names":["TagPickerOption","renderTagPickerOption_unstable","tagPickerOptionClassNames","useTagPickerOptionStyles_unstable","useTagPickerOption_unstable"],"mappings":"AAKA,SACEA,eAAe,EACfC,8BAA8B,EAC9BC,yBAAyB,EACzBC,iCAAiC,EACjCC,2BAA2B,QACtB,wCAAqC"}

package/lib/TagPickerOptionGroup.js

@@ -1 +1 @@
-export { TagPickerOptionGroup, renderTagPickerOptionGroup, tagPickerOptionGroupClassNames, useTagPickerOptionGroup, useTagPickerOptionGroupStyles } from './components/TagPickerOptionGroup/index';
+export { TagPickerOptionGroup, renderTagPickerOptionGroup, tagPickerOptionGroupClassNames, useTagPickerOptionGroup, useTagPickerOptionGroupStyles } from "./components/TagPickerOptionGroup/index.js";

package/lib/TagPickerOptionGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/TagPickerOptionGroup.ts"],"sourcesContent":["export type {\n  TagPickerOptionGroupProps,\n  TagPickerOptionGroupSlots,\n  TagPickerOptionGroupState,\n} from './components/TagPickerOptionGroup/index';\nexport {\n  TagPickerOptionGroup,\n  renderTagPickerOptionGroup,\n  tagPickerOptionGroupClassNames,\n  useTagPickerOptionGroup,\n  useTagPickerOptionGroupStyles,\n} from './components/TagPickerOptionGroup/index';\n"],"names":["TagPickerOptionGroup","renderTagPickerOptionGroup","tagPickerOptionGroupClassNames","useTagPickerOptionGroup","useTagPickerOptionGroupStyles"],"mappings":"AAKA,SACEA,oBAAoB,EACpBC,0BAA0B,EAC1BC,8BAA8B,EAC9BC,uBAAuB,EACvBC,6BAA6B,QACxB,0CAA0C"}
+{"version":3,"sources":["../src/TagPickerOptionGroup.ts"],"sourcesContent":["export type {\n  TagPickerOptionGroupProps,\n  TagPickerOptionGroupSlots,\n  TagPickerOptionGroupState,\n} from './components/TagPickerOptionGroup/index';\nexport {\n  TagPickerOptionGroup,\n  renderTagPickerOptionGroup,\n  tagPickerOptionGroupClassNames,\n  useTagPickerOptionGroup,\n  useTagPickerOptionGroupStyles,\n} from './components/TagPickerOptionGroup/index';\n"],"names":["TagPickerOptionGroup","renderTagPickerOptionGroup","tagPickerOptionGroupClassNames","useTagPickerOptionGroup","useTagPickerOptionGroupStyles"],"mappings":"AAKA,SACEA,oBAAoB,EACpBC,0BAA0B,EAC1BC,8BAA8B,EAC9BC,uBAAuB,EACvBC,6BAA6B,QACxB,6CAA0C"}

package/lib/components/TagPicker/TagPicker.js

@@ -1,8 +1,8 @@
 'use client';
-import * as React from 'react';
-import { useTagPicker_unstable } from './useTagPicker';
-import { renderTagPicker_unstable } from './renderTagPicker';
-import { useTagPickerContextValues } from './useTagPickerContextValues';
+import * as React from "react";
+import { useTagPicker_unstable } from "./useTagPicker.js";
+import { renderTagPicker_unstable } from "./renderTagPicker.js";
+import { useTagPickerContextValues } from "./useTagPickerContextValues.js";
 /**
  * TagPicker component -
  * A TagPicker is a composite component that allows users to pick tags from a list of options.

package/lib/components/TagPicker/TagPicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPicker/TagPicker.tsx"],"sourcesContent":["'use client';\n\nimport * 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"],"mappings":"AAAA;AAEA,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"}
+{"version":3,"sources":["../src/components/TagPicker/TagPicker.tsx"],"sourcesContent":["'use client';\n\nimport * 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"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,oBAAiB;AACvD,SAASC,wBAAwB,QAAQ,uBAAoB;AAE7D,SAASC,yBAAyB,QAAQ,iCAA8B;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"}

package/lib/components/TagPicker/TagPicker.types.js

@@ -1,4 +1,5 @@
 /**
- * TagPicker Base Props - omits the floating-ui `positioning` prop; the styled wrapper
- * {@link TagPickerProps} re-introduces it via `usePositioning`.
+ * TagPicker Base State - the state produced by the base hook, which does not interact with the
+ * `size`, `appearance` and `inline` props. These are layered on by the styled
+ * {@link useTagPicker_unstable} hook.
  */ export { };

package/lib/components/TagPicker/TagPicker.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPicker/TagPicker.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type {\n  ComponentProps,\n  ComponentState,\n  DistributiveOmit,\n  EventData,\n  EventHandler,\n  JSXElement,\n} 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'\n    | 'disabled'\n    | 'defaultOpen'\n    | 'selectedOptions'\n    | 'defaultSelectedOptions'\n    | 'open'\n    | 'disableAutoFocus'\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: [JSXElement, JSXElement | undefined | false] | JSXElement;\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\n/**\n * TagPicker Base Props - omits the floating-ui `positioning` prop; the styled wrapper\n * {@link TagPickerProps} re-introduces it via `usePositioning`.\n */\nexport type TagPickerBaseProps = DistributiveOmit<TagPickerProps, 'positioning'>;\n"],"names":[],"mappings":"AAoHA;;;CAGC,GACD,WAAiF"}
+{"version":3,"sources":["../src/components/TagPicker/TagPicker.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type {\n  ComponentProps,\n  ComponentState,\n  DistributiveOmit,\n  EventData,\n  EventHandler,\n  JSXElement,\n} 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'\n    | 'disabled'\n    | 'defaultOpen'\n    | 'selectedOptions'\n    | 'defaultSelectedOptions'\n    | 'open'\n    | 'disableAutoFocus'\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: [JSXElement, JSXElement | undefined | false] | JSXElement;\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\n/**\n * TagPicker Base Props - omits the presentation-related props that the base hook does not handle:\n * the floating-ui `positioning` prop (the styled {@link TagPickerProps} re-introduces it via\n * `usePositioning`) as well as `size`, `appearance` and `inline` (layered on by the styled\n * {@link useTagPicker_unstable} hook).\n */\nexport type TagPickerBaseProps = DistributiveOmit<TagPickerProps, 'positioning' | 'size' | 'appearance' | 'inline'>;\n\n/**\n * TagPicker Base State - the state produced by the base hook, which does not interact with the\n * `size`, `appearance` and `inline` props. These are layered on by the styled\n * {@link useTagPicker_unstable} hook.\n */\nexport type TagPickerBaseState = Omit<TagPickerState, 'size' | 'appearance' | 'inline'>;\n"],"names":[],"mappings":"AA4HA;;;;CAIC,GACD,WAAwF"}

package/lib/components/TagPicker/index.js

@@ -1,3 +1,4 @@
-export { TagPicker } from './TagPicker';
-export { renderTagPicker_unstable } from './renderTagPicker';
-export { useTagPicker_unstable, useTagPickerBase_unstable } from './useTagPicker';
+export { TagPicker } from "./TagPicker.js";
+export { renderTagPicker_unstable } from "./renderTagPicker.js";
+export { useTagPicker_unstable, useTagPickerBase_unstable } from "./useTagPicker.js";
+export { useTagPickerContextValues } from "./useTagPickerContextValues.js";

package/lib/components/TagPicker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPicker/index.ts"],"sourcesContent":["export { TagPicker } from './TagPicker';\nexport type {\n  TagPickerBaseProps,\n  TagPickerContextValues,\n  TagPickerOnOpenChangeData,\n  TagPickerOnOptionSelectData,\n  TagPickerProps,\n  TagPickerSize,\n  TagPickerSlots,\n  TagPickerState,\n} from './TagPicker.types';\nexport { renderTagPicker_unstable } from './renderTagPicker';\nexport { useTagPicker_unstable, useTagPickerBase_unstable } from './useTagPicker';\n"],"names":["TagPicker","renderTagPicker_unstable","useTagPicker_unstable","useTagPickerBase_unstable"],"mappings":"AAAA,SAASA,SAAS,QAAQ,cAAc;AAWxC,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,qBAAqB,EAAEC,yBAAyB,QAAQ,iBAAiB"}
+{"version":3,"sources":["../src/components/TagPicker/index.ts"],"sourcesContent":["export { TagPicker } from './TagPicker';\nexport type {\n  TagPickerBaseProps,\n  TagPickerBaseState,\n  TagPickerContextValues,\n  TagPickerOnOpenChangeData,\n  TagPickerOnOptionSelectData,\n  TagPickerProps,\n  TagPickerSize,\n  TagPickerSlots,\n  TagPickerState,\n} from './TagPicker.types';\nexport { renderTagPicker_unstable } from './renderTagPicker';\nexport { useTagPicker_unstable, useTagPickerBase_unstable } from './useTagPicker';\nexport { useTagPickerContextValues } from './useTagPickerContextValues';\n"],"names":["TagPicker","renderTagPicker_unstable","useTagPicker_unstable","useTagPickerBase_unstable","useTagPickerContextValues"],"mappings":"AAAA,SAASA,SAAS,QAAQ,iBAAc;AAYxC,SAASC,wBAAwB,QAAQ,uBAAoB;AAC7D,SAASC,qBAAqB,EAAEC,yBAAyB,QAAQ,oBAAiB;AAClF,SAASC,yBAAyB,QAAQ,iCAA8B"}

package/lib/components/TagPicker/renderTagPicker.js

@@ -1,9 +1,9 @@
-import * as React from 'react';
-import { ActiveDescendantContextProvider } from '@fluentui/react-aria';
-import { ListboxProvider } from '@fluentui/react-combobox';
-import { Portal } from '@fluentui/react-portal';
-import { assertSlots } from '@fluentui/react-utilities';
-import { TagPickerContextProvider } from '../../contexts/TagPickerContext';
+import * as React from "react";
+import { ActiveDescendantContextProvider } from "@fluentui/react-aria";
+import { ListboxProvider } from "@fluentui/react-combobox";
+import { Portal } from "@fluentui/react-portal";
+import { assertSlots } from "@fluentui/react-utilities";
+import { TagPickerContextProvider } from "../../contexts/TagPickerContext.js";
 /**
  * Render the final JSX of Picker
  */ export const renderTagPicker_unstable = (state, contexts)=>{

package/lib/components/TagPicker/renderTagPicker.js.map

@@ -1 +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 { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { TagPickerContextProvider } from '../../contexts/TagPickerContext';\n\n/**\n * Render the final JSX of Picker\n */\n\nexport const renderTagPicker_unstable = (state: TagPickerState, contexts: TagPickerContextValues): JSXElement => {\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.popover &&\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","assertSlots","TagPickerContextProvider","renderTagPicker_unstable","state","contexts","value","picker","activeDescendant","listbox","trigger","popover","inline","mountNode"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,+BAA+B,QAAQ,uBAAuB;AACvE,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,MAAM,QAAQ,yBAAyB;AAChD,SAASC,WAAW,QAAQ,4BAA4B;AAExD,SAASC,wBAAwB,QAAQ,kCAAkC;AAE3E;;CAEC,GAED,OAAO,MAAMC,2BAA2B,CAACC,OAAuBC;IAC9DJ,YAA4BG;IAC5B,qBACE,oBAACF;QAAyBI,OAAOD,SAASE,MAAM;qBAC9C,oBAACT;QAAgCQ,OAAOD,SAASG,gBAAgB;qBAC/D,oBAACT;QAAgBO,OAAOD,SAASI,OAAO;OACrCL,MAAMM,OAAO,EACbN,MAAMO,OAAO,IACXP,CAAAA,MAAMQ,MAAM,GAAGR,MAAMO,OAAO,iBAAG,oBAACX;QAAOa,WAAWT,MAAMS,SAAS;OAAGT,MAAMO,OAAO,CAAS;AAKvG,EAAE"}
+{"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 { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { TagPickerContextProvider } from '../../contexts/TagPickerContext';\n\n/**\n * Render the final JSX of Picker\n */\n\nexport const renderTagPicker_unstable = (state: TagPickerState, contexts: TagPickerContextValues): JSXElement => {\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.popover &&\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","assertSlots","TagPickerContextProvider","renderTagPicker_unstable","state","contexts","value","picker","activeDescendant","listbox","trigger","popover","inline","mountNode"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,+BAA+B,QAAQ,uBAAuB;AACvE,SAASC,eAAe,QAAQ,2BAA2B;AAC3D,SAASC,MAAM,QAAQ,yBAAyB;AAChD,SAASC,WAAW,QAAQ,4BAA4B;AAExD,SAASC,wBAAwB,QAAQ,qCAAkC;AAE3E;;CAEC,GAED,OAAO,MAAMC,2BAA2B,CAACC,OAAuBC;IAC9DJ,YAA4BG;IAC5B,qBACE,oBAACF;QAAyBI,OAAOD,SAASE,MAAM;qBAC9C,oBAACT;QAAgCQ,OAAOD,SAASG,gBAAgB;qBAC/D,oBAACT;QAAgBO,OAAOD,SAASI,OAAO;OACrCL,MAAMM,OAAO,EACbN,MAAMO,OAAO,IACXP,CAAAA,MAAMQ,MAAM,GAAGR,MAAMO,OAAO,iBAAG,oBAACX;QAAOa,WAAWT,MAAMS,SAAS;OAAGT,MAAMO,OAAO,CAAS;AAKvG,EAAE"}

package/lib/components/TagPicker/useTagPicker.js

@@ -1,10 +1,10 @@
 'use client';
-import * as React from 'react';
-import { elementContains, useEventCallback, useId, useMergedRefs } from '@fluentui/react-utilities';
-import { optionClassNames } from '@fluentui/react-combobox';
-import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';
-import { useActiveDescendant } from '@fluentui/react-aria';
-import { useComboboxBaseState } from '@fluentui/react-combobox';
+import * as React from "react";
+import { elementContains, useEventCallback, useId, useMergedRefs } from "@fluentui/react-utilities";
+import { optionClassNames } from "@fluentui/react-combobox";
+import { resolvePositioningShorthand, usePositioning } from "@fluentui/react-positioning";
+import { useActiveDescendant } from "@fluentui/react-aria";
+import { useComboboxBaseState } from "@fluentui/react-combobox";
 // Set a default set of fallback positions to try if the dropdown does not fit on screen
 const fallbackPositions = [
     'above',
@@ -22,7 +22,7 @@ const fallbackPositions = [
     const secondaryActionRef = React.useRef(null);
     const tagPickerGroupRef = React.useRef(null);
     const passiveTargetRef = React.useRef(null);
-    const { size = 'medium', inline = false, noPopover = false, disableAutoFocus } = props;
+    const { noPopover = false, disableAutoFocus } = props;
     const { controller: activeDescendantController, activeParentRef, listboxRef } = useActiveDescendant({
         matchOption: (el)=>el.classList.contains(optionClassNames.root)
     });
@@ -48,8 +48,7 @@ const fallbackPositions = [
         activeDescendantController,
         disableAutoFocus,
         editable: true,
-        multiselect: true,
-        size: 'medium'
+        multiselect: true
     });
     const { trigger, popover } = childrenToTriggerAndPopover(props.children, noPopover);
     return {
@@ -65,15 +64,12 @@ const fallbackPositions = [
         secondaryActionRef,
         tagPickerGroupRef,
         targetRef: passiveTargetRef,
-        size,
-        inline,
         open: comboboxState.open,
         mountNode: comboboxState.mountNode,
         onOptionClick: useEventCallback((event)=>{
             comboboxState.onOptionClick(event);
             comboboxState.setOpen(event, false);
         }),
-        appearance: comboboxState.appearance,
         clearSelection: comboboxState.clearSelection,
         getOptionById: comboboxState.getOptionById,
         getOptionsMatchingValue: comboboxState.getOptionsMatchingValue,
@@ -108,7 +104,7 @@ const fallbackPositions = [
  *
  * @param props - props from this instance of Picker
  */ export const useTagPicker_unstable = (props)=>{
-    const { positioning } = props;
+    const { positioning, size = 'medium', appearance = 'outline', inline = false } = props;
     const { targetRef, containerRef } = usePositioning({
         position: 'below',
         align: 'start',
@@ -123,6 +119,9 @@ const fallbackPositions = [
     const baseState = useTagPickerBase_unstable(props);
     return {
         ...baseState,
+        size,
+        appearance,
+        inline,
         targetRef,
         popoverRef: useMergedRefs(baseState.popoverRef, containerRef)
     };

package/lib/components/TagPicker/useTagPicker.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPicker/useTagPicker.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { elementContains, useEventCallback, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport type {\n  TagPickerBaseProps,\n  TagPickerOnOpenChangeData,\n  TagPickerOnOptionSelectData,\n  TagPickerProps,\n  TagPickerState,\n} from './TagPicker.types';\nimport { optionClassNames } from '@fluentui/react-combobox';\nimport type { PositioningShorthandValue } from '@fluentui/react-positioning';\nimport { 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 base state required to render TagPicker, without floating-ui positioning.\n * @param props - props from this instance of TagPicker (without `positioning`)\n */\nexport const useTagPickerBase_unstable = (props: TagPickerBaseProps): 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 passiveTargetRef = React.useRef<HTMLDivElement>(null);\n  const { size = 'medium', inline = false, noPopover = false, disableAutoFocus } = props;\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    disableAutoFocus,\n    editable: true,\n    multiselect: true,\n    size: 'medium',\n  });\n\n  const { trigger, popover } = childrenToTriggerAndPopover(props.children, noPopover);\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),\n    secondaryActionRef,\n    tagPickerGroupRef,\n    targetRef: passiveTargetRef,\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: useEventCallback((event, data) => {\n      // if the option is already selected, invoke onOptionSelect callback with current selected values\n      // the combobox state would unselect the option, which is not the behavior expected\n      if (\n        comboboxState.selectedOptions.includes(data.value) &&\n        !elementContains(tagPickerGroupRef.current, event.target as Node)\n      ) {\n        props.onOptionSelect?.(event, {\n          selectedOptions: comboboxState.selectedOptions,\n          value: data.value,\n          type: event.type,\n          event,\n        } as TagPickerOnOptionSelectData);\n        return;\n      }\n      comboboxState.selectOption(event, data);\n    }),\n    setHasFocus: comboboxState.setHasFocus,\n    setOpen: comboboxState.setOpen,\n    setValue: comboboxState.setValue,\n    value: comboboxState.value,\n  };\n};\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 { positioning } = 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 baseState = useTagPickerBase_unstable(props);\n\n  return {\n    ...baseState,\n    targetRef,\n    popoverRef: useMergedRefs(baseState.popoverRef, containerRef),\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","elementContains","useEventCallback","useId","useMergedRefs","optionClassNames","resolvePositioningShorthand","usePositioning","useActiveDescendant","useComboboxBaseState","fallbackPositions","useTagPickerBase_unstable","props","popoverId","triggerInnerRef","useRef","secondaryActionRef","tagPickerGroupRef","passiveTargetRef","size","inline","noPopover","disableAutoFocus","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","targetRef","mountNode","onOptionClick","setOpen","appearance","clearSelection","getOptionById","getOptionsMatchingValue","registerOption","selectOption","includes","current","target","setHasFocus","setValue","useTagPicker_unstable","positioning","containerRef","position","align","offset","crossAxis","mainAxis","matchTargetSize","baseState","childrenArray","Children","toArray","process","env","NODE_ENV","length","console","warn"],"mappings":"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"}
+{"version":3,"sources":["../src/components/TagPicker/useTagPicker.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { elementContains, useEventCallback, useId, useMergedRefs } from '@fluentui/react-utilities';\nimport type {\n  TagPickerBaseProps,\n  TagPickerBaseState,\n  TagPickerOnOpenChangeData,\n  TagPickerOnOptionSelectData,\n  TagPickerProps,\n  TagPickerState,\n} from './TagPicker.types';\nimport { optionClassNames } from '@fluentui/react-combobox';\nimport type { PositioningShorthandValue } from '@fluentui/react-positioning';\nimport { 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 base state required to render TagPicker, without floating-ui positioning.\n * @param props - props from this instance of TagPicker (without `positioning`)\n */\nexport const useTagPickerBase_unstable = (props: TagPickerBaseProps): TagPickerBaseState => {\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 passiveTargetRef = React.useRef<HTMLDivElement>(null);\n  const { noPopover = false, disableAutoFocus } = props;\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    disableAutoFocus,\n    editable: true,\n    multiselect: true,\n  });\n\n  const { trigger, popover } = childrenToTriggerAndPopover(props.children, noPopover);\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),\n    secondaryActionRef,\n    tagPickerGroupRef,\n    targetRef: passiveTargetRef,\n    open: comboboxState.open,\n    mountNode: comboboxState.mountNode,\n    onOptionClick: useEventCallback(event => {\n      comboboxState.onOptionClick(event);\n      comboboxState.setOpen(event, false);\n    }),\n    clearSelection: comboboxState.clearSelection,\n    getOptionById: comboboxState.getOptionById,\n    getOptionsMatchingValue: comboboxState.getOptionsMatchingValue,\n    registerOption: comboboxState.registerOption,\n    selectedOptions: comboboxState.selectedOptions,\n    selectOption: useEventCallback((event, data) => {\n      // if the option is already selected, invoke onOptionSelect callback with current selected values\n      // the combobox state would unselect the option, which is not the behavior expected\n      if (\n        comboboxState.selectedOptions.includes(data.value) &&\n        !elementContains(tagPickerGroupRef.current, event.target as Node)\n      ) {\n        props.onOptionSelect?.(event, {\n          selectedOptions: comboboxState.selectedOptions,\n          value: data.value,\n          type: event.type,\n          event,\n        } as TagPickerOnOptionSelectData);\n        return;\n      }\n      comboboxState.selectOption(event, data);\n    }),\n    setHasFocus: comboboxState.setHasFocus,\n    setOpen: comboboxState.setOpen,\n    setValue: comboboxState.setValue,\n    value: comboboxState.value,\n  };\n};\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 { positioning, size = 'medium', appearance = 'outline', inline = 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 baseState = useTagPickerBase_unstable(props);\n\n  return {\n    ...baseState,\n    size,\n    appearance,\n    inline,\n    targetRef,\n    popoverRef: useMergedRefs(baseState.popoverRef, containerRef),\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","elementContains","useEventCallback","useId","useMergedRefs","optionClassNames","resolvePositioningShorthand","usePositioning","useActiveDescendant","useComboboxBaseState","fallbackPositions","useTagPickerBase_unstable","props","popoverId","triggerInnerRef","useRef","secondaryActionRef","tagPickerGroupRef","passiveTargetRef","noPopover","disableAutoFocus","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","targetRef","mountNode","onOptionClick","setOpen","clearSelection","getOptionById","getOptionsMatchingValue","registerOption","selectOption","includes","current","target","setHasFocus","setValue","useTagPicker_unstable","positioning","size","appearance","inline","containerRef","position","align","offset","crossAxis","mainAxis","matchTargetSize","baseState","childrenArray","Children","toArray","process","env","NODE_ENV","length","console","warn"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,eAAe,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,aAAa,QAAQ,4BAA4B;AASpG,SAASC,gBAAgB,QAAQ,2BAA2B;AAE5D,SAASC,2BAA2B,EAAEC,cAAc,QAAQ,8BAA8B;AAC1F,SAASC,mBAAmB,QAAQ,uBAAuB;AAC3D,SAASC,oBAAoB,QAAQ,2BAA2B;AAEhE,wFAAwF;AACxF,MAAMC,oBAAiD;IAAC;IAAS;IAAS;IAAa;IAAU;CAAa;AAE9G;;;CAGC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxC,MAAMC,YAAYV,MAAM;IACxB,MAAMW,kBAAkBd,MAAMe,MAAM,CAAuC;IAC3E,MAAMC,qBAAqBhB,MAAMe,MAAM,CAAkB;IACzD,MAAME,oBAAoBjB,MAAMe,MAAM,CAAiB;IACvD,MAAMG,mBAAmBlB,MAAMe,MAAM,CAAiB;IACtD,MAAM,EAAEI,YAAY,KAAK,EAAEC,gBAAgB,EAAE,GAAGR;IAEhD,MAAM,EACJS,YAAYC,0BAA0B,EACtCC,eAAe,EACfC,UAAU,EACX,GAAGhB,oBAAsD;QACxDiB,aAAaC,CAAAA,KAAMA,GAAGC,SAAS,CAACC,QAAQ,CAACvB,iBAAiBwB,IAAI;IAChE;IAEA,MAAMC,gBAAgBrB,qBAAqB;QACzC,GAAGG,KAAK;QACRmB,gBAAgB7B,iBAAiB,CAAC8B,OAAOC;gBACvCrB;oBAAAA,wBAAAA,MAAMmB,cAAc,cAApBnB,4CAAAA,2BAAAA,OAAuBoB,OAAO;gBAC5BE,iBAAiBD,KAAKC,eAAe;gBACrCC,OAAOF,KAAKG,WAAW;gBACvBC,MAAML,MAAMK,IAAI;gBAChBL;YACF;;QAEFM,cAAcpC,iBAAiB,CAAC8B,OAAOC;gBACrCrB;oBAAAA,sBAAAA,MAAM0B,YAAY,cAAlB1B,0CAAAA,yBAAAA,OAAqBoB,OAAO;gBAC1B,GAAGC,IAAI;gBACPI,MAAML,MAAMK,IAAI;gBAChBL;YACF;;QAEFV;QACAF;QACAmB,UAAU;QACVC,aAAa;IACf;IAEA,MAAM,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGC,4BAA4B/B,MAAMgC,QAAQ,EAAEzB;IACzE,OAAO;QACLG;QACAuB,YAAY,CAAC;QACbJ;QACAC,SAASZ,cAAcgB,IAAI,IAAIhB,cAAciB,QAAQ,GAAGL,UAAUM;QAClEnC;QACAM;QACA8B,UAAUnB,cAAcmB,QAAQ;QAChCC,YAAY9C,cAAcU,iBAAiBS;QAC3C4B,YAAY/C,cAAcoB;QAC1BR;QACAC;QACAmC,WAAWlC;QACX4B,MAAMhB,cAAcgB,IAAI;QACxBO,WAAWvB,cAAcuB,SAAS;QAClCC,eAAepD,iBAAiB8B,CAAAA;YAC9BF,cAAcwB,aAAa,CAACtB;YAC5BF,cAAcyB,OAAO,CAACvB,OAAO;QAC/B;QACAwB,gBAAgB1B,cAAc0B,cAAc;QAC5CC,eAAe3B,cAAc2B,aAAa;QAC1CC,yBAAyB5B,cAAc4B,uBAAuB;QAC9DC,gBAAgB7B,cAAc6B,cAAc;QAC5CzB,iBAAiBJ,cAAcI,eAAe;QAC9C0B,cAAc1D,iBAAiB,CAAC8B,OAAOC;YACrC,iGAAiG;YACjG,mFAAmF;YACnF,IACEH,cAAcI,eAAe,CAAC2B,QAAQ,CAAC5B,KAAKE,KAAK,KACjD,CAAClC,gBAAgBgB,kBAAkB6C,OAAO,EAAE9B,MAAM+B,MAAM,GACxD;oBACAnD;iBAAAA,wBAAAA,MAAMmB,cAAc,cAApBnB,4CAAAA,2BAAAA,OAAuBoB,OAAO;oBAC5BE,iBAAiBJ,cAAcI,eAAe;oBAC9CC,OAAOF,KAAKE,KAAK;oBACjBE,MAAML,MAAMK,IAAI;oBAChBL;gBACF;gBACA;YACF;YACAF,cAAc8B,YAAY,CAAC5B,OAAOC;QACpC;QACA+B,aAAalC,cAAckC,WAAW;QACtCT,SAASzB,cAAcyB,OAAO;QAC9BU,UAAUnC,cAAcmC,QAAQ;QAChC9B,OAAOL,cAAcK,KAAK;IAC5B;AACF,EAAE;AAEF;;;;;;;CAOC,GACD,OAAO,MAAM+B,wBAAwB,CAACtD;IACpC,MAAM,EAAEuD,WAAW,EAAEC,OAAO,QAAQ,EAAEC,aAAa,SAAS,EAAEC,SAAS,KAAK,EAAE,GAAG1D;IAEjF,MAAM,EAAEwC,SAAS,EAAEmB,YAAY,EAAE,GAAGhE,eAAe;QACjDiE,UAAU;QACVC,OAAO;QACPC,QAAQ;YAAEC,WAAW;YAAGC,UAAU;QAAE;QACpClE;QACAmE,iBAAiB;QACjB,GAAGvE,4BAA4B6D,YAAY;IAC7C;IAEA,MAAMW,YAAYnE,0BAA0BC;IAE5C,OAAO;QACL,GAAGkE,SAAS;QACZV;QACAC;QACAC;QACAlB;QACAD,YAAY/C,cAAc0E,UAAU3B,UAAU,EAAEoB;IAClD;AACF,EAAE;AAEF,MAAM5B,8BAA8B,CAACC,UAA2BzB;IAC9D,MAAM4D,gBAAgB/E,MAAMgF,QAAQ,CAACC,OAAO,CAACrC;IAE7C,IAAIsC,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,IAAIpE,WAAW;QACb,OAAO;YAAEsB,SAASsC,aAAa,CAAC,EAAE;QAAC;IACrC;IAEA,IAAItC,UAA0CO;IAC9C,IAAIN,UAA0CM;IAE9C,IAAI+B,cAAcM,MAAM,KAAK,GAAG;QAC9B5C,UAAUsC,aAAa,CAAC,EAAE;QAC1BrC,UAAUqC,aAAa,CAAC,EAAE;IAC5B,OAAO,IAAIA,cAAcM,MAAM,KAAK,GAAG;QACrC3C,UAAUqC,aAAa,CAAC,EAAE;IAC5B;IAEA,OAAO;QAAEtC;QAASC;IAAQ;AAC5B"}

package/lib/components/TagPicker/useTagPickerContextValues.js

@@ -1,5 +1,5 @@
 'use client';
-import * as React from 'react';
+import * as React from "react";
 export function useTagPickerContextValues(state) {
     const { onOptionClick, registerOption, selectedOptions, selectOption, value, triggerRef, secondaryActionRef, tagPickerGroupRef, targetRef, size, setValue, setOpen, setHasFocus, popoverRef, appearance, clearSelection, getOptionById, getOptionsMatchingValue, open, popoverId, disabled, noPopover } = state;
     return {

package/lib/components/TagPickerButton/TagPickerButton.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { useTagPickerButton_unstable } from './useTagPickerButton';
-import { renderTagPickerButton_unstable } from './renderTagPickerButton';
-import { useTagPickerButtonStyles_unstable } from './useTagPickerButtonStyles.styles';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useTagPickerButton_unstable } from "./useTagPickerButton.js";
+import { renderTagPickerButton_unstable } from "./renderTagPickerButton.js";
+import { useTagPickerButtonStyles_unstable } from "./useTagPickerButtonStyles.styles.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 /**
  * TagPickerButton component -
  * A TagPickerButton is an alternative to TagPickerInput that does not include an input field.

package/lib/components/TagPickerButton/TagPickerButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPickerButton/TagPickerButton.tsx"],"sourcesContent":["'use client';\n\nimport * 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"],"mappings":"AAAA;AAEA,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"}
+{"version":3,"sources":["../src/components/TagPickerButton/TagPickerButton.tsx"],"sourcesContent":["'use client';\n\nimport * 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"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,0BAAuB;AACnE,SAASC,8BAA8B,QAAQ,6BAA0B;AACzE,SAASC,iCAAiC,QAAQ,uCAAoC;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"}

package/lib/components/TagPickerButton/index.js

@@ -1,4 +1,4 @@
-export { TagPickerButton } from './TagPickerButton';
-export { renderTagPickerButton_unstable } from './renderTagPickerButton';
-export { useTagPickerButton_unstable, useTagPickerButtonBase_unstable } from './useTagPickerButton';
-export { tagPickerButtonClassNames, useTagPickerButtonStyles_unstable } from './useTagPickerButtonStyles.styles';
+export { TagPickerButton } from "./TagPickerButton.js";
+export { renderTagPickerButton_unstable } from "./renderTagPickerButton.js";
+export { useTagPickerButton_unstable, useTagPickerButtonBase_unstable } from "./useTagPickerButton.js";
+export { tagPickerButtonClassNames, useTagPickerButtonStyles_unstable } from "./useTagPickerButtonStyles.styles.js";

package/lib/components/TagPickerButton/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPickerButton/index.ts"],"sourcesContent":["export { TagPickerButton } from './TagPickerButton';\nexport type {\n  TagPickerButtonBaseProps,\n  TagPickerButtonBaseState,\n  TagPickerButtonProps,\n  TagPickerButtonSlots,\n  TagPickerButtonState,\n} from './TagPickerButton.types';\nexport { renderTagPickerButton_unstable } from './renderTagPickerButton';\nexport { useTagPickerButton_unstable, useTagPickerButtonBase_unstable } from './useTagPickerButton';\nexport { tagPickerButtonClassNames, useTagPickerButtonStyles_unstable } from './useTagPickerButtonStyles.styles';\n"],"names":["TagPickerButton","renderTagPickerButton_unstable","useTagPickerButton_unstable","useTagPickerButtonBase_unstable","tagPickerButtonClassNames","useTagPickerButtonStyles_unstable"],"mappings":"AAAA,SAASA,eAAe,QAAQ,oBAAoB;AAQpD,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,2BAA2B,EAAEC,+BAA+B,QAAQ,uBAAuB;AACpG,SAASC,yBAAyB,EAAEC,iCAAiC,QAAQ,oCAAoC"}
+{"version":3,"sources":["../src/components/TagPickerButton/index.ts"],"sourcesContent":["export { TagPickerButton } from './TagPickerButton';\nexport type {\n  TagPickerButtonBaseProps,\n  TagPickerButtonBaseState,\n  TagPickerButtonProps,\n  TagPickerButtonSlots,\n  TagPickerButtonState,\n} from './TagPickerButton.types';\nexport { renderTagPickerButton_unstable } from './renderTagPickerButton';\nexport { useTagPickerButton_unstable, useTagPickerButtonBase_unstable } from './useTagPickerButton';\nexport { tagPickerButtonClassNames, useTagPickerButtonStyles_unstable } from './useTagPickerButtonStyles.styles';\n"],"names":["TagPickerButton","renderTagPickerButton_unstable","useTagPickerButton_unstable","useTagPickerButtonBase_unstable","tagPickerButtonClassNames","useTagPickerButtonStyles_unstable"],"mappings":"AAAA,SAASA,eAAe,QAAQ,uBAAoB;AAQpD,SAASC,8BAA8B,QAAQ,6BAA0B;AACzE,SAASC,2BAA2B,EAAEC,+BAA+B,QAAQ,0BAAuB;AACpG,SAASC,yBAAyB,EAAEC,iCAAiC,QAAQ,uCAAoC"}

package/lib/components/TagPickerButton/renderTagPickerButton.js

@@ -1,5 +1,5 @@
   import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
+import { assertSlots } from "@fluentui/react-utilities";
 /**
  * Render the final JSX of PickerButton
  */ export const renderTagPickerButton_unstable = (state)=>{

package/lib/components/TagPickerButton/useTagPickerButton.js

@@ -1,7 +1,7 @@
 'use client';
-import { useActiveDescendantContext } from '@fluentui/react-aria';
-import { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';
-import { useButtonTriggerSlot } from '@fluentui/react-combobox';
+import { useActiveDescendantContext } from "@fluentui/react-aria";
+import { useTagPickerContext_unstable } from "../../contexts/TagPickerContext.js";
+import { useButtonTriggerSlot } from "@fluentui/react-combobox";
 /**
  * Create the base state required to render TagPickerButton, without design-only props.
  *

package/lib/components/TagPickerButton/useTagPickerButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPickerButton/useTagPickerButton.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useActiveDescendantContext } from '@fluentui/react-aria';\nimport type {\n  TagPickerButtonBaseProps,\n  TagPickerButtonBaseState,\n  TagPickerButtonProps,\n  TagPickerButtonState,\n} from './TagPickerButton.types';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { useButtonTriggerSlot } from '@fluentui/react-combobox';\n\n/**\n * Create the base state required to render TagPickerButton, without design-only props.\n *\n * @param props - props from this instance of TagPickerButton (without size, appearance)\n * @param ref - reference to root HTMLButtonElement of TagPickerButton\n */\nexport const useTagPickerButtonBase_unstable = (\n  props: TagPickerButtonBaseProps,\n  ref: React.Ref<HTMLButtonElement>,\n): TagPickerButtonBaseState => {\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:\n        value ||\n        // @ts-expect-error - FIXME: TS2339: Property 'placeholder' does not exist on type 'TagPickerButtonBaseProps'\n        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  return {\n    components: {\n      root: 'button',\n    },\n    root,\n    hasSelectedOption,\n  };\n};\n\n/**\n * Create the state required to render TagPickerButton.\n *\n * The returned state can be modified with hooks such as useTagPickerButtonStyles_unstable,\n * before being passed to renderTagPickerButton_unstable.\n *\n * @param props - props from this instance of TagPickerButton\n * @param ref - reference to root HTMLButtonElement of TagPickerButton\n */\nexport const useTagPickerButton_unstable = (\n  props: TagPickerButtonProps,\n  ref: React.Ref<HTMLButtonElement>,\n): TagPickerButtonState => {\n  const baseState = useTagPickerButtonBase_unstable(props, ref);\n  const size = useTagPickerContext_unstable(ctx => ctx.size);\n\n  return {\n    ...baseState,\n    size,\n  };\n};\n"],"names":["useActiveDescendantContext","useTagPickerContext_unstable","useButtonTriggerSlot","useTagPickerButtonBase_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","components","useTagPickerButton_unstable","baseState","size"],"mappings":"AAAA;AAGA,SAASA,0BAA0B,QAAQ,uBAAuB;AAOlE,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,oBAAoB,QAAQ,2BAA2B;AAEhE;;;;;CAKC,GACD,OAAO,MAAMC,kCAAkC,CAC7CC,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,UACEb,SACA,6GAA6G;YAC7GP,MAAMqB,WAAW;YACnB,iBAAiBf,OAAOK,YAAYW;YACpCrB;QACF;QACAsB,OAAO;YACLX;YACAN;YACAO;YACAC;YACAC;YACAS,aAAa;QACf;IACF;IAEA,OAAO;QACLC,YAAY;YACVT,MAAM;QACR;QACAA;QACAR;IACF;AACF,EAAE;AAEF;;;;;;;;CAQC,GACD,OAAO,MAAMkB,8BAA8B,CACzC1B,OACAC;IAEA,MAAM0B,YAAY5B,gCAAgCC,OAAOC;IACzD,MAAM2B,OAAO/B,6BAA6BQ,CAAAA,MAAOA,IAAIuB,IAAI;IAEzD,OAAO;QACL,GAAGD,SAAS;QACZC;IACF;AACF,EAAE"}
+{"version":3,"sources":["../src/components/TagPickerButton/useTagPickerButton.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { useActiveDescendantContext } from '@fluentui/react-aria';\nimport type {\n  TagPickerButtonBaseProps,\n  TagPickerButtonBaseState,\n  TagPickerButtonProps,\n  TagPickerButtonState,\n} from './TagPickerButton.types';\nimport { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';\nimport { useButtonTriggerSlot } from '@fluentui/react-combobox';\n\n/**\n * Create the base state required to render TagPickerButton, without design-only props.\n *\n * @param props - props from this instance of TagPickerButton (without size, appearance)\n * @param ref - reference to root HTMLButtonElement of TagPickerButton\n */\nexport const useTagPickerButtonBase_unstable = (\n  props: TagPickerButtonBaseProps,\n  ref: React.Ref<HTMLButtonElement>,\n): TagPickerButtonBaseState => {\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:\n        value ||\n        // @ts-expect-error - FIXME: TS2339: Property 'placeholder' does not exist on type 'TagPickerButtonBaseProps'\n        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  return {\n    components: {\n      root: 'button',\n    },\n    root,\n    hasSelectedOption,\n  };\n};\n\n/**\n * Create the state required to render TagPickerButton.\n *\n * The returned state can be modified with hooks such as useTagPickerButtonStyles_unstable,\n * before being passed to renderTagPickerButton_unstable.\n *\n * @param props - props from this instance of TagPickerButton\n * @param ref - reference to root HTMLButtonElement of TagPickerButton\n */\nexport const useTagPickerButton_unstable = (\n  props: TagPickerButtonProps,\n  ref: React.Ref<HTMLButtonElement>,\n): TagPickerButtonState => {\n  const baseState = useTagPickerButtonBase_unstable(props, ref);\n  const size = useTagPickerContext_unstable(ctx => ctx.size);\n\n  return {\n    ...baseState,\n    size,\n  };\n};\n"],"names":["useActiveDescendantContext","useTagPickerContext_unstable","useButtonTriggerSlot","useTagPickerButtonBase_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","components","useTagPickerButton_unstable","baseState","size"],"mappings":"AAAA;AAGA,SAASA,0BAA0B,QAAQ,uBAAuB;AAOlE,SAASC,4BAA4B,QAAQ,qCAAkC;AAC/E,SAASC,oBAAoB,QAAQ,2BAA2B;AAEhE;;;;;CAKC,GACD,OAAO,MAAMC,kCAAkC,CAC7CC,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,UACEb,SACA,6GAA6G;YAC7GP,MAAMqB,WAAW;YACnB,iBAAiBf,OAAOK,YAAYW;YACpCrB;QACF;QACAsB,OAAO;YACLX;YACAN;YACAO;YACAC;YACAC;YACAS,aAAa;QACf;IACF;IAEA,OAAO;QACLC,YAAY;YACVT,MAAM;QACR;QACAA;QACAR;IACF;AACF,EAAE;AAEF;;;;;;;;CAQC,GACD,OAAO,MAAMkB,8BAA8B,CACzC1B,OACAC;IAEA,MAAM0B,YAAY5B,gCAAgCC,OAAOC;IACzD,MAAM2B,OAAO/B,6BAA6BQ,CAAAA,MAAOA,IAAIuB,IAAI;IAEzD,OAAO;QACL,GAAGD,SAAS;QACZC;IACF;AACF,EAAE"}

package/lib/components/TagPickerButton/useTagPickerButtonStyles.styles.js

@@ -1,7 +1,7 @@
 'use client';
 
-import { __styles, mergeClasses, shorthands } from '@griffel/react';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
+import { __styles, mergeClasses, shorthands } from "@griffel/react";
+import { tokens, typographyStyles } from "@fluentui/react-theme";
 export const tagPickerButtonClassNames = {
   root: 'fui-TagPickerButton'
 };

package/lib/components/TagPickerButton/useTagPickerButtonStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","tagPickerButtonClassNames","root","useStyles","button","Bt984gj","sshi5w","De3pzq","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","B7ck84d","sj55zd","i8kkvl","Bceei9c","Bahqtrf","fsow6f","Bh6795r","Brovlpu","placeholder","medium","Be2twd7","Bhrd7zp","Bg96gwp","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","large","outline","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","disabled","Bcq6wej","Jcjdmf","sc4o1m","Bosien3","disabledText","hidden","mc9l5x","visuallyHidden","Bh84pgu","Bqenvij","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","B68tc82","Bmxbyg5","Bpg54ce","a9b677","qhf8xq","d","p","f","h","a","m","useTagPickerButtonStyles_unstable","state","styles","className","size","hasSelectedOption"],"sources":["useTagPickerButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const tagPickerButtonClassNames = {\n    root: 'fui-TagPickerButton'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    button: {\n        alignItems: 'center',\n        minHeight: '32px',\n        backgroundColor: tokens.colorTransparentBackground,\n        border: 'none',\n        boxSizing: 'border-box',\n        color: tokens.colorNeutralForeground1,\n        columnGap: tokens.spacingHorizontalXXS,\n        cursor: 'pointer',\n        fontFamily: tokens.fontFamilyBase,\n        textAlign: 'left',\n        flexGrow: 1,\n        '&:focus': {\n            outlineStyle: 'none'\n        }\n    },\n    placeholder: {\n        color: tokens.colorNeutralForeground4\n    },\n    // size variants\n    medium: {\n        ...typographyStyles.caption1,\n        padding: `3px ${tokens.spacingHorizontalSNudge} 3px ${`calc(${tokens.spacingHorizontalSNudge} + ${tokens.spacingHorizontalXXS})`}`\n    },\n    large: {\n        ...typographyStyles.body1,\n        padding: `5px ${tokens.spacingHorizontalMNudge} 5px ${`calc(${tokens.spacingHorizontalMNudge} + ${tokens.spacingHorizontalXXS})`}`\n    },\n    'extra-large': {\n        columnGap: tokens.spacingHorizontalSNudge,\n        ...typographyStyles.body2,\n        padding: `7px ${tokens.spacingHorizontalM} 7px ${`calc(${tokens.spacingHorizontalM} + ${tokens.spacingHorizontalSNudge})`}`\n    },\n    // appearance variants\n    outline: {\n        backgroundColor: tokens.colorNeutralBackground1,\n        border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n        borderBottomColor: tokens.colorNeutralStrokeAccessible\n    },\n    outlineInteractive: {\n        '&:hover': {\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n            borderBottomColor: tokens.colorNeutralStrokeAccessible\n        },\n        '&:active': {\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n            borderBottomColor: tokens.colorNeutralStrokeAccessible\n        }\n    },\n    underline: {\n        backgroundColor: tokens.colorTransparentBackground,\n        borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n        borderRadius: '0'\n    },\n    'filled-lighter': {\n        backgroundColor: tokens.colorNeutralBackground1,\n        border: `${tokens.strokeWidthThin} solid transparent`\n    },\n    'filled-darker': {\n        backgroundColor: tokens.colorNeutralBackground3,\n        border: `${tokens.strokeWidthThin} solid transparent`\n    },\n    invalid: {\n        ':not(:focus-within),:hover:not(:focus-within)': {\n            ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n        }\n    },\n    invalidUnderline: {\n        ':not(:focus-within),:hover:not(:focus-within)': {\n            borderBottomColor: tokens.colorPaletteRedBorder2\n        }\n    },\n    disabled: {\n        cursor: 'not-allowed',\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n        '@media (forced-colors: active)': {\n            ...shorthands.borderColor('GrayText')\n        }\n    },\n    disabledText: {\n        color: tokens.colorNeutralForegroundDisabled,\n        cursor: 'not-allowed'\n    },\n    hidden: {\n        display: 'none'\n    },\n    visuallyHidden: {\n        clip: 'rect(0px, 0px, 0px, 0px)',\n        height: '1px',\n        margin: '-1px',\n        overflow: 'hidden',\n        padding: '0px',\n        width: '1px',\n        position: 'absolute'\n    }\n});\n/**\n * Apply styling to the PickerButton slots based on the state\n */ export const useTagPickerButtonStyles_unstable = (state)=>{\n    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(tagPickerButtonClassNames.root, styles.button, styles[state.size], state.hasSelectedOption && styles.visuallyHidden, state.root.className);\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","tagPickerButtonClassNames","root","useStyles","button","Bt984gj","sshi5w","De3pzq","Bgfg5da","B9xav0g","oivjwe","Bn0qgzm","B4g9neb","zhjwy3","wvpqe5","ibv6hh","u1mtju","h3c5rm","vrafjx","Bekrc4i","i8vvqc","g2u3we","icvyot","B4j52fo","irswps","B7ck84d","sj55zd","i8kkvl","Bceei9c","Bahqtrf","fsow6f","Bh6795r","Brovlpu","placeholder","medium","Be2twd7","Bhrd7zp","Bg96gwp","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","large","outline","outlineInteractive","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","B6oc9vd","ak43y8","wmxk5l","B50zh58","underline","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","invalid","tvckwq","gk2u95","hhx65j","Bxowmz0","invalidUnderline","disabled","Bcq6wej","Jcjdmf","sc4o1m","Bosien3","disabledText","hidden","mc9l5x","visuallyHidden","Bh84pgu","Bqenvij","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","B68tc82","Bmxbyg5","Bpg54ce","a9b677","qhf8xq","d","p","f","h","a","m","useTagPickerButtonStyles_unstable","state","styles","className","size","hasSelectedOption"],"sources":["useTagPickerButtonStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses, shorthands } from \"@griffel/react\";\nimport { tokens, typographyStyles } from \"@fluentui/react-theme\";\nexport const tagPickerButtonClassNames = {\n    root: 'fui-TagPickerButton'\n};\n/**\n * Styles for the root slot\n */ const useStyles = makeStyles({\n    button: {\n        alignItems: 'center',\n        minHeight: '32px',\n        backgroundColor: tokens.colorTransparentBackground,\n        border: 'none',\n        boxSizing: 'border-box',\n        color: tokens.colorNeutralForeground1,\n        columnGap: tokens.spacingHorizontalXXS,\n        cursor: 'pointer',\n        fontFamily: tokens.fontFamilyBase,\n        textAlign: 'left',\n        flexGrow: 1,\n        '&:focus': {\n            outlineStyle: 'none'\n        }\n    },\n    placeholder: {\n        color: tokens.colorNeutralForeground4\n    },\n    // size variants\n    medium: {\n        ...typographyStyles.caption1,\n        padding: `3px ${tokens.spacingHorizontalSNudge} 3px ${`calc(${tokens.spacingHorizontalSNudge} + ${tokens.spacingHorizontalXXS})`}`\n    },\n    large: {\n        ...typographyStyles.body1,\n        padding: `5px ${tokens.spacingHorizontalMNudge} 5px ${`calc(${tokens.spacingHorizontalMNudge} + ${tokens.spacingHorizontalXXS})`}`\n    },\n    'extra-large': {\n        columnGap: tokens.spacingHorizontalSNudge,\n        ...typographyStyles.body2,\n        padding: `7px ${tokens.spacingHorizontalM} 7px ${`calc(${tokens.spacingHorizontalM} + ${tokens.spacingHorizontalSNudge})`}`\n    },\n    // appearance variants\n    outline: {\n        backgroundColor: tokens.colorNeutralBackground1,\n        border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n        borderBottomColor: tokens.colorNeutralStrokeAccessible\n    },\n    outlineInteractive: {\n        '&:hover': {\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n            borderBottomColor: tokens.colorNeutralStrokeAccessible\n        },\n        '&:active': {\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n            borderBottomColor: tokens.colorNeutralStrokeAccessible\n        }\n    },\n    underline: {\n        backgroundColor: tokens.colorTransparentBackground,\n        borderBottom: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStrokeAccessible}`,\n        borderRadius: '0'\n    },\n    'filled-lighter': {\n        backgroundColor: tokens.colorNeutralBackground1,\n        border: `${tokens.strokeWidthThin} solid transparent`\n    },\n    'filled-darker': {\n        backgroundColor: tokens.colorNeutralBackground3,\n        border: `${tokens.strokeWidthThin} solid transparent`\n    },\n    invalid: {\n        ':not(:focus-within),:hover:not(:focus-within)': {\n            ...shorthands.borderColor(tokens.colorPaletteRedBorder2)\n        }\n    },\n    invalidUnderline: {\n        ':not(:focus-within),:hover:not(:focus-within)': {\n            borderBottomColor: tokens.colorPaletteRedBorder2\n        }\n    },\n    disabled: {\n        cursor: 'not-allowed',\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n        '@media (forced-colors: active)': {\n            ...shorthands.borderColor('GrayText')\n        }\n    },\n    disabledText: {\n        color: tokens.colorNeutralForegroundDisabled,\n        cursor: 'not-allowed'\n    },\n    hidden: {\n        display: 'none'\n    },\n    visuallyHidden: {\n        clip: 'rect(0px, 0px, 0px, 0px)',\n        height: '1px',\n        margin: '-1px',\n        overflow: 'hidden',\n        padding: '0px',\n        width: '1px',\n        position: 'absolute'\n    }\n});\n/**\n * Apply styling to the PickerButton slots based on the state\n */ export const useTagPickerButtonStyles_unstable = (state)=>{\n    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(tagPickerButtonClassNames.root, styles.button, styles[state.size], state.hasSelectedOption && styles.visuallyHidden, state.root.className);\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/TagPickerButton/useTagPickerButtonStyles.styles.raw.js

@@ -1,6 +1,6 @@
 'use client';
-import { makeStyles, mergeClasses, shorthands } from '@griffel/react';
-import { tokens, typographyStyles } from '@fluentui/react-theme';
+import { makeStyles, mergeClasses, shorthands } from "@griffel/react";
+import { tokens, typographyStyles } from "@fluentui/react-theme";
 export const tagPickerButtonClassNames = {
     root: 'fui-TagPickerButton'
 };

package/lib/components/TagPickerControl/TagPickerControl.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { useTagPickerControl_unstable } from './useTagPickerControl';
-import { renderTagPickerControl_unstable } from './renderTagPickerControl';
-import { useTagPickerControlStyles_unstable } from './useTagPickerControlStyles.styles';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useTagPickerControl_unstable } from "./useTagPickerControl.js";
+import { renderTagPickerControl_unstable } from "./renderTagPickerControl.js";
+import { useTagPickerControlStyles_unstable } from "./useTagPickerControlStyles.styles.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 /**
  * TagPickerControl component -
  * A TagPickerControl is a composite component that controls actions and state for a TagPicker.

package/lib/components/TagPickerControl/TagPickerControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPickerControl/TagPickerControl.tsx"],"sourcesContent":["'use client';\n\nimport * 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"],"mappings":"AAAA;AAEA,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"}
+{"version":3,"sources":["../src/components/TagPickerControl/TagPickerControl.tsx"],"sourcesContent":["'use client';\n\nimport * 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"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,4BAA4B,QAAQ,2BAAwB;AACrE,SAASC,+BAA+B,QAAQ,8BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,wCAAqC;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"}

package/lib/components/TagPickerControl/index.js

@@ -1,4 +1,4 @@
-export { TagPickerControl } from './TagPickerControl';
-export { renderTagPickerControl_unstable } from './renderTagPickerControl';
-export { useTagPickerControl_unstable, useTagPickerControlBase_unstable } from './useTagPickerControl';
-export { iconSizes, tagPickerControlAsideWidthToken, tagPickerControlClassNames, useTagPickerControlStyles_unstable } from './useTagPickerControlStyles.styles';
+export { TagPickerControl } from "./TagPickerControl.js";
+export { renderTagPickerControl_unstable } from "./renderTagPickerControl.js";
+export { useTagPickerControl_unstable, useTagPickerControlBase_unstable } from "./useTagPickerControl.js";
+export { iconSizes, tagPickerControlAsideWidthToken, tagPickerControlClassNames, useTagPickerControlStyles_unstable } from "./useTagPickerControlStyles.styles.js";

package/lib/components/TagPickerControl/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/TagPickerControl/index.ts"],"sourcesContent":["export { TagPickerControl } from './TagPickerControl';\nexport type {\n  TagPickerControlBaseState,\n  TagPickerControlCSSProperties,\n  TagPickerControlInternalSlots,\n  TagPickerControlProps,\n  TagPickerControlSlots,\n  TagPickerControlState,\n} from './TagPickerControl.types';\nexport { renderTagPickerControl_unstable } from './renderTagPickerControl';\nexport { useTagPickerControl_unstable, useTagPickerControlBase_unstable } from './useTagPickerControl';\nexport {\n  iconSizes,\n  tagPickerControlAsideWidthToken,\n  tagPickerControlClassNames,\n  useTagPickerControlStyles_unstable,\n} from './useTagPickerControlStyles.styles';\n"],"names":["TagPickerControl","renderTagPickerControl_unstable","useTagPickerControl_unstable","useTagPickerControlBase_unstable","iconSizes","tagPickerControlAsideWidthToken","tagPickerControlClassNames","useTagPickerControlStyles_unstable"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,qBAAqB;AAStD,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,4BAA4B,EAAEC,gCAAgC,QAAQ,wBAAwB;AACvG,SACEC,SAAS,EACTC,+BAA+B,EAC/BC,0BAA0B,EAC1BC,kCAAkC,QAC7B,qCAAqC"}
+{"version":3,"sources":["../src/components/TagPickerControl/index.ts"],"sourcesContent":["export { TagPickerControl } from './TagPickerControl';\nexport type {\n  TagPickerControlBaseState,\n  TagPickerControlCSSProperties,\n  TagPickerControlInternalSlots,\n  TagPickerControlProps,\n  TagPickerControlSlots,\n  TagPickerControlState,\n} from './TagPickerControl.types';\nexport { renderTagPickerControl_unstable } from './renderTagPickerControl';\nexport { useTagPickerControl_unstable, useTagPickerControlBase_unstable } from './useTagPickerControl';\nexport {\n  iconSizes,\n  tagPickerControlAsideWidthToken,\n  tagPickerControlClassNames,\n  useTagPickerControlStyles_unstable,\n} from './useTagPickerControlStyles.styles';\n"],"names":["TagPickerControl","renderTagPickerControl_unstable","useTagPickerControl_unstable","useTagPickerControlBase_unstable","iconSizes","tagPickerControlAsideWidthToken","tagPickerControlClassNames","useTagPickerControlStyles_unstable"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,wBAAqB;AAStD,SAASC,+BAA+B,QAAQ,8BAA2B;AAC3E,SAASC,4BAA4B,EAAEC,gCAAgC,QAAQ,2BAAwB;AACvG,SACEC,SAAS,EACTC,+BAA+B,EAC/BC,0BAA0B,EAC1BC,kCAAkC,QAC7B,wCAAqC"}

package/lib/components/TagPickerControl/renderTagPickerControl.js

@@ -1,5 +1,5 @@
   import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
+import { assertSlots } from "@fluentui/react-utilities";
 /**
  * Render the final JSX of PickerControl
  */ export const renderTagPickerControl_unstable = (state)=>{

package/lib/components/TagPickerControl/useTagPickerControl.js

@@ -1,13 +1,13 @@
 'use client';
-import * as React from 'react';
-import { elementContains, getIntrinsicElementProps, slot, useEventCallback, useId, useMergedRefs } from '@fluentui/react-utilities';
-import { useFluent_unstable } from '@fluentui/react-shared-contexts';
-import { useTagPickerContext_unstable } from '../../contexts/TagPickerContext';
-import { ChevronDownRegular } from '@fluentui/react-icons';
-import { useResizeObserverRef } from '../../utils/useResizeObserverRef';
-import { tagPickerControlAsideWidthToken } from './useTagPickerControlStyles.styles';
-import { useFieldContext_unstable } from '@fluentui/react-field';
-import { useExpandLabel } from '../../utils/useExpandLabel';
+import * as React from "react";
+import { elementContains, getIntrinsicElementProps, slot, useEventCallback, useId, useMergedRefs } from "@fluentui/react-utilities";
+import { useFluent_unstable } from "@fluentui/react-shared-contexts";
+import { useTagPickerContext_unstable } from "../../contexts/TagPickerContext.js";
+import { ChevronDownRegular } from "@fluentui/react-icons";
+import { useResizeObserverRef } from "../../utils/useResizeObserverRef.js";
+import { tagPickerControlAsideWidthToken } from "./useTagPickerControlStyles.styles.js";
+import { useFieldContext_unstable } from "@fluentui/react-field";
+import { useExpandLabel } from "../../utils/useExpandLabel.js";
 /**
  * Create the base state required to render TagPickerControl, without design-only state.
  *