npm - @fluentui/react-tags - Versions diffs - 9.3.20 → 9.3.22 - Mend

@fluentui/react-tags 9.3.20 → 9.3.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (90) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,12 +1,38 @@
 # Change Log - @fluentui/react-tags
-This log was last generated on Tue, 15 Oct 2024 17:13:32 GMT and should not be manually modified.
+This log was last generated on Tue, 12 Nov 2024 09:30:43 GMT and should not be manually modified.
 <!-- Start content -->
+## [9.3.22](https://github.com/microsoft/fluentui/tree/@fluentui/react-tags_v9.3.22)
+Tue, 12 Nov 2024 09:30:43 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tags_v9.3.21..@fluentui/react-tags_v9.3.22)
+### Patches
+- fix: explicitly set box-sizing for tag icon ([PR #33203](https://github.com/microsoft/fluentui/pull/33203) by dmytrokirpa@microsoft.com)
+## [9.3.21](https://github.com/microsoft/fluentui/tree/@fluentui/react-tags_v9.3.21)
+Mon, 11 Nov 2024 10:00:59 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tags_v9.3.20..@fluentui/react-tags_v9.3.21)
+### Patches
+- chore: replace npm-scripts and just-scrtips with nx inferred tasks ([PR #33074](https://github.com/microsoft/fluentui/pull/33074) by martinhochel@microsoft.com)
+- Bump @fluentui/keyboard-keys to v9.0.8 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-aria to v9.13.9 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-avatar to v9.6.42 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.0.46 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.21.0 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-tabster to v9.23.0 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-theme to v9.1.22 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
+- Bump @fluentui/react-utilities to v9.18.17 ([PR #33238](https://github.com/microsoft/fluentui/pull/33238) by beachball)
 ## [9.3.20](https://github.com/microsoft/fluentui/tree/@fluentui/react-tags_v9.3.20)
-Tue, 15 Oct 2024 17:13:32 GMT
+Tue, 15 Oct 2024 17:17:53 GMT
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tags_v9.3.19..@fluentui/react-tags_v9.3.20)
 ### Patches

package/lib/InteractionTag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTag.ts"],"sourcesContent":["export * from './components/InteractionTag/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oCAAoC"}
1	+ {"version":3,"sources":["../src/InteractionTag.ts"],"sourcesContent":["export * from './components/InteractionTag/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,oCAAoC"}

package/lib/InteractionTagPrimary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTagPrimary.ts"],"sourcesContent":["export * from './components/InteractionTagPrimary/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,2CAA2C"}
1	+ {"version":3,"sources":["../src/InteractionTagPrimary.ts"],"sourcesContent":["export * from './components/InteractionTagPrimary/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,2CAA2C"}

package/lib/InteractionTagSecondary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTagSecondary.ts"],"sourcesContent":["export * from './components/InteractionTagSecondary/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,6CAA6C"}
1	+ {"version":3,"sources":["../src/InteractionTagSecondary.ts"],"sourcesContent":["export * from './components/InteractionTagSecondary/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,6CAA6C"}

package/lib/Tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Tag.ts"],"sourcesContent":["export * from './components/Tag/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,yBAAyB"}
1	+ {"version":3,"sources":["../src/Tag.ts"],"sourcesContent":["export * from './components/Tag/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,yBAAyB"}

package/lib/TagGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["TagGroup.ts"],"sourcesContent":["export * from './components/TagGroup/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,8BAA8B"}
1	+ {"version":3,"sources":["../src/TagGroup.ts"],"sourcesContent":["export * from './components/TagGroup/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,8BAA8B"}

package/lib/components/InteractionTag/InteractionTag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useInteractionTag_unstable } from './useInteractionTag';\nimport { renderInteractionTag_unstable } from './renderInteractionTag';\nimport { useInteractionTagStyles_unstable } from './useInteractionTagStyles.styles';\nimport { useInteractionTagContextValues_unstable } from './useInteractionTagContextValues';\nimport type { InteractionTagProps } from './InteractionTag.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n InteractionTag component - a visual representation of an attribute with primary and secondary actions.\n * Can have `InteractionTagPrimary` and `InteractionTagSecondary` components as its children.\n */\nexport const InteractionTag: ForwardRefComponent<InteractionTagProps> = React.forwardRef((props, ref) => {\n const state = useInteractionTag_unstable(props, ref);\n\n useInteractionTagStyles_unstable(state);\n\n useCustomStyleHook_unstable('useInteractionTagStyles_unstable')(state);\n\n return renderInteractionTag_unstable(state, useInteractionTagContextValues_unstable(state));\n});\n\nInteractionTag.displayName = 'InteractionTag';\n"],"names":["React","useInteractionTag_unstable","renderInteractionTag_unstable","useInteractionTagStyles_unstable","useInteractionTagContextValues_unstable","useCustomStyleHook_unstable","InteractionTag","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AACpF,SAASC,uCAAuC,QAAQ,mCAAmC;AAG3F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDN,iCAAiCO;IAEjCL,4BAA4B,oCAAoCK;IAEhE,OAAOR,8BAA8BQ,OAAON,wCAAwCM;AACtF,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/InteractionTag/InteractionTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useInteractionTag_unstable } from './useInteractionTag';\nimport { renderInteractionTag_unstable } from './renderInteractionTag';\nimport { useInteractionTagStyles_unstable } from './useInteractionTagStyles.styles';\nimport { useInteractionTagContextValues_unstable } from './useInteractionTagContextValues';\nimport type { InteractionTagProps } from './InteractionTag.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n InteractionTag component - a visual representation of an attribute with primary and secondary actions.\n * Can have `InteractionTagPrimary` and `InteractionTagSecondary` components as its children.\n */\nexport const InteractionTag: ForwardRefComponent<InteractionTagProps> = React.forwardRef((props, ref) => {\n const state = useInteractionTag_unstable(props, ref);\n\n useInteractionTagStyles_unstable(state);\n\n useCustomStyleHook_unstable('useInteractionTagStyles_unstable')(state);\n\n return renderInteractionTag_unstable(state, useInteractionTagContextValues_unstable(state));\n});\n\nInteractionTag.displayName = 'InteractionTag';\n"],"names":["React","useInteractionTag_unstable","renderInteractionTag_unstable","useInteractionTagStyles_unstable","useInteractionTagContextValues_unstable","useCustomStyleHook_unstable","InteractionTag","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,mCAAmC;AACpF,SAASC,uCAAuC,QAAQ,mCAAmC;AAG3F,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,+BAA2DN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQT,2BAA2BO,OAAOC;IAEhDN,iCAAiCO;IAEjCL,4BAA4B,oCAAoCK;IAEhE,OAAOR,8BAA8BQ,OAAON,wCAAwCM;AACtF,GAAG;AAEHJ,eAAeK,WAAW,GAAG"}

package/lib/components/InteractionTag/InteractionTag.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTag.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InteractionTagContextValue } from '../../contexts/interactionTagContext';\nimport { TagAppearance, TagShape, TagSize, TagValue, TagDismissHandler } from '../../utils/types';\n\nexport type InteractionTagContextValues = {\n interactionTag: InteractionTagContextValue;\n};\n\nexport type InteractionTagSlots = {\n root: NonNullable<Slot<'div'>>;\n};\n\n/*\n InteractionTag Props\n /\nexport type InteractionTagProps<Value = TagValue> = ComponentProps<Partial<InteractionTagSlots>> & {\n /\n An InteractionTag can have filled, outlined or brand experience.\n \n @default 'filled'\n /\n appearance?: TagAppearance;\n\n /\n An InteractionTag can show that it cannot be interacted with.\n \n @default false\n /\n disabled?: boolean;\n\n /\n An InteractionTag can have rounded or circular shape.\n \n @default 'round'\n /\n shape?: TagShape;\n\n /\n An InteractionTag has three sizes.\n \n @default 'medium'\n /\n size?: TagSize;\n\n /\n Unique value identifying the tag within a TagGroup\n /\n value?: Value;\n};\n\n/\n State used in rendering InteractionTag\n /\nexport type InteractionTagState<Value = TagValue> = ComponentState<InteractionTagSlots> &\n Required<Pick<InteractionTagProps, 'appearance' \| 'disabled' \| 'shape' \| 'size' \| 'value'>> & {\n /\n Event handler from TagGroup context that allows TagGroup to dismiss the tag\n /\n handleTagDismiss: TagDismissHandler<Value>;\n\n /\n id to assign to InteractionTagPrimary\n */\n interactionTagPrimaryId: string;\n };\n"],"names":[],"rangeMappings":";;","mappings":"AAkDA;;CAEC,GACD,WAWI"}
1	+ {"version":3,"sources":["../src/components/InteractionTag/InteractionTag.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InteractionTagContextValue } from '../../contexts/interactionTagContext';\nimport { TagAppearance, TagShape, TagSize, TagValue, TagDismissHandler } from '../../utils/types';\n\nexport type InteractionTagContextValues = {\n interactionTag: InteractionTagContextValue;\n};\n\nexport type InteractionTagSlots = {\n root: NonNullable<Slot<'div'>>;\n};\n\n/*\n InteractionTag Props\n /\nexport type InteractionTagProps<Value = TagValue> = ComponentProps<Partial<InteractionTagSlots>> & {\n /\n An InteractionTag can have filled, outlined or brand experience.\n \n @default 'filled'\n /\n appearance?: TagAppearance;\n\n /\n An InteractionTag can show that it cannot be interacted with.\n \n @default false\n /\n disabled?: boolean;\n\n /\n An InteractionTag can have rounded or circular shape.\n \n @default 'round'\n /\n shape?: TagShape;\n\n /\n An InteractionTag has three sizes.\n \n @default 'medium'\n /\n size?: TagSize;\n\n /\n Unique value identifying the tag within a TagGroup\n /\n value?: Value;\n};\n\n/\n State used in rendering InteractionTag\n /\nexport type InteractionTagState<Value = TagValue> = ComponentState<InteractionTagSlots> &\n Required<Pick<InteractionTagProps, 'appearance' \| 'disabled' \| 'shape' \| 'size' \| 'value'>> & {\n /\n Event handler from TagGroup context that allows TagGroup to dismiss the tag\n /\n handleTagDismiss: TagDismissHandler<Value>;\n\n /\n id to assign to InteractionTagPrimary\n */\n interactionTagPrimaryId: string;\n };\n"],"names":[],"rangeMappings":";;","mappings":"AAkDA;;CAEC,GACD,WAWI"}

package/lib/components/InteractionTag/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InteractionTag';\nexport * from './InteractionTag.types';\nexport * from './renderInteractionTag';\nexport * from './useInteractionTag';\nexport * from './useInteractionTagStyles.styles';\nexport * from './useInteractionTagContextValues';\n"],"names":[],"rangeMappings":";;;;;","mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC;AACjD,cAAc,mCAAmC"}
1	+ {"version":3,"sources":["../src/components/InteractionTag/index.ts"],"sourcesContent":["export * from './InteractionTag';\nexport * from './InteractionTag.types';\nexport * from './renderInteractionTag';\nexport * from './useInteractionTag';\nexport * from './useInteractionTagStyles.styles';\nexport * from './useInteractionTagContextValues';\n"],"names":[],"rangeMappings":";;;;;","mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,mCAAmC;AACjD,cAAc,mCAAmC"}

package/lib/components/InteractionTag/renderInteractionTag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["renderInteractionTag.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { InteractionTagState, InteractionTagSlots, InteractionTagContextValues } from './InteractionTag.types';\nimport { InteractionTagContextProvider } from '../../contexts/interactionTagContext';\n\n/\n Render the final JSX of InteractionTag\n */\nexport const renderInteractionTag_unstable = (\n state: InteractionTagState,\n contextValues: InteractionTagContextValues,\n) => {\n assertSlots<InteractionTagSlots>(state);\n\n return (\n <InteractionTagContextProvider value={contextValues.interactionTag}>\n <state.root />\n </InteractionTagContextProvider>\n );\n};\n"],"names":["assertSlots","InteractionTagContextProvider","renderInteractionTag_unstable","state","contextValues","value","interactionTag","root"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,6BAA6B,QAAQ,uCAAuC;AAErF;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEAJ,YAAiCG;IAEjC,qBACE,KAACF;QAA8BI,OAAOD,cAAcE,cAAc;kBAChE,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
1	+ {"version":3,"sources":["../src/components/InteractionTag/renderInteractionTag.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { InteractionTagState, InteractionTagSlots, InteractionTagContextValues } from './InteractionTag.types';\nimport { InteractionTagContextProvider } from '../../contexts/interactionTagContext';\n\n/\n Render the final JSX of InteractionTag\n */\nexport const renderInteractionTag_unstable = (\n state: InteractionTagState,\n contextValues: InteractionTagContextValues,\n) => {\n assertSlots<InteractionTagSlots>(state);\n\n return (\n <InteractionTagContextProvider value={contextValues.interactionTag}>\n <state.root />\n </InteractionTagContextProvider>\n );\n};\n"],"names":["assertSlots","InteractionTagContextProvider","renderInteractionTag_unstable","state","contextValues","value","interactionTag","root"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,6BAA6B,QAAQ,uCAAuC;AAErF;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEAJ,YAAiCG;IAEjC,qBACE,KAACF;QAA8BI,OAAOD,cAAcE,cAAc;kBAChE,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}

package/lib/components/InteractionTag/useInteractionTag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useInteractionTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { InteractionTagProps, InteractionTagState } from './InteractionTag.types';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\n\n/*\n Create the state required to render InteractionTag.\n \n The returned state can be modified with hooks such as useInteractionTagStyles_unstable,\n * before being passed to renderInteractionTag_unstable.\n \n @param props - props from this instance of InteractionTag\n * @param ref - reference to root HTMLDivElement of InteractionTag\n */\nexport const useInteractionTag_unstable = (\n props: InteractionTagProps,\n ref: React.Ref<HTMLDivElement>,\n): InteractionTagState => {\n const {\n handleTagDismiss,\n size: contextSize,\n disabled: contextDisabled,\n appearance: contextAppearance,\n } = useTagGroupContext_unstable();\n\n const id = useId('fui-InteractionTag-', props.id);\n\n const interactionTagPrimaryId = useId('fui-InteractionTagPrimary-');\n\n const {\n appearance = contextAppearance ?? 'filled',\n disabled = false,\n shape = 'rounded',\n size = contextSize,\n value = id,\n } = props;\n\n return {\n appearance,\n disabled: contextDisabled ? true : disabled,\n handleTagDismiss,\n interactionTagPrimaryId,\n shape,\n size,\n value,\n\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n disabled: contextDisabled ? true : disabled,\n id,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useId","slot","useTagGroupContext_unstable","useInteractionTag_unstable","props","ref","handleTagDismiss","size","contextSize","disabled","contextDisabled","appearance","contextAppearance","id","interactionTagPrimaryId","shape","value","components","root","always","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAElF,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EACJC,gBAAgB,EAChBC,MAAMC,WAAW,EACjBC,UAAUC,eAAe,EACzBC,YAAYC,iBAAiB,EAC9B,GAAGV;IAEJ,MAAMW,KAAKb,MAAM,uBAAuBI,MAAMS,EAAE;IAEhD,MAAMC,0BAA0Bd,MAAM;IAEtC,MAAM,EACJW,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CH,WAAW,KAAK,EAChBM,QAAQ,SAAS,EACjBR,OAAOC,WAAW,EAClBQ,QAAQH,EAAE,EACX,GAAGT;IAEJ,OAAO;QACLO;QACAF,UAAUC,kBAAkB,OAAOD;QACnCH;QACAQ;QACAC;QACAR;QACAS;QAEAC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMjB,KAAKkB,MAAM,CACfpB,yBAAyB,OAAO;YAC9BM;YACA,GAAGD,KAAK;YACRK,UAAUC,kBAAkB,OAAOD;YACnCI;QACF,IACA;YAAEO,aAAa;QAAM;IAEzB;AACF,EAAE"}
1	+ {"version":3,"sources":["../src/components/InteractionTag/useInteractionTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport type { InteractionTagProps, InteractionTagState } from './InteractionTag.types';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\n\n/*\n Create the state required to render InteractionTag.\n \n The returned state can be modified with hooks such as useInteractionTagStyles_unstable,\n * before being passed to renderInteractionTag_unstable.\n \n @param props - props from this instance of InteractionTag\n * @param ref - reference to root HTMLDivElement of InteractionTag\n */\nexport const useInteractionTag_unstable = (\n props: InteractionTagProps,\n ref: React.Ref<HTMLDivElement>,\n): InteractionTagState => {\n const {\n handleTagDismiss,\n size: contextSize,\n disabled: contextDisabled,\n appearance: contextAppearance,\n } = useTagGroupContext_unstable();\n\n const id = useId('fui-InteractionTag-', props.id);\n\n const interactionTagPrimaryId = useId('fui-InteractionTagPrimary-');\n\n const {\n appearance = contextAppearance ?? 'filled',\n disabled = false,\n shape = 'rounded',\n size = contextSize,\n value = id,\n } = props;\n\n return {\n appearance,\n disabled: contextDisabled ? true : disabled,\n handleTagDismiss,\n interactionTagPrimaryId,\n shape,\n size,\n value,\n\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n disabled: contextDisabled ? true : disabled,\n id,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useId","slot","useTagGroupContext_unstable","useInteractionTag_unstable","props","ref","handleTagDismiss","size","contextSize","disabled","contextDisabled","appearance","contextAppearance","id","interactionTagPrimaryId","shape","value","components","root","always","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAElF,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EACJC,gBAAgB,EAChBC,MAAMC,WAAW,EACjBC,UAAUC,eAAe,EACzBC,YAAYC,iBAAiB,EAC9B,GAAGV;IAEJ,MAAMW,KAAKb,MAAM,uBAAuBI,MAAMS,EAAE;IAEhD,MAAMC,0BAA0Bd,MAAM;IAEtC,MAAM,EACJW,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CH,WAAW,KAAK,EAChBM,QAAQ,SAAS,EACjBR,OAAOC,WAAW,EAClBQ,QAAQH,EAAE,EACX,GAAGT;IAEJ,OAAO;QACLO;QACAF,UAAUC,kBAAkB,OAAOD;QACnCH;QACAQ;QACAC;QACAR;QACAS;QAEAC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMjB,KAAKkB,MAAM,CACfpB,yBAAyB,OAAO;YAC9BM;YACA,GAAGD,KAAK;YACRK,UAAUC,kBAAkB,OAAOD;YACnCI;QACF,IACA;YAAEO,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/InteractionTag/useInteractionTagContextValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useInteractionTagContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport { InteractionTagState, InteractionTagContextValues } from './InteractionTag.types';\n\nexport function useInteractionTagContextValues_unstable(state: InteractionTagState): InteractionTagContextValues {\n const { appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value } = state;\n\n return {\n interactionTag: React.useMemo(\n () => ({ appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value }),\n [appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value],\n ),\n };\n}\n"],"names":["React","useInteractionTagContextValues_unstable","state","appearance","disabled","handleTagDismiss","interactionTagPrimaryId","shape","size","value","interactionTag","useMemo"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,wCAAwCC,KAA0B;IAChF,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,gBAAgB,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGP;IAEhG,OAAO;QACLQ,gBAAgBV,MAAMW,OAAO,CAC3B,IAAO,CAAA;gBAAER;gBAAYC;gBAAUC;gBAAkBC;gBAAyBC;gBAAOC;gBAAMC;YAAM,CAAA,GAC7F;YAACN;YAAYC;YAAUC;YAAkBC;YAAyBC;YAAOC;YAAMC;SAAM;IAEzF;AACF"}
1	+ {"version":3,"sources":["../src/components/InteractionTag/useInteractionTagContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport { InteractionTagState, InteractionTagContextValues } from './InteractionTag.types';\n\nexport function useInteractionTagContextValues_unstable(state: InteractionTagState): InteractionTagContextValues {\n const { appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value } = state;\n\n return {\n interactionTag: React.useMemo(\n () => ({ appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value }),\n [appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value],\n ),\n };\n}\n"],"names":["React","useInteractionTagContextValues_unstable","state","appearance","disabled","handleTagDismiss","interactionTagPrimaryId","shape","size","value","interactionTag","useMemo"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,SAASC,wCAAwCC,KAA0B;IAChF,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,gBAAgB,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGP;IAEhG,OAAO;QACLQ,gBAAgBV,MAAMW,OAAO,CAC3B,IAAO,CAAA;gBAAER;gBAAYC;gBAAUC;gBAAkBC;gBAAyBC;gBAAOC;gBAAMC;YAAM,CAAA,GAC7F;YAACN;YAAYC;YAAUC;YAAkBC;YAAyBC;YAAOC;YAAMC;SAAM;IAEzF;AACF"}

package/lib/components/InteractionTag/useInteractionTagStyles.styles.js CHANGED Viewed

@@ -49,5 +49,4 @@ export const useInteractionTagStyles_unstable = state => {
   } = state;
   state.root.className = mergeClasses(interactionTagClassNames.root, rootBaseClassName, rootStyles[shape], rootStyles[size], state.root.className);
   return state;
-};
-//# sourceMappingURL=useInteractionTagStyles.styles.js.map
+};

package/lib/components/InteractionTagPrimary/InteractionTagPrimary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTagPrimary.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useInteractionTagPrimary_unstable } from './useInteractionTagPrimary';\nimport { renderInteractionTagPrimary_unstable } from './renderInteractionTagPrimary';\nimport { useInteractionTagPrimaryStyles_unstable } from './useInteractionTagPrimaryStyles.styles';\nimport type { InteractionTagPrimaryProps } from './InteractionTagPrimary.types';\nimport { useTagAvatarContextValues_unstable } from '../../utils';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n InteractionTagPrimary component - used as the first child of the `InteractionTag` component.\n * Provides visual attributes such as media, icon, primary and secondary text, as well as the ability to attach a primary action.\n */\nexport const InteractionTagPrimary: ForwardRefComponent<InteractionTagPrimaryProps> = React.forwardRef((props, ref) => {\n const state = useInteractionTagPrimary_unstable(props, ref);\n\n useInteractionTagPrimaryStyles_unstable(state);\n\n useCustomStyleHook_unstable('useInteractionTagPrimaryStyles_unstable')(state);\n\n return renderInteractionTagPrimary_unstable(state, useTagAvatarContextValues_unstable(state));\n});\n\nInteractionTagPrimary.displayName = 'InteractionTagPrimary';\n"],"names":["React","useInteractionTagPrimary_unstable","renderInteractionTagPrimary_unstable","useInteractionTagPrimaryStyles_unstable","useTagAvatarContextValues_unstable","useCustomStyleHook_unstable","InteractionTagPrimary","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,oCAAoC,QAAQ,gCAAgC;AACrF,SAASC,uCAAuC,QAAQ,0CAA0C;AAElG,SAASC,kCAAkC,QAAQ,cAAc;AACjE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,sCAAyEN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC7G,MAAMC,QAAQT,kCAAkCO,OAAOC;IAEvDN,wCAAwCO;IAExCL,4BAA4B,2CAA2CK;IAEvE,OAAOR,qCAAqCQ,OAAON,mCAAmCM;AACxF,GAAG;AAEHJ,sBAAsBK,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/InteractionTagPrimary/InteractionTagPrimary.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useInteractionTagPrimary_unstable } from './useInteractionTagPrimary';\nimport { renderInteractionTagPrimary_unstable } from './renderInteractionTagPrimary';\nimport { useInteractionTagPrimaryStyles_unstable } from './useInteractionTagPrimaryStyles.styles';\nimport type { InteractionTagPrimaryProps } from './InteractionTagPrimary.types';\nimport { useTagAvatarContextValues_unstable } from '../../utils';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n InteractionTagPrimary component - used as the first child of the `InteractionTag` component.\n * Provides visual attributes such as media, icon, primary and secondary text, as well as the ability to attach a primary action.\n */\nexport const InteractionTagPrimary: ForwardRefComponent<InteractionTagPrimaryProps> = React.forwardRef((props, ref) => {\n const state = useInteractionTagPrimary_unstable(props, ref);\n\n useInteractionTagPrimaryStyles_unstable(state);\n\n useCustomStyleHook_unstable('useInteractionTagPrimaryStyles_unstable')(state);\n\n return renderInteractionTagPrimary_unstable(state, useTagAvatarContextValues_unstable(state));\n});\n\nInteractionTagPrimary.displayName = 'InteractionTagPrimary';\n"],"names":["React","useInteractionTagPrimary_unstable","renderInteractionTagPrimary_unstable","useInteractionTagPrimaryStyles_unstable","useTagAvatarContextValues_unstable","useCustomStyleHook_unstable","InteractionTagPrimary","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,iCAAiC,QAAQ,6BAA6B;AAC/E,SAASC,oCAAoC,QAAQ,gCAAgC;AACrF,SAASC,uCAAuC,QAAQ,0CAA0C;AAElG,SAASC,kCAAkC,QAAQ,cAAc;AACjE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;;CAGC,GACD,OAAO,MAAMC,sCAAyEN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IAC7G,MAAMC,QAAQT,kCAAkCO,OAAOC;IAEvDN,wCAAwCO;IAExCL,4BAA4B,2CAA2CK;IAEvE,OAAOR,qCAAqCQ,OAAON,mCAAmCM;AACxF,GAAG;AAEHJ,sBAAsBK,WAAW,GAAG"}

package/lib/components/InteractionTagPrimary/InteractionTagPrimary.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTagPrimary.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InteractionTagContextValue } from '../../contexts/interactionTagContext';\nimport { TagAvatarContextValues, UseTagAvatarContextValuesOptions } from '../../utils/useTagAvatarContextValues';\n\nexport type InteractionTagPrimaryContextValues = TagAvatarContextValues;\n\nexport type InteractionTagPrimarySlots = {\n root: NonNullable<Slot<'button'>>;\n\n /*\n Slot for a visual element, usually an avatar\n /\n media?: Slot<'span'>;\n\n /\n Slot for an icon\n /\n icon?: Slot<'span'>;\n\n /\n Main text for the InteractionTagPrimary button. Children of the root slot are automatically rendered here\n /\n primaryText: Slot<'span'>;\n\n /\n Secondary text that describes or complements the main text\n /\n secondaryText?: Slot<'span'>;\n};\n\n/\n InteractionTagPrimary Props\n /\nexport type InteractionTagPrimaryProps = ComponentProps<Partial<InteractionTagPrimarySlots>> & {\n /\n Whether the `InteractionTag` component has a `Secondary` component that provides an secondary action.\n * If `true`, the `InteractionTagPrimary` component will adjust its styles to accommodate the `Secondary` component.\n \n @default false\n /\n hasSecondaryAction?: boolean;\n};\n\n/\n State used in rendering InteractionTagPrimary\n */\nexport type InteractionTagPrimaryState = ComponentState<InteractionTagPrimarySlots> &\n Required<\n Pick<InteractionTagContextValue, 'appearance' \| 'disabled' \| 'shape' \| 'size'> &\n Pick<InteractionTagPrimaryProps, 'hasSecondaryAction'>\n > &\n UseTagAvatarContextValuesOptions;\n"],"names":[],"rangeMappings":";;","mappings":"AA2CA;;CAEC,GACD,WAKmC"}
1	+ {"version":3,"sources":["../src/components/InteractionTagPrimary/InteractionTagPrimary.types.ts"],"sourcesContent":["import { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InteractionTagContextValue } from '../../contexts/interactionTagContext';\nimport { TagAvatarContextValues, UseTagAvatarContextValuesOptions } from '../../utils/useTagAvatarContextValues';\n\nexport type InteractionTagPrimaryContextValues = TagAvatarContextValues;\n\nexport type InteractionTagPrimarySlots = {\n root: NonNullable<Slot<'button'>>;\n\n /*\n Slot for a visual element, usually an avatar\n /\n media?: Slot<'span'>;\n\n /\n Slot for an icon\n /\n icon?: Slot<'span'>;\n\n /\n Main text for the InteractionTagPrimary button. Children of the root slot are automatically rendered here\n /\n primaryText: Slot<'span'>;\n\n /\n Secondary text that describes or complements the main text\n /\n secondaryText?: Slot<'span'>;\n};\n\n/\n InteractionTagPrimary Props\n /\nexport type InteractionTagPrimaryProps = ComponentProps<Partial<InteractionTagPrimarySlots>> & {\n /\n Whether the `InteractionTag` component has a `Secondary` component that provides an secondary action.\n * If `true`, the `InteractionTagPrimary` component will adjust its styles to accommodate the `Secondary` component.\n \n @default false\n /\n hasSecondaryAction?: boolean;\n};\n\n/\n State used in rendering InteractionTagPrimary\n */\nexport type InteractionTagPrimaryState = ComponentState<InteractionTagPrimarySlots> &\n Required<\n Pick<InteractionTagContextValue, 'appearance' \| 'disabled' \| 'shape' \| 'size'> &\n Pick<InteractionTagPrimaryProps, 'hasSecondaryAction'>\n > &\n UseTagAvatarContextValuesOptions;\n"],"names":[],"rangeMappings":";;","mappings":"AA2CA;;CAEC,GACD,WAKmC"}

package/lib/components/InteractionTagPrimary/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InteractionTagPrimary';\nexport * from './InteractionTagPrimary.types';\nexport * from './renderInteractionTagPrimary';\nexport * from './useInteractionTagPrimary';\nexport * from './useInteractionTagPrimaryStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,0BAA0B;AACxC,cAAc,gCAAgC;AAC9C,cAAc,gCAAgC;AAC9C,cAAc,6BAA6B;AAC3C,cAAc,0CAA0C"}
1	+ {"version":3,"sources":["../src/components/InteractionTagPrimary/index.ts"],"sourcesContent":["export * from './InteractionTagPrimary';\nexport * from './InteractionTagPrimary.types';\nexport * from './renderInteractionTagPrimary';\nexport * from './useInteractionTagPrimary';\nexport * from './useInteractionTagPrimaryStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,0BAA0B;AACxC,cAAc,gCAAgC;AAC9C,cAAc,gCAAgC;AAC9C,cAAc,6BAA6B;AAC3C,cAAc,0CAA0C"}

package/lib/components/InteractionTagPrimary/renderInteractionTagPrimary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["renderInteractionTagPrimary.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type {\n InteractionTagPrimaryState,\n InteractionTagPrimarySlots,\n InteractionTagPrimaryContextValues,\n} from './InteractionTagPrimary.types';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n\n/\n Render the final JSX of InteractionTagPrimary\n */\nexport const renderInteractionTagPrimary_unstable = (\n state: InteractionTagPrimaryState,\n contextValues: InteractionTagPrimaryContextValues,\n) => {\n assertSlots<InteractionTagPrimarySlots>(state);\n\n return (\n <state.root>\n {state.media && (\n <AvatarContextProvider value={contextValues.avatar}>\n <state.media />\n </AvatarContextProvider>\n )}\n {state.icon && <state.icon />}\n {state.primaryText && <state.primaryText />}\n {state.secondaryText && <state.secondaryText />}\n </state.root>\n );\n};\n"],"names":["assertSlots","AvatarContextProvider","renderInteractionTagPrimary_unstable","state","contextValues","root","media","value","avatar","icon","primaryText","secondaryText"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAMxD,SAASC,qBAAqB,QAAQ,yBAAyB;AAE/D;;CAEC,GACD,OAAO,MAAMC,uCAAuC,CAClDC,OACAC;IAEAJ,YAAwCG;IAExC,qBACE,MAACA,MAAME,IAAI;;YACRF,MAAMG,KAAK,kBACV,KAACL;gBAAsBM,OAAOH,cAAcI,MAAM;0BAChD,cAAA,KAACL,MAAMG,KAAK;;YAGfH,MAAMM,IAAI,kBAAI,KAACN,MAAMM,IAAI;YACzBN,MAAMO,WAAW,kBAAI,KAACP,MAAMO,WAAW;YACvCP,MAAMQ,aAAa,kBAAI,KAACR,MAAMQ,aAAa;;;AAGlD,EAAE"}
1	+ {"version":3,"sources":["../src/components/InteractionTagPrimary/renderInteractionTagPrimary.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type {\n InteractionTagPrimaryState,\n InteractionTagPrimarySlots,\n InteractionTagPrimaryContextValues,\n} from './InteractionTagPrimary.types';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n\n/\n Render the final JSX of InteractionTagPrimary\n */\nexport const renderInteractionTagPrimary_unstable = (\n state: InteractionTagPrimaryState,\n contextValues: InteractionTagPrimaryContextValues,\n) => {\n assertSlots<InteractionTagPrimarySlots>(state);\n\n return (\n <state.root>\n {state.media && (\n <AvatarContextProvider value={contextValues.avatar}>\n <state.media />\n </AvatarContextProvider>\n )}\n {state.icon && <state.icon />}\n {state.primaryText && <state.primaryText />}\n {state.secondaryText && <state.secondaryText />}\n </state.root>\n );\n};\n"],"names":["assertSlots","AvatarContextProvider","renderInteractionTagPrimary_unstable","state","contextValues","root","media","value","avatar","icon","primaryText","secondaryText"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAMxD,SAASC,qBAAqB,QAAQ,yBAAyB;AAE/D;;CAEC,GACD,OAAO,MAAMC,uCAAuC,CAClDC,OACAC;IAEAJ,YAAwCG;IAExC,qBACE,MAACA,MAAME,IAAI;;YACRF,MAAMG,KAAK,kBACV,KAACL;gBAAsBM,OAAOH,cAAcI,MAAM;0BAChD,cAAA,KAACL,MAAMG,KAAK;;YAGfH,MAAMM,IAAI,kBAAI,KAACN,MAAMM,IAAI;YACzBN,MAAMO,WAAW,kBAAI,KAACP,MAAMO,WAAW;YACvCP,MAAMQ,aAAa,kBAAI,KAACR,MAAMQ,aAAa;;;AAGlD,EAAE"}

package/lib/components/InteractionTagPrimary/useInteractionTagPrimary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useInteractionTagPrimary.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { InteractionTagPrimaryProps, InteractionTagPrimaryState } from './InteractionTagPrimary.types';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\n\nconst avatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16,\n} as const;\n\nconst avatarShapeMap = {\n rounded: 'square',\n circular: 'circular',\n} as const;\n\n/*\n Create the state required to render InteractionTagPrimary.\n \n The returned state can be modified with hooks such as useInteractionTagPrimaryStyles_unstable,\n * before being passed to renderInteractionTagPrimary_unstable.\n \n @param props - props from this instance of InteractionTagPrimary\n * @param ref - reference to root HTMLButtonElement of InteractionTagPrimary\n */\nexport const useInteractionTagPrimary_unstable = (\n props: InteractionTagPrimaryProps,\n ref: React.Ref<HTMLButtonElement>,\n): InteractionTagPrimaryState => {\n const { appearance, disabled, interactionTagPrimaryId, shape, size } = useInteractionTagContext_unstable();\n const { hasSecondaryAction = false } = props;\n\n return {\n appearance,\n avatarShape: avatarShapeMap[shape],\n avatarSize: avatarSizeMap[size],\n disabled,\n hasSecondaryAction,\n shape,\n size,\n\n components: {\n root: 'button',\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span',\n },\n\n root: slot.always(\n getIntrinsicElementProps('button', {\n ref,\n disabled,\n id: interactionTagPrimaryId,\n ...props,\n }),\n { elementType: 'button' },\n ),\n\n media: slot.optional(props.media, { elementType: 'span' }),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n primaryText: slot.optional(props.primaryText, {\n renderByDefault: true,\n defaultProps: {\n children: props.children,\n },\n elementType: 'span',\n }),\n secondaryText: slot.optional(props.secondaryText, { elementType: 'span' }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useInteractionTagContext_unstable","avatarSizeMap","medium","small","avatarShapeMap","rounded","circular","useInteractionTagPrimary_unstable","props","ref","appearance","disabled","interactionTagPrimaryId","shape","size","hasSecondaryAction","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","always","id","elementType","optional","renderByDefault","defaultProps","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,iCAAiC,QAAQ,uCAAuC;AAEzF,MAAMC,gBAAgB;IACpBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACjB;AAEA,MAAMC,iBAAiB;IACrBC,SAAS;IACTC,UAAU;AACZ;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oCAAoC,CAC/CC,OACAC;IAEA,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGd;IACvE,MAAM,EAAEe,qBAAqB,KAAK,EAAE,GAAGP;IAEvC,OAAO;QACLE;QACAM,aAAaZ,cAAc,CAACS,MAAM;QAClCI,YAAYhB,aAAa,CAACa,KAAK;QAC/BH;QACAI;QACAF;QACAC;QAEAI,YAAY;YACVC,MAAM;YACNC,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;QACjB;QAEAJ,MAAMpB,KAAKyB,MAAM,CACf1B,yBAAyB,UAAU;YACjCW;YACAE;YACAc,IAAIb;YACJ,GAAGJ,KAAK;QACV,IACA;YAAEkB,aAAa;QAAS;QAG1BN,OAAOrB,KAAK4B,QAAQ,CAACnB,MAAMY,KAAK,EAAE;YAAEM,aAAa;QAAO;QACxDL,MAAMtB,KAAK4B,QAAQ,CAACnB,MAAMa,IAAI,EAAE;YAAEK,aAAa;QAAO;QACtDJ,aAAavB,KAAK4B,QAAQ,CAACnB,MAAMc,WAAW,EAAE;YAC5CM,iBAAiB;YACjBC,cAAc;gBACZC,UAAUtB,MAAMsB,QAAQ;YAC1B;YACAJ,aAAa;QACf;QACAH,eAAexB,KAAK4B,QAAQ,CAACnB,MAAMe,aAAa,EAAE;YAAEG,aAAa;QAAO;IAC1E;AACF,EAAE"}
1	+ {"version":3,"sources":["../src/components/InteractionTagPrimary/useInteractionTagPrimary.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { InteractionTagPrimaryProps, InteractionTagPrimaryState } from './InteractionTagPrimary.types';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\n\nconst avatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16,\n} as const;\n\nconst avatarShapeMap = {\n rounded: 'square',\n circular: 'circular',\n} as const;\n\n/*\n Create the state required to render InteractionTagPrimary.\n \n The returned state can be modified with hooks such as useInteractionTagPrimaryStyles_unstable,\n * before being passed to renderInteractionTagPrimary_unstable.\n \n @param props - props from this instance of InteractionTagPrimary\n * @param ref - reference to root HTMLButtonElement of InteractionTagPrimary\n */\nexport const useInteractionTagPrimary_unstable = (\n props: InteractionTagPrimaryProps,\n ref: React.Ref<HTMLButtonElement>,\n): InteractionTagPrimaryState => {\n const { appearance, disabled, interactionTagPrimaryId, shape, size } = useInteractionTagContext_unstable();\n const { hasSecondaryAction = false } = props;\n\n return {\n appearance,\n avatarShape: avatarShapeMap[shape],\n avatarSize: avatarSizeMap[size],\n disabled,\n hasSecondaryAction,\n shape,\n size,\n\n components: {\n root: 'button',\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span',\n },\n\n root: slot.always(\n getIntrinsicElementProps('button', {\n ref,\n disabled,\n id: interactionTagPrimaryId,\n ...props,\n }),\n { elementType: 'button' },\n ),\n\n media: slot.optional(props.media, { elementType: 'span' }),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n primaryText: slot.optional(props.primaryText, {\n renderByDefault: true,\n defaultProps: {\n children: props.children,\n },\n elementType: 'span',\n }),\n secondaryText: slot.optional(props.secondaryText, { elementType: 'span' }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useInteractionTagContext_unstable","avatarSizeMap","medium","small","avatarShapeMap","rounded","circular","useInteractionTagPrimary_unstable","props","ref","appearance","disabled","interactionTagPrimaryId","shape","size","hasSecondaryAction","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","always","id","elementType","optional","renderByDefault","defaultProps","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,iCAAiC,QAAQ,uCAAuC;AAEzF,MAAMC,gBAAgB;IACpBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACjB;AAEA,MAAMC,iBAAiB;IACrBC,SAAS;IACTC,UAAU;AACZ;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,oCAAoC,CAC/CC,OACAC;IAEA,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGd;IACvE,MAAM,EAAEe,qBAAqB,KAAK,EAAE,GAAGP;IAEvC,OAAO;QACLE;QACAM,aAAaZ,cAAc,CAACS,MAAM;QAClCI,YAAYhB,aAAa,CAACa,KAAK;QAC/BH;QACAI;QACAF;QACAC;QAEAI,YAAY;YACVC,MAAM;YACNC,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;QACjB;QAEAJ,MAAMpB,KAAKyB,MAAM,CACf1B,yBAAyB,UAAU;YACjCW;YACAE;YACAc,IAAIb;YACJ,GAAGJ,KAAK;QACV,IACA;YAAEkB,aAAa;QAAS;QAG1BN,OAAOrB,KAAK4B,QAAQ,CAACnB,MAAMY,KAAK,EAAE;YAAEM,aAAa;QAAO;QACxDL,MAAMtB,KAAK4B,QAAQ,CAACnB,MAAMa,IAAI,EAAE;YAAEK,aAAa;QAAO;QACtDJ,aAAavB,KAAK4B,QAAQ,CAACnB,MAAMc,WAAW,EAAE;YAC5CM,iBAAiB;YACjBC,cAAc;gBACZC,UAAUtB,MAAMsB,QAAQ;YAC1B;YACAJ,aAAa;QACf;QACAH,eAAexB,KAAK4B,QAAQ,CAACnB,MAAMe,aAAa,EAAE;YAAEG,aAAa;QAAO;IAC1E;AACF,EAAE"}

package/lib/components/InteractionTagPrimary/useInteractionTagPrimaryStyles.styles.js CHANGED Viewed

@@ -231,5 +231,4 @@ export const useInteractionTagPrimaryStyles_unstable = state => {
     state.secondaryText.className = mergeClasses(interactionTagPrimaryClassNames.secondaryText, secondaryTextBaseClassName, state.secondaryText.className);
   }
   return state;
-};
-//# sourceMappingURL=useInteractionTagPrimaryStyles.styles.js.map
+};

package/lib/components/InteractionTagSecondary/InteractionTagSecondary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTagSecondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useInteractionTagSecondary_unstable } from './useInteractionTagSecondary';\nimport { renderInteractionTagSecondary_unstable } from './renderInteractionTagSecondary';\nimport { useInteractionTagSecondaryStyles_unstable } from './useInteractionTagSecondaryStyles.styles';\nimport type { InteractionTagSecondaryProps } from './InteractionTagSecondary.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n InteractionTagSecondary component - used as the second child of the `InteractionTag` component and provides the secondary action, which is dismiss by default.\n */\nexport const InteractionTagSecondary: ForwardRefComponent<InteractionTagSecondaryProps> = React.forwardRef(\n (props, ref) => {\n const state = useInteractionTagSecondary_unstable(props, ref);\n\n useInteractionTagSecondaryStyles_unstable(state);\n\n useCustomStyleHook_unstable('useInteractionTagSecondaryStyles_unstable')(state);\n\n return renderInteractionTagSecondary_unstable(state);\n },\n);\n\nInteractionTagSecondary.displayName = 'InteractionTagSecondary';\n"],"names":["React","useInteractionTagSecondary_unstable","renderInteractionTagSecondary_unstable","useInteractionTagSecondaryStyles_unstable","useCustomStyleHook_unstable","InteractionTagSecondary","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,mCAAmC,QAAQ,+BAA+B;AACnF,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,yCAAyC,QAAQ,4CAA4C;AAEtG,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,wCAA6EL,MAAMM,UAAU,CACxG,CAACC,OAAOC;IACN,MAAMC,QAAQR,oCAAoCM,OAAOC;IAEzDL,0CAA0CM;IAE1CL,4BAA4B,6CAA6CK;IAEzE,OAAOP,uCAAuCO;AAChD,GACA;AAEFJ,wBAAwBK,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/InteractionTagSecondary/InteractionTagSecondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useInteractionTagSecondary_unstable } from './useInteractionTagSecondary';\nimport { renderInteractionTagSecondary_unstable } from './renderInteractionTagSecondary';\nimport { useInteractionTagSecondaryStyles_unstable } from './useInteractionTagSecondaryStyles.styles';\nimport type { InteractionTagSecondaryProps } from './InteractionTagSecondary.types';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n InteractionTagSecondary component - used as the second child of the `InteractionTag` component and provides the secondary action, which is dismiss by default.\n */\nexport const InteractionTagSecondary: ForwardRefComponent<InteractionTagSecondaryProps> = React.forwardRef(\n (props, ref) => {\n const state = useInteractionTagSecondary_unstable(props, ref);\n\n useInteractionTagSecondaryStyles_unstable(state);\n\n useCustomStyleHook_unstable('useInteractionTagSecondaryStyles_unstable')(state);\n\n return renderInteractionTagSecondary_unstable(state);\n },\n);\n\nInteractionTagSecondary.displayName = 'InteractionTagSecondary';\n"],"names":["React","useInteractionTagSecondary_unstable","renderInteractionTagSecondary_unstable","useInteractionTagSecondaryStyles_unstable","useCustomStyleHook_unstable","InteractionTagSecondary","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,mCAAmC,QAAQ,+BAA+B;AACnF,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,yCAAyC,QAAQ,4CAA4C;AAEtG,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,wCAA6EL,MAAMM,UAAU,CACxG,CAACC,OAAOC;IACN,MAAMC,QAAQR,oCAAoCM,OAAOC;IAEzDL,0CAA0CM;IAE1CL,4BAA4B,6CAA6CK;IAEzE,OAAOP,uCAAuCO;AAChD,GACA;AAEFJ,wBAAwBK,WAAW,GAAG"}

package/lib/components/InteractionTagSecondary/InteractionTagSecondary.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["InteractionTagSecondary.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InteractionTagContextValue } from '../../contexts/interactionTagContext';\n\nexport type InteractionTagSecondarySlots = {\n root: NonNullable<Slot<'button'>>;\n};\n\n/*\n InteractionTagSecondary Props\n /\nexport type InteractionTagSecondaryProps = ComponentProps<InteractionTagSecondarySlots>;\n\n/\n State used in rendering InteractionTagSecondary\n */\nexport type InteractionTagSecondaryState = ComponentState<InteractionTagSecondarySlots> &\n Required<Pick<InteractionTagContextValue, 'appearance' \| 'disabled' \| 'shape' \| 'size'>>;\n"],"names":[],"rangeMappings":";;","mappings":"AAYA;;CAEC,GACD,WAC2F"}
1	+ {"version":3,"sources":["../src/components/InteractionTagSecondary/InteractionTagSecondary.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { InteractionTagContextValue } from '../../contexts/interactionTagContext';\n\nexport type InteractionTagSecondarySlots = {\n root: NonNullable<Slot<'button'>>;\n};\n\n/*\n InteractionTagSecondary Props\n /\nexport type InteractionTagSecondaryProps = ComponentProps<InteractionTagSecondarySlots>;\n\n/\n State used in rendering InteractionTagSecondary\n */\nexport type InteractionTagSecondaryState = ComponentState<InteractionTagSecondarySlots> &\n Required<Pick<InteractionTagContextValue, 'appearance' \| 'disabled' \| 'shape' \| 'size'>>;\n"],"names":[],"rangeMappings":";;","mappings":"AAYA;;CAEC,GACD,WAC2F"}

package/lib/components/InteractionTagSecondary/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './InteractionTagSecondary';\nexport * from './InteractionTagSecondary.types';\nexport * from './renderInteractionTagSecondary';\nexport * from './useInteractionTagSecondary';\nexport * from './useInteractionTagSecondaryStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,4BAA4B;AAC1C,cAAc,kCAAkC;AAChD,cAAc,kCAAkC;AAChD,cAAc,+BAA+B;AAC7C,cAAc,4CAA4C"}
1	+ {"version":3,"sources":["../src/components/InteractionTagSecondary/index.ts"],"sourcesContent":["export * from './InteractionTagSecondary';\nexport * from './InteractionTagSecondary.types';\nexport * from './renderInteractionTagSecondary';\nexport * from './useInteractionTagSecondary';\nexport * from './useInteractionTagSecondaryStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,4BAA4B;AAC1C,cAAc,kCAAkC;AAChD,cAAc,kCAAkC;AAChD,cAAc,+BAA+B;AAC7C,cAAc,4CAA4C"}

package/lib/components/InteractionTagSecondary/renderInteractionTagSecondary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["renderInteractionTagSecondary.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { InteractionTagSecondaryState, InteractionTagSecondarySlots } from './InteractionTagSecondary.types';\n\n/\n Render the final JSX of InteractionTagSecondary\n */\nexport const renderInteractionTagSecondary_unstable = (state: InteractionTagSecondaryState) => {\n assertSlots<InteractionTagSecondarySlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderInteractionTagSecondary_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,yCAAyC,CAACC;IACrDF,YAA0CE;IAE1C,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1	+ {"version":3,"sources":["../src/components/InteractionTagSecondary/renderInteractionTagSecondary.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { InteractionTagSecondaryState, InteractionTagSecondarySlots } from './InteractionTagSecondary.types';\n\n/\n Render the final JSX of InteractionTagSecondary\n */\nexport const renderInteractionTagSecondary_unstable = (state: InteractionTagSecondaryState) => {\n assertSlots<InteractionTagSecondarySlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderInteractionTagSecondary_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,yCAAyC,CAACC;IACrDF,YAA0CE;IAE1C,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/InteractionTagSecondary/useInteractionTagSecondary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useInteractionTagSecondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, slot, useId } from '@fluentui/react-utilities';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport type { InteractionTagSecondaryProps, InteractionTagSecondaryState } from './InteractionTagSecondary.types';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\n\n/*\n Create the state required to render InteractionTagSecondary.\n \n The returned state can be modified with hooks such as useInteractionTagSecondaryStyles_unstable,\n * before being passed to renderInteractionTagSecondary_unstable.\n \n @param props - props from this instance of InteractionTagSecondary\n * @param ref - reference to root HTMLButtonElement of InteractionTagSecondary\n */\nexport const useInteractionTagSecondary_unstable = (\n props: InteractionTagSecondaryProps,\n ref: React.Ref<HTMLButtonElement>,\n): InteractionTagSecondaryState => {\n const { appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value } =\n useInteractionTagContext_unstable();\n\n const id = useId('fui-InteractionTagSecondary-', props.id);\n\n const onClick = useEventCallback((ev: React.MouseEvent<HTMLButtonElement>) => {\n props?.onClick?.(ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n const onKeyDown = useEventCallback((ev: React.KeyboardEvent<HTMLButtonElement>) => {\n props?.onKeyDown?.(ev);\n if (!ev.defaultPrevented && (ev.key === Delete \|\| ev.key === Backspace)) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n return {\n appearance,\n disabled,\n shape,\n size,\n components: {\n root: 'button',\n },\n\n root: slot.always(\n getIntrinsicElementProps('button', {\n children: <DismissRegular />,\n type: 'button',\n disabled,\n ref,\n 'aria-labelledby': `${interactionTagPrimaryId} ${id}`,\n ...props,\n id,\n onClick,\n onKeyDown,\n }),\n { elementType: 'button' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useEventCallback","slot","useId","Delete","Backspace","DismissRegular","useInteractionTagContext_unstable","useInteractionTagSecondary_unstable","props","ref","appearance","disabled","handleTagDismiss","interactionTagPrimaryId","shape","size","value","id","onClick","ev","defaultPrevented","onKeyDown","key","components","root","always","children","type","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,gBAAgB,EAAEC,IAAI,EAAEC,KAAK,QAAQ,4BAA4B;AACpG,SAASC,MAAM,EAAEC,SAAS,QAAQ,0BAA0B;AAC5D,SAASC,cAAc,QAAQ,wBAAwB;AAEvD,SAASC,iCAAiC,QAAQ,uCAAuC;AAEzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,sCAAsC,CACjDC,OACAC;IAEA,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,gBAAgB,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAC3FV;IAEF,MAAMW,KAAKf,MAAM,gCAAgCM,MAAMS,EAAE;IAEzD,MAAMC,UAAUlB,iBAAiB,CAACmB;YAChCX;QAAAA,kBAAAA,6BAAAA,iBAAAA,MAAOU,OAAO,cAAdV,qCAAAA,oBAAAA,OAAiBW;QACjB,IAAI,CAACA,GAAGC,gBAAgB,EAAE;YACxBR,6BAAAA,uCAAAA,iBAAmBO,IAAI;gBAAEH;YAAM;QACjC;IACF;IAEA,MAAMK,YAAYrB,iBAAiB,CAACmB;YAClCX;QAAAA,kBAAAA,6BAAAA,mBAAAA,MAAOa,SAAS,cAAhBb,uCAAAA,sBAAAA,OAAmBW;QACnB,IAAI,CAACA,GAAGC,gBAAgB,IAAKD,CAAAA,GAAGG,GAAG,KAAKnB,UAAUgB,GAAGG,GAAG,KAAKlB,SAAQ,GAAI;YACvEQ,6BAAAA,uCAAAA,iBAAmBO,IAAI;gBAAEH;YAAM;QACjC;IACF;IAEA,OAAO;QACLN;QACAC;QACAG;QACAC;QACAQ,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMvB,KAAKwB,MAAM,CACf1B,yBAAyB,UAAU;YACjC2B,wBAAU,oBAACrB;YACXsB,MAAM;YACNhB;YACAF;YACA,mBAAmB,CAAC,EAAEI,wBAAwB,CAAC,EAAEI,GAAG,CAAC;YACrD,GAAGT,KAAK;YACRS;YACAC;YACAG;QACF,IACA;YAAEO,aAAa;QAAS;IAE5B;AACF,EAAE"}
1	+ {"version":3,"sources":["../src/components/InteractionTagSecondary/useInteractionTagSecondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, slot, useId } from '@fluentui/react-utilities';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport type { InteractionTagSecondaryProps, InteractionTagSecondaryState } from './InteractionTagSecondary.types';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\n\n/*\n Create the state required to render InteractionTagSecondary.\n \n The returned state can be modified with hooks such as useInteractionTagSecondaryStyles_unstable,\n * before being passed to renderInteractionTagSecondary_unstable.\n \n @param props - props from this instance of InteractionTagSecondary\n * @param ref - reference to root HTMLButtonElement of InteractionTagSecondary\n */\nexport const useInteractionTagSecondary_unstable = (\n props: InteractionTagSecondaryProps,\n ref: React.Ref<HTMLButtonElement>,\n): InteractionTagSecondaryState => {\n const { appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value } =\n useInteractionTagContext_unstable();\n\n const id = useId('fui-InteractionTagSecondary-', props.id);\n\n const onClick = useEventCallback((ev: React.MouseEvent<HTMLButtonElement>) => {\n props?.onClick?.(ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n const onKeyDown = useEventCallback((ev: React.KeyboardEvent<HTMLButtonElement>) => {\n props?.onKeyDown?.(ev);\n if (!ev.defaultPrevented && (ev.key === Delete \|\| ev.key === Backspace)) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n return {\n appearance,\n disabled,\n shape,\n size,\n components: {\n root: 'button',\n },\n\n root: slot.always(\n getIntrinsicElementProps('button', {\n children: <DismissRegular />,\n type: 'button',\n disabled,\n ref,\n 'aria-labelledby': `${interactionTagPrimaryId} ${id}`,\n ...props,\n id,\n onClick,\n onKeyDown,\n }),\n { elementType: 'button' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useEventCallback","slot","useId","Delete","Backspace","DismissRegular","useInteractionTagContext_unstable","useInteractionTagSecondary_unstable","props","ref","appearance","disabled","handleTagDismiss","interactionTagPrimaryId","shape","size","value","id","onClick","ev","defaultPrevented","onKeyDown","key","components","root","always","children","type","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,gBAAgB,EAAEC,IAAI,EAAEC,KAAK,QAAQ,4BAA4B;AACpG,SAASC,MAAM,EAAEC,SAAS,QAAQ,0BAA0B;AAC5D,SAASC,cAAc,QAAQ,wBAAwB;AAEvD,SAASC,iCAAiC,QAAQ,uCAAuC;AAEzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,sCAAsC,CACjDC,OACAC;IAEA,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,gBAAgB,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAC3FV;IAEF,MAAMW,KAAKf,MAAM,gCAAgCM,MAAMS,EAAE;IAEzD,MAAMC,UAAUlB,iBAAiB,CAACmB;YAChCX;QAAAA,kBAAAA,6BAAAA,iBAAAA,MAAOU,OAAO,cAAdV,qCAAAA,oBAAAA,OAAiBW;QACjB,IAAI,CAACA,GAAGC,gBAAgB,EAAE;YACxBR,6BAAAA,uCAAAA,iBAAmBO,IAAI;gBAAEH;YAAM;QACjC;IACF;IAEA,MAAMK,YAAYrB,iBAAiB,CAACmB;YAClCX;QAAAA,kBAAAA,6BAAAA,mBAAAA,MAAOa,SAAS,cAAhBb,uCAAAA,sBAAAA,OAAmBW;QACnB,IAAI,CAACA,GAAGC,gBAAgB,IAAKD,CAAAA,GAAGG,GAAG,KAAKnB,UAAUgB,GAAGG,GAAG,KAAKlB,SAAQ,GAAI;YACvEQ,6BAAAA,uCAAAA,iBAAmBO,IAAI;gBAAEH;YAAM;QACjC;IACF;IAEA,OAAO;QACLN;QACAC;QACAG;QACAC;QACAQ,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMvB,KAAKwB,MAAM,CACf1B,yBAAyB,UAAU;YACjC2B,wBAAU,oBAACrB;YACXsB,MAAM;YACNhB;YACAF;YACA,mBAAmB,CAAC,EAAEI,wBAAwB,CAAC,EAAEI,GAAG,CAAC;YACrD,GAAGT,KAAK;YACRS;YACAC;YACAG;QACF,IACA;YAAEO,aAAa;QAAS;IAE5B;AACF,EAAE"}

package/lib/components/InteractionTagSecondary/useInteractionTagSecondaryStyles.styles.js CHANGED Viewed

@@ -124,5 +124,4 @@ export const useInteractionTagSecondaryStyles_unstable = state => {
   } = state;
   state.root.className = mergeClasses(interactionTagSecondaryClassNames.root, rootBaseClassName, state.disabled ? rootDisabledStyles[appearance] : rootStyles[appearance], rootStyles[shape], rootStyles[size], state.root.className);
   return state;
-};
-//# sourceMappingURL=useInteractionTagSecondaryStyles.styles.js.map
+};

package/lib/components/Tag/Tag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Tag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTag_unstable } from './useTag';\nimport { renderTag_unstable } from './renderTag';\nimport { useTagStyles_unstable } from './useTagStyles.styles';\nimport type { TagProps } from './Tag.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTagAvatarContextValues_unstable } from '../../utils';\n\n/*\n Tag component - a visual representation of an attribute.\n * Provides visual attributes such as media, icon, primary and secondary text, as well as the ability to attach an action (by default it is dismiss)\n */\nexport const Tag: ForwardRefComponent<TagProps> = React.forwardRef((props, ref) => {\n const state = useTag_unstable(props, ref);\n\n useTagStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTagStyles_unstable')(state);\n\n return renderTag_unstable(state, useTagAvatarContextValues_unstable(state));\n});\n\nTag.displayName = 'Tag';\n"],"names":["React","useTag_unstable","renderTag_unstable","useTagStyles_unstable","useCustomStyleHook_unstable","useTagAvatarContextValues_unstable","Tag","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,eAAe,QAAQ,WAAW;AAC3C,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,qBAAqB,QAAQ,wBAAwB;AAG9D,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,kCAAkC,QAAQ,cAAc;AAEjE;;;CAGC,GACD,OAAO,MAAMC,oBAAqCN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACzE,MAAMC,QAAQT,gBAAgBO,OAAOC;IAErCN,sBAAsBO;IAEtBN,4BAA4B,yBAAyBM;IAErD,OAAOR,mBAAmBQ,OAAOL,mCAAmCK;AACtE,GAAG;AAEHJ,IAAIK,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/Tag/Tag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTag_unstable } from './useTag';\nimport { renderTag_unstable } from './renderTag';\nimport { useTagStyles_unstable } from './useTagStyles.styles';\nimport type { TagProps } from './Tag.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTagAvatarContextValues_unstable } from '../../utils';\n\n/*\n Tag component - a visual representation of an attribute.\n * Provides visual attributes such as media, icon, primary and secondary text, as well as the ability to attach an action (by default it is dismiss)\n */\nexport const Tag: ForwardRefComponent<TagProps> = React.forwardRef((props, ref) => {\n const state = useTag_unstable(props, ref);\n\n useTagStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTagStyles_unstable')(state);\n\n return renderTag_unstable(state, useTagAvatarContextValues_unstable(state));\n});\n\nTag.displayName = 'Tag';\n"],"names":["React","useTag_unstable","renderTag_unstable","useTagStyles_unstable","useCustomStyleHook_unstable","useTagAvatarContextValues_unstable","Tag","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,eAAe,QAAQ,WAAW;AAC3C,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,qBAAqB,QAAQ,wBAAwB;AAG9D,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,kCAAkC,QAAQ,cAAc;AAEjE;;;CAGC,GACD,OAAO,MAAMC,oBAAqCN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACzE,MAAMC,QAAQT,gBAAgBO,OAAOC;IAErCN,sBAAsBO;IAEtBN,4BAA4B,yBAAyBM;IAErD,OAAOR,mBAAmBQ,OAAOL,mCAAmCK;AACtE,GAAG;AAEHJ,IAAIK,WAAW,GAAG"}

package/lib/components/Tag/Tag.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Tag.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TagAppearance, TagShape, TagSize } from '../../utils/types';\nimport { TagAvatarContextValues, UseTagAvatarContextValuesOptions } from '../../utils/useTagAvatarContextValues';\n\nexport type TagContextValues = TagAvatarContextValues;\n\nexport type TagSlots = {\n root: NonNullable<Slot<'button', 'span'>>;\n\n /*\n Slot for a visual element, usually an avatar\n /\n media?: Slot<'span'>;\n\n /\n Slot for an icon\n /\n icon?: Slot<'span'>;\n\n /\n Main text for the Tag. Children of the root slot are automatically rendered here\n /\n primaryText: Slot<'span'>;\n\n /\n Secondary text that describes or complements the main text\n /\n secondaryText?: Slot<'span'>;\n\n /\n Slot for the dismiss icon\n /\n dismissIcon?: Slot<'span'>;\n};\n\n/\n Tag Props\n /\nexport type TagProps<Value = string> = ComponentProps<Partial<TagSlots>> & {\n /\n A Tag can have filled, outlined or brand experience.\n \n @default 'filled'\n /\n appearance?: TagAppearance;\n\n /\n A Tag can show that it cannot be interacted with.\n \n @default false\n /\n disabled?: boolean;\n\n /\n A Tag can be dismissible\n \n @default false\n /\n dismissible?: boolean;\n\n /\n A Tag can have rounded or circular shape.\n \n @default 'round'\n /\n shape?: TagShape;\n\n /\n A Tag has three sizes.\n \n @default 'medium'\n /\n size?: TagSize;\n\n /\n Unique value identifying the tag within a TagGroup\n /\n value?: Value;\n};\n\n/\n State used in rendering Tag\n */\nexport type TagState = ComponentState<TagSlots> &\n Required<Pick<TagProps, 'appearance' \| 'disabled' \| 'dismissible' \| 'shape' \| 'size'>> &\n UseTagAvatarContextValuesOptions;\n"],"names":[],"rangeMappings":";;","mappings":"AAgFA;;CAEC,GACD,WAEmC"}
1	+ {"version":3,"sources":["../src/components/Tag/Tag.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TagAppearance, TagShape, TagSize } from '../../utils/types';\nimport { TagAvatarContextValues, UseTagAvatarContextValuesOptions } from '../../utils/useTagAvatarContextValues';\n\nexport type TagContextValues = TagAvatarContextValues;\n\nexport type TagSlots = {\n root: NonNullable<Slot<'button', 'span'>>;\n\n /*\n Slot for a visual element, usually an avatar\n /\n media?: Slot<'span'>;\n\n /\n Slot for an icon\n /\n icon?: Slot<'span'>;\n\n /\n Main text for the Tag. Children of the root slot are automatically rendered here\n /\n primaryText: Slot<'span'>;\n\n /\n Secondary text that describes or complements the main text\n /\n secondaryText?: Slot<'span'>;\n\n /\n Slot for the dismiss icon\n /\n dismissIcon?: Slot<'span'>;\n};\n\n/\n Tag Props\n /\nexport type TagProps<Value = string> = ComponentProps<Partial<TagSlots>> & {\n /\n A Tag can have filled, outlined or brand experience.\n \n @default 'filled'\n /\n appearance?: TagAppearance;\n\n /\n A Tag can show that it cannot be interacted with.\n \n @default false\n /\n disabled?: boolean;\n\n /\n A Tag can be dismissible\n \n @default false\n /\n dismissible?: boolean;\n\n /\n A Tag can have rounded or circular shape.\n \n @default 'round'\n /\n shape?: TagShape;\n\n /\n A Tag has three sizes.\n \n @default 'medium'\n /\n size?: TagSize;\n\n /\n Unique value identifying the tag within a TagGroup\n /\n value?: Value;\n};\n\n/\n State used in rendering Tag\n */\nexport type TagState = ComponentState<TagSlots> &\n Required<Pick<TagProps, 'appearance' \| 'disabled' \| 'dismissible' \| 'shape' \| 'size'>> &\n UseTagAvatarContextValuesOptions;\n"],"names":[],"rangeMappings":";;","mappings":"AAgFA;;CAEC,GACD,WAEmC"}

package/lib/components/Tag/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Tag';\nexport * from './Tag.types';\nexport * from './renderTag';\nexport * from './useTag';\nexport * from './useTagStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,cAAc;AAC5B,cAAc,WAAW;AACzB,cAAc,wBAAwB"}
1	+ {"version":3,"sources":["../src/components/Tag/index.ts"],"sourcesContent":["export * from './Tag';\nexport * from './Tag.types';\nexport * from './renderTag';\nexport * from './useTag';\nexport * from './useTagStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,cAAc;AAC5B,cAAc,WAAW;AACzB,cAAc,wBAAwB"}

package/lib/components/Tag/renderTag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["renderTag.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagState, TagSlots, TagContextValues } from './Tag.types';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n\n/\n Render the final JSX of Tag\n */\nexport const renderTag_unstable = (state: TagState, contextValues: TagContextValues) => {\n assertSlots<TagSlots>(state);\n\n return (\n <state.root>\n {state.media && (\n <AvatarContextProvider value={contextValues.avatar}>\n <state.media />\n </AvatarContextProvider>\n )}\n\n {state.icon && <state.icon />}\n {state.primaryText && <state.primaryText />}\n {state.secondaryText && <state.secondaryText />}\n {state.dismissIcon && state.dismissible && <state.dismissIcon />}\n </state.root>\n );\n};\n"],"names":["assertSlots","AvatarContextProvider","renderTag_unstable","state","contextValues","root","media","value","avatar","icon","primaryText","secondaryText","dismissIcon","dismissible"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,qBAAqB,QAAQ,yBAAyB;AAE/D;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAACC,OAAiBC;IAClDJ,YAAsBG;IAEtB,qBACE,MAACA,MAAME,IAAI;;YACRF,MAAMG,KAAK,kBACV,KAACL;gBAAsBM,OAAOH,cAAcI,MAAM;0BAChD,cAAA,KAACL,MAAMG,KAAK;;YAIfH,MAAMM,IAAI,kBAAI,KAACN,MAAMM,IAAI;YACzBN,MAAMO,WAAW,kBAAI,KAACP,MAAMO,WAAW;YACvCP,MAAMQ,aAAa,kBAAI,KAACR,MAAMQ,aAAa;YAC3CR,MAAMS,WAAW,IAAIT,MAAMU,WAAW,kBAAI,KAACV,MAAMS,WAAW;;;AAGnE,EAAE"}
1	+ {"version":3,"sources":["../src/components/Tag/renderTag.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagState, TagSlots, TagContextValues } from './Tag.types';\nimport { AvatarContextProvider } from '@fluentui/react-avatar';\n\n/\n Render the final JSX of Tag\n */\nexport const renderTag_unstable = (state: TagState, contextValues: TagContextValues) => {\n assertSlots<TagSlots>(state);\n\n return (\n <state.root>\n {state.media && (\n <AvatarContextProvider value={contextValues.avatar}>\n <state.media />\n </AvatarContextProvider>\n )}\n\n {state.icon && <state.icon />}\n {state.primaryText && <state.primaryText />}\n {state.secondaryText && <state.secondaryText />}\n {state.dismissIcon && state.dismissible && <state.dismissIcon />}\n </state.root>\n );\n};\n"],"names":["assertSlots","AvatarContextProvider","renderTag_unstable","state","contextValues","root","media","value","avatar","icon","primaryText","secondaryText","dismissIcon","dismissible"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,qBAAqB,QAAQ,yBAAyB;AAE/D;;CAEC,GACD,OAAO,MAAMC,qBAAqB,CAACC,OAAiBC;IAClDJ,YAAsBG;IAEtB,qBACE,MAACA,MAAME,IAAI;;YACRF,MAAMG,KAAK,kBACV,KAACL;gBAAsBM,OAAOH,cAAcI,MAAM;0BAChD,cAAA,KAACL,MAAMG,KAAK;;YAIfH,MAAMM,IAAI,kBAAI,KAACN,MAAMM,IAAI;YACzBN,MAAMO,WAAW,kBAAI,KAACP,MAAMO,WAAW;YACvCP,MAAMQ,aAAa,kBAAI,KAACR,MAAMQ,aAAa;YAC3CR,MAAMS,WAAW,IAAIT,MAAMU,WAAW,kBAAI,KAACV,MAAMS,WAAW;;;AAGnE,EAAE"}

package/lib/components/Tag/useTag.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, useId, slot } from '@fluentui/react-utilities';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport type { TagProps, TagState } from './Tag.types';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\n\nconst tagAvatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16,\n} as const;\n\nconst tagAvatarShapeMap = {\n rounded: 'square',\n circular: 'circular',\n} as const;\n\n/*\n Create the state required to render Tag.\n \n The returned state can be modified with hooks such as useTagStyles_unstable,\n * before being passed to renderTag_unstable.\n \n @param props - props from this instance of Tag\n * @param ref - reference to root HTMLSpanElement or HTMLButtonElement of Tag\n */\nexport const useTag_unstable = (props: TagProps, ref: React.Ref<HTMLSpanElement \| HTMLButtonElement>): TagState => {\n const {\n handleTagDismiss,\n size: contextSize,\n disabled: contextDisabled,\n appearance: contextAppearance,\n dismissible: contextDismissible,\n role: tagGroupRole,\n } = useTagGroupContext_unstable();\n\n const id = useId('fui-Tag', props.id);\n\n const {\n appearance = contextAppearance ?? 'filled',\n disabled = false,\n dismissible = contextDismissible ?? false,\n shape = 'rounded',\n size = contextSize,\n value = id,\n } = props;\n\n const dismissOnClick = useEventCallback((ev: React.MouseEvent<HTMLButtonElement>) => {\n props.onClick?.(ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n const dismissOnKeyDown = useEventCallback((ev: React.KeyboardEvent<HTMLButtonElement>) => {\n props?.onKeyDown?.(ev);\n if (!ev.defaultPrevented && (ev.key === Delete \|\| ev.key === Backspace)) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n const elementType = dismissible ? 'button' : 'span';\n\n return {\n appearance,\n avatarShape: tagAvatarShapeMap[shape],\n avatarSize: tagAvatarSizeMap[size],\n disabled: contextDisabled ? true : disabled,\n dismissible,\n shape,\n size,\n\n components: {\n root: elementType,\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span',\n dismissIcon: 'span',\n },\n\n root: slot.always(\n getIntrinsicElementProps(elementType, {\n ref,\n role: tagGroupRole === 'listbox' ? 'option' : undefined,\n ...props,\n disabled: contextDisabled ? true : disabled,\n id,\n ...(dismissible && { onClick: dismissOnClick, onKeyDown: dismissOnKeyDown }),\n }),\n { elementType },\n ),\n\n media: slot.optional(props.media, { elementType: 'span' }),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n primaryText: slot.optional(props.primaryText, {\n renderByDefault: true,\n defaultProps: {\n children: props.children,\n },\n elementType: 'span',\n }),\n secondaryText: slot.optional(props.secondaryText, { elementType: 'span' }),\n dismissIcon: slot.optional(props.dismissIcon, {\n renderByDefault: dismissible,\n defaultProps: {\n children: <DismissRegular />,\n },\n elementType: 'span',\n }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useEventCallback","useId","slot","DismissRegular","Delete","Backspace","useTagGroupContext_unstable","tagAvatarSizeMap","medium","small","tagAvatarShapeMap","rounded","circular","useTag_unstable","props","ref","handleTagDismiss","size","contextSize","disabled","contextDisabled","appearance","contextAppearance","dismissible","contextDismissible","role","tagGroupRole","id","shape","value","dismissOnClick","ev","onClick","defaultPrevented","dismissOnKeyDown","onKeyDown","key","elementType","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","dismissIcon","always","undefined","optional","renderByDefault","defaultProps","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1	+ {"version":3,"sources":["../src/components/Tag/useTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, useId, slot } from '@fluentui/react-utilities';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport type { TagProps, TagState } from './Tag.types';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\n\nconst tagAvatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16,\n} as const;\n\nconst tagAvatarShapeMap = {\n rounded: 'square',\n circular: 'circular',\n} as const;\n\n/*\n Create the state required to render Tag.\n \n The returned state can be modified with hooks such as useTagStyles_unstable,\n * before being passed to renderTag_unstable.\n \n @param props - props from this instance of Tag\n * @param ref - reference to root HTMLSpanElement or HTMLButtonElement of Tag\n */\nexport const useTag_unstable = (props: TagProps, ref: React.Ref<HTMLSpanElement \| HTMLButtonElement>): TagState => {\n const {\n handleTagDismiss,\n size: contextSize,\n disabled: contextDisabled,\n appearance: contextAppearance,\n dismissible: contextDismissible,\n role: tagGroupRole,\n } = useTagGroupContext_unstable();\n\n const id = useId('fui-Tag', props.id);\n\n const {\n appearance = contextAppearance ?? 'filled',\n disabled = false,\n dismissible = contextDismissible ?? false,\n shape = 'rounded',\n size = contextSize,\n value = id,\n } = props;\n\n const dismissOnClick = useEventCallback((ev: React.MouseEvent<HTMLButtonElement>) => {\n props.onClick?.(ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n const dismissOnKeyDown = useEventCallback((ev: React.KeyboardEvent<HTMLButtonElement>) => {\n props?.onKeyDown?.(ev);\n if (!ev.defaultPrevented && (ev.key === Delete \|\| ev.key === Backspace)) {\n handleTagDismiss?.(ev, { value });\n }\n });\n\n const elementType = dismissible ? 'button' : 'span';\n\n return {\n appearance,\n avatarShape: tagAvatarShapeMap[shape],\n avatarSize: tagAvatarSizeMap[size],\n disabled: contextDisabled ? true : disabled,\n dismissible,\n shape,\n size,\n\n components: {\n root: elementType,\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span',\n dismissIcon: 'span',\n },\n\n root: slot.always(\n getIntrinsicElementProps(elementType, {\n ref,\n role: tagGroupRole === 'listbox' ? 'option' : undefined,\n ...props,\n disabled: contextDisabled ? true : disabled,\n id,\n ...(dismissible && { onClick: dismissOnClick, onKeyDown: dismissOnKeyDown }),\n }),\n { elementType },\n ),\n\n media: slot.optional(props.media, { elementType: 'span' }),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n primaryText: slot.optional(props.primaryText, {\n renderByDefault: true,\n defaultProps: {\n children: props.children,\n },\n elementType: 'span',\n }),\n secondaryText: slot.optional(props.secondaryText, { elementType: 'span' }),\n dismissIcon: slot.optional(props.dismissIcon, {\n renderByDefault: dismissible,\n defaultProps: {\n children: <DismissRegular />,\n },\n elementType: 'span',\n }),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useEventCallback","useId","slot","DismissRegular","Delete","Backspace","useTagGroupContext_unstable","tagAvatarSizeMap","medium","small","tagAvatarShapeMap","rounded","circular","useTag_unstable","props","ref","handleTagDismiss","size","contextSize","disabled","contextDisabled","appearance","contextAppearance","dismissible","contextDismissible","role","tagGroupRole","id","shape","value","dismissOnClick","ev","onClick","defaultPrevented","dismissOnKeyDown","onKeyDown","key","elementType","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","dismissIcon","always","undefined","optional","renderByDefault","defaultProps","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/components/Tag/useTagStyles.styles.js CHANGED Viewed

@@ -141,7 +141,8 @@ export const useIconStyles = /*#__PURE__*/__styles({
     nk6f5a: 0,
     Ijaq50: 0,
     Bq1tomu: "fujjg13",
-    mc9l5x: "f22iagw"
+    mc9l5x: "f22iagw",
+    B7ck84d: "f1e4lqlz"
   },
   medium: {
     uwmqm3: ["f1rtp3s9", "f18k1jr3"],
@@ -164,7 +165,7 @@ export const useIconStyles = /*#__PURE__*/__styles({
 }, {
   d: [[".fujjg13{grid-area:media;}", {
     p: -1
-  }], ".f22iagw{display:flex;}", ".f1rtp3s9{padding-left:7px;}", ".f18k1jr3{padding-right:7px;}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f64fuq3{width:20px;}", ".fe5j1ua{font-size:20px;}", ".f15vdbe4{padding-left:5px;}", ".fwiuce9{padding-right:5px;}", ".ffczdla{padding-right:var(--spacingHorizontalXXS);}", ".fgiv446{padding-left:var(--spacingHorizontalXXS);}", ".fjw5fx7{width:16px;}", ".f4ybsrx{font-size:16px;}", ".frx94fk{width:12px;}", ".f1ugzwwg{font-size:12px;}"]
+  }], ".f22iagw{display:flex;}", ".f1e4lqlz{box-sizing:content-box;}", ".f1rtp3s9{padding-left:7px;}", ".f18k1jr3{padding-right:7px;}", ".f7x41pl{padding-right:var(--spacingHorizontalXS);}", ".fruq291{padding-left:var(--spacingHorizontalXS);}", ".f64fuq3{width:20px;}", ".fe5j1ua{font-size:20px;}", ".f15vdbe4{padding-left:5px;}", ".fwiuce9{padding-right:5px;}", ".ffczdla{padding-right:var(--spacingHorizontalXXS);}", ".fgiv446{padding-left:var(--spacingHorizontalXXS);}", ".fjw5fx7{width:16px;}", ".f4ybsrx{font-size:16px;}", ".frx94fk{width:12px;}", ".f1ugzwwg{font-size:12px;}"]
 });
 export const useMediaStyles = /*#__PURE__*/__styles({
   base: {
@@ -330,5 +331,4 @@ export const useTagStyles_unstable = state => {
     state.dismissIcon.className = mergeClasses(tagClassNames.dismissIcon, dismissIconStyles.base, dismissIconStyles[size], !state.disabled && dismissIconStyles[appearance], state.dismissIcon.className);
   }
   return state;
-};
-//# sourceMappingURL=useTagStyles.styles.js.map
+};

package/lib/components/Tag/useTagStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","createCustomFocusIndicatorStyle","tagClassNames","root","media","icon","primaryText","secondaryText","dismissIcon","tagSpacingMedium","tagSpacingSmall","tagSpacingExtraSmall","mediumIconSize","smallIconSize","extraSmallIconSize","baseStyles","fontFamily","padding","appearance","textAlign","display","alignItems","gridTemplateAreas","boxSizing","width","border","strokeWidthThin","colorTransparentStroke","useRootRoundedBaseClassName","r","s","useRootCircularBaseClassName","useRootStyles","filled","De3pzq","sj55zd","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","brand","medium","Bqenvij","small","d","useRootDisabledStyles","Bceei9c","useRootWithoutMediaStyles","uwmqm3","useRootWithoutDismissStyles","z189sj","useIconStyles","base","Bw0ie65","Br312pm","nk6f5a","Ijaq50","Bq1tomu","mc9l5x","a9b677","Be2twd7","p","useMediaStyles","useDismissIconStyles","ze5xyy","oy3o9n","eoavqd","Bi91k9c","lj723h","m","h","a","usePrimaryTextStyles","Huce71","Bahqtrf","Bhrd7zp","Bg96gwp","withoutSecondaryText","Byoj8tv","withSecondaryText","B6of3ja","useSecondaryTextBaseClassName","useTagStyles_unstable","state","rootRoundedBaseClassName","rootCircularBaseClassName","rootStyles","rootDisabledStyles","rootWithoutMediaStyles","rootWithoutDismissStyles","iconStyles","mediaStyles","dismissIconStyles","primaryTextStyles","secondaryTextBaseClassName","shape","size","className","disabled"],"sources":["useTagStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tagClassNames = {\n root: 'fui-Tag',\n media: 'fui-Tag__media',\n icon: 'fui-Tag__icon',\n primaryText: 'fui-Tag__primaryText',\n secondaryText: 'fui-Tag__secondaryText',\n dismissIcon: 'fui-Tag__dismissIcon'\n};\n/*\n Inner horizontal space left and right of Tag\n / const tagSpacingMedium = '7px';\nconst tagSpacingSmall = '5px';\nconst tagSpacingExtraSmall = '5px';\nconst mediumIconSize = '20px';\nconst smallIconSize = '16px';\nconst extraSmallIconSize = '12px';\nconst baseStyles = {\n // reset default button style:\n fontFamily: 'inherit',\n padding: '0px',\n appearance: 'button',\n textAlign: 'unset',\n display: 'inline-grid',\n alignItems: 'center',\n gridTemplateAreas: `\n \"media primary dismissIcon\"\n \"media secondary dismissIcon\"\n `,\n boxSizing: 'border-box',\n width: 'fit-content',\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n};\nconst useRootRoundedBaseClassName = makeResetStyles({\n ...baseStyles,\n borderRadius: tokens.borderRadiusMedium,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusMedium,\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`\n }),\n /\n Pseudo element to draw the border for windows high contrast mode -\n * when Tag is with secondary text, primary text has negative margin that covers the border.\n / '@media (forced-colors: active)': {\n position: 'relative',\n '::before': {\n content: '\"\"',\n borderTop: `${tokens.strokeWidthThin} solid`,\n position: 'absolute',\n top: '-1px',\n left: '-1px',\n right: '-1px',\n bottom: '-1px',\n borderTopLeftRadius: tokens.borderRadiusMedium,\n borderTopRightRadius: tokens.borderRadiusMedium\n }\n }\n});\nconst useRootCircularBaseClassName = makeResetStyles({\n ...baseStyles,\n borderRadius: tokens.borderRadiusCircular,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusCircular,\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`\n }),\n /\n Pseudo element to draw the border for windows high contrast mode -\n * when Tag is with secondary text, primary text has negative margin that covers the border.\n / '@media (forced-colors: active)': {\n position: 'relative',\n '::before': {\n content: '\"\"',\n borderTop: `${tokens.strokeWidthThin} solid`,\n borderLeft: `${tokens.strokeWidthThin} solid`,\n borderRight: `${tokens.strokeWidthThin} solid`,\n position: 'absolute',\n top: '-1px',\n left: '-1px',\n right: '-1px',\n bottom: '-1px',\n borderRadius: tokens.borderRadiusCircular\n }\n }\n});\nconst useRootStyles = makeStyles({\n filled: {\n backgroundColor: tokens.colorNeutralBackground3,\n color: tokens.colorNeutralForeground2\n },\n outline: {\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2\n },\n medium: {\n height: '32px'\n },\n small: {\n height: '24px'\n },\n 'extra-small': {\n height: '20px'\n }\n});\nconst useRootDisabledStyles = makeStyles({\n filled: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n ...shorthands.borderColor(tokens.colorTransparentStrokeDisabled)\n },\n outline: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForegroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled)\n },\n brand: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n ...shorthands.borderColor(tokens.colorTransparentStrokeDisabled)\n }\n});\n/\n Styles for root slot when Tag is without leading media/icon\n / const useRootWithoutMediaStyles = makeStyles({\n medium: {\n paddingLeft: tagSpacingMedium\n },\n small: {\n paddingLeft: tagSpacingSmall\n },\n 'extra-small': {\n paddingLeft: tagSpacingExtraSmall\n }\n});\n/\n Styles for root slot when Tag is without dismiss icon\n / const useRootWithoutDismissStyles = makeStyles({\n medium: {\n paddingRight: tagSpacingMedium\n },\n small: {\n paddingRight: tagSpacingSmall\n },\n 'extra-small': {\n paddingRight: tagSpacingExtraSmall\n }\n});\nexport const useIconStyles = makeStyles({\n base: {\n gridArea: 'media',\n display: 'flex'\n },\n medium: {\n paddingLeft: tagSpacingMedium,\n paddingRight: tokens.spacingHorizontalXS,\n width: mediumIconSize,\n fontSize: mediumIconSize\n },\n small: {\n paddingLeft: tagSpacingSmall,\n paddingRight: tokens.spacingHorizontalXXS,\n width: smallIconSize,\n fontSize: smallIconSize\n },\n 'extra-small': {\n paddingLeft: tagSpacingExtraSmall,\n paddingRight: tokens.spacingHorizontalXXS,\n width: extraSmallIconSize,\n fontSize: extraSmallIconSize\n }\n});\nexport const useMediaStyles = makeStyles({\n base: {\n gridArea: 'media',\n display: 'flex',\n paddingLeft: '1px'\n },\n medium: {\n paddingRight: tokens.spacingHorizontalS\n },\n small: {\n paddingRight: tokens.spacingHorizontalSNudge\n },\n 'extra-small': {\n paddingRight: tokens.spacingHorizontalSNudge\n }\n});\nconst useDismissIconStyles = makeStyles({\n base: {\n gridArea: 'dismissIcon',\n display: 'flex',\n // windows high contrast:\n '@media (forced-colors: active)': {\n ':hover': {\n color: 'Highlight'\n },\n ':active': {\n color: 'Highlight'\n }\n }\n },\n medium: {\n paddingLeft: tokens.spacingHorizontalXS,\n paddingRight: tagSpacingMedium,\n fontSize: mediumIconSize\n },\n small: {\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tagSpacingSmall,\n fontSize: smallIconSize\n },\n 'extra-small': {\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tagSpacingExtraSmall,\n fontSize: extraSmallIconSize\n },\n filled: {\n ':hover': {\n cursor: 'pointer',\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active': {\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n },\n outline: {\n ':hover': {\n cursor: 'pointer',\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active': {\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n },\n brand: {\n ':hover': {\n cursor: 'pointer',\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active': {\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n }\n});\nexport const usePrimaryTextStyles = makeStyles({\n base: {\n whiteSpace: 'nowrap',\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tokens.spacingHorizontalXXS\n },\n medium: {\n ...typographyStyles.body1\n },\n small: {\n ...typographyStyles.caption1\n },\n 'extra-small': {\n ...typographyStyles.caption1\n },\n withoutSecondaryText: {\n gridColumnStart: 'primary',\n gridRowStart: 'primary',\n gridRowEnd: 'secondary',\n paddingBottom: tokens.spacingHorizontalXXS\n },\n withSecondaryText: {\n gridArea: 'primary',\n ...typographyStyles.caption1,\n marginTop: '-2px'\n }\n});\nexport const useSecondaryTextBaseClassName = makeResetStyles({\n gridArea: 'secondary',\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tokens.spacingHorizontalXXS,\n ...typographyStyles.caption2,\n whiteSpace: 'nowrap'\n});\n/\n Apply styling to the Tag slots based on the state\n */ export const useTagStyles_unstable = (state)=>{\n 'use no memo';\n const rootRoundedBaseClassName = useRootRoundedBaseClassName();\n const rootCircularBaseClassName = useRootCircularBaseClassName();\n const rootStyles = useRootStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const rootWithoutMediaStyles = useRootWithoutMediaStyles();\n const rootWithoutDismissStyles = useRootWithoutDismissStyles();\n const iconStyles = useIconStyles();\n const mediaStyles = useMediaStyles();\n const dismissIconStyles = useDismissIconStyles();\n const primaryTextStyles = usePrimaryTextStyles();\n const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n const { shape, size, appearance } = state;\n state.root.className = mergeClasses(tagClassNames.root, shape === 'rounded' ? rootRoundedBaseClassName : rootCircularBaseClassName, state.disabled ? rootDisabledStyles[appearance] : rootStyles[appearance], rootStyles[size], !state.media && !state.icon && rootWithoutMediaStyles[size], !state.dismissIcon && rootWithoutDismissStyles[size], state.root.className);\n if (state.media) {\n state.media.className = mergeClasses(tagClassNames.media, mediaStyles.base, mediaStyles[size], state.media.className);\n }\n if (state.icon) {\n state.icon.className = mergeClasses(tagClassNames.icon, iconStyles.base, iconStyles[size], state.icon.className);\n }\n if (state.primaryText) {\n state.primaryText.className = mergeClasses(tagClassNames.primaryText, primaryTextStyles.base, primaryTextStyles[size], state.secondaryText ? primaryTextStyles.withSecondaryText : primaryTextStyles.withoutSecondaryText, state.primaryText.className);\n }\n if (state.secondaryText) {\n state.secondaryText.className = mergeClasses(tagClassNames.secondaryText, secondaryTextBaseClassName, state.secondaryText.className);\n }\n if (state.dismissIcon) {\n state.dismissIcon.className = mergeClasses(tagClassNames.dismissIcon, dismissIconStyles.base, dismissIconStyles[size], !state.disabled && dismissIconStyles[appearance], state.dismissIcon.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","typographyStyles","createCustomFocusIndicatorStyle","tagClassNames","root","media","icon","primaryText","secondaryText","dismissIcon","tagSpacingMedium","tagSpacingSmall","tagSpacingExtraSmall","mediumIconSize","smallIconSize","extraSmallIconSize","baseStyles","fontFamily","padding","appearance","textAlign","display","alignItems","gridTemplateAreas","boxSizing","width","border","strokeWidthThin","colorTransparentStroke","useRootRoundedBaseClassName","r","s","useRootCircularBaseClassName","useRootStyles","filled","De3pzq","sj55zd","outline","g2u3we","h3c5rm","B9xav0g","zhjwy3","brand","medium","Bqenvij","small","d","useRootDisabledStyles","Bceei9c","useRootWithoutMediaStyles","uwmqm3","useRootWithoutDismissStyles","z189sj","useIconStyles","base","Bw0ie65","Br312pm","nk6f5a","Ijaq50","Bq1tomu","mc9l5x","B7ck84d","a9b677","Be2twd7","p","useMediaStyles","useDismissIconStyles","ze5xyy","oy3o9n","eoavqd","Bi91k9c","lj723h","m","h","a","usePrimaryTextStyles","Huce71","Bahqtrf","Bhrd7zp","Bg96gwp","withoutSecondaryText","Byoj8tv","withSecondaryText","B6of3ja","useSecondaryTextBaseClassName","useTagStyles_unstable","state","rootRoundedBaseClassName","rootCircularBaseClassName","rootStyles","rootDisabledStyles","rootWithoutMediaStyles","rootWithoutDismissStyles","iconStyles","mediaStyles","dismissIconStyles","primaryTextStyles","secondaryTextBaseClassName","shape","size","className","disabled"],"sources":["useTagStyles.styles.js"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const tagClassNames = {\n root: 'fui-Tag',\n media: 'fui-Tag__media',\n icon: 'fui-Tag__icon',\n primaryText: 'fui-Tag__primaryText',\n secondaryText: 'fui-Tag__secondaryText',\n dismissIcon: 'fui-Tag__dismissIcon'\n};\n/*\n Inner horizontal space left and right of Tag\n / const tagSpacingMedium = '7px';\nconst tagSpacingSmall = '5px';\nconst tagSpacingExtraSmall = '5px';\nconst mediumIconSize = '20px';\nconst smallIconSize = '16px';\nconst extraSmallIconSize = '12px';\nconst baseStyles = {\n // reset default button style:\n fontFamily: 'inherit',\n padding: '0px',\n appearance: 'button',\n textAlign: 'unset',\n display: 'inline-grid',\n alignItems: 'center',\n gridTemplateAreas: `\n \"media primary dismissIcon\"\n \"media secondary dismissIcon\"\n `,\n boxSizing: 'border-box',\n width: 'fit-content',\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`\n};\nconst useRootRoundedBaseClassName = makeResetStyles({\n ...baseStyles,\n borderRadius: tokens.borderRadiusMedium,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusMedium,\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`\n }),\n /\n Pseudo element to draw the border for windows high contrast mode -\n * when Tag is with secondary text, primary text has negative margin that covers the border.\n / '@media (forced-colors: active)': {\n position: 'relative',\n '::before': {\n content: '\"\"',\n borderTop: `${tokens.strokeWidthThin} solid`,\n position: 'absolute',\n top: '-1px',\n left: '-1px',\n right: '-1px',\n bottom: '-1px',\n borderTopLeftRadius: tokens.borderRadiusMedium,\n borderTopRightRadius: tokens.borderRadiusMedium\n }\n }\n});\nconst useRootCircularBaseClassName = makeResetStyles({\n ...baseStyles,\n borderRadius: tokens.borderRadiusCircular,\n ...createCustomFocusIndicatorStyle({\n borderRadius: tokens.borderRadiusCircular,\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`\n }),\n /\n Pseudo element to draw the border for windows high contrast mode -\n * when Tag is with secondary text, primary text has negative margin that covers the border.\n / '@media (forced-colors: active)': {\n position: 'relative',\n '::before': {\n content: '\"\"',\n borderTop: `${tokens.strokeWidthThin} solid`,\n borderLeft: `${tokens.strokeWidthThin} solid`,\n borderRight: `${tokens.strokeWidthThin} solid`,\n position: 'absolute',\n top: '-1px',\n left: '-1px',\n right: '-1px',\n bottom: '-1px',\n borderRadius: tokens.borderRadiusCircular\n }\n }\n});\nconst useRootStyles = makeStyles({\n filled: {\n backgroundColor: tokens.colorNeutralBackground3,\n color: tokens.colorNeutralForeground2\n },\n outline: {\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForeground2,\n ...shorthands.borderColor(tokens.colorNeutralStroke1)\n },\n brand: {\n backgroundColor: tokens.colorBrandBackground2,\n color: tokens.colorBrandForeground2\n },\n medium: {\n height: '32px'\n },\n small: {\n height: '24px'\n },\n 'extra-small': {\n height: '20px'\n }\n});\nconst useRootDisabledStyles = makeStyles({\n filled: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n ...shorthands.borderColor(tokens.colorTransparentStrokeDisabled)\n },\n outline: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorSubtleBackground,\n color: tokens.colorNeutralForegroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled)\n },\n brand: {\n cursor: 'not-allowed',\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n color: tokens.colorNeutralForegroundDisabled,\n ...shorthands.borderColor(tokens.colorTransparentStrokeDisabled)\n }\n});\n/\n Styles for root slot when Tag is without leading media/icon\n / const useRootWithoutMediaStyles = makeStyles({\n medium: {\n paddingLeft: tagSpacingMedium\n },\n small: {\n paddingLeft: tagSpacingSmall\n },\n 'extra-small': {\n paddingLeft: tagSpacingExtraSmall\n }\n});\n/\n Styles for root slot when Tag is without dismiss icon\n / const useRootWithoutDismissStyles = makeStyles({\n medium: {\n paddingRight: tagSpacingMedium\n },\n small: {\n paddingRight: tagSpacingSmall\n },\n 'extra-small': {\n paddingRight: tagSpacingExtraSmall\n }\n});\nexport const useIconStyles = makeStyles({\n base: {\n gridArea: 'media',\n display: 'flex',\n boxSizing: 'content-box'\n },\n medium: {\n paddingLeft: tagSpacingMedium,\n paddingRight: tokens.spacingHorizontalXS,\n width: mediumIconSize,\n fontSize: mediumIconSize\n },\n small: {\n paddingLeft: tagSpacingSmall,\n paddingRight: tokens.spacingHorizontalXXS,\n width: smallIconSize,\n fontSize: smallIconSize\n },\n 'extra-small': {\n paddingLeft: tagSpacingExtraSmall,\n paddingRight: tokens.spacingHorizontalXXS,\n width: extraSmallIconSize,\n fontSize: extraSmallIconSize\n }\n});\nexport const useMediaStyles = makeStyles({\n base: {\n gridArea: 'media',\n display: 'flex',\n paddingLeft: '1px'\n },\n medium: {\n paddingRight: tokens.spacingHorizontalS\n },\n small: {\n paddingRight: tokens.spacingHorizontalSNudge\n },\n 'extra-small': {\n paddingRight: tokens.spacingHorizontalSNudge\n }\n});\nconst useDismissIconStyles = makeStyles({\n base: {\n gridArea: 'dismissIcon',\n display: 'flex',\n // windows high contrast:\n '@media (forced-colors: active)': {\n ':hover': {\n color: 'Highlight'\n },\n ':active': {\n color: 'Highlight'\n }\n }\n },\n medium: {\n paddingLeft: tokens.spacingHorizontalXS,\n paddingRight: tagSpacingMedium,\n fontSize: mediumIconSize\n },\n small: {\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tagSpacingSmall,\n fontSize: smallIconSize\n },\n 'extra-small': {\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tagSpacingExtraSmall,\n fontSize: extraSmallIconSize\n },\n filled: {\n ':hover': {\n cursor: 'pointer',\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active': {\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n },\n outline: {\n ':hover': {\n cursor: 'pointer',\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active': {\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n },\n brand: {\n ':hover': {\n cursor: 'pointer',\n color: tokens.colorCompoundBrandForeground1Hover\n },\n ':active': {\n color: tokens.colorCompoundBrandForeground1Pressed\n }\n }\n});\nexport const usePrimaryTextStyles = makeStyles({\n base: {\n whiteSpace: 'nowrap',\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tokens.spacingHorizontalXXS\n },\n medium: {\n ...typographyStyles.body1\n },\n small: {\n ...typographyStyles.caption1\n },\n 'extra-small': {\n ...typographyStyles.caption1\n },\n withoutSecondaryText: {\n gridColumnStart: 'primary',\n gridRowStart: 'primary',\n gridRowEnd: 'secondary',\n paddingBottom: tokens.spacingHorizontalXXS\n },\n withSecondaryText: {\n gridArea: 'primary',\n ...typographyStyles.caption1,\n marginTop: '-2px'\n }\n});\nexport const useSecondaryTextBaseClassName = makeResetStyles({\n gridArea: 'secondary',\n paddingLeft: tokens.spacingHorizontalXXS,\n paddingRight: tokens.spacingHorizontalXXS,\n ...typographyStyles.caption2,\n whiteSpace: 'nowrap'\n});\n/\n Apply styling to the Tag slots based on the state\n */ export const useTagStyles_unstable = (state)=>{\n 'use no memo';\n const rootRoundedBaseClassName = useRootRoundedBaseClassName();\n const rootCircularBaseClassName = useRootCircularBaseClassName();\n const rootStyles = useRootStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const rootWithoutMediaStyles = useRootWithoutMediaStyles();\n const rootWithoutDismissStyles = useRootWithoutDismissStyles();\n const iconStyles = useIconStyles();\n const mediaStyles = useMediaStyles();\n const dismissIconStyles = useDismissIconStyles();\n const primaryTextStyles = usePrimaryTextStyles();\n const secondaryTextBaseClassName = useSecondaryTextBaseClassName();\n const { shape, size, appearance } = state;\n state.root.className = mergeClasses(tagClassNames.root, shape === 'rounded' ? rootRoundedBaseClassName : rootCircularBaseClassName, state.disabled ? rootDisabledStyles[appearance] : rootStyles[appearance], rootStyles[size], !state.media && !state.icon && rootWithoutMediaStyles[size], !state.dismissIcon && rootWithoutDismissStyles[size], state.root.className);\n if (state.media) {\n state.media.className = mergeClasses(tagClassNames.media, mediaStyles.base, mediaStyles[size], state.media.className);\n }\n if (state.icon) {\n state.icon.className = mergeClasses(tagClassNames.icon, iconStyles.base, iconStyles[size], state.icon.className);\n }\n if (state.primaryText) {\n state.primaryText.className = mergeClasses(tagClassNames.primaryText, primaryTextStyles.base, primaryTextStyles[size], state.secondaryText ? primaryTextStyles.withSecondaryText : primaryTextStyles.withoutSecondaryText, state.primaryText.className);\n }\n if (state.secondaryText) {\n state.secondaryText.className = mergeClasses(tagClassNames.secondaryText, secondaryTextBaseClassName, state.secondaryText.className);\n }\n if (state.dismissIcon) {\n state.dismissIcon.className = mergeClasses(tagClassNames.dismissIcon, dismissIconStyles.base, dismissIconStyles[size], !state.disabled && dismissIconStyles[appearance], state.dismissIcon.className);\n }\n return state;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/TagGroup/TagGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["TagGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTagGroup_unstable } from './useTagGroup';\nimport { renderTagGroup_unstable } from './renderTagGroup';\nimport { useTagGroupStyles_unstable } from './useTagGroupStyles.styles';\nimport type { TagGroupProps } from './TagGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTagGroupContextValues_unstable } from './useTagGroupContextValues';\n\n/*\n TagGroup component - a container for multiple tags.\n * Provides context to size or dismiss children tags.\n */\nexport const TagGroup: ForwardRefComponent<TagGroupProps> = React.forwardRef((props, ref) => {\n const state = useTagGroup_unstable(props, ref);\n\n useTagGroupStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTagGroupStyles_unstable')(state);\n\n return renderTagGroup_unstable(state, useTagGroupContextValues_unstable(state));\n});\n\nTagGroup.displayName = 'TagGroup';\n"],"names":["React","useTagGroup_unstable","renderTagGroup_unstable","useTagGroupStyles_unstable","useCustomStyleHook_unstable","useTagGroupContextValues_unstable","TagGroup","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,iCAAiC,QAAQ,6BAA6B;AAE/E;;;CAGC,GACD,OAAO,MAAMC,yBAA+CN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQT,qBAAqBO,OAAOC;IAE1CN,2BAA2BO;IAE3BN,4BAA4B,8BAA8BM;IAE1D,OAAOR,wBAAwBQ,OAAOL,kCAAkCK;AAC1E,GAAG;AAEHJ,SAASK,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/TagGroup/TagGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useTagGroup_unstable } from './useTagGroup';\nimport { renderTagGroup_unstable } from './renderTagGroup';\nimport { useTagGroupStyles_unstable } from './useTagGroupStyles.styles';\nimport type { TagGroupProps } from './TagGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useTagGroupContextValues_unstable } from './useTagGroupContextValues';\n\n/*\n TagGroup component - a container for multiple tags.\n * Provides context to size or dismiss children tags.\n */\nexport const TagGroup: ForwardRefComponent<TagGroupProps> = React.forwardRef((props, ref) => {\n const state = useTagGroup_unstable(props, ref);\n\n useTagGroupStyles_unstable(state);\n\n useCustomStyleHook_unstable('useTagGroupStyles_unstable')(state);\n\n return renderTagGroup_unstable(state, useTagGroupContextValues_unstable(state));\n});\n\nTagGroup.displayName = 'TagGroup';\n"],"names":["React","useTagGroup_unstable","renderTagGroup_unstable","useTagGroupStyles_unstable","useCustomStyleHook_unstable","useTagGroupContextValues_unstable","TagGroup","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,iCAAiC,QAAQ,6BAA6B;AAE/E;;;CAGC,GACD,OAAO,MAAMC,yBAA+CN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQT,qBAAqBO,OAAOC;IAE1CN,2BAA2BO;IAE3BN,4BAA4B,8BAA8BM;IAE1D,OAAOR,wBAAwBQ,OAAOL,kCAAkCK;AAC1E,GAAG;AAEHJ,SAASK,WAAW,GAAG"}

package/lib/components/TagGroup/TagGroup.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["TagGroup.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TagSize, TagValue, TagDismissHandler, TagAppearance } from '../../utils/types';\nimport { TagGroupContextValue } from '../../contexts/tagGroupContext';\nimport * as React from 'react';\n\nexport type TagGroupContextValues = {\n tagGroup: TagGroupContextValue;\n};\n\nexport type TagGroupSlots = {\n root: Slot<'div'>;\n};\n\n/*\n TagGroup Props\n /\nexport type TagGroupProps<Value = TagValue> = ComponentProps<TagGroupSlots> & {\n /\n Callback for when a tag is dismissed\n /\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onDismiss?: TagDismissHandler<Value>;\n\n /\n A TagGroup can show that it cannot be interacted with.\n \n @default false\n /\n disabled?: boolean;\n\n size?: TagSize;\n appearance?: TagAppearance;\n dismissible?: boolean;\n};\n\n/\n State used in rendering TagGroup\n */\nexport type TagGroupState<Value = TagValue> = ComponentState<TagGroupSlots> &\n Required<Pick<TagGroupProps, 'disabled' \| 'size' \| 'appearance' \| 'dismissible'>> & {\n handleTagDismiss: TagDismissHandler<Value>;\n role?: React.AriaRole;\n };\n"],"names":["React"],"rangeMappings":"","mappings":"AAGA,YAAYA,WAAW,QAAQ"}
1	+ {"version":3,"sources":["../src/components/TagGroup/TagGroup.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { TagSize, TagValue, TagDismissHandler, TagAppearance } from '../../utils/types';\nimport { TagGroupContextValue } from '../../contexts/tagGroupContext';\nimport * as React from 'react';\n\nexport type TagGroupContextValues = {\n tagGroup: TagGroupContextValue;\n};\n\nexport type TagGroupSlots = {\n root: Slot<'div'>;\n};\n\n/*\n TagGroup Props\n /\nexport type TagGroupProps<Value = TagValue> = ComponentProps<TagGroupSlots> & {\n /\n Callback for when a tag is dismissed\n /\n // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n onDismiss?: TagDismissHandler<Value>;\n\n /\n A TagGroup can show that it cannot be interacted with.\n \n @default false\n /\n disabled?: boolean;\n\n size?: TagSize;\n appearance?: TagAppearance;\n dismissible?: boolean;\n};\n\n/\n State used in rendering TagGroup\n */\nexport type TagGroupState<Value = TagValue> = ComponentState<TagGroupSlots> &\n Required<Pick<TagGroupProps, 'disabled' \| 'size' \| 'appearance' \| 'dismissible'>> & {\n handleTagDismiss: TagDismissHandler<Value>;\n role?: React.AriaRole;\n };\n"],"names":["React"],"rangeMappings":"","mappings":"AAGA,YAAYA,WAAW,QAAQ"}

package/lib/components/TagGroup/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["index.ts"],"sourcesContent":["export * from './TagGroup';\nexport * from './TagGroup.types';\nexport * from './renderTagGroup';\nexport * from './useTagGroup';\nexport * from './useTagGroupStyles.styles';\nexport * from './useTagGroupContextValues';\n"],"names":[],"rangeMappings":";;;;;","mappings":"AAAA,cAAc,aAAa;AAC3B,cAAc,mBAAmB;AACjC,cAAc,mBAAmB;AACjC,cAAc,gBAAgB;AAC9B,cAAc,6BAA6B;AAC3C,cAAc,6BAA6B"}
1	+ {"version":3,"sources":["../src/components/TagGroup/index.ts"],"sourcesContent":["export * from './TagGroup';\nexport * from './TagGroup.types';\nexport * from './renderTagGroup';\nexport * from './useTagGroup';\nexport * from './useTagGroupStyles.styles';\nexport * from './useTagGroupContextValues';\n"],"names":[],"rangeMappings":";;;;;","mappings":"AAAA,cAAc,aAAa;AAC3B,cAAc,mBAAmB;AACjC,cAAc,mBAAmB;AACjC,cAAc,gBAAgB;AAC9B,cAAc,6BAA6B;AAC3C,cAAc,6BAA6B"}

package/lib/components/TagGroup/renderTagGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["renderTagGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagGroupState, TagGroupSlots, TagGroupContextValues } from './TagGroup.types';\nimport { TagGroupContextProvider } from '../../contexts/tagGroupContext';\n\n/\n Render the final JSX of TagGroup\n */\nexport const renderTagGroup_unstable = (state: TagGroupState, contextValue: TagGroupContextValues) => {\n assertSlots<TagGroupSlots>(state);\n\n return (\n <TagGroupContextProvider value={contextValue.tagGroup}>\n <state.root />\n </TagGroupContextProvider>\n );\n};\n"],"names":["assertSlots","TagGroupContextProvider","renderTagGroup_unstable","state","contextValue","value","tagGroup","root"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,iCAAiC;AAEzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5DJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,aAAaE,QAAQ;kBACnD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
1	+ {"version":3,"sources":["../src/components/TagGroup/renderTagGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TagGroupState, TagGroupSlots, TagGroupContextValues } from './TagGroup.types';\nimport { TagGroupContextProvider } from '../../contexts/tagGroupContext';\n\n/\n Render the final JSX of TagGroup\n */\nexport const renderTagGroup_unstable = (state: TagGroupState, contextValue: TagGroupContextValues) => {\n assertSlots<TagGroupSlots>(state);\n\n return (\n <TagGroupContextProvider value={contextValue.tagGroup}>\n <state.root />\n </TagGroupContextProvider>\n );\n};\n"],"names":["assertSlots","TagGroupContextProvider","renderTagGroup_unstable","state","contextValue","value","tagGroup","root"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,iCAAiC;AAEzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5DJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,aAAaE,QAAQ;kBACnD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}