@fluentui/react-tags 9.0.0 → 9.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/CHANGELOG.json +46 -1
  2. package/CHANGELOG.md +16 -2
  3. package/lib/components/InteractionTag/useInteractionTag.js +2 -2
  4. package/lib/components/InteractionTag/useInteractionTag.js.map +1 -1
  5. package/lib/components/InteractionTagPrimary/useInteractionTagPrimary.js +2 -2
  6. package/lib/components/InteractionTagPrimary/useInteractionTagPrimary.js.map +1 -1
  7. package/lib/components/InteractionTagSecondary/useInteractionTagSecondary.js +2 -2
  8. package/lib/components/InteractionTagSecondary/useInteractionTagSecondary.js.map +1 -1
  9. package/lib/components/Tag/useTag.js +2 -2
  10. package/lib/components/Tag/useTag.js.map +1 -1
  11. package/lib/components/TagGroup/useTagGroup.js +5 -2
  12. package/lib/components/TagGroup/useTagGroup.js.map +1 -1
  13. package/lib-commonjs/components/InteractionTag/useInteractionTag.js +1 -1
  14. package/lib-commonjs/components/InteractionTag/useInteractionTag.js.map +1 -1
  15. package/lib-commonjs/components/InteractionTagPrimary/useInteractionTagPrimary.js +1 -1
  16. package/lib-commonjs/components/InteractionTagPrimary/useInteractionTagPrimary.js.map +1 -1
  17. package/lib-commonjs/components/InteractionTagSecondary/useInteractionTagSecondary.js +1 -1
  18. package/lib-commonjs/components/InteractionTagSecondary/useInteractionTagSecondary.js.map +1 -1
  19. package/lib-commonjs/components/Tag/useTag.js +1 -1
  20. package/lib-commonjs/components/Tag/useTag.js.map +1 -1
  21. package/lib-commonjs/components/TagGroup/useTagGroup.js +4 -1
  22. package/lib-commonjs/components/TagGroup/useTagGroup.js.map +1 -1
  23. package/package.json +6 -6
package/CHANGELOG.json CHANGED
@@ -2,7 +2,52 @@
2
2
  "name": "@fluentui/react-tags",
