@fluentui/react-persona 9.2.4 → 9.2.6

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 (46) hide show
  1. package/.swcrc +30 -0
  2. package/CHANGELOG.json +85 -1
  3. package/CHANGELOG.md +29 -2
  4. package/lib/Persona.js.map +1 -1
  5. package/lib/components/Persona/Persona.js.map +1 -1
  6. package/lib/components/Persona/Persona.types.js.map +1 -1
  7. package/lib/components/Persona/index.js.map +1 -1
  8. package/lib/components/Persona/renderPersona.js +2 -16
  9. package/lib/components/Persona/renderPersona.js.map +1 -1
  10. package/lib/components/Persona/usePersona.js +1 -0
  11. package/lib/components/Persona/usePersona.js.map +1 -1
  12. package/lib/components/Persona/usePersonaStyles.js.map +1 -1
  13. package/lib/index.js.map +1 -1
  14. package/lib-commonjs/Persona.js +5 -4
  15. package/lib-commonjs/Persona.js.map +1 -1
  16. package/lib-commonjs/components/Persona/Persona.js +19 -21
  17. package/lib-commonjs/components/Persona/Persona.js.map +1 -1
  18. package/lib-commonjs/components/Persona/Persona.types.js +3 -2
  19. package/lib-commonjs/components/Persona/Persona.types.js.map +1 -1
  20. package/lib-commonjs/components/Persona/index.js +9 -8
  21. package/lib-commonjs/components/Persona/index.js.map +1 -1
  22. package/lib-commonjs/components/Persona/renderPersona.js +15 -35
  23. package/lib-commonjs/components/Persona/renderPersona.js.map +1 -1
  24. package/lib-commonjs/components/Persona/usePersona.js +80 -84
  25. package/lib-commonjs/components/Persona/usePersona.js.map +1 -1
  26. package/lib-commonjs/components/Persona/usePersonaStyles.js +252 -208
  27. package/lib-commonjs/components/Persona/usePersonaStyles.js.map +1 -1
  28. package/lib-commonjs/index.js +16 -33
  29. package/lib-commonjs/index.js.map +1 -1
  30. package/package.json +10 -9
  31. package/lib-amd/Persona.js +0 -6
  32. package/lib-amd/Persona.js.map +0 -1
  33. package/lib-amd/components/Persona/Persona.js +0 -18
  34. package/lib-amd/components/Persona/Persona.js.map +0 -1
  35. package/lib-amd/components/Persona/Persona.types.js +0 -5
  36. package/lib-amd/components/Persona/Persona.types.js.map +0 -1
  37. package/lib-amd/components/Persona/index.js +0 -10
  38. package/lib-amd/components/Persona/index.js.map +0 -1
  39. package/lib-amd/components/Persona/renderPersona.js +0 -24
  40. package/lib-amd/components/Persona/renderPersona.js.map +0 -1
  41. package/lib-amd/components/Persona/usePersona.js +0 -84
  42. package/lib-amd/components/Persona/usePersona.js.map +0 -1
  43. package/lib-amd/components/Persona/usePersonaStyles.js +0 -191
  44. package/lib-amd/components/Persona/usePersonaStyles.js.map +0 -1
  45. package/lib-amd/index.js +0 -11
  46. package/lib-amd/index.js.map +0 -1
package/.swcrc ADDED
@@ -0,0 +1,30 @@
1
+ {
2
+ "$schema": "https://json.schemastore.org/swcrc",
3
+ "exclude": [
4
+ "/testing",
5
+ "/**/*.cy.ts",
6
+ "/**/*.cy.tsx",
7
+ "/**/*.spec.ts",
8
+ "/**/*.spec.tsx",
9
+ "/**/*.test.ts",
10
+ "/**/*.test.tsx"
11
+ ],
12
+ "jsc": {
13
+ "parser": {
14
+ "syntax": "typescript",
15
+ "tsx": true,
16
+ "decorators": false,
17
+ "dynamicImport": false
18
+ },
19
+ "externalHelpers": true,
20
+ "transform": {
21
+ "react": {
22
+ "runtime": "classic",
23
+ "useSpread": true
24
+ }
25
+ },
26
+ "target": "es2019"
27
+ },
28
+ "minify": false,
29
+ "sourceMaps": true
30
+ }
package/CHANGELOG.json CHANGED
@@ -2,7 +2,91 @@
2
2
  "name": "@fluentui/react-persona",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 16 Mar 2023 14:33:33 GMT",
