@fluentui-react-native/experimental-avatar 0.12.19 → 0.13.3
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.
- package/CHANGELOG.json +180 -1
- package/CHANGELOG.md +49 -2
- package/lib/JSAvatar.d.ts +12 -0
- package/lib/JSAvatar.d.ts.map +1 -0
- package/lib/JSAvatar.helpers.d.ts +17 -0
- package/lib/JSAvatar.helpers.d.ts.map +1 -0
- package/lib/JSAvatar.helpers.js +103 -0
- package/lib/JSAvatar.helpers.js.map +1 -0
- package/lib/JSAvatar.js +62 -0
- package/lib/JSAvatar.js.map +1 -0
- package/lib/JSAvatar.styling.d.ts +5 -0
- package/lib/JSAvatar.styling.d.ts.map +1 -0
- package/lib/JSAvatar.styling.js +123 -0
- package/lib/JSAvatar.styling.js.map +1 -0
- package/lib/JSAvatar.types.d.ts +76 -0
- package/lib/JSAvatar.types.d.ts.map +1 -0
- package/lib/JSAvatar.types.js +2 -0
- package/lib/JSAvatar.types.js.map +1 -0
- package/lib/JSAvatarTokens.d.ts +5 -0
- package/lib/JSAvatarTokens.d.ts.map +1 -0
- package/lib/JSAvatarTokens.js +18 -0
- package/lib/JSAvatarTokens.js.map +1 -0
- package/lib/index.d.ts +2 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +2 -0
- package/lib/index.js.map +1 -1
- package/lib/useAvatar.d.ts +10 -0
- package/lib/useAvatar.d.ts.map +1 -0
- package/lib/useAvatar.js +52 -0
- package/lib/useAvatar.js.map +1 -0
- package/lib-commonjs/JSAvatar.d.ts +12 -0
- package/lib-commonjs/JSAvatar.d.ts.map +1 -0
- package/lib-commonjs/JSAvatar.helpers.d.ts +17 -0
- package/lib-commonjs/JSAvatar.helpers.d.ts.map +1 -0
- package/lib-commonjs/JSAvatar.helpers.js +110 -0
- package/lib-commonjs/JSAvatar.helpers.js.map +1 -0
- package/lib-commonjs/JSAvatar.js +64 -0
- package/lib-commonjs/JSAvatar.js.map +1 -0
- package/lib-commonjs/JSAvatar.styling.d.ts +5 -0
- package/lib-commonjs/JSAvatar.styling.d.ts.map +1 -0
- package/lib-commonjs/JSAvatar.styling.js +125 -0
- package/lib-commonjs/JSAvatar.styling.js.map +1 -0
- package/lib-commonjs/JSAvatar.types.d.ts +76 -0
- package/lib-commonjs/JSAvatar.types.d.ts.map +1 -0
- package/lib-commonjs/JSAvatar.types.js +4 -0
- package/lib-commonjs/JSAvatar.types.js.map +1 -0
- package/lib-commonjs/JSAvatarTokens.d.ts +5 -0
- package/lib-commonjs/JSAvatarTokens.d.ts.map +1 -0
- package/lib-commonjs/JSAvatarTokens.js +20 -0
- package/lib-commonjs/JSAvatarTokens.js.map +1 -0
- package/lib-commonjs/index.d.ts +2 -0
- package/lib-commonjs/index.d.ts.map +1 -1
- package/lib-commonjs/index.js +2 -0
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/useAvatar.d.ts +10 -0
- package/lib-commonjs/useAvatar.d.ts.map +1 -0
- package/lib-commonjs/useAvatar.js +54 -0
- package/lib-commonjs/useAvatar.js.map +1 -0
- package/package.json +13 -9
- package/src/JSAvatar.helpers.ts +126 -0
- package/src/JSAvatar.styling.ts +163 -0
- package/src/JSAvatar.tsx +56 -0
- package/src/JSAvatar.types.ts +110 -0
- package/src/JSAvatarTokens.ts +20 -0
- package/src/index.ts +2 -0
- package/src/useAvatar.ts +43 -0
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,186 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/experimental-avatar",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Fri, 17 Dec 2021 01:23:52 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.13.3",
|
|
7
|
+
"version": "0.13.3",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "beachball",
|
|
12
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
13
|
+
"comment": "Bump @fluentui-react-native/framework to v0.7.2",
|
|
14
|
+
"commit": "511aeb31982a5fb9dd2f7196c0c7217cc4a3dbc6"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
19
|
+
"comment": "Bump @fluentui-react-native/theme-tokens to v0.11.1",
|
|
20
|
+
"commit": "511aeb31982a5fb9dd2f7196c0c7217cc4a3dbc6"
|
|
21
|
+
}
|
|
22
|
+
]
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
"date": "Thu, 16 Dec 2021 23:00:56 GMT",
|
|
27
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.13.2",
|
|
28
|
+
"version": "0.13.2",
|
|
29
|
+
"comments": {
|
|
30
|
+
"none": [
|
|
31
|
+
{
|
|
32
|
+
"author": "dannyvv@microsoft.com",
|
|
33
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
34
|
+
"commit": "25b3989739737bc598a5d699a941af4c0b4a421f",
|
|
35
|
+
"comment": "📦 applying package updates ***NO_CI***"
|
|
36
|
+
}
|
|
37
|
+
]
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"date": "Thu, 16 Dec 2021 19:10:29 GMT",
|
|
42
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.13.2",
|
|
43
|
+
"version": "0.13.2",
|
|
44
|
+
"comments": {
|
|
45
|
+
"patch": [
|
|
46
|
+
{
|
|
47
|
+
"author": "v.kozlova13@gmail.com",
|
|
48
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
49
|
+
"commit": "ea7b9238079f53af55ce3c37458b925bb3dfa922",
|
|
50
|
+
"comment": "Added shape prop to Avatar"
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
"author": "beachball",
|
|
54
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
55
|
+
"comment": "Bump @fluentui-react-native/adapters to v0.8.1",
|
|
56
|
+
"commit": "6a9f067ae2510481b6ff3512c10c08e7de84f86e"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"author": "beachball",
|
|
60
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
61
|
+
"comment": "Bump @fluentui-react-native/framework to v0.7.1",
|
|
62
|
+
"commit": "6a9f067ae2510481b6ff3512c10c08e7de84f86e"
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
"author": "beachball",
|
|
66
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
67
|
+
"comment": "Bump @fluentui-react-native/theme-tokens to v0.11.0",
|
|
68
|
+
"commit": "6a9f067ae2510481b6ff3512c10c08e7de84f86e"
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
"author": "beachball",
|
|
72
|
+
"package": "@fluentui-react-native/experimental-avatar",
|
|
73
|
+
"comment": "Bump @fluentui-react-native/tokens to v0.11.1",
|
|
74
|
+
"commit": "6a9f067ae2510481b6ff3512c10c08e7de84f86e"
|
|
75
|
+
}
|
|
76
|
+
]
|
|
77
|
+
}
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
"date": "Wed, 17 Nov 2021 21:07:06 GMT",
|
|
81
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.13.1",
|
|
82
|
+
"version": "0.13.1",
|
|
83
|
+
"comments": {
|
|
84
|
+
"patch": [
|
|
85
|
+
{
|
|
86
|
+
"comment": "fix Avatar not working on iOS",
|
|
87
|
+
"author": "sanajmi@microsoft.com",
|
|
88
|
+
"commit": "7356f363aa7ef56ecd1221ba4b36411701438c2e",
|
|
89
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
90
|
+
}
|
|
91
|
+
]
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
"date": "Wed, 17 Nov 2021 19:28:07 GMT",
|
|
96
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.13.0",
|
|
97
|
+
"version": "0.13.0",
|
|
98
|
+
"comments": {
|
|
99
|
+
"patch": [
|
|
100
|
+
{
|
|
101
|
+
"comment": "Moved Avatar (PersonaCoin) to framework v2.",
|
|
102
|
+
"author": "v.kozlova13@gmail.com",
|
|
103
|
+
"commit": "6f1258d182196549bdd747a752ab8c28e5b60e2a",
|
|
104
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
"comment": "Bump @fluentui-react-native/adapters to v0.8.0",
|
|
108
|
+
"author": "afoxman@microsoft.com",
|
|
109
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
110
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
111
|
+
},
|
|
112
|
+
{
|
|
113
|
+
"comment": "Bump @fluentui-react-native/tokens to v0.11.0",
|
|
114
|
+
"author": "afoxman@microsoft.com",
|
|
115
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
116
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
"comment": "Bump @fluentui-react-native/framework to v0.7.0",
|
|
120
|
+
"author": "afoxman@microsoft.com",
|
|
121
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
122
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
123
|
+
},
|
|
124
|
+
{
|
|
125
|
+
"comment": "Bump @fluentui-react-native/component-cache to v1.3.0",
|
|
126
|
+
"author": "afoxman@microsoft.com",
|
|
127
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
128
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
"comment": "Bump @fluentui-react-native/use-styling to v0.8.0",
|
|
132
|
+
"author": "afoxman@microsoft.com",
|
|
133
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
134
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
135
|
+
},
|
|
136
|
+
{
|
|
137
|
+
"comment": "Bump @fluentui-react-native/theme-tokens to v0.10.0",
|
|
138
|
+
"author": "afoxman@microsoft.com",
|
|
139
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
140
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
141
|
+
}
|
|
142
|
+
],
|
|
143
|
+
"minor": [
|
|
144
|
+
{
|
|
145
|
+
"comment": "Update to react-native 0.64",
|
|
146
|
+
"author": "afoxman@microsoft.com",
|
|
147
|
+
"commit": "f16d742b5c2d5b97e49ac1ef7b740cbf89fc42e6",
|
|
148
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
149
|
+
}
|
|
150
|
+
]
|
|
151
|
+
}
|
|
152
|
+
},
|
|
153
|
+
{
|
|
154
|
+
"date": "Fri, 12 Nov 2021 16:07:20 GMT",
|
|
155
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.12.19",
|
|
156
|
+
"version": "0.12.19",
|
|
157
|
+
"comments": {
|
|
158
|
+
"none": [
|
|
159
|
+
{
|
|
160
|
+
"comment": "Bump @fluentui-react-native/framework to v0.6.6",
|
|
161
|
+
"author": "4123478+tido64@users.noreply.github.com",
|
|
162
|
+
"commit": "25673699e6c6c064b41f1246c2c995baa67a74ad",
|
|
163
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
164
|
+
}
|
|
165
|
+
]
|
|
166
|
+
}
|
|
167
|
+
},
|
|
168
|
+
{
|
|
169
|
+
"date": "Thu, 11 Nov 2021 23:17:41 GMT",
|
|
170
|
+
"tag": "@fluentui-react-native/experimental-avatar_v0.12.19",
|
|
171
|
+
"version": "0.12.19",
|
|
172
|
+
"comments": {
|
|
173
|
+
"none": [
|
|
174
|
+
{
|
|
175
|
+
"comment": "Rename uifabricshared/eslint-config-rules to fluentui-react-native/eslint-config-rules",
|
|
176
|
+
"author": "ruaraki@microsoft.com",
|
|
177
|
+
"commit": "110fba2a1721a914501404f6040f07656307549e",
|
|
178
|
+
"package": "@fluentui-react-native/experimental-avatar"
|
|
179
|
+
}
|
|
180
|
+
]
|
|
181
|
+
}
|
|
182
|
+
},
|
|
183
|
+
{
|
|
184
|
+
"date": "Tue, 09 Nov 2021 23:04:33 GMT",
|
|
6
185
|
"tag": "@fluentui-react-native/experimental-avatar_v0.12.19",
|
|
7
186
|
"version": "0.12.19",
|
|
8
187
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,59 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/experimental-avatar
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Fri, 17 Dec 2021 01:23:52 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.13.3
|
|
8
|
+
|
|
9
|
+
Fri, 17 Dec 2021 01:23:52 GMT
|
|
10
|
+
|
|
11
|
+
### Patches
|
|
12
|
+
|
|
13
|
+
- Bump @fluentui-react-native/framework to v0.7.2
|
|
14
|
+
- Bump @fluentui-react-native/theme-tokens to v0.11.1
|
|
15
|
+
|
|
16
|
+
## 0.13.2
|
|
17
|
+
|
|
18
|
+
Thu, 16 Dec 2021 19:10:29 GMT
|
|
19
|
+
|
|
20
|
+
### Patches
|
|
21
|
+
|
|
22
|
+
- Added shape prop to Avatar (v.kozlova13@gmail.com)
|
|
23
|
+
- Bump @fluentui-react-native/adapters to v0.8.1
|
|
24
|
+
- Bump @fluentui-react-native/framework to v0.7.1
|
|
25
|
+
- Bump @fluentui-react-native/theme-tokens to v0.11.0
|
|
26
|
+
- Bump @fluentui-react-native/tokens to v0.11.1
|
|
27
|
+
|
|
28
|
+
## 0.13.1
|
|
29
|
+
|
|
30
|
+
Wed, 17 Nov 2021 21:07:06 GMT
|
|
31
|
+
|
|
32
|
+
### Patches
|
|
33
|
+
|
|
34
|
+
- fix Avatar not working on iOS (sanajmi@microsoft.com)
|
|
35
|
+
|
|
36
|
+
## 0.13.0
|
|
37
|
+
|
|
38
|
+
Wed, 17 Nov 2021 19:28:07 GMT
|
|
39
|
+
|
|
40
|
+
### Minor changes
|
|
41
|
+
|
|
42
|
+
- Update to react-native 0.64 (afoxman@microsoft.com)
|
|
43
|
+
|
|
44
|
+
### Patches
|
|
45
|
+
|
|
46
|
+
- Moved Avatar (PersonaCoin) to framework v2. (v.kozlova13@gmail.com)
|
|
47
|
+
- Bump @fluentui-react-native/adapters to v0.8.0 (afoxman@microsoft.com)
|
|
48
|
+
- Bump @fluentui-react-native/tokens to v0.11.0 (afoxman@microsoft.com)
|
|
49
|
+
- Bump @fluentui-react-native/framework to v0.7.0 (afoxman@microsoft.com)
|
|
50
|
+
- Bump @fluentui-react-native/component-cache to v1.3.0 (afoxman@microsoft.com)
|
|
51
|
+
- Bump @fluentui-react-native/use-styling to v0.8.0 (afoxman@microsoft.com)
|
|
52
|
+
- Bump @fluentui-react-native/theme-tokens to v0.10.0 (afoxman@microsoft.com)
|
|
53
|
+
|
|
7
54
|
## 0.12.19
|
|
8
55
|
|
|
9
|
-
Tue, 09 Nov 2021 23:
|
|
56
|
+
Tue, 09 Nov 2021 23:04:33 GMT
|
|
10
57
|
|
|
11
58
|
### Patches
|
|
12
59
|
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { JSAvatarProps, JSAvatarState } from './JSAvatar.types';
|
|
2
|
+
/**
|
|
3
|
+
* A function which determines if a set of styles should be applied to the compoent given the current state and props of the avatar.
|
|
4
|
+
*
|
|
5
|
+
* @param layer The name of the state that is being checked for
|
|
6
|
+
* @param state The current state of the avatar
|
|
7
|
+
* @param userProps The props that were passed into the avatar
|
|
8
|
+
* @returns Whether the styles that are assigned to the layer should be applied to the avatar
|
|
9
|
+
*/
|
|
10
|
+
export declare const avatarLookup: (layer: string, state: JSAvatarState, userProps: JSAvatarProps) => boolean;
|
|
11
|
+
export declare const JSAvatar: import("@fluentui-react-native/composition").ComposeFactoryComponent<JSAvatarProps, import("./JSAvatar.types").AvatarSlotProps, import("./JSAvatar.types").JSAvatarTokens, import("@fluentui-react-native/framework").Theme, object>;
|
|
12
|
+
//# sourceMappingURL=JSAvatar.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"JSAvatar.d.ts","sourceRoot":"","sources":["../src/JSAvatar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAA8B,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAK5F;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,4EAExB,CAAC;AAEF,eAAO,MAAM,QAAQ,sOAoCnB,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { AvatarSize, AvatarColor, AvatarPresence, JSAvatarTokens, RingThickness } from './JSAvatar.types';
|
|
2
|
+
import { ImageURISource } from 'react-native';
|
|
3
|
+
export declare function getPresenceIconSource(presence: AvatarPresence, isOutOfOffice: boolean): ImageURISource;
|
|
4
|
+
export declare type AvatarSizeConfig = {
|
|
5
|
+
physicalSize: number;
|
|
6
|
+
iconSize: number;
|
|
7
|
+
iconStrokeWidth: number;
|
|
8
|
+
initialsSize: number;
|
|
9
|
+
};
|
|
10
|
+
export declare function getSizeConfig(size: AvatarSize): AvatarSizeConfig;
|
|
11
|
+
/**
|
|
12
|
+
* Converts the AvatarColor into a hex color value
|
|
13
|
+
*/
|
|
14
|
+
export declare function convertCoinColorFluent(coinColor: AvatarColor): string;
|
|
15
|
+
export declare function calculateEffectiveSizes(tokens: JSAvatarTokens): AvatarSizeConfig;
|
|
16
|
+
export declare function getRingThickness(thickness: RingThickness): number;
|
|
17
|
+
//# sourceMappingURL=JSAvatar.helpers.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"JSAvatar.helpers.d.ts","sourceRoot":"","sources":["../src/JSAvatar.helpers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC1G,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AA4B9C,wBAAgB,qBAAqB,CAAC,QAAQ,EAAE,cAAc,EAAE,aAAa,EAAE,OAAO,GAAG,cAAc,CAEtG;AAED,oBAAY,gBAAgB,GAAG;IAC7B,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAcF,wBAAgB,aAAa,CAAC,IAAI,EAAE,UAAU,GAAG,gBAAgB,CAEhE;AAyBD;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,WAAW,GAAG,MAAM,CAErE;AAED,wBAAgB,uBAAuB,CAAC,MAAM,EAAE,cAAc,GAAG,gBAAgB,CAoBhF;AAED,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,aAAa,GAAG,MAAM,CAiBjE"}
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
import { globalTokens } from '@fluentui-react-native/theme-tokens';
|
|
2
|
+
var presenceIconCache = {
|
|
3
|
+
none: { uri: '' },
|
|
4
|
+
offline: {
|
|
5
|
+
uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAANlBMVEUAAACoxM+oxM+oxM+oxM+oxM+oxM+oxM+oxM////+oxM/W5OmzzNX5+/z3+vvu9Pbt8/Xj7PAAKKEtAAAACXRSTlMA6bWcZQpiXgXWfJCWAAAAeElEQVQoz52RSQ7EIAwEx0AWymT7/2dHYpgoPvQldeySsGl/XjOVZGCpTDFfjIEtj3jN0Pzc99Mb5PUWGbwOHPI/n+GqNxfMY67h9YFjvw0KrQYapYuER+GkLowjigPrArYoNpBCPiWHy3XlB1UlqkRZuziUPO1bvszLC8V87ko/AAAAAElFTkSuQmCC',
|
|
6
|
+
},
|
|
7
|
+
online: {
|
|
8
|
+
uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAWlBMVEUAAABusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAVusAX////N4bi61517tivn8d3e7NL3+vTE3Kux0o6nzH6GvEWFZ26xAAAAEnRSTlMA8eNrEQj6syHTeXrKshzZ19JHa6QpAAAApUlEQVQoz4WS6w7CIAyFBwwGbE5th87b+7+mCDXcIp4/NN9J2tJ2+KdRTFyx0yTGAkvLgMRmmbg2kMnoL185FOIr5Vmg0hKzWWhkQz+sNdinN1Eg9wyP8MYh5xvewjt5gxcct9iYN1SIXvsj46C8EWvfEZ0jTsYxRJcrYuLAqTg5xKm4AHL2xEH8/GBvJIM819xIWkc9dt1ZFEnO+WrbY1CcjqGnN0xiGcyuKFtcAAAAAElFTkSuQmCC',
|
|
9
|
+
},
|
|
10
|
+
away: {
|
|
11
|
+
uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAP1BMVEUAAAD6yRT6yRT6yRT6yRT6yRT6yRT6yRT6yRT6yRT6yRT6yRT////6zCP95pH95Yv++OL84Hn822T72FT71EUen9LHAAAAC3RSTlMA6rVlCuWgmGJeBd4LCPMAAAB8SURBVCjPnZFLDoAgDERtQUUH/97/rCYNJUITTXjLeYu2064Z75gAYufLfOqR6KdXPI94Mc5ZDCgYNA8piHGBENJcqgV5EQ61gBPBVrAIsoJEwArUYi0EIbFlQ+VwHGpY11XOGDdZVw/MXPstB2olFeGnRFv796Psa1t5ANwFDZEW8B8sAAAAAElFTkSuQmCC',
|
|
12
|
+
},
|
|
13
|
+
dnd: {
|
|
14
|
+
uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAQlBMVEUAAADpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABv////wfYT86errJjiR9OLxAAAAEXRSTlMA4/CzeQj602seEhEk89jKakfnNfsAAACKSURBVCjPhZFbDoQgDEWBQkHBR2d0/1udEppR0cbzeU9SSq95I69gcZphzZc4eEeC8+HIh0gn4vDPLV2wYsJCHUub5umGr/no7sKNLBI9kFjAkwAWbaX9K+xtMRZIle0jbFRBFpMmZmWU8ri+rv5B/SQmxD6PUknpz16MUJSi9GqZnMAiWkjZvPADxcoYalVfnOMAAAAASUVORK5CYII=',
|
|
15
|
+
},
|
|
16
|
+
blocked: {
|
|
17
|
+
uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAe1BMVEUAAADpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABv////pABv83uHqCiTsJz7rGjP7zNHvRVj/+vv+8vP6x83sIzv2mqXsKD/7zNL5v8b3oqz2maTuP1P82Nz819vtKUDrGjLrGTK2dyGvAAAAEXRSTlMA8dSzeQj64mseEhHkJMpq5T3coEAAAADSSURBVCjPhdHZFoIgFAVQGQRLGzhQiaLNw/9/YZRk4IvncZ+17uJys7mUGyYFoWxTJpxzghDC878vKFBftLX6UgN0MXqF/qRCTg5VaPI1ro36Re+MWQ/TOPrEXw7840uCNvb9oQVZ+qJAnbpSNQpfMHQTVx2YLyT0xJWG9IWAnbiyEL4gaCKPCopb7P9RDOeJqzNYeG7i3+eGBVMPC2Yczpn9cfTmAT58IoV5Rn4FDSdZbY1rxzk9qpXHofkcqtO2uXfhUHOn9SkLJoWQrCizmbwBa5IbuX8ugpIAAAAASUVORK5CYII=',
|
|
18
|
+
},
|
|
19
|
+
busy: {
|
|
20
|
+
uri: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAANlBMVEUAAADpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvpABvsgIdoAAAAEXRSTlMA8eLUEQj6s2sheXrlyrJqHBqb3nMAAAB/SURBVCjPhZFRDsQgCEQFEdS223L/yy7JummtGN/nvASUCSvoFGSIclIXpwragC3deYn6IJZ/fqF24NXmHPri+E2rOlCDQTAKIBNZHbKJjyfEBHoCTbAn2ATMRPRHzZfPn+t/cH4SIw3rY2p17H2+l0VRRtr8ag3KgswomcKCL1NmGBp9lqsZAAAAAElFTkSuQmCC',
|
|
21
|
+
},
|
|
22
|
+
};
|
|
23
|
+
// TODO: Need icons for the OOF statuses
|
|
24
|
+
var presenceOOFIconCache = presenceIconCache;
|
|
25
|
+
export function getPresenceIconSource(presence, isOutOfOffice) {
|
|
26
|
+
return isOutOfOffice ? presenceOOFIconCache[presence] : presenceIconCache[presence];
|
|
27
|
+
}
|
|
28
|
+
var sizeTable = {
|
|
29
|
+
size8: { physicalSize: 8, iconSize: 0, iconStrokeWidth: 0, initialsSize: 4 },
|
|
30
|
+
size24: { physicalSize: 24, iconSize: 8, iconStrokeWidth: 2, initialsSize: 10 },
|
|
31
|
+
size32: { physicalSize: 32, iconSize: 8, iconStrokeWidth: 2, initialsSize: 12 },
|
|
32
|
+
size40: { physicalSize: 40, iconSize: 12, iconStrokeWidth: 2, initialsSize: 14 },
|
|
33
|
+
size48: { physicalSize: 48, iconSize: 12, iconStrokeWidth: 2, initialsSize: 16 },
|
|
34
|
+
size56: { physicalSize: 56, iconSize: 16, iconStrokeWidth: 3, initialsSize: 18 },
|
|
35
|
+
size72: { physicalSize: 72, iconSize: 20, iconStrokeWidth: 3, initialsSize: 20 },
|
|
36
|
+
size100: { physicalSize: 100, iconSize: 28, iconStrokeWidth: 4, initialsSize: 36 },
|
|
37
|
+
size120: { physicalSize: 120, iconSize: 32, iconStrokeWidth: 4, initialsSize: 40 },
|
|
38
|
+
};
|
|
39
|
+
export function getSizeConfig(size) {
|
|
40
|
+
return sizeTable[size];
|
|
41
|
+
}
|
|
42
|
+
var colorTableFluent = {
|
|
43
|
+
cornflower: globalTokens.color.cornflower.primary,
|
|
44
|
+
blue: globalTokens.color.blue.primary,
|
|
45
|
+
royalBlue: globalTokens.color.royalBlue.primary,
|
|
46
|
+
teal: globalTokens.color.teal.primary,
|
|
47
|
+
forest: globalTokens.color.forest.primary,
|
|
48
|
+
darkGreen: globalTokens.color.darkGreen.primary,
|
|
49
|
+
berry: globalTokens.color.berry.primary,
|
|
50
|
+
hotPink: globalTokens.color.hotPink.primary,
|
|
51
|
+
grape: globalTokens.color.grape.primary,
|
|
52
|
+
purple: globalTokens.color.purple.primary,
|
|
53
|
+
pumpkin: globalTokens.color.pumpkin.primary,
|
|
54
|
+
red: globalTokens.color.red.primary,
|
|
55
|
+
burgundy: globalTokens.color.burgundy.primary,
|
|
56
|
+
orchid: globalTokens.color.orchid.primary,
|
|
57
|
+
brass: globalTokens.color.brass.primary,
|
|
58
|
+
darkRed: globalTokens.color.darkRed.primary,
|
|
59
|
+
beige: globalTokens.color.beige.primary,
|
|
60
|
+
platinum: globalTokens.color.platinum.primary,
|
|
61
|
+
steel: globalTokens.color.steel.primary,
|
|
62
|
+
brown: globalTokens.color.brown.primary,
|
|
63
|
+
};
|
|
64
|
+
/**
|
|
65
|
+
* Converts the AvatarColor into a hex color value
|
|
66
|
+
*/
|
|
67
|
+
export function convertCoinColorFluent(coinColor) {
|
|
68
|
+
return colorTableFluent[coinColor];
|
|
69
|
+
}
|
|
70
|
+
export function calculateEffectiveSizes(tokens) {
|
|
71
|
+
var size = tokens.size, avatarSize = tokens.avatarSize, iconSize = tokens.iconSize, iconStrokeWidth = tokens.iconStrokeWidth, initialsSize = tokens.initialsSize;
|
|
72
|
+
if (size) {
|
|
73
|
+
return sizeTable[size];
|
|
74
|
+
}
|
|
75
|
+
else {
|
|
76
|
+
var _a = sizeTable['size40'], defaultPhysicalSize = _a.physicalSize, defaultIconSize = _a.iconSize, defaultIconStrokeWidth = _a.iconStrokeWidth, defaultInitialsSize = _a.initialsSize;
|
|
77
|
+
return {
|
|
78
|
+
physicalSize: avatarSize || defaultPhysicalSize,
|
|
79
|
+
iconSize: iconSize || defaultIconSize,
|
|
80
|
+
iconStrokeWidth: iconStrokeWidth || defaultIconStrokeWidth,
|
|
81
|
+
initialsSize: initialsSize || defaultInitialsSize,
|
|
82
|
+
};
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
export function getRingThickness(thickness) {
|
|
86
|
+
switch (thickness) {
|
|
87
|
+
case 'xSmall':
|
|
88
|
+
return 1;
|
|
89
|
+
case 'small':
|
|
90
|
+
return 1;
|
|
91
|
+
case 'medium':
|
|
92
|
+
return 2;
|
|
93
|
+
case 'large':
|
|
94
|
+
return 2;
|
|
95
|
+
case 'xlarge':
|
|
96
|
+
return 2;
|
|
97
|
+
case 'xxlarge':
|
|
98
|
+
return 4;
|
|
99
|
+
default:
|
|
100
|
+
return thickness < 0 ? 4 : thickness;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
//# sourceMappingURL=JSAvatar.helpers.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"JSAvatar.helpers.js","sourceRoot":"","sources":["../src/JSAvatar.helpers.ts"],"names":[],"mappings":"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"}
|
package/lib/JSAvatar.js
ADDED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
23
|
+
/** @jsx withSlots */
|
|
24
|
+
import { Image, View, Text } from 'react-native';
|
|
25
|
+
import { JSAvatarName } from './JSAvatar.types';
|
|
26
|
+
import { stylingSettings } from './JSAvatar.styling';
|
|
27
|
+
import { compose, mergeProps, withSlots } from '@fluentui-react-native/framework';
|
|
28
|
+
import { useAvatar } from './useAvatar';
|
|
29
|
+
/**
|
|
30
|
+
* A function which determines if a set of styles should be applied to the compoent given the current state and props of the avatar.
|
|
31
|
+
*
|
|
32
|
+
* @param layer The name of the state that is being checked for
|
|
33
|
+
* @param state The current state of the avatar
|
|
34
|
+
* @param userProps The props that were passed into the avatar
|
|
35
|
+
* @returns Whether the styles that are assigned to the layer should be applied to the avatar
|
|
36
|
+
*/
|
|
37
|
+
export var avatarLookup = function (layer, state, userProps) {
|
|
38
|
+
return state[layer] || userProps[layer] || layer === userProps['shape'] || (!userProps['shape'] && layer === 'circular');
|
|
39
|
+
};
|
|
40
|
+
export var JSAvatar = compose(__assign(__assign({ displayName: JSAvatarName }, stylingSettings), { slots: {
|
|
41
|
+
root: View,
|
|
42
|
+
photo: Image,
|
|
43
|
+
initials: Text,
|
|
44
|
+
initialsBackground: View,
|
|
45
|
+
icon: Image,
|
|
46
|
+
ring: View,
|
|
47
|
+
glow: View,
|
|
48
|
+
}, render: function (userProps, useSlots) {
|
|
49
|
+
var avatar = useAvatar(userProps);
|
|
50
|
+
var Slots = useSlots(userProps, function (layer) { return avatarLookup(layer, avatar.state, userProps); });
|
|
51
|
+
return function (final) {
|
|
52
|
+
var _a = mergeProps(avatar.props, final), children = _a.children, accessibilityLabel = _a.accessibilityLabel, mergedProps = __rest(_a, ["children", "accessibilityLabel"]);
|
|
53
|
+
var _b = avatar.state, personaPhotoSource = _b.personaPhotoSource, iconSource = _b.iconSource, showRing = _b.showRing, transparentRing = _b.transparentRing;
|
|
54
|
+
return (withSlots(Slots.root, __assign({}, mergedProps),
|
|
55
|
+
personaPhotoSource ? (withSlots(Slots.photo, { accessibilityLabel: accessibilityLabel, source: personaPhotoSource })) : (withSlots(Slots.initialsBackground, null,
|
|
56
|
+
withSlots(Slots.initials, null, children))),
|
|
57
|
+
showRing && !transparentRing && withSlots(Slots.ring, null),
|
|
58
|
+
showRing && withSlots(Slots.glow, null),
|
|
59
|
+
!!iconSource && !!iconSource.uri && withSlots(Slots.icon, { source: iconSource })));
|
|
60
|
+
};
|
|
61
|
+
} }));
|
|
62
|
+
//# sourceMappingURL=JSAvatar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"JSAvatar.js","sourceRoot":"","sources":["../src/JSAvatar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,qBAAqB;AACrB,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAA+B,YAAY,EAAiB,MAAM,kBAAkB,CAAC;AAC5F,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAY,UAAU,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAC5F,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC;;;;;;;GAOG;AACH,MAAM,CAAC,IAAM,YAAY,GAAG,UAAC,KAAa,EAAE,KAAoB,EAAE,SAAwB;IACxF,OAAO,KAAK,CAAC,KAAK,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC,IAAI,KAAK,KAAK,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,KAAK,KAAK,UAAU,CAAC,CAAC;AAC3H,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,OAAO,qBAC7B,WAAW,EAAE,YAAY,IACtB,eAAe,KAClB,KAAK,EAAE;QACL,IAAI,EAAE,IAAI;QACV,KAAK,EAAE,KAAK;QACZ,QAAQ,EAAE,IAAI;QACd,kBAAkB,EAAE,IAAI;QACxB,IAAI,EAAE,KAAK;QACX,IAAI,EAAE,IAAI;QACV,IAAI,EAAE,IAAI;KACX,EACD,MAAM,EAAE,UAAC,SAAwB,EAAE,QAAgC;QACjE,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;QACpC,IAAM,KAAK,GAAG,QAAQ,CAAC,SAAS,EAAE,UAAC,KAAK,IAAK,OAAA,YAAY,CAAC,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,EAA5C,CAA4C,CAAC,CAAC;QAE3F,OAAO,UAAC,KAAoB;YAC1B,IAAM,oCAAkF,EAAhF,sBAAQ,EAAE,0CAAkB,EAAE,4DAAkD,CAAC;YACnF,IAAA,iBAA4E,EAA1E,0CAAkB,EAAE,0BAAU,EAAE,sBAAQ,EAAE,oCAAgC,CAAC;YAEnF,OAAO,CACL,UAAC,KAAK,CAAC,IAAI,eAAK,WAAW;gBACxB,kBAAkB,CAAC,CAAC,CAAC,CACpB,UAAC,KAAK,CAAC,KAAK,IAAC,kBAAkB,EAAE,kBAAkB,EAAE,MAAM,EAAE,kBAAkB,GAAI,CACpF,CAAC,CAAC,CAAC,CACF,UAAC,KAAK,CAAC,kBAAkB;oBACvB,UAAC,KAAK,CAAC,QAAQ,QAAE,QAAQ,CAAkB,CAClB,CAC5B;gBACA,QAAQ,IAAI,CAAC,eAAe,IAAI,UAAC,KAAK,CAAC,IAAI,OAAG;gBAC9C,QAAQ,IAAI,UAAC,KAAK,CAAC,IAAI,OAAG;gBAC1B,CAAC,CAAC,UAAU,IAAI,CAAC,CAAC,UAAU,CAAC,GAAG,IAAI,UAAC,KAAK,CAAC,IAAI,IAAC,MAAM,EAAE,UAAU,GAAI,CAC5D,CACd,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,IACD,CAAC"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { JSAvatarTokens, AvatarSlotProps, JSAvatarProps } from './JSAvatar.types';
|
|
2
|
+
import { UseStylingOptions } from '@fluentui-react-native/framework';
|
|
3
|
+
export declare const avatarStates: (keyof JSAvatarTokens)[];
|
|
4
|
+
export declare const stylingSettings: UseStylingOptions<JSAvatarProps, AvatarSlotProps, JSAvatarTokens>;
|
|
5
|
+
//# sourceMappingURL=JSAvatar.styling.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"JSAvatar.styling.d.ts","sourceRoot":"","sources":["../src/JSAvatar.styling.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAChG,OAAO,EAAS,iBAAiB,EAAc,MAAM,kCAAkC,CAAC;AAYxF,eAAO,MAAM,YAAY,EAAE,CAAC,MAAM,cAAc,CAAC,EAA2B,CAAC;AAE7E,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,aAAa,EAAE,eAAe,EAAE,cAAc,CAmJ7F,CAAC"}
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
var __spreadArrays = (this && this.__spreadArrays) || function () {
|
|
13
|
+
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
|
|
14
|
+
for (var r = Array(s), k = 0, i = 0; i < il; i++)
|
|
15
|
+
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
|
|
16
|
+
r[k] = a[j];
|
|
17
|
+
return r;
|
|
18
|
+
};
|
|
19
|
+
import { JSAvatarName } from './JSAvatar.types';
|
|
20
|
+
import { buildProps } from '@fluentui-react-native/framework';
|
|
21
|
+
import { defaultJSAvatarTokens } from './JSAvatarTokens';
|
|
22
|
+
import { calculateEffectiveSizes, convertCoinColorFluent, getRingThickness } from './JSAvatar.helpers';
|
|
23
|
+
import { borderStyles } from '@fluentui-react-native/tokens';
|
|
24
|
+
var nameMap = {
|
|
25
|
+
start: 'flex-start',
|
|
26
|
+
center: 'center',
|
|
27
|
+
end: 'flex-end',
|
|
28
|
+
};
|
|
29
|
+
export var avatarStates = ['circular', 'square'];
|
|
30
|
+
export var stylingSettings = {
|
|
31
|
+
tokens: [defaultJSAvatarTokens, JSAvatarName],
|
|
32
|
+
states: avatarStates,
|
|
33
|
+
slotProps: {
|
|
34
|
+
root: buildProps(function (tokens) {
|
|
35
|
+
var physicalSize = calculateEffectiveSizes(tokens).physicalSize;
|
|
36
|
+
var horizontalIconAlignment = tokens.horizontalIconAlignment, verticalIconAlignment = tokens.verticalIconAlignment;
|
|
37
|
+
return {
|
|
38
|
+
style: {
|
|
39
|
+
flexDirection: 'row',
|
|
40
|
+
width: physicalSize,
|
|
41
|
+
height: physicalSize,
|
|
42
|
+
justifyContent: nameMap[horizontalIconAlignment || 'end'],
|
|
43
|
+
alignItems: nameMap[verticalIconAlignment || 'end'],
|
|
44
|
+
horizontalIconAlignment: horizontalIconAlignment,
|
|
45
|
+
verticalIconAlignment: verticalIconAlignment,
|
|
46
|
+
},
|
|
47
|
+
};
|
|
48
|
+
}, ['horizontalIconAlignment', 'verticalIconAlignment']),
|
|
49
|
+
initials: buildProps(function (tokens) {
|
|
50
|
+
var initialsSize = calculateEffectiveSizes(tokens).initialsSize;
|
|
51
|
+
return {
|
|
52
|
+
style: {
|
|
53
|
+
fontSize: initialsSize,
|
|
54
|
+
},
|
|
55
|
+
};
|
|
56
|
+
}, ['initialsSize']),
|
|
57
|
+
initialsBackground: buildProps(function (tokens, theme) {
|
|
58
|
+
var physicalSize = calculateEffectiveSizes(tokens).physicalSize;
|
|
59
|
+
var backgroundColor = tokens.backgroundColor, coinColorFluent = tokens.coinColorFluent;
|
|
60
|
+
var effectiveBackgroundColor = backgroundColor;
|
|
61
|
+
if (coinColorFluent) {
|
|
62
|
+
effectiveBackgroundColor = convertCoinColorFluent(coinColorFluent);
|
|
63
|
+
}
|
|
64
|
+
return {
|
|
65
|
+
style: __assign(__assign({}, borderStyles.from(tokens, theme)), { width: physicalSize, height: physicalSize, flexGrow: 1, alignSelf: 'stretch', justifyContent: 'center', alignItems: 'center', backgroundColor: effectiveBackgroundColor }),
|
|
66
|
+
};
|
|
67
|
+
}, __spreadArrays(['coinColorFluent', 'backgroundColor', 'physicalSize'], borderStyles.keys)),
|
|
68
|
+
photo: buildProps(function (tokens) {
|
|
69
|
+
var physicalSize = calculateEffectiveSizes(tokens).physicalSize;
|
|
70
|
+
return {
|
|
71
|
+
style: {
|
|
72
|
+
borderRadius: tokens.borderRadius,
|
|
73
|
+
width: physicalSize,
|
|
74
|
+
height: physicalSize,
|
|
75
|
+
},
|
|
76
|
+
};
|
|
77
|
+
}, ['physicalSize', 'borderRadius']),
|
|
78
|
+
icon: buildProps(function (tokens, theme) {
|
|
79
|
+
var _a = calculateEffectiveSizes(tokens), iconSize = _a.iconSize, iconStrokeWidth = _a.iconStrokeWidth;
|
|
80
|
+
var iconSizeAdjusted = iconSize + iconStrokeWidth * 2;
|
|
81
|
+
var iconStrokeColor = tokens.iconStrokeColor || theme.colors.background;
|
|
82
|
+
return {
|
|
83
|
+
style: {
|
|
84
|
+
position: 'absolute',
|
|
85
|
+
width: iconSizeAdjusted,
|
|
86
|
+
height: iconSizeAdjusted,
|
|
87
|
+
bottom: -iconStrokeWidth,
|
|
88
|
+
end: -iconStrokeWidth,
|
|
89
|
+
borderRadius: iconSizeAdjusted / 2,
|
|
90
|
+
borderWidth: iconStrokeWidth,
|
|
91
|
+
borderColor: iconStrokeColor,
|
|
92
|
+
},
|
|
93
|
+
};
|
|
94
|
+
}, ['iconSize', 'iconStrokeWidth', 'iconStrokeColor']),
|
|
95
|
+
ring: buildProps(function (tokens, theme) {
|
|
96
|
+
var physicalSize = calculateEffectiveSizes(tokens).physicalSize;
|
|
97
|
+
var ring = tokens.ring;
|
|
98
|
+
if (!ring)
|
|
99
|
+
return {};
|
|
100
|
+
var innerGap = ring.innerGap != undefined ? getRingThickness(ring.innerGap) : getRingThickness(ring.ringThickness || 'xxlarge');
|
|
101
|
+
var effectiveRingThickness = 2 * getRingThickness(ring.ringThickness || 'xxlarge') + innerGap;
|
|
102
|
+
var effectiveSize = physicalSize + 2 * effectiveRingThickness;
|
|
103
|
+
var ringColor = ring.ringBackgroundColor || theme.colors.personaActivityRing;
|
|
104
|
+
return {
|
|
105
|
+
style: __assign({ borderStyle: 'solid', borderColor: ringColor, borderWidth: effectiveRingThickness, width: effectiveSize, height: effectiveSize, position: 'absolute', top: -effectiveRingThickness, left: -effectiveRingThickness }, borderStyles.from(tokens, theme)),
|
|
106
|
+
};
|
|
107
|
+
}, __spreadArrays(['physicalSize', 'ring', 'physicalSize'], borderStyles.keys)),
|
|
108
|
+
glow: buildProps(function (tokens, theme) {
|
|
109
|
+
var physicalSize = calculateEffectiveSizes(tokens).physicalSize;
|
|
110
|
+
var ring = tokens.ring;
|
|
111
|
+
if (!ring)
|
|
112
|
+
return {};
|
|
113
|
+
var innerGap = ring.innerGap != undefined ? getRingThickness(ring.innerGap) : getRingThickness(ring.ringThickness || 'xxlarge');
|
|
114
|
+
var effectiveRingThickness = getRingThickness(ring.ringThickness || 'xxlarge') + innerGap;
|
|
115
|
+
var effectiveSize = physicalSize + 2 * effectiveRingThickness;
|
|
116
|
+
var glowColor = ring.accent ? theme.colors.accentButtonBackground : ring.ringColor || theme.colors.personaActivityGlow;
|
|
117
|
+
return {
|
|
118
|
+
style: __assign({ borderStyle: 'solid', borderColor: glowColor, borderWidth: effectiveRingThickness - innerGap, width: effectiveSize, height: effectiveSize, position: 'absolute', top: -effectiveRingThickness, left: -effectiveRingThickness }, borderStyles.from(tokens, theme)),
|
|
119
|
+
};
|
|
120
|
+
}, __spreadArrays(['physicalSize', 'ring'], borderStyles.keys)),
|
|
121
|
+
},
|
|
122
|
+
};
|
|
123
|
+
//# sourceMappingURL=JSAvatar.styling.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"JSAvatar.styling.js","sourceRoot":"","sources":["../src/JSAvatar.styling.ts"],"names":[],"mappings":"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"}
|