3
3
  "entries": [
4
4
  {
5
- "date": "Wed, 04 Oct 2023 08:41:54 GMT",
5
+ "date": "Thu, 05 Oct 2023 15:18:00 GMT",
6
+ "tag": "@fluentui/react-tags_v9.0.1",
7
+ "version": "9.0.1",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "bernardo.sunderhus@gmail.com",
12
+ "package": "@fluentui/react-tags",
13
+ "commit": "86dd76990e3da5af1f2b6b04a3aec46141d5a653",
14
+ "comment": "chore: migrate from getNativeElementProps to getIntrinsicElementProps"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-tags",
19
+ "comment": "Bump @fluentui/react-aria to v9.3.40",
20
+ "commit": "690590449dc3d65cd40b2b06a990fd920180919d"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-tags",
25
+ "comment": "Bump @fluentui/react-avatar to v9.5.37",
26
+ "commit": "690590449dc3d65cd40b2b06a990fd920180919d"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-tags",
31
+ "comment": "Bump @fluentui/react-jsx-runtime to v9.0.14",
32
+ "commit": "690590449dc3d65cd40b2b06a990fd920180919d"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-tags",
37
+ "comment": "Bump @fluentui/react-tabster to v9.13.4",
38
+ "commit": "690590449dc3d65cd40b2b06a990fd920180919d"
39
+ },
40
+ {
41
+ "author": "beachball",
42
+ "package": "@fluentui/react-tags",
43
+ "comment": "Bump @fluentui/react-utilities to v9.14.1",
44
+ "commit": "690590449dc3d65cd40b2b06a990fd920180919d"
45
+ }
46
+ ]
47
+ }
48
+ },
49
+ {
50
+ "date": "Wed, 04 Oct 2023 08:45:46 GMT",
6
51
  "tag": "@fluentui/react-tags_v9.0.0",
7
52
  "version": "9.0.0",
8
53
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,26 @@
1
1
  # Change Log - @fluentui/react-tags
2
2
 
3
- This log was last generated on Wed, 04 Oct 2023 08:41:54 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 05 Oct 2023 15:18:00 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tags_v9.0.1)
8
+
9
+ Thu, 05 Oct 2023 15:18:00 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tags_v9.0.0..@fluentui/react-tags_v9.0.1)
11
+
12
+ ### Patches
13
+
14
+ - chore: migrate from getNativeElementProps to getIntrinsicElementProps ([PR #29387](https://github.com/microsoft/fluentui/pull/29387) by bernardo.sunderhus@gmail.com)
15
+ - Bump @fluentui/react-aria to v9.3.40 ([PR #29412](https://github.com/microsoft/fluentui/pull/29412) by beachball)
16
+ - Bump @fluentui/react-avatar to v9.5.37 ([PR #29412](https://github.com/microsoft/fluentui/pull/29412) by beachball)
17
+ - Bump @fluentui/react-jsx-runtime to v9.0.14 ([PR #29412](https://github.com/microsoft/fluentui/pull/29412) by beachball)
18
+ - Bump @fluentui/react-tabster to v9.13.4 ([PR #29412](https://github.com/microsoft/fluentui/pull/29412) by beachball)
19
+ - Bump @fluentui/react-utilities to v9.14.1 ([PR #29412](https://github.com/microsoft/fluentui/pull/29412) by beachball)
20
+
7
21
  ## [9.0.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-tags_v9.0.0)
8
22
 
9
- Wed, 04 Oct 2023 08:41:54 GMT
23
+ Wed, 04 Oct 2023 08:45:46 GMT
10
24
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tags-preview_v0.4.0..@fluentui/react-tags_v9.0.0)
11
25
 
12
26
  ### Minor changes
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { getNativeElementProps, useId, slot } from '@fluentui/react-utilities';
2
+ import { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';
3
3
  import { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';
4
4
  /**
5
5
  * Create the state required to render InteractionTag.
@@ -25,7 +25,7 @@ import { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';
25
25
  components: {
26
26
  root: 'div'
27
27
  },
28
- root: slot.always(getNativeElementProps('div', {
28
+ root: slot.always(getIntrinsicElementProps('div', {
29
29
  ref,
30
30
  ...props,
31
31
  id
@@ -1 +1 @@
1
- {"version":3,"sources":["useInteractionTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, 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 { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n\n const id = useId('fui-InteractionTag-', props.id);\n\n const interactionTagPrimaryId = useId('fui-InteractionTagPrimary-');\n\n const { appearance = 'filled', disabled = false, shape = 'rounded', size = contextSize, value = id } = props;\n\n return {\n appearance,\n disabled,\n handleTagDismiss,\n interactionTagPrimaryId,\n shape,\n size,\n value,\n\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getNativeElementProps('div', {\n ref,\n ...props,\n id,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getNativeElementProps","useId","slot","useTagGroupContext_unstable","useInteractionTag_unstable","props","ref","handleTagDismiss","size","contextSize","id","interactionTagPrimaryId","appearance","disabled","shape","value","components","root","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AAE/E,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGN;IAEhD,MAAMO,KAAKT,MAAM,uBAAuBI,MAAMK,EAAE;IAEhD,MAAMC,0BAA0BV,MAAM;IAEtC,MAAM,EAAEW,aAAa,QAAQ,EAAEC,WAAW,KAAK,EAAEC,QAAQ,SAAS,EAAEN,OAAOC,WAAW,EAAEM,QAAQL,EAAE,EAAE,GAAGL;IAEvG,OAAO;QACLO;QACAC;QACAN;QACAI;QACAG;QACAN;QACAO;QAEAC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMf,KAAKgB,MAAM,CACflB,sBAAsB,OAAO;YAC3BM;YACA,GAAGD,KAAK;YACRK;QACF,IACA;YAAES,aAAa;QAAM;IAEzB;AACF,EAAE"}
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 { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n\n const id = useId('fui-InteractionTag-', props.id);\n\n const interactionTagPrimaryId = useId('fui-InteractionTagPrimary-');\n\n const { appearance = 'filled', disabled = false, shape = 'rounded', size = contextSize, value = id } = props;\n\n return {\n appearance,\n 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 id,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useId","slot","useTagGroupContext_unstable","useInteractionTag_unstable","props","ref","handleTagDismiss","size","contextSize","id","interactionTagPrimaryId","appearance","disabled","shape","value","components","root","always","elementType"],"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,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGN;IAEhD,MAAMO,KAAKT,MAAM,uBAAuBI,MAAMK,EAAE;IAEhD,MAAMC,0BAA0BV,MAAM;IAEtC,MAAM,EAAEW,aAAa,QAAQ,EAAEC,WAAW,KAAK,EAAEC,QAAQ,SAAS,EAAEN,OAAOC,WAAW,EAAEM,QAAQL,EAAE,EAAE,GAAGL;IAEvG,OAAO;QACLO;QACAC;QACAN;QACAI;QACAG;QACAN;QACAO;QAEAC,YAAY;YACVC,MAAM;QACR;QAEAA,MAAMf,KAAKgB,MAAM,CACflB,yBAAyB,OAAO;YAC9BM;YACA,GAAGD,KAAK;YACRK;QACF,IACA;YAAES,aAAa;QAAM;IAEzB;AACF,EAAE"}
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { getNativeElementProps, slot } from '@fluentui/react-utilities';
2
+ import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
3
3
  import { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';
4
4
  const avatarSizeMap = {
5
5
  medium: 28,
@@ -36,7 +36,7 @@ const avatarShapeMap = {
36
36
  primaryText: 'span',
37
37
  secondaryText: 'span'
38
38
  },
39
- root: slot.always(getNativeElementProps('button', {
39
+ root: slot.always(getIntrinsicElementProps('button', {
40
40
  ref,
41
41
  disabled,
42
42
  id: interactionTagPrimaryId,
@@ -1 +1 @@
1
- {"version":3,"sources":["useInteractionTagPrimary.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, 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 getNativeElementProps('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","getNativeElementProps","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"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,4BAA4B;AAExE,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,sBAAsB,UAAU;YAC9BW;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":["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"],"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,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { getNativeElementProps, useEventCallback, slot, useId } from '@fluentui/react-utilities';
2
+ import { getIntrinsicElementProps, useEventCallback, slot, useId } from '@fluentui/react-utilities';
3
3
  import { Delete, Backspace } from '@fluentui/keyboard-keys';
4
4
  import { DismissRegular } from '@fluentui/react-icons';
5
5
  import { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';
@@ -40,7 +40,7 @@ import { useInteractionTagContext_unstable } from '../../contexts/interactionTag
40
40
  components: {
41
41
  root: 'button'
42
42
  },
43
- root: slot.always(getNativeElementProps('button', {
43
+ root: slot.always(getIntrinsicElementProps('button', {
44
44
  children: /*#__PURE__*/ React.createElement(DismissRegular, null),
45
45
  type: 'button',
46
46
  disabled,
@@ -1 +1 @@
1
- {"version":3,"sources":["useInteractionTagSecondary.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, 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 getNativeElementProps('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","getNativeElementProps","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"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,IAAI,EAAEC,KAAK,QAAQ,4BAA4B;AACjG,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,sBAAsB,UAAU;YAC9B2B,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":["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"],"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,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { getNativeElementProps, useEventCallback, useId, slot } from '@fluentui/react-utilities';
2
+ import { getIntrinsicElementProps, useEventCallback, useId, slot } from '@fluentui/react-utilities';
3
3
  import { DismissRegular } from '@fluentui/react-icons';
4
4
  import { Delete, Backspace } from '@fluentui/keyboard-keys';
5
5
  import { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';
@@ -59,7 +59,7 @@ const tagAvatarShapeMap = {
59
59
  secondaryText: 'span',
60
60
  dismissIcon: 'span'
61
61
  },
62
- root: slot.always(getNativeElementProps(elementType, {
62
+ root: slot.always(getIntrinsicElementProps(elementType, {
63
63
  ref,
64
64
  ...props,
65
65
  id,
@@ -1 +1 @@
1
- {"version":3,"sources":["useTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, 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 { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n\n const id = useId('fui-Tag', props.id);\n\n const {\n appearance = 'filled',\n disabled = false,\n dismissible = 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,\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 getNativeElementProps(elementType, {\n ref,\n ...props,\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 role: 'img',\n },\n elementType: 'span',\n }),\n };\n};\n"],"names":["React","getNativeElementProps","useEventCallback","useId","slot","DismissRegular","Delete","Backspace","useTagGroupContext_unstable","tagAvatarSizeMap","medium","small","tagAvatarShapeMap","rounded","circular","useTag_unstable","props","ref","handleTagDismiss","size","contextSize","id","appearance","disabled","dismissible","shape","value","dismissOnClick","ev","onClick","defaultPrevented","dismissOnKeyDown","onKeyDown","key","elementType","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","dismissIcon","always","optional","renderByDefault","defaultProps","children","role"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AACjG,SAASC,cAAc,QAAQ,wBAAwB;AAEvD,SAASC,MAAM,EAAEC,SAAS,QAAQ,0BAA0B;AAC5D,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E,MAAMC,mBAAmB;IACvBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACjB;AAEA,MAAMC,oBAAoB;IACxBC,SAAS;IACTC,UAAU;AACZ;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,kBAAkB,CAACC,OAAiBC;IAC/C,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGZ;IAEhD,MAAMa,KAAKlB,MAAM,WAAWa,MAAMK,EAAE;IAEpC,MAAM,EACJC,aAAa,QAAQ,EACrBC,WAAW,KAAK,EAChBC,cAAc,KAAK,EACnBC,QAAQ,SAAS,EACjBN,OAAOC,WAAW,EAClBM,QAAQL,EAAE,EACX,GAAGL;IAEJ,MAAMW,iBAAiBzB,iBAAiB,CAAC0B;YACvCZ;SAAAA,iBAAAA,MAAMa,OAAO,cAAbb,qCAAAA,oBAAAA,OAAgBY;QAChB,IAAI,CAACA,GAAGE,gBAAgB,EAAE;YACxBZ,6BAAAA,uCAAAA,iBAAmBU,IAAI;gBAAEF;YAAM;QACjC;IACF;IAEA,MAAMK,mBAAmB7B,iBAAiB,CAAC0B;YACzCZ;QAAAA,kBAAAA,6BAAAA,mBAAAA,MAAOgB,SAAS,cAAhBhB,uCAAAA,sBAAAA,OAAmBY;QACnB,IAAI,CAACA,GAAGE,gBAAgB,IAAKF,CAAAA,GAAGK,GAAG,KAAK3B,UAAUsB,GAAGK,GAAG,KAAK1B,SAAQ,GAAI;YACvEW,6BAAAA,uCAAAA,iBAAmBU,IAAI;gBAAEF;YAAM;QACjC;IACF;IAEA,MAAMQ,cAAcV,cAAc,WAAW;IAE7C,OAAO;QACLF;QACAa,aAAavB,iBAAiB,CAACa,MAAM;QACrCW,YAAY3B,gBAAgB,CAACU,KAAK;QAClCI;QACAC;QACAC;QACAN;QAEAkB,YAAY;YACVC,MAAMJ;YACNK,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;YACfC,aAAa;QACf;QAEAL,MAAMlC,KAAKwC,MAAM,CACf3C,sBAAsBiC,aAAa;YACjCjB;YACA,GAAGD,KAAK;YACRK;YACA,GAAIG,eAAe;gBAAEK,SAASF;gBAAgBK,WAAWD;YAAiB,CAAC;QAC7E,IACA;YAAEG;QAAY;QAGhBK,OAAOnC,KAAKyC,QAAQ,CAAC7B,MAAMuB,KAAK,EAAE;YAAEL,aAAa;QAAO;QACxDM,MAAMpC,KAAKyC,QAAQ,CAAC7B,MAAMwB,IAAI,EAAE;YAAEN,aAAa;QAAO;QACtDO,aAAarC,KAAKyC,QAAQ,CAAC7B,MAAMyB,WAAW,EAAE;YAC5CK,iBAAiB;YACjBC,cAAc;gBACZC,UAAUhC,MAAMgC,QAAQ;YAC1B;YACAd,aAAa;QACf;QACAQ,eAAetC,KAAKyC,QAAQ,CAAC7B,MAAM0B,aAAa,EAAE;YAAER,aAAa;QAAO;QACxES,aAAavC,KAAKyC,QAAQ,CAAC7B,MAAM2B,WAAW,EAAE;YAC5CG,iBAAiBtB;YACjBuB,cAAc;gBACZC,wBAAU,oBAAC3C;gBACX4C,MAAM;YACR;YACAf,aAAa;QACf;IACF;AACF,EAAE"}
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 { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n\n const id = useId('fui-Tag', props.id);\n\n const {\n appearance = 'filled',\n disabled = false,\n dismissible = 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,\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 ...props,\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 role: 'img',\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","id","appearance","disabled","dismissible","shape","value","dismissOnClick","ev","onClick","defaultPrevented","dismissOnKeyDown","onKeyDown","key","elementType","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","dismissIcon","always","optional","renderByDefault","defaultProps","children","role"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,IAAI,QAAQ,4BAA4B;AACpG,SAASC,cAAc,QAAQ,wBAAwB;AAEvD,SAASC,MAAM,EAAEC,SAAS,QAAQ,0BAA0B;AAC5D,SAASC,2BAA2B,QAAQ,iCAAiC;AAE7E,MAAMC,mBAAmB;IACvBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACjB;AAEA,MAAMC,oBAAoB;IACxBC,SAAS;IACTC,UAAU;AACZ;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMC,kBAAkB,CAACC,OAAiBC;IAC/C,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGZ;IAEhD,MAAMa,KAAKlB,MAAM,WAAWa,MAAMK,EAAE;IAEpC,MAAM,EACJC,aAAa,QAAQ,EACrBC,WAAW,KAAK,EAChBC,cAAc,KAAK,EACnBC,QAAQ,SAAS,EACjBN,OAAOC,WAAW,EAClBM,QAAQL,EAAE,EACX,GAAGL;IAEJ,MAAMW,iBAAiBzB,iBAAiB,CAAC0B;YACvCZ;SAAAA,iBAAAA,MAAMa,OAAO,cAAbb,qCAAAA,oBAAAA,OAAgBY;QAChB,IAAI,CAACA,GAAGE,gBAAgB,EAAE;YACxBZ,6BAAAA,uCAAAA,iBAAmBU,IAAI;gBAAEF;YAAM;QACjC;IACF;IAEA,MAAMK,mBAAmB7B,iBAAiB,CAAC0B;YACzCZ;QAAAA,kBAAAA,6BAAAA,mBAAAA,MAAOgB,SAAS,cAAhBhB,uCAAAA,sBAAAA,OAAmBY;QACnB,IAAI,CAACA,GAAGE,gBAAgB,IAAKF,CAAAA,GAAGK,GAAG,KAAK3B,UAAUsB,GAAGK,GAAG,KAAK1B,SAAQ,GAAI;YACvEW,6BAAAA,uCAAAA,iBAAmBU,IAAI;gBAAEF;YAAM;QACjC;IACF;IAEA,MAAMQ,cAAcV,cAAc,WAAW;IAE7C,OAAO;QACLF;QACAa,aAAavB,iBAAiB,CAACa,MAAM;QACrCW,YAAY3B,gBAAgB,CAACU,KAAK;QAClCI;QACAC;QACAC;QACAN;QAEAkB,YAAY;YACVC,MAAMJ;YACNK,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;YACfC,aAAa;QACf;QAEAL,MAAMlC,KAAKwC,MAAM,CACf3C,yBAAyBiC,aAAa;YACpCjB;YACA,GAAGD,KAAK;YACRK;YACA,GAAIG,eAAe;gBAAEK,SAASF;gBAAgBK,WAAWD;YAAiB,CAAC;QAC7E,IACA;YAAEG;QAAY;QAGhBK,OAAOnC,KAAKyC,QAAQ,CAAC7B,MAAMuB,KAAK,EAAE;YAAEL,aAAa;QAAO;QACxDM,MAAMpC,KAAKyC,QAAQ,CAAC7B,MAAMwB,IAAI,EAAE;YAAEN,aAAa;QAAO;QACtDO,aAAarC,KAAKyC,QAAQ,CAAC7B,MAAMyB,WAAW,EAAE;YAC5CK,iBAAiB;YACjBC,cAAc;gBACZC,UAAUhC,MAAMgC,QAAQ;YAC1B;YACAd,aAAa;QACf;QACAQ,eAAetC,KAAKyC,QAAQ,CAAC7B,MAAM0B,aAAa,EAAE;YAAER,aAAa;QAAO;QACxES,aAAavC,KAAKyC,QAAQ,CAAC7B,MAAM2B,WAAW,EAAE;YAC5CG,iBAAiBtB;YACjBuB,cAAc;gBACZC,wBAAU,oBAAC3C;gBACX4C,MAAM;YACR;YACAf,aAAa;QACf;IACF;AACF,EAAE"}
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { getNativeElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';
2
+ import { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';
3
3
  import { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';
4
4
  import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
5
5
  import { interactionTagSecondaryClassNames } from '../InteractionTagSecondary/useInteractionTagSecondaryStyles.styles';
@@ -55,7 +55,10 @@ import { interactionTagSecondaryClassNames } from '../InteractionTagSecondary/us
55
55
  components: {
56
56
  root: 'div'
57
57
  },
58
- root: slot.always(getNativeElementProps('div', {
58
+ root: slot.always(getIntrinsicElementProps('div', {
59
+ // FIXME:
60
+ // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
61
+ // but since it would be a breaking change to fix it, we are casting ref to it's proper type
59
62
  ref: useMergedRefs(ref, innerRef),
60
63
  role: 'toolbar',
61
64
  ...arrowNavigationProps,
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport type { TagGroupProps, TagGroupState } from './TagGroup.types';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { interactionTagSecondaryClassNames } from '../InteractionTagSecondary/useInteractionTagSecondaryStyles.styles';\n\n/**\n * Create the state required to render TagGroup.\n *\n * The returned state can be modified with hooks such as useTagGroupStyles_unstable,\n * before being passed to renderTagGroup_unstable.\n *\n * @param props - props from this instance of TagGroup\n * @param ref - reference to root HTMLDivElement of TagGroup\n */\nexport const useTagGroup_unstable = (props: TagGroupProps, ref: React.Ref<HTMLDivElement>): TagGroupState => {\n const { onDismiss, size = 'medium' } = props;\n\n const innerRef = React.useRef<HTMLElement>();\n const { targetDocument } = useFluent();\n const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n\n const handleTagDismiss: TagGroupState['handleTagDismiss'] = useEventCallback((e, data) => {\n onDismiss?.(e, data);\n\n // set focus after tag dismiss\n const activeElement = targetDocument?.activeElement;\n if (innerRef.current?.contains(activeElement as HTMLElement)) {\n // focus on next tag only if the active element is within the current tag group\n const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n if (next) {\n next.focus();\n return;\n }\n\n // if there is no next focusable, focus on the previous focusable\n if (activeElement?.className.includes(interactionTagSecondaryClassNames.root)) {\n const prev = findPrevFocusable(activeElement.parentElement as HTMLElement, { container: innerRef.current });\n prev?.focus();\n } else {\n const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n prev?.focus();\n }\n }\n });\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: true,\n axis: 'both',\n memorizeCurrent: true,\n });\n\n return {\n handleTagDismiss,\n size,\n\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'toolbar',\n ...arrowNavigationProps,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getNativeElementProps","useEventCallback","useMergedRefs","slot","useArrowNavigationGroup","useFocusFinders","useFluent_unstable","useFluent","interactionTagSecondaryClassNames","useTagGroup_unstable","props","ref","onDismiss","size","innerRef","useRef","targetDocument","findNextFocusable","findPrevFocusable","handleTagDismiss","e","data","activeElement","current","contains","next","container","focus","className","includes","root","prev","parentElement","arrowNavigationProps","circular","axis","memorizeCurrent","components","always","role","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAEzG,SAASC,uBAAuB,EAAEC,eAAe,QAAQ,0BAA0B;AACnF,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,iCAAiC,QAAQ,qEAAqE;AAEvH;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,SAAS,EAAEC,OAAO,QAAQ,EAAE,GAAGH;IAEvC,MAAMI,WAAWf,MAAMgB,MAAM;IAC7B,MAAM,EAAEC,cAAc,EAAE,GAAGT;IAC3B,MAAM,EAAEU,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGb;IAEjD,MAAMc,mBAAsDlB,iBAAiB,CAACmB,GAAGC;YAK3EP;QAJJF,sBAAAA,gCAAAA,UAAYQ,GAAGC;QAEf,8BAA8B;QAC9B,MAAMC,gBAAgBN,2BAAAA,qCAAAA,eAAgBM,aAAa;QACnD,KAAIR,oBAAAA,SAASS,OAAO,cAAhBT,wCAAAA,kBAAkBU,QAAQ,CAACF,gBAA+B;YAC5D,+EAA+E;YAC/E,MAAMG,OAAOR,kBAAkBK,eAA8B;gBAAEI,WAAWZ,SAASS,OAAO;YAAC;YAC3F,IAAIE,MAAM;gBACRA,KAAKE,KAAK;gBACV;YACF;YAEA,iEAAiE;YACjE,IAAIL,0BAAAA,oCAAAA,cAAeM,SAAS,CAACC,QAAQ,CAACrB,kCAAkCsB,IAAI,GAAG;gBAC7E,MAAMC,OAAOb,kBAAkBI,cAAcU,aAAa,EAAiB;oBAAEN,WAAWZ,SAASS,OAAO;gBAAC;gBACzGQ,iBAAAA,2BAAAA,KAAMJ,KAAK;YACb,OAAO;gBACL,MAAMI,OAAOb,kBAAkBI,eAA8B;oBAAEI,WAAWZ,SAASS,OAAO;gBAAC;gBAC3FQ,iBAAAA,2BAAAA,KAAMJ,KAAK;YACb;QACF;IACF;IAEA,MAAMM,uBAAuB7B,wBAAwB;QACnD8B,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,OAAO;QACLjB;QACAN;QAEAwB,YAAY;YACVP,MAAM;QACR;QAEAA,MAAM3B,KAAKmC,MAAM,CACftC,sBAAsB,OAAO;YAC3BW,KAAKT,cAAcS,KAAKG;YACxByB,MAAM;YACN,GAAGN,oBAAoB;YACvB,GAAGvB,KAAK;QACV,IACA;YAAE8B,aAAa;QAAM;IAEzB;AACF,EAAE"}
1
+ {"version":3,"sources":["useTagGroup.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport type { TagGroupProps, TagGroupState } from './TagGroup.types';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { interactionTagSecondaryClassNames } from '../InteractionTagSecondary/useInteractionTagSecondaryStyles.styles';\n\n/**\n * Create the state required to render TagGroup.\n *\n * The returned state can be modified with hooks such as useTagGroupStyles_unstable,\n * before being passed to renderTagGroup_unstable.\n *\n * @param props - props from this instance of TagGroup\n * @param ref - reference to root HTMLDivElement of TagGroup\n */\nexport const useTagGroup_unstable = (props: TagGroupProps, ref: React.Ref<HTMLDivElement>): TagGroupState => {\n const { onDismiss, size = 'medium' } = props;\n\n const innerRef = React.useRef<HTMLElement>();\n const { targetDocument } = useFluent();\n const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n\n const handleTagDismiss: TagGroupState['handleTagDismiss'] = useEventCallback((e, data) => {\n onDismiss?.(e, data);\n\n // set focus after tag dismiss\n const activeElement = targetDocument?.activeElement;\n if (innerRef.current?.contains(activeElement as HTMLElement)) {\n // focus on next tag only if the active element is within the current tag group\n const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n if (next) {\n next.focus();\n return;\n }\n\n // if there is no next focusable, focus on the previous focusable\n if (activeElement?.className.includes(interactionTagSecondaryClassNames.root)) {\n const prev = findPrevFocusable(activeElement.parentElement as HTMLElement, { container: innerRef.current });\n prev?.focus();\n } else {\n const prev = findPrevFocusable(activeElement as HTMLElement, { container: innerRef.current });\n prev?.focus();\n }\n }\n });\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: true,\n axis: 'both',\n memorizeCurrent: true,\n });\n\n return {\n handleTagDismiss,\n size,\n\n components: {\n root: 'div',\n },\n\n root: slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, innerRef) as React.Ref<HTMLDivElement>,\n role: 'toolbar',\n ...arrowNavigationProps,\n ...props,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","useEventCallback","useMergedRefs","slot","useArrowNavigationGroup","useFocusFinders","useFluent_unstable","useFluent","interactionTagSecondaryClassNames","useTagGroup_unstable","props","ref","onDismiss","size","innerRef","useRef","targetDocument","findNextFocusable","findPrevFocusable","handleTagDismiss","e","data","activeElement","current","contains","next","container","focus","className","includes","root","prev","parentElement","arrowNavigationProps","circular","axis","memorizeCurrent","components","always","role","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,gBAAgB,EAAEC,aAAa,EAAEC,IAAI,QAAQ,4BAA4B;AAE5G,SAASC,uBAAuB,EAAEC,eAAe,QAAQ,0BAA0B;AACnF,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,iCAAiC,QAAQ,qEAAqE;AAEvH;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,SAAS,EAAEC,OAAO,QAAQ,EAAE,GAAGH;IAEvC,MAAMI,WAAWf,MAAMgB,MAAM;IAC7B,MAAM,EAAEC,cAAc,EAAE,GAAGT;IAC3B,MAAM,EAAEU,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGb;IAEjD,MAAMc,mBAAsDlB,iBAAiB,CAACmB,GAAGC;YAK3EP;QAJJF,sBAAAA,gCAAAA,UAAYQ,GAAGC;QAEf,8BAA8B;QAC9B,MAAMC,gBAAgBN,2BAAAA,qCAAAA,eAAgBM,aAAa;QACnD,KAAIR,oBAAAA,SAASS,OAAO,cAAhBT,wCAAAA,kBAAkBU,QAAQ,CAACF,gBAA+B;YAC5D,+EAA+E;YAC/E,MAAMG,OAAOR,kBAAkBK,eAA8B;gBAAEI,WAAWZ,SAASS,OAAO;YAAC;YAC3F,IAAIE,MAAM;gBACRA,KAAKE,KAAK;gBACV;YACF;YAEA,iEAAiE;YACjE,IAAIL,0BAAAA,oCAAAA,cAAeM,SAAS,CAACC,QAAQ,CAACrB,kCAAkCsB,IAAI,GAAG;gBAC7E,MAAMC,OAAOb,kBAAkBI,cAAcU,aAAa,EAAiB;oBAAEN,WAAWZ,SAASS,OAAO;gBAAC;gBACzGQ,iBAAAA,2BAAAA,KAAMJ,KAAK;YACb,OAAO;gBACL,MAAMI,OAAOb,kBAAkBI,eAA8B;oBAAEI,WAAWZ,SAASS,OAAO;gBAAC;gBAC3FQ,iBAAAA,2BAAAA,KAAMJ,KAAK;YACb;QACF;IACF;IAEA,MAAMM,uBAAuB7B,wBAAwB;QACnD8B,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,OAAO;QACLjB;QACAN;QAEAwB,YAAY;YACVP,MAAM;QACR;QAEAA,MAAM3B,KAAKmC,MAAM,CACftC,yBAAyB,OAAO;YAC9B,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FW,KAAKT,cAAcS,KAAKG;YACxByB,MAAM;YACN,GAAGN,oBAAoB;YACvB,GAAGvB,KAAK;QACV,IACA;YAAE8B,aAAa;QAAM;IAEzB;AACF,EAAE"}
@@ -28,7 +28,7 @@ const useInteractionTag_unstable = (props, ref)=>{
28
28
  components: {
29
29
  root: 'div'
30
30
  },
31
- root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('div', {
31
+ root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
32
32
  ref,
33
33
  ...props,
34
34
  id
@@ -1 +1 @@
1
- {"version":3,"sources":["useInteractionTag.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useId, slot } from '@fluentui/react-utilities';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\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 */ export const useInteractionTag_unstable = (props, ref)=>{\n const { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n const id = useId('fui-InteractionTag-', props.id);\n const interactionTagPrimaryId = useId('fui-InteractionTagPrimary-');\n const { appearance = 'filled', disabled = false, shape = 'rounded', size = contextSize, value = id } = props;\n return {\n appearance,\n disabled,\n handleTagDismiss,\n interactionTagPrimaryId,\n shape,\n size,\n value,\n components: {\n root: 'div'\n },\n root: slot.always(getNativeElementProps('div', {\n ref,\n ...props,\n id\n }), {\n elementType: 'div'\n })\n };\n};\n"],"names":["useInteractionTag_unstable","props","ref","handleTagDismiss","size","contextSize","useTagGroupContext_unstable","id","useId","interactionTagPrimaryId","appearance","disabled","shape","value","components","root","slot","always","getNativeElementProps","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCAC4B;iCACP;AASjC,MAAMA,6BAA6B,CAACC,OAAOC;IAClD,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGC,IAAAA,4CAA2B;IAC3E,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,uBAAuBP,MAAMM,EAAE;IAChD,MAAME,0BAA0BD,IAAAA,qBAAK,EAAC;IACtC,MAAM,EAAEE,aAAa,QAAQ,EAAEC,WAAW,KAAK,EAAEC,QAAQ,SAAS,EAAER,OAAOC,WAAW,EAAEQ,QAAQN,EAAE,EAAE,GAAGN;IACvG,OAAO;QACHS;QACAC;QACAR;QACAM;QACAG;QACAR;QACAS;QACAC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3ChB;YACA,GAAGD,KAAK;YACRM;QACJ,IAAI;YACAY,aAAa;QACjB;IACJ;AACJ"}
1
+ {"version":3,"sources":["useInteractionTag.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useId, slot } from '@fluentui/react-utilities';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\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 */ export const useInteractionTag_unstable = (props, ref)=>{\n const { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n const id = useId('fui-InteractionTag-', props.id);\n const interactionTagPrimaryId = useId('fui-InteractionTagPrimary-');\n const { appearance = 'filled', disabled = false, shape = 'rounded', size = contextSize, value = id } = props;\n return {\n appearance,\n disabled,\n handleTagDismiss,\n interactionTagPrimaryId,\n shape,\n size,\n value,\n components: {\n root: 'div'\n },\n root: slot.always(getIntrinsicElementProps('div', {\n ref,\n ...props,\n id\n }), {\n elementType: 'div'\n })\n };\n};\n"],"names":["useInteractionTag_unstable","props","ref","handleTagDismiss","size","contextSize","useTagGroupContext_unstable","id","useId","interactionTagPrimaryId","appearance","disabled","shape","value","components","root","slot","always","getIntrinsicElementProps","elementType"],"mappings":";;;;+BAWiBA;;;eAAAA;;;;iEAXM;gCAC+B;iCACV;AASjC,MAAMA,6BAA6B,CAACC,OAAOC;IAClD,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGC,IAAAA,4CAA2B;IAC3E,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,uBAAuBP,MAAMM,EAAE;IAChD,MAAME,0BAA0BD,IAAAA,qBAAK,EAAC;IACtC,MAAM,EAAEE,aAAa,QAAQ,EAAEC,WAAW,KAAK,EAAEC,QAAQ,SAAS,EAAER,OAAOC,WAAW,EAAEQ,QAAQN,EAAE,EAAE,GAAGN;IACvG,OAAO;QACHS;QACAC;QACAR;QACAM;QACAG;QACAR;QACAS;QACAC,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9ChB;YACA,GAAGD,KAAK;YACRM;QACJ,IAAI;YACAY,aAAa;QACjB;IACJ;AACJ"}
@@ -39,7 +39,7 @@ const useInteractionTagPrimary_unstable = (props, ref)=>{
39
39
  primaryText: 'span',
40
40
  secondaryText: 'span'
41
41
  },
42
- root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('button', {
42
+ root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('button', {
43
43
  ref,
44
44
  disabled,
45
45
  id: interactionTagPrimaryId,
@@ -1 +1 @@
1
- {"version":3,"sources":["useInteractionTagPrimary.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-utilities';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\nconst avatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16\n};\nconst avatarShapeMap = {\n rounded: 'square',\n circular: 'circular'\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 */ export const useInteractionTagPrimary_unstable = (props, ref)=>{\n const { appearance, disabled, interactionTagPrimaryId, shape, size } = useInteractionTagContext_unstable();\n const { hasSecondaryAction = false } = props;\n return {\n appearance,\n avatarShape: avatarShapeMap[shape],\n avatarSize: avatarSizeMap[size],\n disabled,\n hasSecondaryAction,\n shape,\n size,\n components: {\n root: 'button',\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span'\n },\n root: slot.always(getNativeElementProps('button', {\n ref,\n disabled,\n id: interactionTagPrimaryId,\n ...props\n }), {\n elementType: 'button'\n }),\n media: slot.optional(props.media, {\n elementType: 'span'\n }),\n icon: slot.optional(props.icon, {\n elementType: 'span'\n }),\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, {\n elementType: 'span'\n })\n };\n};\n"],"names":["useInteractionTagPrimary_unstable","avatarSizeMap","medium","small","avatarShapeMap","rounded","circular","props","ref","appearance","disabled","interactionTagPrimaryId","shape","size","useInteractionTagContext_unstable","hasSecondaryAction","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","slot","always","getNativeElementProps","id","elementType","optional","renderByDefault","defaultProps","children"],"mappings":";;;;+BAoBiBA;;;eAAAA;;;;iEApBM;gCACqB;uCACM;AAClD,MAAMC,gBAAgB;IAClBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACnB;AACA,MAAMC,iBAAiB;IACnBC,SAAS;IACTC,UAAU;AACd;AASW,MAAMN,oCAAoC,CAACO,OAAOC;IACzD,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGC,IAAAA,wDAAiC;IACxG,MAAM,EAAEC,qBAAqB,KAAK,EAAE,GAAGR;IACvC,OAAO;QACHE;QACAO,aAAaZ,cAAc,CAACQ,MAAM;QAClCK,YAAYhB,aAAa,CAACY,KAAK;QAC/BH;QACAK;QACAH;QACAC;QACAK,YAAY;YACRC,MAAM;YACNC,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;QACnB;QACAJ,MAAMK,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,UAAU;YAC9ClB;YACAE;YACAiB,IAAIhB;YACJ,GAAGJ,KAAK;QACZ,IAAI;YACAqB,aAAa;QACjB;QACAR,OAAOI,oBAAI,CAACK,QAAQ,CAACtB,MAAMa,KAAK,EAAE;YAC9BQ,aAAa;QACjB;QACAP,MAAMG,oBAAI,CAACK,QAAQ,CAACtB,MAAMc,IAAI,EAAE;YAC5BO,aAAa;QACjB;QACAN,aAAaE,oBAAI,CAACK,QAAQ,CAACtB,MAAMe,WAAW,EAAE;YAC1CQ,iBAAiB;YACjBC,cAAc;gBACVC,UAAUzB,MAAMyB,QAAQ;YAC5B;YACAJ,aAAa;QACjB;QACAL,eAAeC,oBAAI,CAACK,QAAQ,CAACtB,MAAMgB,aAAa,EAAE;YAC9CK,aAAa;QACjB;IACJ;AACJ"}
1
+ {"version":3,"sources":["useInteractionTagPrimary.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\nconst avatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16\n};\nconst avatarShapeMap = {\n rounded: 'square',\n circular: 'circular'\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 */ export const useInteractionTagPrimary_unstable = (props, ref)=>{\n const { appearance, disabled, interactionTagPrimaryId, shape, size } = useInteractionTagContext_unstable();\n const { hasSecondaryAction = false } = props;\n return {\n appearance,\n avatarShape: avatarShapeMap[shape],\n avatarSize: avatarSizeMap[size],\n disabled,\n hasSecondaryAction,\n shape,\n size,\n components: {\n root: 'button',\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span'\n },\n root: slot.always(getIntrinsicElementProps('button', {\n ref,\n disabled,\n id: interactionTagPrimaryId,\n ...props\n }), {\n elementType: 'button'\n }),\n media: slot.optional(props.media, {\n elementType: 'span'\n }),\n icon: slot.optional(props.icon, {\n elementType: 'span'\n }),\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, {\n elementType: 'span'\n })\n };\n};\n"],"names":["useInteractionTagPrimary_unstable","avatarSizeMap","medium","small","avatarShapeMap","rounded","circular","props","ref","appearance","disabled","interactionTagPrimaryId","shape","size","useInteractionTagContext_unstable","hasSecondaryAction","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","slot","always","getIntrinsicElementProps","id","elementType","optional","renderByDefault","defaultProps","children"],"mappings":";;;;+BAoBiBA;;;eAAAA;;;;iEApBM;gCACwB;uCACG;AAClD,MAAMC,gBAAgB;IAClBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACnB;AACA,MAAMC,iBAAiB;IACnBC,SAAS;IACTC,UAAU;AACd;AASW,MAAMN,oCAAoC,CAACO,OAAOC;IACzD,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAE,GAAGC,IAAAA,wDAAiC;IACxG,MAAM,EAAEC,qBAAqB,KAAK,EAAE,GAAGR;IACvC,OAAO;QACHE;QACAO,aAAaZ,cAAc,CAACQ,MAAM;QAClCK,YAAYhB,aAAa,CAACY,KAAK;QAC/BH;QACAK;QACAH;QACAC;QACAK,YAAY;YACRC,MAAM;YACNC,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;QACnB;QACAJ,MAAMK,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,UAAU;YACjDlB;YACAE;YACAiB,IAAIhB;YACJ,GAAGJ,KAAK;QACZ,IAAI;YACAqB,aAAa;QACjB;QACAR,OAAOI,oBAAI,CAACK,QAAQ,CAACtB,MAAMa,KAAK,EAAE;YAC9BQ,aAAa;QACjB;QACAP,MAAMG,oBAAI,CAACK,QAAQ,CAACtB,MAAMc,IAAI,EAAE;YAC5BO,aAAa;QACjB;QACAN,aAAaE,oBAAI,CAACK,QAAQ,CAACtB,MAAMe,WAAW,EAAE;YAC1CQ,iBAAiB;YACjBC,cAAc;gBACVC,UAAUzB,MAAMyB,QAAQ;YAC5B;YACAJ,aAAa;QACjB;QACAL,eAAeC,oBAAI,CAACK,QAAQ,CAACtB,MAAMgB,aAAa,EAAE;YAC9CK,aAAa;QACjB;IACJ;AACJ"}
@@ -43,7 +43,7 @@ const useInteractionTagSecondary_unstable = (props, ref)=>{
43
43
  components: {
44
44
  root: 'button'
45
45
  },
46
- root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('button', {
46
+ root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('button', {
47
47
  children: /*#__PURE__*/ _react.createElement(_reacticons.DismissRegular, null),
48
48
  type: 'button',
49
49
  disabled,
@@ -1 +1 @@
1
- {"version":3,"sources":["useInteractionTagSecondary.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, slot, useId } from '@fluentui/react-utilities';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\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 */ export const useInteractionTagSecondary_unstable = (props, ref)=>{\n const { appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value } = useInteractionTagContext_unstable();\n const id = useId('fui-InteractionTagSecondary-', props.id);\n const onClick = useEventCallback((ev)=>{\n var _props_onClick;\n props === null || props === void 0 ? void 0 : (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n const onKeyDown = useEventCallback((ev)=>{\n var _props_onKeyDown;\n props === null || props === void 0 ? void 0 : (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, ev);\n if (!ev.defaultPrevented && (ev.key === Delete || ev.key === Backspace)) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n return {\n appearance,\n disabled,\n shape,\n size,\n components: {\n root: 'button'\n },\n root: slot.always(getNativeElementProps('button', {\n children: /*#__PURE__*/ React.createElement(DismissRegular, null),\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":["useInteractionTagSecondary_unstable","props","ref","appearance","disabled","handleTagDismiss","interactionTagPrimaryId","shape","size","value","useInteractionTagContext_unstable","id","useId","onClick","useEventCallback","ev","_props_onClick","call","defaultPrevented","onKeyDown","_props_onKeyDown","key","Delete","Backspace","components","root","slot","always","getNativeElementProps","children","React","createElement","DismissRegular","type","elementType"],"mappings":";;;;+BAaiBA;;;eAAAA;;;;iEAbM;gCAC8C;8BACnC;4BACH;uCACmB;AASvC,MAAMA,sCAAsC,CAACC,OAAOC;IAC3D,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,gBAAgB,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGC,IAAAA,wDAAiC;IACjI,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,gCAAgCX,MAAMU,EAAE;IACzD,MAAME,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACJf,UAAU,QAAQA,UAAU,KAAK,IAAI,KAAK,IAAI,AAACe,CAAAA,iBAAiBf,MAAMY,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAAChB,OAAOc;QAC3J,IAAI,CAACA,GAAGG,gBAAgB,EAAE;YACtBb,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBU,IAAI;gBACrFN;YACJ;QACJ;IACJ;IACA,MAAMU,YAAYL,IAAAA,gCAAgB,EAAC,CAACC;QAChC,IAAIK;QACJnB,UAAU,QAAQA,UAAU,KAAK,IAAI,KAAK,IAAI,AAACmB,CAAAA,mBAAmBnB,MAAMkB,SAAS,AAAD,MAAO,QAAQC,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBH,IAAI,CAAChB,OAAOc;QACnK,IAAI,CAACA,GAAGG,gBAAgB,IAAKH,CAAAA,GAAGM,GAAG,KAAKC,oBAAM,IAAIP,GAAGM,GAAG,KAAKE,uBAAS,AAAD,GAAI;YACrElB,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBU,IAAI;gBACrFN;YACJ;QACJ;IACJ;IACA,OAAO;QACHN;QACAC;QACAG;QACAC;QACAgB,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,UAAU;YAC9CC,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;YAC5DC,MAAM;YACN7B;YACAF;YACA,mBAAmB,CAAC,EAAEI,wBAAwB,CAAC,EAAEK,GAAG,CAAC;YACrD,GAAGV,KAAK;YACRU;YACAE;YACAM;QACJ,IAAI;YACAe,aAAa;QACjB;IACJ;AACJ"}
1
+ {"version":3,"sources":["useInteractionTagSecondary.js"],"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 { useInteractionTagContext_unstable } from '../../contexts/interactionTagContext';\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 */ export const useInteractionTagSecondary_unstable = (props, ref)=>{\n const { appearance, disabled, handleTagDismiss, interactionTagPrimaryId, shape, size, value } = useInteractionTagContext_unstable();\n const id = useId('fui-InteractionTagSecondary-', props.id);\n const onClick = useEventCallback((ev)=>{\n var _props_onClick;\n props === null || props === void 0 ? void 0 : (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n const onKeyDown = useEventCallback((ev)=>{\n var _props_onKeyDown;\n props === null || props === void 0 ? void 0 : (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, ev);\n if (!ev.defaultPrevented && (ev.key === Delete || ev.key === Backspace)) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n return {\n appearance,\n disabled,\n shape,\n size,\n components: {\n root: 'button'\n },\n root: slot.always(getIntrinsicElementProps('button', {\n children: /*#__PURE__*/ React.createElement(DismissRegular, null),\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":["useInteractionTagSecondary_unstable","props","ref","appearance","disabled","handleTagDismiss","interactionTagPrimaryId","shape","size","value","useInteractionTagContext_unstable","id","useId","onClick","useEventCallback","ev","_props_onClick","call","defaultPrevented","onKeyDown","_props_onKeyDown","key","Delete","Backspace","components","root","slot","always","getIntrinsicElementProps","children","React","createElement","DismissRegular","type","elementType"],"mappings":";;;;+BAaiBA;;;eAAAA;;;;iEAbM;gCACiD;8BACtC;4BACH;uCACmB;AASvC,MAAMA,sCAAsC,CAACC,OAAOC;IAC3D,MAAM,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,gBAAgB,EAAEC,uBAAuB,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGC,IAAAA,wDAAiC;IACjI,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,gCAAgCX,MAAMU,EAAE;IACzD,MAAME,UAAUC,IAAAA,gCAAgB,EAAC,CAACC;QAC9B,IAAIC;QACJf,UAAU,QAAQA,UAAU,KAAK,IAAI,KAAK,IAAI,AAACe,CAAAA,iBAAiBf,MAAMY,OAAO,AAAD,MAAO,QAAQG,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeC,IAAI,CAAChB,OAAOc;QAC3J,IAAI,CAACA,GAAGG,gBAAgB,EAAE;YACtBb,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBU,IAAI;gBACrFN;YACJ;QACJ;IACJ;IACA,MAAMU,YAAYL,IAAAA,gCAAgB,EAAC,CAACC;QAChC,IAAIK;QACJnB,UAAU,QAAQA,UAAU,KAAK,IAAI,KAAK,IAAI,AAACmB,CAAAA,mBAAmBnB,MAAMkB,SAAS,AAAD,MAAO,QAAQC,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBH,IAAI,CAAChB,OAAOc;QACnK,IAAI,CAACA,GAAGG,gBAAgB,IAAKH,CAAAA,GAAGM,GAAG,KAAKC,oBAAM,IAAIP,GAAGM,GAAG,KAAKE,uBAAS,AAAD,GAAI;YACrElB,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBU,IAAI;gBACrFN;YACJ;QACJ;IACJ;IACA,OAAO;QACHN;QACAC;QACAG;QACAC;QACAgB,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,UAAU;YACjDC,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;YAC5DC,MAAM;YACN7B;YACAF;YACA,mBAAmB,CAAC,EAAEI,wBAAwB,CAAC,EAAEK,GAAG,CAAC;YACrD,GAAGV,KAAK;YACRU;YACAE;YACAM;QACJ,IAAI;YACAe,aAAa;QACjB;IACJ;AACJ"}
@@ -62,7 +62,7 @@ const useTag_unstable = (props, ref)=>{
62
62
  secondaryText: 'span',
63
63
  dismissIcon: 'span'
64
64
  },
65
- root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)(elementType, {
65
+ root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)(elementType, {
66
66
  ref,
67
67
  ...props,
68
68
  id,
@@ -1 +1 @@
1
- {"version":3,"sources":["useTag.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, useId, slot } from '@fluentui/react-utilities';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\nconst tagAvatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16\n};\nconst tagAvatarShapeMap = {\n rounded: 'square',\n circular: 'circular'\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 */ export const useTag_unstable = (props, ref)=>{\n const { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n const id = useId('fui-Tag', props.id);\n const { appearance = 'filled', disabled = false, dismissible = false, shape = 'rounded', size = contextSize, value = id } = props;\n const dismissOnClick = useEventCallback((ev)=>{\n var _props_onClick;\n (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n const dismissOnKeyDown = useEventCallback((ev)=>{\n var _props_onKeyDown;\n props === null || props === void 0 ? void 0 : (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, ev);\n if (!ev.defaultPrevented && (ev.key === Delete || ev.key === Backspace)) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n const elementType = dismissible ? 'button' : 'span';\n return {\n appearance,\n avatarShape: tagAvatarShapeMap[shape],\n avatarSize: tagAvatarSizeMap[size],\n disabled,\n dismissible,\n shape,\n size,\n components: {\n root: elementType,\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span',\n dismissIcon: 'span'\n },\n root: slot.always(getNativeElementProps(elementType, {\n ref,\n ...props,\n id,\n ...dismissible && {\n onClick: dismissOnClick,\n onKeyDown: dismissOnKeyDown\n }\n }), {\n elementType\n }),\n media: slot.optional(props.media, {\n elementType: 'span'\n }),\n icon: slot.optional(props.icon, {\n elementType: 'span'\n }),\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, {\n elementType: 'span'\n }),\n dismissIcon: slot.optional(props.dismissIcon, {\n renderByDefault: dismissible,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(DismissRegular, null),\n role: 'img'\n },\n elementType: 'span'\n })\n };\n};\n"],"names":["useTag_unstable","tagAvatarSizeMap","medium","small","tagAvatarShapeMap","rounded","circular","props","ref","handleTagDismiss","size","contextSize","useTagGroupContext_unstable","id","useId","appearance","disabled","dismissible","shape","value","dismissOnClick","useEventCallback","ev","_props_onClick","onClick","call","defaultPrevented","dismissOnKeyDown","_props_onKeyDown","onKeyDown","key","Delete","Backspace","elementType","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","dismissIcon","slot","always","getNativeElementProps","optional","renderByDefault","defaultProps","children","React","createElement","DismissRegular","role"],"mappings":";;;;+BAsBiBA;;;eAAAA;;;;iEAtBM;gCAC8C;4BACtC;8BACG;iCACU;AAC5C,MAAMC,mBAAmB;IACrBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACnB;AACA,MAAMC,oBAAoB;IACtBC,SAAS;IACTC,UAAU;AACd;AASW,MAAMN,kBAAkB,CAACO,OAAOC;IACvC,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGC,IAAAA,4CAA2B;IAC3E,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,WAAWP,MAAMM,EAAE;IACpC,MAAM,EAAEE,aAAa,QAAQ,EAAEC,WAAW,KAAK,EAAEC,cAAc,KAAK,EAAEC,QAAQ,SAAS,EAAER,OAAOC,WAAW,EAAEQ,QAAQN,EAAE,EAAE,GAAGN;IAC5H,MAAMa,iBAAiBC,IAAAA,gCAAgB,EAAC,CAACC;QACrC,IAAIC;QACHA,CAAAA,iBAAiBhB,MAAMiB,OAAO,AAAD,MAAO,QAAQD,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,IAAI,CAAClB,OAAOe;QAC7G,IAAI,CAACA,GAAGI,gBAAgB,EAAE;YACtBjB,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBa,IAAI;gBACrFH;YACJ;QACJ;IACJ;IACA,MAAMQ,mBAAmBN,IAAAA,gCAAgB,EAAC,CAACC;QACvC,IAAIM;QACJrB,UAAU,QAAQA,UAAU,KAAK,IAAI,KAAK,IAAI,AAACqB,CAAAA,mBAAmBrB,MAAMsB,SAAS,AAAD,MAAO,QAAQD,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBH,IAAI,CAAClB,OAAOe;QACnK,IAAI,CAACA,GAAGI,gBAAgB,IAAKJ,CAAAA,GAAGQ,GAAG,KAAKC,oBAAM,IAAIT,GAAGQ,GAAG,KAAKE,uBAAS,AAAD,GAAI;YACrEvB,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBa,IAAI;gBACrFH;YACJ;QACJ;IACJ;IACA,MAAMc,cAAchB,cAAc,WAAW;IAC7C,OAAO;QACHF;QACAmB,aAAa9B,iBAAiB,CAACc,MAAM;QACrCiB,YAAYlC,gBAAgB,CAACS,KAAK;QAClCM;QACAC;QACAC;QACAR;QACA0B,YAAY;YACRC,MAAMJ;YACNK,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;YACfC,aAAa;QACjB;QACAL,MAAMM,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAACZ,aAAa;YACjDzB;YACA,GAAGD,KAAK;YACRM;YACA,GAAGI,eAAe;gBACdO,SAASJ;gBACTS,WAAWF;YACf,CAAC;QACL,IAAI;YACAM;QACJ;QACAK,OAAOK,oBAAI,CAACG,QAAQ,CAACvC,MAAM+B,KAAK,EAAE;YAC9BL,aAAa;QACjB;QACAM,MAAMI,oBAAI,CAACG,QAAQ,CAACvC,MAAMgC,IAAI,EAAE;YAC5BN,aAAa;QACjB;QACAO,aAAaG,oBAAI,CAACG,QAAQ,CAACvC,MAAMiC,WAAW,EAAE;YAC1CO,iBAAiB;YACjBC,cAAc;gBACVC,UAAU1C,MAAM0C,QAAQ;YAC5B;YACAhB,aAAa;QACjB;QACAQ,eAAeE,oBAAI,CAACG,QAAQ,CAACvC,MAAMkC,aAAa,EAAE;YAC9CR,aAAa;QACjB;QACAS,aAAaC,oBAAI,CAACG,QAAQ,CAACvC,MAAMmC,WAAW,EAAE;YAC1CK,iBAAiB9B;YACjB+B,cAAc;gBACVC,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;gBAC5DC,MAAM;YACV;YACApB,aAAa;QACjB;IACJ;AACJ"}
1
+ {"version":3,"sources":["useTag.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, useId, slot } from '@fluentui/react-utilities';\nimport { DismissRegular } from '@fluentui/react-icons';\nimport { Delete, Backspace } from '@fluentui/keyboard-keys';\nimport { useTagGroupContext_unstable } from '../../contexts/tagGroupContext';\nconst tagAvatarSizeMap = {\n medium: 28,\n small: 20,\n 'extra-small': 16\n};\nconst tagAvatarShapeMap = {\n rounded: 'square',\n circular: 'circular'\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 */ export const useTag_unstable = (props, ref)=>{\n const { handleTagDismiss, size: contextSize } = useTagGroupContext_unstable();\n const id = useId('fui-Tag', props.id);\n const { appearance = 'filled', disabled = false, dismissible = false, shape = 'rounded', size = contextSize, value = id } = props;\n const dismissOnClick = useEventCallback((ev)=>{\n var _props_onClick;\n (_props_onClick = props.onClick) === null || _props_onClick === void 0 ? void 0 : _props_onClick.call(props, ev);\n if (!ev.defaultPrevented) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n const dismissOnKeyDown = useEventCallback((ev)=>{\n var _props_onKeyDown;\n props === null || props === void 0 ? void 0 : (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, ev);\n if (!ev.defaultPrevented && (ev.key === Delete || ev.key === Backspace)) {\n handleTagDismiss === null || handleTagDismiss === void 0 ? void 0 : handleTagDismiss(ev, {\n value\n });\n }\n });\n const elementType = dismissible ? 'button' : 'span';\n return {\n appearance,\n avatarShape: tagAvatarShapeMap[shape],\n avatarSize: tagAvatarSizeMap[size],\n disabled,\n dismissible,\n shape,\n size,\n components: {\n root: elementType,\n media: 'span',\n icon: 'span',\n primaryText: 'span',\n secondaryText: 'span',\n dismissIcon: 'span'\n },\n root: slot.always(getIntrinsicElementProps(elementType, {\n ref,\n ...props,\n id,\n ...dismissible && {\n onClick: dismissOnClick,\n onKeyDown: dismissOnKeyDown\n }\n }), {\n elementType\n }),\n media: slot.optional(props.media, {\n elementType: 'span'\n }),\n icon: slot.optional(props.icon, {\n elementType: 'span'\n }),\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, {\n elementType: 'span'\n }),\n dismissIcon: slot.optional(props.dismissIcon, {\n renderByDefault: dismissible,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(DismissRegular, null),\n role: 'img'\n },\n elementType: 'span'\n })\n };\n};\n"],"names":["useTag_unstable","tagAvatarSizeMap","medium","small","tagAvatarShapeMap","rounded","circular","props","ref","handleTagDismiss","size","contextSize","useTagGroupContext_unstable","id","useId","appearance","disabled","dismissible","shape","value","dismissOnClick","useEventCallback","ev","_props_onClick","onClick","call","defaultPrevented","dismissOnKeyDown","_props_onKeyDown","onKeyDown","key","Delete","Backspace","elementType","avatarShape","avatarSize","components","root","media","icon","primaryText","secondaryText","dismissIcon","slot","always","getIntrinsicElementProps","optional","renderByDefault","defaultProps","children","React","createElement","DismissRegular","role"],"mappings":";;;;+BAsBiBA;;;eAAAA;;;;iEAtBM;gCACiD;4BACzC;8BACG;iCACU;AAC5C,MAAMC,mBAAmB;IACrBC,QAAQ;IACRC,OAAO;IACP,eAAe;AACnB;AACA,MAAMC,oBAAoB;IACtBC,SAAS;IACTC,UAAU;AACd;AASW,MAAMN,kBAAkB,CAACO,OAAOC;IACvC,MAAM,EAAEC,gBAAgB,EAAEC,MAAMC,WAAW,EAAE,GAAGC,IAAAA,4CAA2B;IAC3E,MAAMC,KAAKC,IAAAA,qBAAK,EAAC,WAAWP,MAAMM,EAAE;IACpC,MAAM,EAAEE,aAAa,QAAQ,EAAEC,WAAW,KAAK,EAAEC,cAAc,KAAK,EAAEC,QAAQ,SAAS,EAAER,OAAOC,WAAW,EAAEQ,QAAQN,EAAE,EAAE,GAAGN;IAC5H,MAAMa,iBAAiBC,IAAAA,gCAAgB,EAAC,CAACC;QACrC,IAAIC;QACHA,CAAAA,iBAAiBhB,MAAMiB,OAAO,AAAD,MAAO,QAAQD,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeE,IAAI,CAAClB,OAAOe;QAC7G,IAAI,CAACA,GAAGI,gBAAgB,EAAE;YACtBjB,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBa,IAAI;gBACrFH;YACJ;QACJ;IACJ;IACA,MAAMQ,mBAAmBN,IAAAA,gCAAgB,EAAC,CAACC;QACvC,IAAIM;QACJrB,UAAU,QAAQA,UAAU,KAAK,IAAI,KAAK,IAAI,AAACqB,CAAAA,mBAAmBrB,MAAMsB,SAAS,AAAD,MAAO,QAAQD,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBH,IAAI,CAAClB,OAAOe;QACnK,IAAI,CAACA,GAAGI,gBAAgB,IAAKJ,CAAAA,GAAGQ,GAAG,KAAKC,oBAAM,IAAIT,GAAGQ,GAAG,KAAKE,uBAAS,AAAD,GAAI;YACrEvB,qBAAqB,QAAQA,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBa,IAAI;gBACrFH;YACJ;QACJ;IACJ;IACA,MAAMc,cAAchB,cAAc,WAAW;IAC7C,OAAO;QACHF;QACAmB,aAAa9B,iBAAiB,CAACc,MAAM;QACrCiB,YAAYlC,gBAAgB,CAACS,KAAK;QAClCM;QACAC;QACAC;QACAR;QACA0B,YAAY;YACRC,MAAMJ;YACNK,OAAO;YACPC,MAAM;YACNC,aAAa;YACbC,eAAe;YACfC,aAAa;QACjB;QACAL,MAAMM,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAACZ,aAAa;YACpDzB;YACA,GAAGD,KAAK;YACRM;YACA,GAAGI,eAAe;gBACdO,SAASJ;gBACTS,WAAWF;YACf,CAAC;QACL,IAAI;YACAM;QACJ;QACAK,OAAOK,oBAAI,CAACG,QAAQ,CAACvC,MAAM+B,KAAK,EAAE;YAC9BL,aAAa;QACjB;QACAM,MAAMI,oBAAI,CAACG,QAAQ,CAACvC,MAAMgC,IAAI,EAAE;YAC5BN,aAAa;QACjB;QACAO,aAAaG,oBAAI,CAACG,QAAQ,CAACvC,MAAMiC,WAAW,EAAE;YAC1CO,iBAAiB;YACjBC,cAAc;gBACVC,UAAU1C,MAAM0C,QAAQ;YAC5B;YACAhB,aAAa;QACjB;QACAQ,eAAeE,oBAAI,CAACG,QAAQ,CAACvC,MAAMkC,aAAa,EAAE;YAC9CR,aAAa;QACjB;QACAS,aAAaC,oBAAI,CAACG,QAAQ,CAACvC,MAAMmC,WAAW,EAAE;YAC1CK,iBAAiB9B;YACjB+B,cAAc;gBACVC,UAAU,WAAW,GAAGC,OAAMC,aAAa,CAACC,0BAAc,EAAE;gBAC5DC,MAAM;YACV;YACApB,aAAa;QACjB;IACJ;AACJ"}
@@ -58,7 +58,10 @@ const useTagGroup_unstable = (props, ref)=>{
58
58
  components: {
59
59
  root: 'div'
60
60
  },
61
- root: _reactutilities.slot.always((0, _reactutilities.getNativeElementProps)('div', {
61
+ root: _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
62
+ // FIXME:
63
+ // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
64
+ // but since it would be a breaking change to fix it, we are casting ref to it's proper type
62
65
  ref: (0, _reactutilities.useMergedRefs)(ref, innerRef),
63
66
  role: 'toolbar',
64
67
  ...arrowNavigationProps,
@@ -1 +1 @@
1
- {"version":3,"sources":["useTagGroup.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { interactionTagSecondaryClassNames } from '../InteractionTagSecondary/useInteractionTagSecondaryStyles.styles';\n/**\n * Create the state required to render TagGroup.\n *\n * The returned state can be modified with hooks such as useTagGroupStyles_unstable,\n * before being passed to renderTagGroup_unstable.\n *\n * @param props - props from this instance of TagGroup\n * @param ref - reference to root HTMLDivElement of TagGroup\n */ export const useTagGroup_unstable = (props, ref)=>{\n const { onDismiss, size = 'medium' } = props;\n const innerRef = React.useRef();\n const { targetDocument } = useFluent();\n const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n const handleTagDismiss = useEventCallback((e, data)=>{\n var _innerRef_current;\n onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(e, data);\n // set focus after tag dismiss\n const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;\n if ((_innerRef_current = innerRef.current) === null || _innerRef_current === void 0 ? void 0 : _innerRef_current.contains(activeElement)) {\n // focus on next tag only if the active element is within the current tag group\n const next = findNextFocusable(activeElement, {\n container: innerRef.current\n });\n if (next) {\n next.focus();\n return;\n }\n // if there is no next focusable, focus on the previous focusable\n if (activeElement === null || activeElement === void 0 ? void 0 : activeElement.className.includes(interactionTagSecondaryClassNames.root)) {\n const prev = findPrevFocusable(activeElement.parentElement, {\n container: innerRef.current\n });\n prev === null || prev === void 0 ? void 0 : prev.focus();\n } else {\n const prev = findPrevFocusable(activeElement, {\n container: innerRef.current\n });\n prev === null || prev === void 0 ? void 0 : prev.focus();\n }\n }\n });\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: true,\n axis: 'both',\n memorizeCurrent: true\n });\n return {\n handleTagDismiss,\n size,\n components: {\n root: 'div'\n },\n root: slot.always(getNativeElementProps('div', {\n ref: useMergedRefs(ref, innerRef),\n role: 'toolbar',\n ...arrowNavigationProps,\n ...props\n }), {\n elementType: 'div'\n })\n };\n};\n"],"names":["useTagGroup_unstable","props","ref","onDismiss","size","innerRef","React","useRef","targetDocument","useFluent","findNextFocusable","findPrevFocusable","useFocusFinders","handleTagDismiss","useEventCallback","e","data","_innerRef_current","activeElement","current","contains","next","container","focus","className","includes","interactionTagSecondaryClassNames","root","prev","parentElement","arrowNavigationProps","useArrowNavigationGroup","circular","axis","memorizeCurrent","components","slot","always","getNativeElementProps","useMergedRefs","role","elementType"],"mappings":";;;;+BAaiBA;;;eAAAA;;;;iEAbM;gCACsD;8BACpB;qCACT;wDACE;AASvC,MAAMA,uBAAuB,CAACC,OAAOC;IAC5C,MAAM,EAAEC,SAAS,EAAEC,OAAO,QAAQ,EAAE,GAAGH;IACvC,MAAMI,WAAWC,OAAMC,MAAM;IAC7B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAM,EAAEC,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGC,IAAAA,6BAAe;IAChE,MAAMC,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,GAAGC;QAC1C,IAAIC;QACJd,cAAc,QAAQA,cAAc,KAAK,IAAI,KAAK,IAAIA,UAAUY,GAAGC;QACnE,8BAA8B;QAC9B,MAAME,gBAAgBV,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeU,aAAa;QAClH,IAAI,AAACD,CAAAA,oBAAoBZ,SAASc,OAAO,AAAD,MAAO,QAAQF,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBG,QAAQ,CAACF,gBAAgB;YACtI,+EAA+E;YAC/E,MAAMG,OAAOX,kBAAkBQ,eAAe;gBAC1CI,WAAWjB,SAASc,OAAO;YAC/B;YACA,IAAIE,MAAM;gBACNA,KAAKE,KAAK;gBACV;YACJ;YACA,iEAAiE;YACjE,IAAIL,kBAAkB,QAAQA,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcM,SAAS,CAACC,QAAQ,CAACC,yEAAiC,CAACC,IAAI,GAAG;gBACxI,MAAMC,OAAOjB,kBAAkBO,cAAcW,aAAa,EAAE;oBACxDP,WAAWjB,SAASc,OAAO;gBAC/B;gBACAS,SAAS,QAAQA,SAAS,KAAK,IAAI,KAAK,IAAIA,KAAKL,KAAK;YAC1D,OAAO;gBACH,MAAMK,OAAOjB,kBAAkBO,eAAe;oBAC1CI,WAAWjB,SAASc,OAAO;gBAC/B;gBACAS,SAAS,QAAQA,SAAS,KAAK,IAAI,KAAK,IAAIA,KAAKL,KAAK;YAC1D;QACJ;IACJ;IACA,MAAMO,uBAAuBC,IAAAA,qCAAuB,EAAC;QACjDC,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACrB;IACA,OAAO;QACHrB;QACAT;QACA+B,YAAY;YACRR,MAAM;QACV;QACAA,MAAMS,oBAAI,CAACC,MAAM,CAACC,IAAAA,qCAAqB,EAAC,OAAO;YAC3CpC,KAAKqC,IAAAA,6BAAa,EAACrC,KAAKG;YACxBmC,MAAM;YACN,GAAGV,oBAAoB;YACvB,GAAG7B,KAAK;QACZ,IAAI;YACAwC,aAAa;QACjB;IACJ;AACJ"}
1
+ {"version":3,"sources":["useTagGroup.js"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, useEventCallback, useMergedRefs, slot } from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { interactionTagSecondaryClassNames } from '../InteractionTagSecondary/useInteractionTagSecondaryStyles.styles';\n/**\n * Create the state required to render TagGroup.\n *\n * The returned state can be modified with hooks such as useTagGroupStyles_unstable,\n * before being passed to renderTagGroup_unstable.\n *\n * @param props - props from this instance of TagGroup\n * @param ref - reference to root HTMLDivElement of TagGroup\n */ export const useTagGroup_unstable = (props, ref)=>{\n const { onDismiss, size = 'medium' } = props;\n const innerRef = React.useRef();\n const { targetDocument } = useFluent();\n const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n const handleTagDismiss = useEventCallback((e, data)=>{\n var _innerRef_current;\n onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss(e, data);\n // set focus after tag dismiss\n const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;\n if ((_innerRef_current = innerRef.current) === null || _innerRef_current === void 0 ? void 0 : _innerRef_current.contains(activeElement)) {\n // focus on next tag only if the active element is within the current tag group\n const next = findNextFocusable(activeElement, {\n container: innerRef.current\n });\n if (next) {\n next.focus();\n return;\n }\n // if there is no next focusable, focus on the previous focusable\n if (activeElement === null || activeElement === void 0 ? void 0 : activeElement.className.includes(interactionTagSecondaryClassNames.root)) {\n const prev = findPrevFocusable(activeElement.parentElement, {\n container: innerRef.current\n });\n prev === null || prev === void 0 ? void 0 : prev.focus();\n } else {\n const prev = findPrevFocusable(activeElement, {\n container: innerRef.current\n });\n prev === null || prev === void 0 ? void 0 : prev.focus();\n }\n }\n });\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: true,\n axis: 'both',\n memorizeCurrent: true\n });\n return {\n handleTagDismiss,\n size,\n components: {\n root: 'div'\n },\n root: slot.always(getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: useMergedRefs(ref, innerRef),\n role: 'toolbar',\n ...arrowNavigationProps,\n ...props\n }), {\n elementType: 'div'\n })\n };\n};\n"],"names":["useTagGroup_unstable","props","ref","onDismiss","size","innerRef","React","useRef","targetDocument","useFluent","findNextFocusable","findPrevFocusable","useFocusFinders","handleTagDismiss","useEventCallback","e","data","_innerRef_current","activeElement","current","contains","next","container","focus","className","includes","interactionTagSecondaryClassNames","root","prev","parentElement","arrowNavigationProps","useArrowNavigationGroup","circular","axis","memorizeCurrent","components","slot","always","getIntrinsicElementProps","useMergedRefs","role","elementType"],"mappings":";;;;+BAaiBA;;;eAAAA;;;;iEAbM;gCACyD;8BACvB;qCACT;wDACE;AASvC,MAAMA,uBAAuB,CAACC,OAAOC;IAC5C,MAAM,EAAEC,SAAS,EAAEC,OAAO,QAAQ,EAAE,GAAGH;IACvC,MAAMI,WAAWC,OAAMC,MAAM;IAC7B,MAAM,EAAEC,cAAc,EAAE,GAAGC,IAAAA,uCAAS;IACpC,MAAM,EAAEC,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGC,IAAAA,6BAAe;IAChE,MAAMC,mBAAmBC,IAAAA,gCAAgB,EAAC,CAACC,GAAGC;QAC1C,IAAIC;QACJd,cAAc,QAAQA,cAAc,KAAK,IAAI,KAAK,IAAIA,UAAUY,GAAGC;QACnE,8BAA8B;QAC9B,MAAME,gBAAgBV,mBAAmB,QAAQA,mBAAmB,KAAK,IAAI,KAAK,IAAIA,eAAeU,aAAa;QAClH,IAAI,AAACD,CAAAA,oBAAoBZ,SAASc,OAAO,AAAD,MAAO,QAAQF,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBG,QAAQ,CAACF,gBAAgB;YACtI,+EAA+E;YAC/E,MAAMG,OAAOX,kBAAkBQ,eAAe;gBAC1CI,WAAWjB,SAASc,OAAO;YAC/B;YACA,IAAIE,MAAM;gBACNA,KAAKE,KAAK;gBACV;YACJ;YACA,iEAAiE;YACjE,IAAIL,kBAAkB,QAAQA,kBAAkB,KAAK,IAAI,KAAK,IAAIA,cAAcM,SAAS,CAACC,QAAQ,CAACC,yEAAiC,CAACC,IAAI,GAAG;gBACxI,MAAMC,OAAOjB,kBAAkBO,cAAcW,aAAa,EAAE;oBACxDP,WAAWjB,SAASc,OAAO;gBAC/B;gBACAS,SAAS,QAAQA,SAAS,KAAK,IAAI,KAAK,IAAIA,KAAKL,KAAK;YAC1D,OAAO;gBACH,MAAMK,OAAOjB,kBAAkBO,eAAe;oBAC1CI,WAAWjB,SAASc,OAAO;gBAC/B;gBACAS,SAAS,QAAQA,SAAS,KAAK,IAAI,KAAK,IAAIA,KAAKL,KAAK;YAC1D;QACJ;IACJ;IACA,MAAMO,uBAAuBC,IAAAA,qCAAuB,EAAC;QACjDC,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACrB;IACA,OAAO;QACHrB;QACAT;QACA+B,YAAY;YACRR,MAAM;QACV;QACAA,MAAMS,oBAAI,CAACC,MAAM,CAACC,IAAAA,wCAAwB,EAAC,OAAO;YAC9C,SAAS;YACT,4EAA4E;YAC5E,4FAA4F;YAC5FpC,KAAKqC,IAAAA,6BAAa,EAACrC,KAAKG;YACxBmC,MAAM;YACN,GAAGV,oBAAoB;YACvB,GAAG7B,KAAK;QACZ,IAAI;YACAwC,aAAa;QACjB;IACJ;AACJ"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-tags",
3
- "version": "9.0.0",
3
+ "version": "9.0.1",
4
4
  "description": "Fluent UI Tag component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -37,14 +37,14 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@fluentui/keyboard-keys": "^9.0.6",
40
- "@fluentui/react-aria": "^9.3.39",
41
- "@fluentui/react-avatar": "^9.5.36",
40
+ "@fluentui/react-aria": "^9.3.40",
41
+ "@fluentui/react-avatar": "^9.5.37",
42
42
  "@fluentui/react-icons": "^2.0.217",
43
- "@fluentui/react-jsx-runtime": "^9.0.13",
43
+ "@fluentui/react-jsx-runtime": "^9.0.14",
44
44
  "@fluentui/react-shared-contexts": "^9.9.2",
45
- "@fluentui/react-tabster": "^9.13.3",
45
+ "@fluentui/react-tabster": "^9.13.4",
46
46
  "@fluentui/react-theme": "^9.1.14",
47
- "@fluentui/react-utilities": "^9.14.0",
47
+ "@fluentui/react-utilities": "^9.14.1",
48
48
  "@griffel/react": "^1.5.14",
49
49
  "@swc/helpers": "^0.5.1"
50
50
  },