5
+ "date": "Tue, 04 Apr 2023 18:42:19 GMT",
6
+ "tag": "@fluentui/react-persona_v9.2.6",
7
+ "version": "9.2.6",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "beachball",
12
+ "package": "@fluentui/react-persona",
13
+ "comment": "Bump @fluentui/react-avatar to v9.4.7",
14
+ "commit": "37a3a6eda1fd41086edd99a0b1560a8740f8c6c5"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-persona",
19
+ "comment": "Bump @fluentui/react-badge to v9.1.7",
20
+ "commit": "37a3a6eda1fd41086edd99a0b1560a8740f8c6c5"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-persona",
25
+ "comment": "Bump @fluentui/react-utilities to v9.7.3",
26
+ "commit": "37a3a6eda1fd41086edd99a0b1560a8740f8c6c5"
27
+ }
28
+ ]
29
+ }
30
+ },
31
+ {
32
+ "date": "Tue, 21 Mar 2023 21:23:42 GMT",
33
+ "tag": "@fluentui/react-persona_v9.2.5",
34
+ "version": "9.2.5",
35
+ "comments": {
36
+ "patch": [
37
+ {
38
+ "author": "tristan.watanabe@gmail.com",
39
+ "package": "@fluentui/react-persona",
40
+ "commit": "ead1c6d4c2ac3f3596b62b8cbc07b0a03041f11f",
41
+ "comment": "fix: add node field to package.json exports map."
42
+ },
43
+ {
44
+ "author": "tristan.watanabe@gmail.com",
45
+ "package": "@fluentui/react-persona",
46
+ "commit": "2fac1a139149bd13b76b1306207bc988dca9c72c",
47
+ "comment": "chore: migrate to swc transpilation approach."
48
+ },
49
+ {
50
+ "author": "beachball",
51
+ "package": "@fluentui/react-persona",
52
+ "comment": "Bump @fluentui/react-avatar to v9.4.5",
53
+ "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
54
+ },
55
+ {
56
+ "author": "beachball",
57
+ "package": "@fluentui/react-persona",
58
+ "comment": "Bump @fluentui/react-badge to v9.1.5",
59
+ "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
60
+ },
61
+ {
62
+ "author": "beachball",
63
+ "package": "@fluentui/react-persona",
64
+ "comment": "Bump @fluentui/react-shared-contexts to v9.3.2",
65
+ "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
66
+ },
67
+ {
68
+ "author": "beachball",
69
+ "package": "@fluentui/react-persona",
70
+ "comment": "Bump @fluentui/react-theme to v9.1.7",
71
+ "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
72
+ },
73
+ {
74
+ "author": "beachball",
75
+ "package": "@fluentui/react-persona",
76
+ "comment": "Bump @fluentui/react-utilities to v9.7.2",
77
+ "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
78
+ },
79
+ {
80
+ "author": "beachball",
81
+ "package": "@fluentui/react-persona",
82
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20",
83
+ "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
84
+ }
85
+ ]
86
+ }
87
+ },
88
+ {
89
+ "date": "Thu, 16 Mar 2023 14:36:59 GMT",
6
90
  "tag": "@fluentui/react-persona_v9.2.4",
7
91
  "version": "9.2.4",
8
92
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,39 @@
1
1
  # Change Log - @fluentui/react-persona
2
2
 
3
- This log was last generated on Thu, 16 Mar 2023 14:33:33 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 04 Apr 2023 18:42:19 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.2.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-persona_v9.2.6)
8
+
9
+ Tue, 04 Apr 2023 18:42:19 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-persona_v9.2.5..@fluentui/react-persona_v9.2.6)
11
+
12
+ ### Patches
13
+
14
+ - Bump @fluentui/react-avatar to v9.4.7 ([PR #27430](https://github.com/microsoft/fluentui/pull/27430) by beachball)
15
+ - Bump @fluentui/react-badge to v9.1.7 ([PR #27430](https://github.com/microsoft/fluentui/pull/27430) by beachball)
16
+ - Bump @fluentui/react-utilities to v9.7.3 ([PR #27430](https://github.com/microsoft/fluentui/pull/27430) by beachball)
17
+
18
+ ## [9.2.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-persona_v9.2.5)
19
+
20
+ Tue, 21 Mar 2023 21:23:42 GMT
21
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-persona_v9.2.4..@fluentui/react-persona_v9.2.5)
22
+
23
+ ### Patches
24
+
25
+ - fix: add node field to package.json exports map. ([PR #27154](https://github.com/microsoft/fluentui/pull/27154) by tristan.watanabe@gmail.com)
26
+ - chore: migrate to swc transpilation approach. ([PR #27250](https://github.com/microsoft/fluentui/pull/27250) by tristan.watanabe@gmail.com)
27
+ - Bump @fluentui/react-avatar to v9.4.5 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
28
+ - Bump @fluentui/react-badge to v9.1.5 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
29
+ - Bump @fluentui/react-shared-contexts to v9.3.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
30
+ - Bump @fluentui/react-theme to v9.1.7 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
31
+ - Bump @fluentui/react-utilities to v9.7.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
32
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
33
+
7
34
  ## [9.2.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-persona_v9.2.4)
8
35
 
9
- Thu, 16 Mar 2023 14:33:33 GMT
36
+ Thu, 16 Mar 2023 14:36:59 GMT
10
37
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-persona_v9.2.3..@fluentui/react-persona_v9.2.4)
11
38
 
12
39
  ### Patches
@@ -1 +1 @@
1
- {"version":3,"file":"Persona.js","sourceRoot":"../src/","sources":["packages/react-components/react-persona/src/Persona.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './components/Persona/index';\n"]}
1
+ {"version":3,"names":[],"sources":["../src/Persona.ts"],"sourcesContent":["export * from './components/Persona/index';\n"],"mappings":"AAAA,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderPersona_unstable","usePersona_unstable","usePersonaStyles_unstable","useCustomStyleHooks_unstable","Persona","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/Persona.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderPersona_unstable } from './renderPersona';\nimport { usePersona_unstable } from './usePersona';\nimport { usePersonaStyles_unstable } from './usePersonaStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { PersonaProps } from './Persona.types';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A Persona is a visual representation of a person or status that showcases an Avatar, PresenceBadge,\n * or an Avatar with a PresenceBadge.\n */\nexport const Persona: ForwardRefComponent<PersonaProps> = React.forwardRef((props, ref) => {\n const state = usePersona_unstable(props, ref);\n\n usePersonaStyles_unstable(state);\n\n const { usePersonaStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderPersona_unstable(state);\n});\n\nPersona.displayName = 'Persona';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,sBAAsB,QAAQ,iBAAiB;AACxD,SAASC,mBAAmB,QAAQ,cAAc;AAClD,SAASC,yBAAyB,QAAQ,oBAAoB;AAG9D,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;;AAIA,OAAO,MAAMC,OAAO,gBAAsCL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGP,mBAAmB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAE7CL,yBAAyB,CAACM,KAAK,CAAC;EAEhC,MAAM;IAAEN,yBAAyB,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACrFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,sBAAsB,CAACQ,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFJ,OAAO,CAACM,WAAW,GAAG,SAAS"}
1
+ {"version":3,"names":["React","renderPersona_unstable","usePersona_unstable","usePersonaStyles_unstable","useCustomStyleHooks_unstable","Persona","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/Persona/Persona.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderPersona_unstable } from './renderPersona';\nimport { usePersona_unstable } from './usePersona';\nimport { usePersonaStyles_unstable } from './usePersonaStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { PersonaProps } from './Persona.types';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A Persona is a visual representation of a person or status that showcases an Avatar, PresenceBadge,\n * or an Avatar with a PresenceBadge.\n */\nexport const Persona: ForwardRefComponent<PersonaProps> = React.forwardRef((props, ref) => {\n const state = usePersona_unstable(props, ref);\n\n usePersonaStyles_unstable(state);\n\n const { usePersonaStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderPersona_unstable(state);\n});\n\nPersona.displayName = 'Persona';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,sBAAsB,QAAQ;AACvC,SAASC,mBAAmB,QAAQ;AACpC,SAASC,yBAAyB,QAAQ;AAG1C,SAASC,4BAA4B,QAAQ;AAE7C;;;;AAIA,OAAO,MAAMC,OAAA,gBAA6CL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACzF,MAAMC,KAAA,GAAQP,mBAAA,CAAoBK,KAAA,EAAOC,GAAA;EAEzCL,yBAAA,CAA0BM,KAAA;EAE1B,MAAM;IAAEN,yBAAA,EAA2BO;EAAe,CAAE,GAAGN,4BAAA;EACvDM,eAAA,CAAgBD,KAAA;EAEhB,OAAOR,sBAAA,CAAuBQ,KAAA;AAChC;AAEAJ,OAAA,CAAQM,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"file":"Persona.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-persona/src/components/Persona/Persona.types.ts"],"names":[],"mappings":"","sourcesContent":["import { Avatar } from '@fluentui/react-avatar';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type PersonaSlots = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Avatar to display.\n *\n * If a PresenceBadge and an Avatar are provided, the Avatar will display the PresenceBadge as its presence.\n */\n avatar?: Slot<typeof Avatar>;\n\n /**\n * PresenceBadge to display.\n *\n * If `presenceOnly` is true, the PresenceBadge will be displayed instead of the Avatar.\n */\n presence?: Slot<typeof PresenceBadge>;\n\n /**\n * The first line of text in the Persona, larger than the rest of the lines.\n *\n * `primaryText` defaults to the `name` prop. We recomend to only use `name`, use `primaryText` when the text is\n * different than the `name` prop.\n */\n primaryText?: Slot<'span'>;\n\n /**\n * The second line of text in the Persona.\n */\n secondaryText?: Slot<'span'>;\n\n /**\n * The third line of text in the Persona.\n */\n tertiaryText?: Slot<'span'>;\n\n /**\n * The fourth line of text in the Persona.\n */\n quaternaryText?: Slot<'span'>;\n};\n\n/**\n * Persona Props\n */\nexport type PersonaProps = ComponentProps<PersonaSlots> & {\n /**\n * The name of the person or entity represented by the Persona.\n *\n * When `primaryText` is not provided, this will be used as the default value for `primaryText`.\n */\n name?: string;\n\n /**\n * Whether to display only the presence.\n *\n * @default false\n */\n presenceOnly?: boolean;\n\n /**\n * The size of a Persona and its text.\n *\n * @default medium\n */\n size?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n\n /**\n * The position of the text relative to the avatar/presence.\n *\n * @default after\n */\n textPosition?: 'after' | 'before' | 'below';\n\n /**\n * The vertical alignment of the text relative to the avatar/presence.\n *\n * @default start\n */\n textAlignment?: 'center' | 'start';\n};\n\n/**\n * State used in rendering Persona\n */\nexport type PersonaState = ComponentState<PersonaSlots> &\n Required<Pick<PersonaProps, 'presenceOnly' | 'size' | 'textAlignment' | 'textPosition'>> & {\n /**\n * The number of text lines used.\n */\n numTextLines: number;\n };\n"]}
1
+ {"version":3,"names":[],"sources":["../../../src/components/Persona/Persona.types.ts"],"sourcesContent":["import { Avatar } from '@fluentui/react-avatar';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type PersonaSlots = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Avatar to display.\n *\n * If a PresenceBadge and an Avatar are provided, the Avatar will display the PresenceBadge as its presence.\n */\n avatar?: Slot<typeof Avatar>;\n\n /**\n * PresenceBadge to display.\n *\n * If `presenceOnly` is true, the PresenceBadge will be displayed instead of the Avatar.\n */\n presence?: Slot<typeof PresenceBadge>;\n\n /**\n * The first line of text in the Persona, larger than the rest of the lines.\n *\n * `primaryText` defaults to the `name` prop. We recomend to only use `name`, use `primaryText` when the text is\n * different than the `name` prop.\n */\n primaryText?: Slot<'span'>;\n\n /**\n * The second line of text in the Persona.\n */\n secondaryText?: Slot<'span'>;\n\n /**\n * The third line of text in the Persona.\n */\n tertiaryText?: Slot<'span'>;\n\n /**\n * The fourth line of text in the Persona.\n */\n quaternaryText?: Slot<'span'>;\n};\n\n/**\n * Persona Props\n */\nexport type PersonaProps = ComponentProps<PersonaSlots> & {\n /**\n * The name of the person or entity represented by the Persona.\n *\n * When `primaryText` is not provided, this will be used as the default value for `primaryText`.\n */\n name?: string;\n\n /**\n * Whether to display only the presence.\n *\n * @default false\n */\n presenceOnly?: boolean;\n\n /**\n * The size of a Persona and its text.\n *\n * @default medium\n */\n size?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n\n /**\n * The position of the text relative to the avatar/presence.\n *\n * @default after\n */\n textPosition?: 'after' | 'before' | 'below';\n\n /**\n * The vertical alignment of the text relative to the avatar/presence.\n *\n * @default start\n */\n textAlignment?: 'center' | 'start';\n};\n\n/**\n * State used in rendering Persona\n */\nexport type PersonaState = ComponentState<PersonaSlots> &\n Required<Pick<PersonaProps, 'presenceOnly' | 'size' | 'textAlignment' | 'textPosition'>> & {\n /**\n * The number of text lines used.\n */\n numTextLines: number;\n };\n"],"mappings":"AAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-persona/src/components/Persona/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './Persona';\nexport * from './Persona.types';\nexport * from './renderPersona';\nexport * from './usePersona';\nexport * from './usePersonaStyles';\n"]}
1
+ {"version":3,"names":[],"sources":["../../../src/components/Persona/index.ts"],"sourcesContent":["export * from './Persona';\nexport * from './Persona.types';\nexport * from './renderPersona';\nexport * from './usePersona';\nexport * from './usePersonaStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
@@ -12,21 +12,7 @@ export const renderPersona_unstable = state => {
12
12
  slots,
13
13
  slotProps
14
14
  } = getSlots(state);
15
- const coin = presenceOnly ? slots.presence && /*#__PURE__*/React.createElement(slots.presence, {
16
- ...slotProps.presence
17
- }) : slots.avatar && /*#__PURE__*/React.createElement(slots.avatar, {
18
- ...slotProps.avatar
19
- });
20
- return /*#__PURE__*/React.createElement(slots.root, {
21
- ...slotProps.root
22
- }, (textPosition === 'after' || textPosition === 'below') && coin, slots.primaryText && /*#__PURE__*/React.createElement(slots.primaryText, {
23
- ...slotProps.primaryText
24
- }), slots.secondaryText && /*#__PURE__*/React.createElement(slots.secondaryText, {
25
- ...slotProps.secondaryText
26
- }), slots.tertiaryText && /*#__PURE__*/React.createElement(slots.tertiaryText, {
27
- ...slotProps.tertiaryText
28
- }), slots.quaternaryText && /*#__PURE__*/React.createElement(slots.quaternaryText, {
29
- ...slotProps.quaternaryText
30
- }), textPosition === 'before' && coin);
15
+ const coin = presenceOnly ? slots.presence && /*#__PURE__*/React.createElement(slots.presence, slotProps.presence) : slots.avatar && /*#__PURE__*/React.createElement(slots.avatar, slotProps.avatar);
16
+ return /*#__PURE__*/React.createElement(slots.root, slotProps.root, (textPosition === 'after' || textPosition === 'below') && coin, slots.primaryText && /*#__PURE__*/React.createElement(slots.primaryText, slotProps.primaryText), slots.secondaryText && /*#__PURE__*/React.createElement(slots.secondaryText, slotProps.secondaryText), slots.tertiaryText && /*#__PURE__*/React.createElement(slots.tertiaryText, slotProps.tertiaryText), slots.quaternaryText && /*#__PURE__*/React.createElement(slots.quaternaryText, slotProps.quaternaryText), textPosition === 'before' && coin);
31
17
  };
32
18
  //# sourceMappingURL=renderPersona.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","getSlots","renderPersona_unstable","state","presenceOnly","textPosition","slots","slotProps","coin","presence","createElement","avatar","root","primaryText","secondaryText","tertiaryText","quaternaryText"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/renderPersona.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { PersonaState, PersonaSlots } from './Persona.types';\n\n/**\n * Render the final JSX of Persona\n */\nexport const renderPersona_unstable = (state: PersonaState) => {\n const { presenceOnly, textPosition } = state;\n const { slots, slotProps } = getSlots<PersonaSlots>(state);\n\n const coin = presenceOnly\n ? slots.presence && <slots.presence {...slotProps.presence} />\n : slots.avatar && <slots.avatar {...slotProps.avatar} />;\n\n return (\n <slots.root {...slotProps.root}>\n {(textPosition === 'after' || textPosition === 'below') && coin}\n {slots.primaryText && <slots.primaryText {...slotProps.primaryText} />}\n {slots.secondaryText && <slots.secondaryText {...slotProps.secondaryText} />}\n {slots.tertiaryText && <slots.tertiaryText {...slotProps.tertiaryText} />}\n {slots.quaternaryText && <slots.quaternaryText {...slotProps.quaternaryText} />}\n {textPosition === 'before' && coin}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,YAAY;IAAEC;EAAY,CAAE,GAAGF,KAAK;EAC5C,MAAM;IAAEG,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAeE,KAAK,CAAC;EAE1D,MAAMK,IAAI,GAAGJ,YAAY,GACrBE,KAAK,CAACG,QAAQ,iBAAIT,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACG,QAAQ;IAAA,GAAKF,SAAS,CAACE;EAAQ,EAAI,GAC5DH,KAAK,CAACK,MAAM,iBAAIX,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACK,MAAM;IAAA,GAAKJ,SAAS,CAACI;EAAM,EAAI;EAE1D,oBACEX,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACM,IAAI;IAAA,GAAKL,SAAS,CAACK;EAAI,GAC3B,CAACP,YAAY,KAAK,OAAO,IAAIA,YAAY,KAAK,OAAO,KAAKG,IAAI,EAC9DF,KAAK,CAACO,WAAW,iBAAIb,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACO,WAAW;IAAA,GAAKN,SAAS,CAACM;EAAW,EAAI,EACrEP,KAAK,CAACQ,aAAa,iBAAId,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACQ,aAAa;IAAA,GAAKP,SAAS,CAACO;EAAa,EAAI,EAC3ER,KAAK,CAACS,YAAY,iBAAIf,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACS,YAAY;IAAA,GAAKR,SAAS,CAACQ;EAAY,EAAI,EACxET,KAAK,CAACU,cAAc,iBAAIhB,KAAA,CAAAU,aAAA,CAACJ,KAAK,CAACU,cAAc;IAAA,GAAKT,SAAS,CAACS;EAAc,EAAI,EAC9EX,YAAY,KAAK,QAAQ,IAAIG,IAAI,CACvB;AAEjB,CAAC"}
1
+ {"version":3,"names":["React","getSlots","renderPersona_unstable","state","presenceOnly","textPosition","slots","slotProps","coin","presence","createElement","avatar","root","primaryText","secondaryText","tertiaryText","quaternaryText"],"sources":["../../../src/components/Persona/renderPersona.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { PersonaState, PersonaSlots } from './Persona.types';\n\n/**\n * Render the final JSX of Persona\n */\nexport const renderPersona_unstable = (state: PersonaState) => {\n const { presenceOnly, textPosition } = state;\n const { slots, slotProps } = getSlots<PersonaSlots>(state);\n\n const coin = presenceOnly\n ? slots.presence && <slots.presence {...slotProps.presence} />\n : slots.avatar && <slots.avatar {...slotProps.avatar} />;\n\n return (\n <slots.root {...slotProps.root}>\n {(textPosition === 'after' || textPosition === 'below') && coin}\n {slots.primaryText && <slots.primaryText {...slotProps.primaryText} />}\n {slots.secondaryText && <slots.secondaryText {...slotProps.secondaryText} />}\n {slots.tertiaryText && <slots.tertiaryText {...slotProps.tertiaryText} />}\n {slots.quaternaryText && <slots.quaternaryText {...slotProps.quaternaryText} />}\n {textPosition === 'before' && coin}\n </slots.root>\n );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,sBAAA,GAA0BC,KAAA,IAAwB;EAC7D,MAAM;IAAEC,YAAA;IAAcC;EAAY,CAAE,GAAGF,KAAA;EACvC,MAAM;IAAEG,KAAA;IAAOC;EAAS,CAAE,GAAGN,QAAA,CAAuBE,KAAA;EAEpD,MAAMK,IAAA,GAAOJ,YAAA,GACTE,KAAA,CAAMG,QAAQ,iBAAIT,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMG,QAAQ,EAAKF,SAAA,CAAUE,QAAQ,IACxDH,KAAA,CAAMK,MAAM,iBAAIX,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMK,MAAM,EAAKJ,SAAA,CAAUI,MAAM,CAAI;EAE1D,oBACEX,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMM,IAAI,EAAKL,SAAA,CAAUK,IAAI,EAC3B,CAACP,YAAA,KAAiB,WAAWA,YAAA,KAAiB,OAAM,KAAMG,IAAA,EAC1DF,KAAA,CAAMO,WAAW,iBAAIb,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMO,WAAW,EAAKN,SAAA,CAAUM,WAAW,GACjEP,KAAA,CAAMQ,aAAa,iBAAId,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMQ,aAAa,EAAKP,SAAA,CAAUO,aAAa,GACvER,KAAA,CAAMS,YAAY,iBAAIf,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMS,YAAY,EAAKR,SAAA,CAAUQ,YAAY,GACpET,KAAA,CAAMU,cAAc,iBAAIhB,KAAA,CAAAU,aAAA,CAACJ,KAAA,CAAMU,cAAc,EAAKT,SAAA,CAAUS,cAAc,GAC1EX,YAAA,KAAiB,YAAYG,IAAA;AAGpC"}
@@ -1,3 +1,4 @@
1
+ import * as React from 'react';
1
2
  import { Avatar } from '@fluentui/react-avatar';
2
3
  import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';
3
4
  import { PresenceBadge } from '@fluentui/react-badge';
@@ -1 +1 @@
1
- {"version":3,"names":["Avatar","getNativeElementProps","resolveShorthand","PresenceBadge","usePersona_unstable","props","ref","name","presenceOnly","size","textAlignment","textPosition","primaryText","required","defaultProps","children","secondaryText","tertiaryText","quaternaryText","numTextLines","filter","Boolean","length","components","root","avatar","presence","badge","avatarSizes","undefined","presenceSizes","small","medium","large","huge"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/usePersona.ts"],"sourcesContent":["import * as React from 'react';\nimport { Avatar } from '@fluentui/react-avatar';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport type { PersonaProps, PersonaState } from './Persona.types';\n\n/**\n * Create the state required to render Persona.\n *\n * The returned state can be modified with hooks such as usePersonaStyles_unstable,\n * before being passed to renderPersona_unstable.\n *\n * @param props - props from this instance of Persona\n * @param ref - reference to root HTMLElement of Persona\n */\nexport const usePersona_unstable = (props: PersonaProps, ref: React.Ref<HTMLElement>): PersonaState => {\n const { name, presenceOnly = false, size = 'medium', textAlignment = 'start', textPosition = 'after' } = props;\n\n const primaryText = resolveShorthand(props.primaryText, {\n required: true,\n defaultProps: {\n children: name,\n },\n });\n const secondaryText = resolveShorthand(props.secondaryText);\n const tertiaryText = resolveShorthand(props.tertiaryText);\n const quaternaryText = resolveShorthand(props.quaternaryText);\n\n const numTextLines = [primaryText, secondaryText, tertiaryText, quaternaryText].filter(Boolean).length;\n\n return {\n numTextLines,\n presenceOnly,\n size,\n textAlignment,\n textPosition,\n\n components: {\n root: 'div',\n avatar: Avatar,\n presence: PresenceBadge,\n primaryText: 'span',\n secondaryText: 'span',\n tertiaryText: 'span',\n quaternaryText: 'span',\n },\n\n root: getNativeElementProps(\n 'div',\n {\n ...props,\n ref,\n },\n /* excludedPropNames */ ['name'],\n ),\n avatar: !presenceOnly\n ? resolveShorthand(props.avatar, {\n required: true,\n defaultProps: {\n name,\n badge: props.presence,\n size: avatarSizes[size],\n },\n })\n : undefined,\n presence: presenceOnly\n ? resolveShorthand(props.presence, {\n defaultProps: {\n size: presenceSizes[size],\n },\n })\n : undefined,\n primaryText,\n secondaryText,\n tertiaryText,\n quaternaryText,\n };\n};\n\nconst presenceSizes = {\n 'extra-small': 'tiny',\n small: 'extra-small',\n medium: 'small',\n large: 'medium',\n 'extra-large': 'large',\n huge: 'large',\n} as const;\n\nconst avatarSizes = {\n 'extra-small': 20,\n small: 28,\n medium: 32,\n large: 36,\n 'extra-large': 40,\n huge: 56,\n} as const;\n"],"mappings":"AACA,SAASA,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ,2BAA2B;AACnF,SAASC,aAAa,QAAQ,uBAAuB;AAGrD;;;;;;;;;AASA,OAAO,MAAMC,mBAAmB,GAAGA,CAACC,KAAmB,EAAEC,GAA2B,KAAkB;EACpG,MAAM;IAAEC,IAAI;IAAEC,YAAY,GAAG,KAAK;IAAEC,IAAI,GAAG,QAAQ;IAAEC,aAAa,GAAG,OAAO;IAAEC,YAAY,GAAG;EAAO,CAAE,GAAGN,KAAK;EAE9G,MAAMO,WAAW,GAAGV,gBAAgB,CAACG,KAAK,CAACO,WAAW,EAAE;IACtDC,QAAQ,EAAE,IAAI;IACdC,YAAY,EAAE;MACZC,QAAQ,EAAER;;GAEb,CAAC;EACF,MAAMS,aAAa,GAAGd,gBAAgB,CAACG,KAAK,CAACW,aAAa,CAAC;EAC3D,MAAMC,YAAY,GAAGf,gBAAgB,CAACG,KAAK,CAACY,YAAY,CAAC;EACzD,MAAMC,cAAc,GAAGhB,gBAAgB,CAACG,KAAK,CAACa,cAAc,CAAC;EAE7D,MAAMC,YAAY,GAAG,CAACP,WAAW,EAAEI,aAAa,EAAEC,YAAY,EAAEC,cAAc,CAAC,CAACE,MAAM,CAACC,OAAO,CAAC,CAACC,MAAM;EAEtG,OAAO;IACLH,YAAY;IACZX,YAAY;IACZC,IAAI;IACJC,aAAa;IACbC,YAAY;IAEZY,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXC,MAAM,EAAEzB,MAAM;MACd0B,QAAQ,EAAEvB,aAAa;MACvBS,WAAW,EAAE,MAAM;MACnBI,aAAa,EAAE,MAAM;MACrBC,YAAY,EAAE,MAAM;MACpBC,cAAc,EAAE;KACjB;IAEDM,IAAI,EAAEvB,qBAAqB,CACzB,KAAK,EACL;MACE,GAAGI,KAAK;MACRC;KACD,EACD,uBAAwB,CAAC,MAAM,CAAC,CACjC;IACDmB,MAAM,EAAE,CAACjB,YAAY,GACjBN,gBAAgB,CAACG,KAAK,CAACoB,MAAM,EAAE;MAC7BZ,QAAQ,EAAE,IAAI;MACdC,YAAY,EAAE;QACZP,IAAI;QACJoB,KAAK,EAAEtB,KAAK,CAACqB,QAAQ;QACrBjB,IAAI,EAAEmB,WAAW,CAACnB,IAAI;;KAEzB,CAAC,GACFoB,SAAS;IACbH,QAAQ,EAAElB,YAAY,GAClBN,gBAAgB,CAACG,KAAK,CAACqB,QAAQ,EAAE;MAC/BZ,YAAY,EAAE;QACZL,IAAI,EAAEqB,aAAa,CAACrB,IAAI;;KAE3B,CAAC,GACFoB,SAAS;IACbjB,WAAW;IACXI,aAAa;IACbC,YAAY;IACZC;GACD;AACH,CAAC;AAED,MAAMY,aAAa,GAAG;EACpB,aAAa,EAAE,MAAM;EACrBC,KAAK,EAAE,aAAa;EACpBC,MAAM,EAAE,OAAO;EACfC,KAAK,EAAE,QAAQ;EACf,aAAa,EAAE,OAAO;EACtBC,IAAI,EAAE;CACE;AAEV,MAAMN,WAAW,GAAG;EAClB,aAAa,EAAE,EAAE;EACjBG,KAAK,EAAE,EAAE;EACTC,MAAM,EAAE,EAAE;EACVC,KAAK,EAAE,EAAE;EACT,aAAa,EAAE,EAAE;EACjBC,IAAI,EAAE;CACE"}
1
+ {"version":3,"names":["React","Avatar","getNativeElementProps","resolveShorthand","PresenceBadge","usePersona_unstable","props","ref","name","presenceOnly","size","textAlignment","textPosition","primaryText","required","defaultProps","children","secondaryText","tertiaryText","quaternaryText","numTextLines","filter","Boolean","length","components","root","avatar","presence","badge","avatarSizes","undefined","presenceSizes","small","medium","large","huge"],"sources":["../../../src/components/Persona/usePersona.ts"],"sourcesContent":["import * as React from 'react';\nimport { Avatar } from '@fluentui/react-avatar';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport type { PersonaProps, PersonaState } from './Persona.types';\n\n/**\n * Create the state required to render Persona.\n *\n * The returned state can be modified with hooks such as usePersonaStyles_unstable,\n * before being passed to renderPersona_unstable.\n *\n * @param props - props from this instance of Persona\n * @param ref - reference to root HTMLElement of Persona\n */\nexport const usePersona_unstable = (props: PersonaProps, ref: React.Ref<HTMLElement>): PersonaState => {\n const { name, presenceOnly = false, size = 'medium', textAlignment = 'start', textPosition = 'after' } = props;\n\n const primaryText = resolveShorthand(props.primaryText, {\n required: true,\n defaultProps: {\n children: name,\n },\n });\n const secondaryText = resolveShorthand(props.secondaryText);\n const tertiaryText = resolveShorthand(props.tertiaryText);\n const quaternaryText = resolveShorthand(props.quaternaryText);\n\n const numTextLines = [primaryText, secondaryText, tertiaryText, quaternaryText].filter(Boolean).length;\n\n return {\n numTextLines,\n presenceOnly,\n size,\n textAlignment,\n textPosition,\n\n components: {\n root: 'div',\n avatar: Avatar,\n presence: PresenceBadge,\n primaryText: 'span',\n secondaryText: 'span',\n tertiaryText: 'span',\n quaternaryText: 'span',\n },\n\n root: getNativeElementProps(\n 'div',\n {\n ...props,\n ref,\n },\n /* excludedPropNames */ ['name'],\n ),\n avatar: !presenceOnly\n ? resolveShorthand(props.avatar, {\n required: true,\n defaultProps: {\n name,\n badge: props.presence,\n size: avatarSizes[size],\n },\n })\n : undefined,\n presence: presenceOnly\n ? resolveShorthand(props.presence, {\n defaultProps: {\n size: presenceSizes[size],\n },\n })\n : undefined,\n primaryText,\n secondaryText,\n tertiaryText,\n quaternaryText,\n };\n};\n\nconst presenceSizes = {\n 'extra-small': 'tiny',\n small: 'extra-small',\n medium: 'small',\n large: 'medium',\n 'extra-large': 'large',\n huge: 'large',\n} as const;\n\nconst avatarSizes = {\n 'extra-small': 20,\n small: 28,\n medium: 32,\n large: 36,\n 'extra-large': 40,\n huge: 56,\n} as const;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,MAAM,QAAQ;AACvB,SAASC,qBAAqB,EAAEC,gBAAgB,QAAQ;AACxD,SAASC,aAAa,QAAQ;AAG9B;;;;;;;;;AASA,OAAO,MAAMC,mBAAA,GAAsBA,CAACC,KAAA,EAAqBC,GAAA,KAA8C;EACrG,MAAM;IAAEC,IAAA;IAAMC,YAAA,GAAe,KAAK;IAAEC,IAAA,GAAO;IAAUC,aAAA,GAAgB;IAASC,YAAA,GAAe;EAAO,CAAE,GAAGN,KAAA;EAEzG,MAAMO,WAAA,GAAcV,gBAAA,CAAiBG,KAAA,CAAMO,WAAW,EAAE;IACtDC,QAAA,EAAU,IAAI;IACdC,YAAA,EAAc;MACZC,QAAA,EAAUR;IACZ;EACF;EACA,MAAMS,aAAA,GAAgBd,gBAAA,CAAiBG,KAAA,CAAMW,aAAa;EAC1D,MAAMC,YAAA,GAAef,gBAAA,CAAiBG,KAAA,CAAMY,YAAY;EACxD,MAAMC,cAAA,GAAiBhB,gBAAA,CAAiBG,KAAA,CAAMa,cAAc;EAE5D,MAAMC,YAAA,GAAe,CAACP,WAAA,EAAaI,aAAA,EAAeC,YAAA,EAAcC,cAAA,CAAe,CAACE,MAAM,CAACC,OAAA,EAASC,MAAM;EAEtG,OAAO;IACLH,YAAA;IACAX,YAAA;IACAC,IAAA;IACAC,aAAA;IACAC,YAAA;IAEAY,UAAA,EAAY;MACVC,IAAA,EAAM;MACNC,MAAA,EAAQzB,MAAA;MACR0B,QAAA,EAAUvB,aAAA;MACVS,WAAA,EAAa;MACbI,aAAA,EAAe;MACfC,YAAA,EAAc;MACdC,cAAA,EAAgB;IAClB;IAEAM,IAAA,EAAMvB,qBAAA,CACJ,OACA;MACE,GAAGI,KAAK;MACRC;IACF,GACA,uBAAwB,CAAC,OAAO;IAElCmB,MAAA,EAAQ,CAACjB,YAAA,GACLN,gBAAA,CAAiBG,KAAA,CAAMoB,MAAM,EAAE;MAC7BZ,QAAA,EAAU,IAAI;MACdC,YAAA,EAAc;QACZP,IAAA;QACAoB,KAAA,EAAOtB,KAAA,CAAMqB,QAAQ;QACrBjB,IAAA,EAAMmB,WAAW,CAACnB,IAAA;MACpB;IACF,KACAoB,SAAS;IACbH,QAAA,EAAUlB,YAAA,GACNN,gBAAA,CAAiBG,KAAA,CAAMqB,QAAQ,EAAE;MAC/BZ,YAAA,EAAc;QACZL,IAAA,EAAMqB,aAAa,CAACrB,IAAA;MACtB;IACF,KACAoB,SAAS;IACbjB,WAAA;IACAI,aAAA;IACAC,YAAA;IACAC;EACF;AACF;AAEA,MAAMY,aAAA,GAAgB;EACpB,eAAe;EACfC,KAAA,EAAO;EACPC,MAAA,EAAQ;EACRC,KAAA,EAAO;EACP,eAAe;EACfC,IAAA,EAAM;AACR;AAEA,MAAMN,WAAA,GAAc;EAClB,eAAe;EACfG,KAAA,EAAO;EACPC,MAAA,EAAQ;EACRC,KAAA,EAAO;EACP,eAAe;EACfC,IAAA,EAAM;AACR"}
@@ -1 +1 @@
1
- {"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","personaClassNames","root","avatar","presence","primaryText","secondaryText","tertiaryText","quaternaryText","avatarSpacing","useRootClassName","useStyles","beforeAfterCenter","wkccdc","after","before","B7hvi0a","Budl1dq","below","Bxotwcr","media","Ijaq50","mediaBeforeAfterCenter","start","qb2dma","center","afterAlignToPrimary","Bw0ie65","beforeAlignToPrimary","Br312pm","secondLineSpacing","B6of3ja","primary","secondary","tertiary","quaternary","d","useAvatarSpacingStyles","Bs1gm4r","small","medium","large","huge","t21cq0","jrapky","Frg6f3","usePresenceSpacingStyles","usePersonaStyles_unstable","state","presenceOnly","size","textAlignment","textPosition","alignToPrimary","alignBeforeAfterCenter","primaryTextClassName","optionalTextClassName","useTextClassNames","rootClassName","styles","avatarSpacingStyles","presenceSpacingStyles","className","usePrimaryTextBaseClassName","useOptionalTextBaseClassName","useTextStyles","body1","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","caption1","subtitle2","primaryTextBaseClassName","optionalTextBaseClassName","textStyles","primaryTextSize","alignToPrimaryClassName","numTextLines"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/usePersonaStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { PersonaSlots, PersonaState } from './Persona.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const personaClassNames: SlotClassNames<PersonaSlots> = {\n root: 'fui-Persona',\n avatar: 'fui-Persona__avatar',\n presence: 'fui-Persona__presence',\n primaryText: 'fui-Persona__primaryText',\n secondaryText: 'fui-Persona__secondaryText',\n tertiaryText: 'fui-Persona__tertiaryText',\n quaternaryText: 'fui-Persona__quaternaryText',\n};\n\nconst avatarSpacing = `--fui-Persona__avatar--spacing`;\n\nconst useRootClassName = makeResetStyles({\n display: 'inline-grid',\n gridAutoRows: 'max-content',\n gridAutoFlow: 'column',\n justifyItems: 'start',\n gridTemplateColumns: 'max-content [middle] auto',\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n beforeAfterCenter: {\n // This template is needed to make sure the Avatar is centered when it takes up more space than the text lines\n gridTemplateRows:\n '1fr [primary] max-content [secondary] max-content [tertiary] max-content [quaternary] max-content 1fr',\n },\n\n after: {\n // Intentionally empty\n },\n before: {\n justifyItems: 'end',\n gridTemplateColumns: 'auto [middle] max-content',\n },\n below: {\n gridAutoFlow: 'unset',\n justifyItems: 'center',\n gridTemplateColumns: 'unset',\n },\n\n media: {\n gridRowStart: 'span 5',\n },\n\n mediaBeforeAfterCenter: {\n gridRowStart: 'span 6',\n },\n\n start: {\n alignSelf: 'start',\n },\n center: {\n alignSelf: 'center',\n },\n\n afterAlignToPrimary: {\n alignSelf: 'center',\n gridRowStart: 'unset',\n gridColumnEnd: 'middle',\n },\n beforeAlignToPrimary: {\n alignSelf: 'center',\n gridRowStart: 'unset',\n gridColumnStart: 'middle',\n },\n\n secondLineSpacing: {\n marginTop: '-2px',\n },\n\n primary: { gridRowStart: 'primary' },\n secondary: { gridRowStart: 'secondary' },\n tertiary: { gridRowStart: 'tertiary' },\n quaternary: { gridRowStart: 'quaternary' },\n});\n\nconst useAvatarSpacingStyles = makeStyles({\n 'extra-small': {\n [avatarSpacing]: tokens.spacingHorizontalSNudge,\n },\n small: {\n [avatarSpacing]: tokens.spacingHorizontalS,\n },\n medium: {\n [avatarSpacing]: tokens.spacingHorizontalS,\n },\n large: {\n [avatarSpacing]: tokens.spacingHorizontalMNudge,\n },\n 'extra-large': {\n [avatarSpacing]: tokens.spacingHorizontalMNudge,\n },\n huge: {\n [avatarSpacing]: tokens.spacingHorizontalM,\n },\n after: {\n marginRight: `var(${avatarSpacing})`,\n },\n below: {\n marginBottom: `var(${avatarSpacing})`,\n },\n before: {\n marginLeft: `var(${avatarSpacing})`,\n },\n});\n\nconst usePresenceSpacingStyles = makeStyles({\n small: {\n [avatarSpacing]: tokens.spacingHorizontalSNudge,\n },\n});\n\n/**\n * Apply styling to the Persona slots based on the state\n */\nexport const usePersonaStyles_unstable = (state: PersonaState): PersonaState => {\n const { presenceOnly, size, textAlignment, textPosition } = state;\n\n const alignToPrimary = presenceOnly && textAlignment === 'start' && size !== 'extra-large' && size !== 'huge';\n const alignBeforeAfterCenter = textPosition !== 'below' && textAlignment === 'center';\n const { primaryTextClassName, optionalTextClassName } = useTextClassNames(state, alignToPrimary);\n\n const rootClassName = useRootClassName();\n const styles = useStyles();\n const avatarSpacingStyles = useAvatarSpacingStyles();\n const presenceSpacingStyles = { ...avatarSpacingStyles, ...usePresenceSpacingStyles() };\n\n state.root.className = mergeClasses(\n personaClassNames.root,\n rootClassName,\n alignBeforeAfterCenter && styles.beforeAfterCenter,\n styles[textPosition],\n state.root.className,\n );\n\n if (state.avatar) {\n state.avatar.className = mergeClasses(\n personaClassNames.avatar,\n textPosition !== 'below' && styles.media,\n alignBeforeAfterCenter && styles.mediaBeforeAfterCenter,\n styles[textAlignment],\n avatarSpacingStyles[size],\n avatarSpacingStyles[textPosition],\n state.avatar.className,\n );\n }\n\n if (state.presence) {\n state.presence.className = mergeClasses(\n personaClassNames.presence,\n textPosition !== 'below' && styles.media,\n alignBeforeAfterCenter && styles.mediaBeforeAfterCenter,\n styles[textAlignment],\n presenceSpacingStyles[size],\n presenceSpacingStyles[textPosition],\n textPosition === 'after' && alignToPrimary && styles.afterAlignToPrimary,\n textPosition === 'before' && alignToPrimary && styles.beforeAlignToPrimary,\n state.presence.className,\n );\n }\n\n if (state.primaryText) {\n state.primaryText.className = mergeClasses(\n personaClassNames.primaryText,\n alignBeforeAfterCenter && styles.primary,\n primaryTextClassName,\n state.primaryText.className,\n );\n }\n\n if (state.secondaryText) {\n state.secondaryText.className = mergeClasses(\n personaClassNames.secondaryText,\n alignBeforeAfterCenter && styles.secondary,\n optionalTextClassName,\n styles.secondLineSpacing,\n state.secondaryText.className,\n );\n }\n\n if (state.tertiaryText) {\n state.tertiaryText.className = mergeClasses(\n personaClassNames.tertiaryText,\n alignBeforeAfterCenter && styles.tertiary,\n optionalTextClassName,\n state.tertiaryText.className,\n );\n }\n\n if (state.quaternaryText) {\n state.quaternaryText.className = mergeClasses(\n personaClassNames.quaternaryText,\n alignBeforeAfterCenter && styles.quaternary,\n optionalTextClassName,\n state.quaternaryText.className,\n );\n }\n\n return state;\n};\n\nconst usePrimaryTextBaseClassName = makeResetStyles({\n display: 'block',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1,\n});\n\nconst useOptionalTextBaseClassName = makeResetStyles({\n display: 'block',\n color: tokens.colorNeutralForeground2,\n ...typographyStyles.caption1,\n});\n\nconst useTextStyles = makeStyles({\n beforeAlignToPrimary: {\n gridColumnEnd: 'middle',\n },\n afterAlignToPrimary: {\n gridColumnStart: 'middle',\n },\n\n body1: typographyStyles.body1,\n caption1: typographyStyles.caption1,\n subtitle2: typographyStyles.subtitle2,\n});\n\nconst useTextClassNames = (\n state: PersonaState,\n alignToPrimary: boolean,\n): {\n primaryTextClassName: string;\n optionalTextClassName: string;\n} => {\n const { presenceOnly, size, textPosition } = state;\n const primaryTextBaseClassName = usePrimaryTextBaseClassName();\n const optionalTextBaseClassName = useOptionalTextBaseClassName();\n const textStyles = useTextStyles();\n\n let primaryTextSize;\n let alignToPrimaryClassName;\n\n if (presenceOnly) {\n if (size === 'extra-small') {\n primaryTextSize = state.numTextLines <= 1 && textStyles.caption1;\n } else if (size === 'extra-large' || size === 'huge') {\n primaryTextSize = textStyles.subtitle2;\n }\n\n if (alignToPrimary) {\n if (textPosition === 'before') {\n alignToPrimaryClassName = textStyles.beforeAlignToPrimary;\n } else if (textPosition === 'after') {\n alignToPrimaryClassName = textStyles.afterAlignToPrimary;\n }\n }\n } else {\n if (size === 'huge') {\n primaryTextSize = textStyles.subtitle2;\n } else if (size === 'extra-large') {\n primaryTextSize = textStyles.subtitle2;\n }\n }\n\n return {\n primaryTextClassName: mergeClasses(primaryTextBaseClassName, primaryTextSize, alignToPrimaryClassName),\n optionalTextClassName: mergeClasses(\n optionalTextBaseClassName,\n !presenceOnly && size === 'huge' && textStyles.body1,\n alignToPrimaryClassName,\n ),\n };\n};\n"],"mappings":"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"}
1
+ {"version":3,"names":["__resetStyles","__styles","mergeClasses","tokens","typographyStyles","personaClassNames","root","avatar","presence","primaryText","secondaryText","tertiaryText","quaternaryText","avatarSpacing","useRootClassName","useStyles","beforeAfterCenter","wkccdc","after","before","B7hvi0a","Budl1dq","below","Bxotwcr","media","Ijaq50","mediaBeforeAfterCenter","start","qb2dma","center","afterAlignToPrimary","Bw0ie65","beforeAlignToPrimary","Br312pm","secondLineSpacing","B6of3ja","primary","secondary","tertiary","quaternary","d","useAvatarSpacingStyles","Bs1gm4r","small","medium","large","huge","t21cq0","jrapky","Frg6f3","usePresenceSpacingStyles","usePersonaStyles_unstable","state","presenceOnly","size","textAlignment","textPosition","alignToPrimary","alignBeforeAfterCenter","primaryTextClassName","optionalTextClassName","useTextClassNames","rootClassName","styles","avatarSpacingStyles","presenceSpacingStyles","className","usePrimaryTextBaseClassName","useOptionalTextBaseClassName","useTextStyles","body1","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","caption1","subtitle2","primaryTextBaseClassName","optionalTextBaseClassName","textStyles","primaryTextSize","alignToPrimaryClassName","numTextLines"],"sources":["../../../src/components/Persona/usePersonaStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { PersonaSlots, PersonaState } from './Persona.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const personaClassNames: SlotClassNames<PersonaSlots> = {\n root: 'fui-Persona',\n avatar: 'fui-Persona__avatar',\n presence: 'fui-Persona__presence',\n primaryText: 'fui-Persona__primaryText',\n secondaryText: 'fui-Persona__secondaryText',\n tertiaryText: 'fui-Persona__tertiaryText',\n quaternaryText: 'fui-Persona__quaternaryText',\n};\n\nconst avatarSpacing = `--fui-Persona__avatar--spacing`;\n\nconst useRootClassName = makeResetStyles({\n display: 'inline-grid',\n gridAutoRows: 'max-content',\n gridAutoFlow: 'column',\n justifyItems: 'start',\n gridTemplateColumns: 'max-content [middle] auto',\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n beforeAfterCenter: {\n // This template is needed to make sure the Avatar is centered when it takes up more space than the text lines\n gridTemplateRows:\n '1fr [primary] max-content [secondary] max-content [tertiary] max-content [quaternary] max-content 1fr',\n },\n\n after: {\n // Intentionally empty\n },\n before: {\n justifyItems: 'end',\n gridTemplateColumns: 'auto [middle] max-content',\n },\n below: {\n gridAutoFlow: 'unset',\n justifyItems: 'center',\n gridTemplateColumns: 'unset',\n },\n\n media: {\n gridRowStart: 'span 5',\n },\n\n mediaBeforeAfterCenter: {\n gridRowStart: 'span 6',\n },\n\n start: {\n alignSelf: 'start',\n },\n center: {\n alignSelf: 'center',\n },\n\n afterAlignToPrimary: {\n alignSelf: 'center',\n gridRowStart: 'unset',\n gridColumnEnd: 'middle',\n },\n beforeAlignToPrimary: {\n alignSelf: 'center',\n gridRowStart: 'unset',\n gridColumnStart: 'middle',\n },\n\n secondLineSpacing: {\n marginTop: '-2px',\n },\n\n primary: { gridRowStart: 'primary' },\n secondary: { gridRowStart: 'secondary' },\n tertiary: { gridRowStart: 'tertiary' },\n quaternary: { gridRowStart: 'quaternary' },\n});\n\nconst useAvatarSpacingStyles = makeStyles({\n 'extra-small': {\n [avatarSpacing]: tokens.spacingHorizontalSNudge,\n },\n small: {\n [avatarSpacing]: tokens.spacingHorizontalS,\n },\n medium: {\n [avatarSpacing]: tokens.spacingHorizontalS,\n },\n large: {\n [avatarSpacing]: tokens.spacingHorizontalMNudge,\n },\n 'extra-large': {\n [avatarSpacing]: tokens.spacingHorizontalMNudge,\n },\n huge: {\n [avatarSpacing]: tokens.spacingHorizontalM,\n },\n after: {\n marginRight: `var(${avatarSpacing})`,\n },\n below: {\n marginBottom: `var(${avatarSpacing})`,\n },\n before: {\n marginLeft: `var(${avatarSpacing})`,\n },\n});\n\nconst usePresenceSpacingStyles = makeStyles({\n small: {\n [avatarSpacing]: tokens.spacingHorizontalSNudge,\n },\n});\n\n/**\n * Apply styling to the Persona slots based on the state\n */\nexport const usePersonaStyles_unstable = (state: PersonaState): PersonaState => {\n const { presenceOnly, size, textAlignment, textPosition } = state;\n\n const alignToPrimary = presenceOnly && textAlignment === 'start' && size !== 'extra-large' && size !== 'huge';\n const alignBeforeAfterCenter = textPosition !== 'below' && textAlignment === 'center';\n const { primaryTextClassName, optionalTextClassName } = useTextClassNames(state, alignToPrimary);\n\n const rootClassName = useRootClassName();\n const styles = useStyles();\n const avatarSpacingStyles = useAvatarSpacingStyles();\n const presenceSpacingStyles = { ...avatarSpacingStyles, ...usePresenceSpacingStyles() };\n\n state.root.className = mergeClasses(\n personaClassNames.root,\n rootClassName,\n alignBeforeAfterCenter && styles.beforeAfterCenter,\n styles[textPosition],\n state.root.className,\n );\n\n if (state.avatar) {\n state.avatar.className = mergeClasses(\n personaClassNames.avatar,\n textPosition !== 'below' && styles.media,\n alignBeforeAfterCenter && styles.mediaBeforeAfterCenter,\n styles[textAlignment],\n avatarSpacingStyles[size],\n avatarSpacingStyles[textPosition],\n state.avatar.className,\n );\n }\n\n if (state.presence) {\n state.presence.className = mergeClasses(\n personaClassNames.presence,\n textPosition !== 'below' && styles.media,\n alignBeforeAfterCenter && styles.mediaBeforeAfterCenter,\n styles[textAlignment],\n presenceSpacingStyles[size],\n presenceSpacingStyles[textPosition],\n textPosition === 'after' && alignToPrimary && styles.afterAlignToPrimary,\n textPosition === 'before' && alignToPrimary && styles.beforeAlignToPrimary,\n state.presence.className,\n );\n }\n\n if (state.primaryText) {\n state.primaryText.className = mergeClasses(\n personaClassNames.primaryText,\n alignBeforeAfterCenter && styles.primary,\n primaryTextClassName,\n state.primaryText.className,\n );\n }\n\n if (state.secondaryText) {\n state.secondaryText.className = mergeClasses(\n personaClassNames.secondaryText,\n alignBeforeAfterCenter && styles.secondary,\n optionalTextClassName,\n styles.secondLineSpacing,\n state.secondaryText.className,\n );\n }\n\n if (state.tertiaryText) {\n state.tertiaryText.className = mergeClasses(\n personaClassNames.tertiaryText,\n alignBeforeAfterCenter && styles.tertiary,\n optionalTextClassName,\n state.tertiaryText.className,\n );\n }\n\n if (state.quaternaryText) {\n state.quaternaryText.className = mergeClasses(\n personaClassNames.quaternaryText,\n alignBeforeAfterCenter && styles.quaternary,\n optionalTextClassName,\n state.quaternaryText.className,\n );\n }\n\n return state;\n};\n\nconst usePrimaryTextBaseClassName = makeResetStyles({\n display: 'block',\n color: tokens.colorNeutralForeground1,\n ...typographyStyles.body1,\n});\n\nconst useOptionalTextBaseClassName = makeResetStyles({\n display: 'block',\n color: tokens.colorNeutralForeground2,\n ...typographyStyles.caption1,\n});\n\nconst useTextStyles = makeStyles({\n beforeAlignToPrimary: {\n gridColumnEnd: 'middle',\n },\n afterAlignToPrimary: {\n gridColumnStart: 'middle',\n },\n\n body1: typographyStyles.body1,\n caption1: typographyStyles.caption1,\n subtitle2: typographyStyles.subtitle2,\n});\n\nconst useTextClassNames = (\n state: PersonaState,\n alignToPrimary: boolean,\n): {\n primaryTextClassName: string;\n optionalTextClassName: string;\n} => {\n const { presenceOnly, size, textPosition } = state;\n const primaryTextBaseClassName = usePrimaryTextBaseClassName();\n const optionalTextBaseClassName = useOptionalTextBaseClassName();\n const textStyles = useTextStyles();\n\n let primaryTextSize;\n let alignToPrimaryClassName;\n\n if (presenceOnly) {\n if (size === 'extra-small') {\n primaryTextSize = state.numTextLines <= 1 && textStyles.caption1;\n } else if (size === 'extra-large' || size === 'huge') {\n primaryTextSize = textStyles.subtitle2;\n }\n\n if (alignToPrimary) {\n if (textPosition === 'before') {\n alignToPrimaryClassName = textStyles.beforeAlignToPrimary;\n } else if (textPosition === 'after') {\n alignToPrimaryClassName = textStyles.afterAlignToPrimary;\n }\n }\n } else {\n if (size === 'huge') {\n primaryTextSize = textStyles.subtitle2;\n } else if (size === 'extra-large') {\n primaryTextSize = textStyles.subtitle2;\n }\n }\n\n return {\n primaryTextClassName: mergeClasses(primaryTextBaseClassName, primaryTextSize, alignToPrimaryClassName),\n optionalTextClassName: mergeClasses(\n optionalTextBaseClassName,\n !presenceOnly && size === 'huge' && textStyles.body1,\n alignToPrimaryClassName,\n ),\n };\n};\n"],"mappings":"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"}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["Persona","personaClassNames","renderPersona_unstable","usePersonaStyles_unstable","usePersona_unstable"],"sources":["../src/packages/react-components/react-persona/src/index.ts"],"sourcesContent":["export {\n Persona,\n personaClassNames,\n renderPersona_unstable,\n usePersonaStyles_unstable,\n usePersona_unstable,\n} from './Persona';\nexport type { PersonaProps, PersonaSlots, PersonaState } from './Persona';\n"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,yBAAyB,EACzBC,mBAAmB,QACd,WAAW"}
1
+ {"version":3,"names":["Persona","personaClassNames","renderPersona_unstable","usePersonaStyles_unstable","usePersona_unstable"],"sources":["../src/index.ts"],"sourcesContent":["export {\n Persona,\n personaClassNames,\n renderPersona_unstable,\n usePersonaStyles_unstable,\n usePersona_unstable,\n} from './Persona';\nexport type { PersonaProps, PersonaSlots, PersonaState } from './Persona';\n"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,yBAAyB,EACzBC,mBAAmB,QACd"}
@@ -1,8 +1,9 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./components/Persona/index"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./components/Persona/index"), exports);
7
+ //# sourceMappingURL=Persona.js.map
8
+
8
9
  //# sourceMappingURL=Persona.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-persona/src/Persona.ts"],"sourcesContent":["export * from './components/Persona/index';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,gCAAAC,OAAA"}
1
+ {"version":3,"sources":["../lib/Persona.js"],"sourcesContent":["export * from './components/Persona/index';\n//# sourceMappingURL=Persona.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,mCAAmC"}
@@ -1,26 +1,24 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "Persona", {
6
+ enumerable: true,
7
+ get: ()=>Persona
5
8
  });
6
- exports.Persona = void 0;
7
- const React = /*#__PURE__*/require("react");
8
- const renderPersona_1 = /*#__PURE__*/require("./renderPersona");
9
- const usePersona_1 = /*#__PURE__*/require("./usePersona");
10
- const usePersonaStyles_1 = /*#__PURE__*/require("./usePersonaStyles");
11
- const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
12
- /**
13
- * A Persona is a visual representation of a person or status that showcases an Avatar, PresenceBadge,
14
- * or an Avatar with a PresenceBadge.
15
- */
16
- exports.Persona = /*#__PURE__*/React.forwardRef((props, ref) => {
17
- const state = usePersona_1.usePersona_unstable(props, ref);
18
- usePersonaStyles_1.usePersonaStyles_unstable(state);
19
- const {
20
- usePersonaStyles_unstable: useCustomStyles
21
- } = react_shared_contexts_1.useCustomStyleHooks_unstable();
22
- useCustomStyles(state);
23
- return renderPersona_1.renderPersona_unstable(state);
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
+ const _renderPersona = require("./renderPersona");
12
+ const _usePersona = require("./usePersona");
13
+ const _usePersonaStyles = require("./usePersonaStyles");
14
+ const _reactSharedContexts = require("@fluentui/react-shared-contexts");
15
+ const Persona = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
16
+ const state = (0, _usePersona.usePersona_unstable)(props, ref);
17
+ (0, _usePersonaStyles.usePersonaStyles_unstable)(state);
18
+ const { usePersonaStyles_unstable: useCustomStyles } = (0, _reactSharedContexts.useCustomStyleHooks_unstable)();
19
+ useCustomStyles(state);
20
+ return (0, _renderPersona.renderPersona_unstable)(state);
24
21
  });
25
- exports.Persona.displayName = 'Persona';
22
+ Persona.displayName = 'Persona'; //# sourceMappingURL=Persona.js.map
23
+
26
24
  //# sourceMappingURL=Persona.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","renderPersona_1","usePersona_1","usePersonaStyles_1","react_shared_contexts_1","exports","Persona","forwardRef","props","ref","state","usePersona_unstable","usePersonaStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderPersona_unstable","displayName"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/Persona.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderPersona_unstable } from './renderPersona';\nimport { usePersona_unstable } from './usePersona';\nimport { usePersonaStyles_unstable } from './usePersonaStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { PersonaProps } from './Persona.types';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * A Persona is a visual representation of a person or status that showcases an Avatar, PresenceBadge,\n * or an Avatar with a PresenceBadge.\n */\nexport const Persona: ForwardRefComponent<PersonaProps> = React.forwardRef((props, ref) => {\n const state = usePersona_unstable(props, ref);\n\n usePersonaStyles_unstable(state);\n\n const { usePersonaStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderPersona_unstable(state);\n});\n\nPersona.displayName = 'Persona';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,eAAA,gBAAAD,OAAA;AACA,MAAAE,YAAA,gBAAAF,OAAA;AACA,MAAAG,kBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;;AAIaK,OAAA,CAAAC,OAAO,gBAAsCP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGR,YAAA,CAAAS,mBAAmB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE7CN,kBAAA,CAAAS,yBAAyB,CAACF,KAAK,CAAC;EAEhC,MAAM;IAAEE,yBAAyB,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EACrFD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,eAAA,CAAAc,sBAAsB,CAACL,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFL,OAAA,CAAAC,OAAO,CAACU,WAAW,GAAG,SAAS"}
1
+ {"version":3,"sources":["../../../lib/components/Persona/Persona.js"],"sourcesContent":["import * as React from 'react';\nimport { renderPersona_unstable } from './renderPersona';\nimport { usePersona_unstable } from './usePersona';\nimport { usePersonaStyles_unstable } from './usePersonaStyles';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n/**\n * A Persona is a visual representation of a person or status that showcases an Avatar, PresenceBadge,\n * or an Avatar with a PresenceBadge.\n */\nexport const Persona = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = usePersona_unstable(props, ref);\n usePersonaStyles_unstable(state);\n const {\n usePersonaStyles_unstable: useCustomStyles\n } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n return renderPersona_unstable(state);\n});\nPersona.displayName = 'Persona';\n//# sourceMappingURL=Persona.js.map"],"names":["Persona","React","forwardRef","props","ref","state","usePersona_unstable","usePersonaStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderPersona_unstable","displayName"],"mappings":";;;;+BASaA;;aAAAA;;;6DATU;+BACgB;4BACH;kCACM;qCACG;AAKtC,MAAMA,UAAU,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnE,MAAMC,QAAQC,IAAAA,+BAAmB,EAACH,OAAOC;IACzCG,IAAAA,2CAAyB,EAACF;IAC1B,MAAM,EACJE,2BAA2BC,gBAAe,EAC3C,GAAGC,IAAAA,iDAA4B;IAChCD,gBAAgBH;IAChB,OAAOK,IAAAA,qCAAsB,EAACL;AAChC;AACAL,QAAQW,WAAW,GAAG,WACtB,mCAAmC"}
@@ -1,6 +1,7 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
5
+ //# sourceMappingURL=Persona.types.js.map
6
+
6
7
  //# sourceMappingURL=Persona.types.js.map
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["../src/packages/react-components/react-persona/src/components/Persona/Persona.types.ts"],"sourcesContent":["import { Avatar } from '@fluentui/react-avatar';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type PersonaSlots = {\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Avatar to display.\n *\n * If a PresenceBadge and an Avatar are provided, the Avatar will display the PresenceBadge as its presence.\n */\n avatar?: Slot<typeof Avatar>;\n\n /**\n * PresenceBadge to display.\n *\n * If `presenceOnly` is true, the PresenceBadge will be displayed instead of the Avatar.\n */\n presence?: Slot<typeof PresenceBadge>;\n\n /**\n * The first line of text in the Persona, larger than the rest of the lines.\n *\n * `primaryText` defaults to the `name` prop. We recomend to only use `name`, use `primaryText` when the text is\n * different than the `name` prop.\n */\n primaryText?: Slot<'span'>;\n\n /**\n * The second line of text in the Persona.\n */\n secondaryText?: Slot<'span'>;\n\n /**\n * The third line of text in the Persona.\n */\n tertiaryText?: Slot<'span'>;\n\n /**\n * The fourth line of text in the Persona.\n */\n quaternaryText?: Slot<'span'>;\n};\n\n/**\n * Persona Props\n */\nexport type PersonaProps = ComponentProps<PersonaSlots> & {\n /**\n * The name of the person or entity represented by the Persona.\n *\n * When `primaryText` is not provided, this will be used as the default value for `primaryText`.\n */\n name?: string;\n\n /**\n * Whether to display only the presence.\n *\n * @default false\n */\n presenceOnly?: boolean;\n\n /**\n * The size of a Persona and its text.\n *\n * @default medium\n */\n size?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n\n /**\n * The position of the text relative to the avatar/presence.\n *\n * @default after\n */\n textPosition?: 'after' | 'before' | 'below';\n\n /**\n * The vertical alignment of the text relative to the avatar/presence.\n *\n * @default start\n */\n textAlignment?: 'center' | 'start';\n};\n\n/**\n * State used in rendering Persona\n */\nexport type PersonaState = ComponentState<PersonaSlots> &\n Required<Pick<PersonaProps, 'presenceOnly' | 'size' | 'textAlignment' | 'textPosition'>> & {\n /**\n * The number of text lines used.\n */\n numTextLines: number;\n };\n"],"mappings":""}
1
+ {"version":3,"sources":["../../../lib/components/Persona/Persona.types.js"],"sourcesContent":["export {};\n//# sourceMappingURL=Persona.types.js.map"],"names":[],"mappings":";;;;CACA,yCAAyC"}
@@ -1,12 +1,13 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- const tslib_1 = /*#__PURE__*/require("tslib");
7
- tslib_1.__exportStar(require("./Persona"), exports);
8
- tslib_1.__exportStar(require("./Persona.types"), exports);
9
- tslib_1.__exportStar(require("./renderPersona"), exports);
10
- tslib_1.__exportStar(require("./usePersona"), exports);
11
- tslib_1.__exportStar(require("./usePersonaStyles"), exports);
5
+ const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
+ _exportStar(require("./Persona"), exports);
7
+ _exportStar(require("./Persona.types"), exports);
8
+ _exportStar(require("./renderPersona"), exports);
9
+ _exportStar(require("./usePersona"), exports);
10
+ _exportStar(require("./usePersonaStyles"), exports);
11
+ //# sourceMappingURL=index.js.map
12
+
12
13
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["tslib_1","__exportStar","require","exports"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/index.ts"],"sourcesContent":["export * from './Persona';\nexport * from './Persona.types';\nexport * from './renderPersona';\nexport * from './usePersona';\nexport * from './usePersonaStyles';\n"],"mappings":";;;;;;AAAAA,OAAA,CAAAC,YAAA,CAAAC,OAAA,eAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,qBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,qBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,kBAAAC,OAAA;AACAH,OAAA,CAAAC,YAAA,CAAAC,OAAA,wBAAAC,OAAA"}
1
+ {"version":3,"sources":["../../../lib/components/Persona/index.js"],"sourcesContent":["export * from './Persona';\nexport * from './Persona.types';\nexport * from './renderPersona';\nexport * from './usePersona';\nexport * from './usePersonaStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
@@ -1,39 +1,19 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "renderPersona_unstable", {
6
+ enumerable: true,
7
+ get: ()=>renderPersona_unstable
5
8
  });
6
- exports.renderPersona_unstable = void 0;
7
- const React = /*#__PURE__*/require("react");
8
- const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
- /**
10
- * Render the final JSX of Persona
11
- */
12
- const renderPersona_unstable = state => {
13
- const {
14
- presenceOnly,
15
- textPosition
16
- } = state;
17
- const {
18
- slots,
19
- slotProps
20
- } = react_utilities_1.getSlots(state);
21
- const coin = presenceOnly ? slots.presence && React.createElement(slots.presence, {
22
- ...slotProps.presence
23
- }) : slots.avatar && React.createElement(slots.avatar, {
24
- ...slotProps.avatar
25
- });
26
- return React.createElement(slots.root, {
27
- ...slotProps.root
28
- }, (textPosition === 'after' || textPosition === 'below') && coin, slots.primaryText && React.createElement(slots.primaryText, {
29
- ...slotProps.primaryText
30
- }), slots.secondaryText && React.createElement(slots.secondaryText, {
31
- ...slotProps.secondaryText
32
- }), slots.tertiaryText && React.createElement(slots.tertiaryText, {
33
- ...slotProps.tertiaryText
34
- }), slots.quaternaryText && React.createElement(slots.quaternaryText, {
35
- ...slotProps.quaternaryText
36
- }), textPosition === 'before' && coin);
37
- };
38
- exports.renderPersona_unstable = renderPersona_unstable;
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
+ const _reactUtilities = require("@fluentui/react-utilities");
12
+ const renderPersona_unstable = (state)=>{
13
+ const { presenceOnly , textPosition } = state;
14
+ const { slots , slotProps } = (0, _reactUtilities.getSlots)(state);
15
+ const coin = presenceOnly ? slots.presence && /*#__PURE__*/ _react.createElement(slots.presence, slotProps.presence) : slots.avatar && /*#__PURE__*/ _react.createElement(slots.avatar, slotProps.avatar);
16
+ return /*#__PURE__*/ _react.createElement(slots.root, slotProps.root, (textPosition === 'after' || textPosition === 'below') && coin, slots.primaryText && /*#__PURE__*/ _react.createElement(slots.primaryText, slotProps.primaryText), slots.secondaryText && /*#__PURE__*/ _react.createElement(slots.secondaryText, slotProps.secondaryText), slots.tertiaryText && /*#__PURE__*/ _react.createElement(slots.tertiaryText, slotProps.tertiaryText), slots.quaternaryText && /*#__PURE__*/ _react.createElement(slots.quaternaryText, slotProps.quaternaryText), textPosition === 'before' && coin);
17
+ }; //# sourceMappingURL=renderPersona.js.map
18
+
39
19
  //# sourceMappingURL=renderPersona.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","react_utilities_1","renderPersona_unstable","state","presenceOnly","textPosition","slots","slotProps","getSlots","coin","presence","createElement","avatar","root","primaryText","secondaryText","tertiaryText","quaternaryText","exports"],"sources":["../src/packages/react-components/react-persona/src/components/Persona/renderPersona.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { PersonaState, PersonaSlots } from './Persona.types';\n\n/**\n * Render the final JSX of Persona\n */\nexport const renderPersona_unstable = (state: PersonaState) => {\n const { presenceOnly, textPosition } = state;\n const { slots, slotProps } = getSlots<PersonaSlots>(state);\n\n const coin = presenceOnly\n ? slots.presence && <slots.presence {...slotProps.presence} />\n : slots.avatar && <slots.avatar {...slotProps.avatar} />;\n\n return (\n <slots.root {...slotProps.root}>\n {(textPosition === 'after' || textPosition === 'below') && coin}\n {slots.primaryText && <slots.primaryText {...slotProps.primaryText} />}\n {slots.secondaryText && <slots.secondaryText {...slotProps.secondaryText} />}\n {slots.tertiaryText && <slots.tertiaryText {...slotProps.tertiaryText} />}\n {slots.quaternaryText && <slots.quaternaryText {...slotProps.quaternaryText} />}\n {textPosition === 'before' && coin}\n </slots.root>\n );\n};\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAGA;;;AAGO,MAAME,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,YAAY;IAAEC;EAAY,CAAE,GAAGF,KAAK;EAC5C,MAAM;IAAEG,KAAK;IAAEC;EAAS,CAAE,GAAGN,iBAAA,CAAAO,QAAQ,CAAeL,KAAK,CAAC;EAE1D,MAAMM,IAAI,GAAGL,YAAY,GACrBE,KAAK,CAACI,QAAQ,IAAIX,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACI,QAAQ;IAAA,GAAKH,SAAS,CAACG;EAAQ,EAAI,GAC5DJ,KAAK,CAACM,MAAM,IAAIb,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACM,MAAM;IAAA,GAAKL,SAAS,CAACK;EAAM,EAAI;EAE1D,OACEb,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACO,IAAI;IAAA,GAAKN,SAAS,CAACM;EAAI,GAC3B,CAACR,YAAY,KAAK,OAAO,IAAIA,YAAY,KAAK,OAAO,KAAKI,IAAI,EAC9DH,KAAK,CAACQ,WAAW,IAAIf,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACQ,WAAW;IAAA,GAAKP,SAAS,CAACO;EAAW,EAAI,EACrER,KAAK,CAACS,aAAa,IAAIhB,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACS,aAAa;IAAA,GAAKR,SAAS,CAACQ;EAAa,EAAI,EAC3ET,KAAK,CAACU,YAAY,IAAIjB,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACU,YAAY;IAAA,GAAKT,SAAS,CAACS;EAAY,EAAI,EACxEV,KAAK,CAACW,cAAc,IAAIlB,KAAA,CAAAY,aAAA,CAACL,KAAK,CAACW,cAAc;IAAA,GAAKV,SAAS,CAACU;EAAc,EAAI,EAC9EZ,YAAY,KAAK,QAAQ,IAAII,IAAI,CACvB;AAEjB,CAAC;AAlBYS,OAAA,CAAAhB,sBAAsB,GAAAA,sBAAA"}
1
+ {"version":3,"sources":["../../../lib/components/Persona/renderPersona.js"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Persona\n */\nexport const renderPersona_unstable = state => {\n const {\n presenceOnly,\n textPosition\n } = state;\n const {\n slots,\n slotProps\n } = getSlots(state);\n const coin = presenceOnly ? slots.presence && /*#__PURE__*/React.createElement(slots.presence, slotProps.presence) : slots.avatar && /*#__PURE__*/React.createElement(slots.avatar, slotProps.avatar);\n return /*#__PURE__*/React.createElement(slots.root, slotProps.root, (textPosition === 'after' || textPosition === 'below') && coin, slots.primaryText && /*#__PURE__*/React.createElement(slots.primaryText, slotProps.primaryText), slots.secondaryText && /*#__PURE__*/React.createElement(slots.secondaryText, slotProps.secondaryText), slots.tertiaryText && /*#__PURE__*/React.createElement(slots.tertiaryText, slotProps.tertiaryText), slots.quaternaryText && /*#__PURE__*/React.createElement(slots.quaternaryText, slotProps.quaternaryText), textPosition === 'before' && coin);\n};\n//# sourceMappingURL=renderPersona.js.map"],"names":["renderPersona_unstable","state","presenceOnly","textPosition","slots","slotProps","getSlots","coin","presence","React","createElement","avatar","root","primaryText","secondaryText","tertiaryText","quaternaryText"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;gCACE;AAIlB,MAAMA,yBAAyBC,CAAAA,QAAS;IAC7C,MAAM,EACJC,aAAY,EACZC,aAAY,EACb,GAAGF;IACJ,MAAM,EACJG,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,wBAAQ,EAACL;IACb,MAAMM,OAAOL,eAAeE,MAAMI,QAAQ,IAAI,WAAW,GAAEC,OAAMC,aAAa,CAACN,MAAMI,QAAQ,EAAEH,UAAUG,QAAQ,IAAIJ,MAAMO,MAAM,IAAI,WAAW,GAAEF,OAAMC,aAAa,CAACN,MAAMO,MAAM,EAAEN,UAAUM,MAAM,CAAC;IACrM,OAAO,WAAW,GAAEF,OAAMC,aAAa,CAACN,MAAMQ,IAAI,EAAEP,UAAUO,IAAI,EAAE,AAACT,CAAAA,iBAAiB,WAAWA,iBAAiB,OAAM,KAAMI,MAAMH,MAAMS,WAAW,IAAI,WAAW,GAAEJ,OAAMC,aAAa,CAACN,MAAMS,WAAW,EAAER,UAAUQ,WAAW,GAAGT,MAAMU,aAAa,IAAI,WAAW,GAAEL,OAAMC,aAAa,CAACN,MAAMU,aAAa,EAAET,UAAUS,aAAa,GAAGV,MAAMW,YAAY,IAAI,WAAW,GAAEN,OAAMC,aAAa,CAACN,MAAMW,YAAY,EAAEV,UAAUU,YAAY,GAAGX,MAAMY,cAAc,IAAI,WAAW,GAAEP,OAAMC,aAAa,CAACN,MAAMY,cAAc,EAAEX,UAAUW,cAAc,GAAGb,iBAAiB,YAAYI;AACzjB,GACA,yCAAyC"}