@fluentui-react-native/use-styling 0.9.1 → 0.9.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/.eslintrc.js +3 -0
- package/CHANGELOG.json +58 -1
- package/CHANGELOG.md +20 -2
- package/lib/buildProps.d.ts +6 -6
- package/lib/buildProps.d.ts.map +1 -1
- package/lib/buildUseStyling.d.ts +5 -5
- package/lib/buildUseStyling.d.ts.map +1 -1
- package/lib/buildUseStyling.js.map +1 -1
- package/lib/buildUseStyling.test.js.map +1 -1
- package/lib/index.d.ts +4 -2
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +2 -2
- package/lib/index.js.map +1 -1
- package/lib/useStyling.samples.test.js.map +1 -1
- package/lib-commonjs/buildProps.d.ts +6 -6
- package/lib-commonjs/buildProps.d.ts.map +1 -1
- package/lib-commonjs/buildProps.test.js +1 -1
- package/lib-commonjs/buildProps.test.js.map +1 -1
- package/lib-commonjs/buildUseStyling.d.ts +5 -5
- package/lib-commonjs/buildUseStyling.d.ts.map +1 -1
- package/lib-commonjs/buildUseStyling.js +2 -2
- package/lib-commonjs/buildUseStyling.js.map +1 -1
- package/lib-commonjs/buildUseStyling.test.js +1 -1
- package/lib-commonjs/buildUseStyling.test.js.map +1 -1
- package/lib-commonjs/index.d.ts +4 -2
- package/lib-commonjs/index.d.ts.map +1 -1
- package/lib-commonjs/index.js +6 -4
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/useStyling.samples.test.js +10 -10
- package/lib-commonjs/useStyling.samples.test.js.map +1 -1
- package/package.json +17 -11
- package/src/buildProps.ts +1 -1
- package/src/buildUseStyling.test.ts +2 -1
- package/src/buildUseStyling.ts +5 -3
- package/src/index.ts +4 -2
- package/src/useStyling.samples.test.tsx +4 -2
package/.eslintrc.js
ADDED
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,64 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/use-styling",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Thu, 02 Feb 2023 01:27:10 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/use-styling_v0.9.3",
|
|
7
|
+
"version": "0.9.3",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "30809111+acoates-ms@users.noreply.github.com",
|
|
12
|
+
"package": "@fluentui-react-native/use-styling",
|
|
13
|
+
"commit": "ac679ca51704ba5c2d2cc2385a71694b69735a1d",
|
|
14
|
+
"comment": "Add eslint to packages missing a config"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui-react-native/use-styling",
|
|
19
|
+
"comment": "Bump @fluentui-react-native/use-tokens to v0.3.3",
|
|
20
|
+
"commit": "ac679ca51704ba5c2d2cc2385a71694b69735a1d"
|
|
21
|
+
}
|
|
22
|
+
]
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
"date": "Wed, 01 Feb 2023 22:33:17 GMT",
|
|
27
|
+
"tag": "@fluentui-react-native/use-styling_v0.9.2",
|
|
28
|
+
"version": "0.9.2",
|
|
29
|
+
"comments": {
|
|
30
|
+
"patch": [
|
|
31
|
+
{
|
|
32
|
+
"author": "beachball",
|
|
33
|
+
"package": "@fluentui-react-native/use-styling",
|
|
34
|
+
"comment": "Bump @fluentui-react-native/memo-cache to v1.1.8",
|
|
35
|
+
"commit": "2d0138c80d7512b905fcf32583760bec2b911910"
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"author": "beachball",
|
|
39
|
+
"package": "@fluentui-react-native/use-styling",
|
|
40
|
+
"comment": "Bump @fluentui-react-native/use-tokens to v0.3.2",
|
|
41
|
+
"commit": "2d0138c80d7512b905fcf32583760bec2b911910"
|
|
42
|
+
}
|
|
43
|
+
]
|
|
44
|
+
}
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"date": "Mon, 30 Jan 2023 15:17:32 GMT",
|
|
48
|
+
"tag": "@fluentui-react-native/use-styling_v0.9.1",
|
|
49
|
+
"version": "0.9.1",
|
|
50
|
+
"comments": {
|
|
51
|
+
"none": [
|
|
52
|
+
{
|
|
53
|
+
"author": "4123478+tido64@users.noreply.github.com",
|
|
54
|
+
"package": "@fluentui-react-native/use-styling",
|
|
55
|
+
"commit": "4de4c2b37c835ebd9af015ff767f9dd68452f786",
|
|
56
|
+
"comment": "Migrate to align-deps"
|
|
57
|
+
}
|
|
58
|
+
]
|
|
59
|
+
}
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
"date": "Fri, 30 Sep 2022 00:54:37 GMT",
|
|
6
63
|
"tag": "@fluentui-react-native/use-styling_v0.9.1",
|
|
7
64
|
"version": "0.9.1",
|
|
8
65
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,30 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/use-styling
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Thu, 02 Feb 2023 01:27:10 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.9.3
|
|
8
|
+
|
|
9
|
+
Thu, 02 Feb 2023 01:27:10 GMT
|
|
10
|
+
|
|
11
|
+
### Patches
|
|
12
|
+
|
|
13
|
+
- Add eslint to packages missing a config (30809111+acoates-ms@users.noreply.github.com)
|
|
14
|
+
- Bump @fluentui-react-native/use-tokens to v0.3.3
|
|
15
|
+
|
|
16
|
+
## 0.9.2
|
|
17
|
+
|
|
18
|
+
Wed, 01 Feb 2023 22:33:17 GMT
|
|
19
|
+
|
|
20
|
+
### Patches
|
|
21
|
+
|
|
22
|
+
- Bump @fluentui-react-native/memo-cache to v1.1.8
|
|
23
|
+
- Bump @fluentui-react-native/use-tokens to v0.3.2
|
|
24
|
+
|
|
7
25
|
## 0.9.1
|
|
8
26
|
|
|
9
|
-
Fri, 30 Sep 2022 00:
|
|
27
|
+
Fri, 30 Sep 2022 00:54:37 GMT
|
|
10
28
|
|
|
11
29
|
### Patches
|
|
12
30
|
|
package/lib/buildProps.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
1
|
+
import type { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
2
2
|
/**
|
|
3
3
|
* Informs the framework of any tokens that also appear as props for the component.
|
|
4
4
|
* - 'none' | undefined : this means no properties should be treated as tokens, the tokens that will be passed in to buildProps
|
|
@@ -7,7 +7,7 @@ import { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
|
7
7
|
* - 'all' : treat all props as tokens. Props will be spread into the tokens before the slot functions are called
|
|
8
8
|
* - array of keys : this is the discrete list of tokens which also appear in props
|
|
9
9
|
*/
|
|
10
|
-
export
|
|
10
|
+
export type TokensThatAreAlsoProps<TTokens> = (keyof TTokens)[] | 'all' | 'none';
|
|
11
11
|
/**
|
|
12
12
|
* Raw format for producing styles in a functional manner. These can only depend on tokens or theme as inputs.
|
|
13
13
|
* - tokens: these will be produced from the theme and component constants, then they will be potentially
|
|
@@ -16,22 +16,22 @@ export declare type TokensThatAreAlsoProps<TTokens> = (keyof TTokens)[] | 'all'
|
|
|
16
16
|
* The provided
|
|
17
17
|
* cache will be scoped to the theme, slot, and tokens that are coming out of the theme.
|
|
18
18
|
*/
|
|
19
|
-
export
|
|
19
|
+
export type BuildPropsBase<TProps, TTokens, TTheme> = (tokens: TTokens, theme: TTheme, cache: GetMemoValue<any>) => Partial<TProps>;
|
|
20
20
|
/**
|
|
21
21
|
* A refine function allows style functions to be updated based on tokens that are also props. Only those tokens that are also
|
|
22
22
|
* props need to be considered as a key for caching
|
|
23
23
|
*/
|
|
24
|
-
export
|
|
24
|
+
export type RefineFunctionBase<TProps, TTokens, TTheme> = (mask?: TokensThatAreAlsoProps<TTokens>) => BuildPropsBase<TProps, TTokens, TTheme>;
|
|
25
25
|
/**
|
|
26
26
|
* Signature for a style function which can be optionally refined by the styling hook if prop masks are provided
|
|
27
27
|
*/
|
|
28
|
-
export
|
|
28
|
+
export type RefinableBuildPropsBase<TProps, TTokens, TTheme> = BuildPropsBase<TProps, TTokens, TTheme> & {
|
|
29
29
|
refine?: RefineFunctionBase<TProps, TTokens, TTheme>;
|
|
30
30
|
};
|
|
31
31
|
/**
|
|
32
32
|
* Style functions can be plain functions, refinable functions, or just raw props
|
|
33
33
|
*/
|
|
34
|
-
export
|
|
34
|
+
export type BuildSlotProps<TSlotProps, TTokens, TTheme> = {
|
|
35
35
|
[K in keyof TSlotProps]?: RefinableBuildPropsBase<TSlotProps[K], TTokens, TTheme> | TSlotProps[K];
|
|
36
36
|
};
|
|
37
37
|
/**
|
package/lib/buildProps.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildProps.d.ts","sourceRoot":"","sources":["../src/buildProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"buildProps.d.ts","sourceRoot":"","sources":["../src/buildProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEtE;;;;;;;GAOG;AACH,MAAM,MAAM,sBAAsB,CAAC,OAAO,IAAI,CAAC,MAAM,OAAO,CAAC,EAAE,GAAG,KAAK,GAAG,MAAM,CAAC;AAEjF;;;;;;;GAOG;AACH,MAAM,MAAM,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;AAEpI;;;GAGG;AACH,MAAM,MAAM,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI,CACxD,IAAI,CAAC,EAAE,sBAAsB,CAAC,OAAO,CAAC,KACnC,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;AAE7C;;GAEG;AACH,MAAM,MAAM,uBAAuB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,GAAG;IACvG,MAAM,CAAC,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;CACtD,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI;KACvD,CAAC,IAAI,MAAM,UAAU,CAAC,CAAC,EAAE,uBAAuB,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC;CAClG,CAAC;AAqBF;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAChD,EAAE,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,EAC9C,IAAI,CAAC,EAAE,CAAC,MAAM,OAAO,CAAC,EAAE,GACvB,uBAAuB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAclD;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,EAC9D,MAAM,EAAE,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,EACnD,IAAI,EAAE,sBAAsB,CAAC,OAAO,CAAC,GACpC,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,CAQ7C"}
|
package/lib/buildUseStyling.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { TokensThatAreAlsoProps, BuildSlotProps } from './buildProps';
|
|
2
|
-
import { HasLayer, TokenSettings } from '@fluentui-react-native/use-tokens';
|
|
1
|
+
import type { TokensThatAreAlsoProps, BuildSlotProps } from './buildProps';
|
|
2
|
+
import type { HasLayer, TokenSettings } from '@fluentui-react-native/use-tokens';
|
|
3
3
|
/**
|
|
4
4
|
* Options used to build up a useStyling hook
|
|
5
5
|
*/
|
|
6
|
-
export
|
|
6
|
+
export type UseStylingOptions<TProps, TSlotProps, TTokens, TTheme> = {
|
|
7
7
|
/**
|
|
8
8
|
* Baseline tokens for this component
|
|
9
9
|
*/
|
|
@@ -29,11 +29,11 @@ export declare type UseStylingOptions<TProps, TSlotProps, TTokens, TTheme> = {
|
|
|
29
29
|
/**
|
|
30
30
|
* Signature for the use styling hook
|
|
31
31
|
*/
|
|
32
|
-
export
|
|
32
|
+
export type UseStyling<TProps, TSlotProps> = (props: TProps, lookup?: HasLayer) => TSlotProps;
|
|
33
33
|
/**
|
|
34
34
|
* Helper object which injects theme specific functionality
|
|
35
35
|
*/
|
|
36
|
-
export
|
|
36
|
+
export type ThemeHelper<TTheme> = {
|
|
37
37
|
/** query the theme from the context, or from a global if your system doesn't use theming */
|
|
38
38
|
useTheme: () => TTheme;
|
|
39
39
|
/** lookup info for the component in the theme */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseStyling.d.ts","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"buildUseStyling.d.ts","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE3E,OAAO,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGjF;;GAEG;AACH,MAAM,MAAM,iBAAiB,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI;IACnE;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC;IAE1C;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,OAAO,CAAC,EAAE,CAAC;IAE3B;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;IAExD;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAC;IAEzD,gHAAgH;IAChH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,CAAC,MAAM,EAAE,UAAU,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,QAAQ,KAAK,UAAU,CAAC;AAE9F;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,MAAM,IAAI;IAChC,4FAA4F;IAC5F,QAAQ,EAAE,MAAM,MAAM,CAAC;IAEvB,iDAAiD;IACjD,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,GAAG,CAAC;CACxD,CAAC;AAwBF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EACjE,OAAO,EAAE,iBAAiB,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/D,WAAW,EAAE,WAAW,CAAC,MAAM,CAAC,GAC/B,UAAU,CAAC,MAAM,EAAE,UAAU,CAAC,CA6BhC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseStyling.js","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"buildUseStyling.js","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAiDzG;;;;;;;GAOG;AACH,SAAS,kBAAkB,CACzB,MAAmD,EACnD,MAAe,EACf,KAAa,EACb,KAA4B;IAE5B,IAAM,SAAS,GAAG,EAAE,CAAC;IACrB,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,UAAC,GAAG;QAC9B,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;QAC1B,SAAS,CAAC,GAAG,CAAC,GAAG,OAAO,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IACrG,CAAC,CAAC,CAAC;IACH,OAAO,SAAuB,CAAC;AACjC,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,eAAe,CAC7B,OAA+D,EAC/D,WAAgC;IAEhC,8DAA8D;IACtD,IAAA,QAAQ,GAAuB,WAAW,SAAlC,EAAE,gBAAgB,GAAK,WAAW,iBAAhB,CAAiB;IAC3C,IAAA,MAAM,GAAyC,OAAO,OAAhD,EAA0B,UAAU,GAAK,OAAO,uBAAZ,CAAa;IAC/D,IAAM,MAAM,GAAG,oBAAoB,CAAC,OAAO,CAAC,SAAS,IAAI,EAAE,EAAE,UAAU,CAAC,CAAC;IACzE,IAAM,SAAS,GAAG,cAAc,8BAAkB,gBAAgB,GAAK,MAAM,SAAC,CAAC;IAE/E,OAAO,UAAC,KAAa,EAAE,MAAiB;;QACtC,kBAAkB;QAClB,IAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QAEzB,uCAAuC;QACnC,IAAA,KAAwB,SAAS,CAAC,KAAK,CAAC,EAAvC,YAAY,QAAA,EAAE,KAAK,QAAoB,CAAC;QAE7C,mCAAmC;QACnC,IAAI,OAAO,CAAC,MAAM,EAAE;YAClB,KAAwB,gBAAgB,CAAC,YAAY,EAAE,OAAO,CAAC,MAAkB,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC,UAAC,GAAG,IAAK,OAAA,KAAK,CAAC,GAAG,CAAC,EAAV,CAAU,CAAC,CAAC,EAAzH,YAAY,QAAA,EAAE,KAAK,QAAA,CAAuG;SAC5H;QAED,qBAAqB;QACrB,IAAI,OAAO,UAAU,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;YAC/D,KAAwB,kBAAkB,CAAC,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,UAAU,CAAC,EAAjF,YAAY,QAAA,EAAE,KAAK,QAAA,CAA+D;SACpF;aAAM,IAAI,UAAU,KAAK,KAAK,EAAE;YAC/B,YAAY,yBAAQ,YAAY,GAAK,KAAK,CAAE,CAAC;SAC9C;QAED,2EAA2E;QAC3E,OAAO,kBAAkB,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IAChE,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseStyling.test.js","sourceRoot":"","sources":["../src/buildUseStyling.test.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"buildUseStyling.test.js","sourceRoot":"","sources":["../src/buildUseStyling.test.ts"],"names":[],"mappings":"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"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export { buildUseStyling } from './buildUseStyling';
|
|
2
|
+
export type { ThemeHelper, UseStyling, UseStylingOptions } from './buildUseStyling';
|
|
3
|
+
export { buildProps, refinePropsFunctions } from './buildProps';
|
|
4
|
+
export type { BuildPropsBase, BuildSlotProps, RefinableBuildPropsBase, RefineFunctionBase, TokensThatAreAlsoProps } from './buildProps';
|
|
3
5
|
export { HasLayer, applyTokenLayers, TokenSettings, TokensFromTheme } from '@fluentui-react-native/use-tokens';
|
|
4
6
|
//# sourceMappingURL=index.d.ts.map
|
package/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAChE,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,uBAAuB,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACxI,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC"}
|
package/lib/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export { buildUseStyling } from './buildUseStyling';
|
|
2
|
+
export { buildProps, refinePropsFunctions } from './buildProps';
|
|
3
3
|
export { applyTokenLayers } from '@fluentui-react-native/use-tokens';
|
|
4
4
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAEhE,OAAO,EAAY,gBAAgB,EAAkC,MAAM,mCAAmC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStyling.samples.test.js","sourceRoot":"","sources":["../src/useStyling.samples.test.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"useStyling.samples.test.js","sourceRoot":"","sources":["../src/useStyling.samples.test.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
1
|
+
import type { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
2
2
|
/**
|
|
3
3
|
* Informs the framework of any tokens that also appear as props for the component.
|
|
4
4
|
* - 'none' | undefined : this means no properties should be treated as tokens, the tokens that will be passed in to buildProps
|
|
@@ -7,7 +7,7 @@ import { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
|
7
7
|
* - 'all' : treat all props as tokens. Props will be spread into the tokens before the slot functions are called
|
|
8
8
|
* - array of keys : this is the discrete list of tokens which also appear in props
|
|
9
9
|
*/
|
|
10
|
-
export
|
|
10
|
+
export type TokensThatAreAlsoProps<TTokens> = (keyof TTokens)[] | 'all' | 'none';
|
|
11
11
|
/**
|
|
12
12
|
* Raw format for producing styles in a functional manner. These can only depend on tokens or theme as inputs.
|
|
13
13
|
* - tokens: these will be produced from the theme and component constants, then they will be potentially
|
|
@@ -16,22 +16,22 @@ export declare type TokensThatAreAlsoProps<TTokens> = (keyof TTokens)[] | 'all'
|
|
|
16
16
|
* The provided
|
|
17
17
|
* cache will be scoped to the theme, slot, and tokens that are coming out of the theme.
|
|
18
18
|
*/
|
|
19
|
-
export
|
|
19
|
+
export type BuildPropsBase<TProps, TTokens, TTheme> = (tokens: TTokens, theme: TTheme, cache: GetMemoValue<any>) => Partial<TProps>;
|
|
20
20
|
/**
|
|
21
21
|
* A refine function allows style functions to be updated based on tokens that are also props. Only those tokens that are also
|
|
22
22
|
* props need to be considered as a key for caching
|
|
23
23
|
*/
|
|
24
|
-
export
|
|
24
|
+
export type RefineFunctionBase<TProps, TTokens, TTheme> = (mask?: TokensThatAreAlsoProps<TTokens>) => BuildPropsBase<TProps, TTokens, TTheme>;
|
|
25
25
|
/**
|
|
26
26
|
* Signature for a style function which can be optionally refined by the styling hook if prop masks are provided
|
|
27
27
|
*/
|
|
28
|
-
export
|
|
28
|
+
export type RefinableBuildPropsBase<TProps, TTokens, TTheme> = BuildPropsBase<TProps, TTokens, TTheme> & {
|
|
29
29
|
refine?: RefineFunctionBase<TProps, TTokens, TTheme>;
|
|
30
30
|
};
|
|
31
31
|
/**
|
|
32
32
|
* Style functions can be plain functions, refinable functions, or just raw props
|
|
33
33
|
*/
|
|
34
|
-
export
|
|
34
|
+
export type BuildSlotProps<TSlotProps, TTokens, TTheme> = {
|
|
35
35
|
[K in keyof TSlotProps]?: RefinableBuildPropsBase<TSlotProps[K], TTokens, TTheme> | TSlotProps[K];
|
|
36
36
|
};
|
|
37
37
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildProps.d.ts","sourceRoot":"","sources":["../src/buildProps.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;
|
|
1
|
+
{"version":3,"file":"buildProps.d.ts","sourceRoot":"","sources":["../src/buildProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEtE;;;;;;;GAOG;AACH,MAAM,MAAM,sBAAsB,CAAC,OAAO,IAAI,CAAC,MAAM,OAAO,CAAC,EAAE,GAAG,KAAK,GAAG,MAAM,CAAC;AAEjF;;;;;;;GAOG;AACH,MAAM,MAAM,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,CAAC,GAAG,CAAC,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;AAEpI;;;GAGG;AACH,MAAM,MAAM,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI,CACxD,IAAI,CAAC,EAAE,sBAAsB,CAAC,OAAO,CAAC,KACnC,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;AAE7C;;GAEG;AACH,MAAM,MAAM,uBAAuB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,IAAI,cAAc,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,GAAG;IACvG,MAAM,CAAC,EAAE,kBAAkB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;CACtD,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI;KACvD,CAAC,IAAI,MAAM,UAAU,CAAC,CAAC,EAAE,uBAAuB,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC;CAClG,CAAC;AAqBF;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,EAChD,EAAE,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,EAC9C,IAAI,CAAC,EAAE,CAAC,MAAM,OAAO,CAAC,EAAE,GACvB,uBAAuB,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,CAclD;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,EAC9D,MAAM,EAAE,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,EACnD,IAAI,EAAE,sBAAsB,CAAC,OAAO,CAAC,GACpC,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,CAQ7C"}
|
|
@@ -6,7 +6,7 @@ var buildProps_1 = require("./buildProps");
|
|
|
6
6
|
var theme = { foo: 'foo', bar: 'bar' };
|
|
7
7
|
var instanceCount = 0;
|
|
8
8
|
function munge(tokens, theme) {
|
|
9
|
-
return
|
|
9
|
+
return tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, theme), tokens), { instance: instanceCount++ });
|
|
10
10
|
}
|
|
11
11
|
describe('props function tests', function () {
|
|
12
12
|
test('basic build props function caches as expected', function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildProps.test.js","sourceRoot":"","sources":["../src/buildProps.test.ts"],"names":[],"mappings":";;;AAAA,gEAAiE;AACjE,2CAA0C;AAM1C,IAAM,KAAK,GAAW,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC;AAEjD,IAAI,aAAa,GAAG,CAAC,CAAC;AAEtB,SAAS,KAAK,CAAC,MAAe,EAAE,KAAa;IAC3C,
|
|
1
|
+
{"version":3,"file":"buildProps.test.js","sourceRoot":"","sources":["../src/buildProps.test.ts"],"names":[],"mappings":";;;AAAA,gEAAiE;AACjE,2CAA0C;AAM1C,IAAM,KAAK,GAAW,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,CAAC;AAEjD,IAAI,aAAa,GAAG,CAAC,CAAC;AAEtB,SAAS,KAAK,CAAC,MAAe,EAAE,KAAa;IAC3C,8DACK,KAAK,GACL,MAAM,KACT,QAAQ,EAAE,aAAa,EAAE,IACzB;AACJ,CAAC;AAED,QAAQ,CAAC,sBAAsB,EAAE;IAC/B,IAAI,CAAC,+CAA+C,EAAE;QACpD,IAAM,KAAK,GAAG,IAAA,yBAAY,GAAE,CAAC;QAC7B,IAAM,OAAO,GAAG,IAAA,uBAAU,EAAC,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;QAC9C,IAAM,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QAC7D,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACrE,IAAM,EAAE,GAAG,OAAO,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACrD,MAAM,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACxB,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,0DAA0D,EAAE;QAC/D,IAAM,KAAK,GAAG,IAAA,yBAAY,GAAE,CAAC;QAC7B,IAAM,OAAO,GAAG,IAAA,uBAAU,EAAC,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;QACxD,IAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;QAC7C,IAAM,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;QAC9C,IAAM,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC;QAElD,IAAM,EAAE,GAAG,OAAO,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACrC,IAAM,EAAE,GAAG,OAAO,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACrC,MAAM,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAExB,IAAM,GAAG,GAAG,SAAS,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACxC,IAAM,GAAG,GAAG,SAAS,CAAC,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;QACxC,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACxB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { TokensThatAreAlsoProps, BuildSlotProps } from './buildProps';
|
|
2
|
-
import { HasLayer, TokenSettings } from '@fluentui-react-native/use-tokens';
|
|
1
|
+
import type { TokensThatAreAlsoProps, BuildSlotProps } from './buildProps';
|
|
2
|
+
import type { HasLayer, TokenSettings } from '@fluentui-react-native/use-tokens';
|
|
3
3
|
/**
|
|
4
4
|
* Options used to build up a useStyling hook
|
|
5
5
|
*/
|
|
6
|
-
export
|
|
6
|
+
export type UseStylingOptions<TProps, TSlotProps, TTokens, TTheme> = {
|
|
7
7
|
/**
|
|
8
8
|
* Baseline tokens for this component
|
|
9
9
|
*/
|
|
@@ -29,11 +29,11 @@ export declare type UseStylingOptions<TProps, TSlotProps, TTokens, TTheme> = {
|
|
|
29
29
|
/**
|
|
30
30
|
* Signature for the use styling hook
|
|
31
31
|
*/
|
|
32
|
-
export
|
|
32
|
+
export type UseStyling<TProps, TSlotProps> = (props: TProps, lookup?: HasLayer) => TSlotProps;
|
|
33
33
|
/**
|
|
34
34
|
* Helper object which injects theme specific functionality
|
|
35
35
|
*/
|
|
36
|
-
export
|
|
36
|
+
export type ThemeHelper<TTheme> = {
|
|
37
37
|
/** query the theme from the context, or from a global if your system doesn't use theming */
|
|
38
38
|
useTheme: () => TTheme;
|
|
39
39
|
/** lookup info for the component in the theme */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseStyling.d.ts","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"buildUseStyling.d.ts","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE3E,OAAO,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAGjF;;GAEG;AACH,MAAM,MAAM,iBAAiB,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI;IACnE;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC,OAAO,EAAE,MAAM,CAAC,EAAE,CAAC;IAE1C;;;OAGG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,OAAO,CAAC,EAAE,CAAC;IAE3B;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC;IAExD;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAC;IAEzD,gHAAgH;IAChH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF;;GAEG;AACH,MAAM,MAAM,UAAU,CAAC,MAAM,EAAE,UAAU,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,QAAQ,KAAK,UAAU,CAAC;AAE9F;;GAEG;AACH,MAAM,MAAM,WAAW,CAAC,MAAM,IAAI;IAChC,4FAA4F;IAC5F,QAAQ,EAAE,MAAM,MAAM,CAAC;IAEvB,iDAAiD;IACjD,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,GAAG,CAAC;CACxD,CAAC;AAwBF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EACjE,OAAO,EAAE,iBAAiB,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/D,WAAW,EAAE,WAAW,CAAC,MAAM,CAAC,GAC/B,UAAU,CAAC,MAAM,EAAE,UAAU,CAAC,CA6BhC"}
|
|
@@ -31,7 +31,7 @@ function buildUseStyling(options, themeHelper) {
|
|
|
31
31
|
var useTheme = themeHelper.useTheme, getComponentInfo = themeHelper.getComponentInfo;
|
|
32
32
|
var tokens = options.tokens, tokenProps = options.tokensThatAreAlsoProps;
|
|
33
33
|
var styles = (0, buildProps_1.refinePropsFunctions)(options.slotProps || {}, tokenProps);
|
|
34
|
-
var useTokens = use_tokens_1.buildUseTokens.apply(void 0,
|
|
34
|
+
var useTokens = use_tokens_1.buildUseTokens.apply(void 0, tslib_1.__spreadArray([getComponentInfo], tokens, false));
|
|
35
35
|
return function (props, lookup) {
|
|
36
36
|
var _a, _b;
|
|
37
37
|
// query the theme
|
|
@@ -47,7 +47,7 @@ function buildUseStyling(options, themeHelper) {
|
|
|
47
47
|
_b = (0, use_tokens_1.applyPropsToTokens)(props, mergedTokens, cache, tokenProps), mergedTokens = _b[0], cache = _b[1];
|
|
48
48
|
}
|
|
49
49
|
else if (tokenProps === 'all') {
|
|
50
|
-
mergedTokens =
|
|
50
|
+
mergedTokens = tslib_1.__assign(tslib_1.__assign({}, mergedTokens), props);
|
|
51
51
|
}
|
|
52
52
|
// finally produce slotProps from calling the style functions on each entry
|
|
53
53
|
return resolveToSlotProps(styles, mergedTokens, theme, cache);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseStyling.js","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"buildUseStyling.js","sourceRoot":"","sources":["../src/buildUseStyling.ts"],"names":[],"mappings":";;;;AAEA,2CAAoD;AAEpD,gEAAyG;AAiDzG;;;;;;;GAOG;AACH,SAAS,kBAAkB,CACzB,MAAmD,EACnD,MAAe,EACf,KAAa,EACb,KAA4B;IAE5B,IAAM,SAAS,GAAG,EAAE,CAAC;IACrB,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,UAAC,GAAG;QAC9B,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC;QAC1B,SAAS,CAAC,GAAG,CAAC,GAAG,OAAO,KAAK,KAAK,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;IACrG,CAAC,CAAC,CAAC;IACH,OAAO,SAAuB,CAAC;AACjC,CAAC;AAED;;;;;GAKG;AACH,SAAgB,eAAe,CAC7B,OAA+D,EAC/D,WAAgC;IAEhC,8DAA8D;IACtD,IAAA,QAAQ,GAAuB,WAAW,SAAlC,EAAE,gBAAgB,GAAK,WAAW,iBAAhB,CAAiB;IAC3C,IAAA,MAAM,GAAyC,OAAO,OAAhD,EAA0B,UAAU,GAAK,OAAO,uBAAZ,CAAa;IAC/D,IAAM,MAAM,GAAG,IAAA,iCAAoB,EAAC,OAAO,CAAC,SAAS,IAAI,EAAE,EAAE,UAAU,CAAC,CAAC;IACzE,IAAM,SAAS,GAAG,2BAAc,sCAAkB,gBAAgB,GAAK,MAAM,SAAC,CAAC;IAE/E,OAAO,UAAC,KAAa,EAAE,MAAiB;;QACtC,kBAAkB;QAClB,IAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;QAEzB,uCAAuC;QACnC,IAAA,KAAwB,SAAS,CAAC,KAAK,CAAC,EAAvC,YAAY,QAAA,EAAE,KAAK,QAAoB,CAAC;QAE7C,mCAAmC;QACnC,IAAI,OAAO,CAAC,MAAM,EAAE;YAClB,KAAwB,IAAA,6BAAgB,EAAC,YAAY,EAAE,OAAO,CAAC,MAAkB,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC,UAAC,GAAG,IAAK,OAAA,KAAK,CAAC,GAAG,CAAC,EAAV,CAAU,CAAC,CAAC,EAAzH,YAAY,QAAA,EAAE,KAAK,QAAA,CAAuG;SAC5H;QAED,qBAAqB;QACrB,IAAI,OAAO,UAAU,KAAK,QAAQ,IAAI,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,EAAE;YAC/D,KAAwB,IAAA,+BAAkB,EAAC,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,UAAU,CAAC,EAAjF,YAAY,QAAA,EAAE,KAAK,QAAA,CAA+D;SACpF;aAAM,IAAI,UAAU,KAAK,KAAK,EAAE;YAC/B,YAAY,yCAAQ,YAAY,GAAK,KAAK,CAAE,CAAC;SAC9C;QAED,2EAA2E;QAC3E,OAAO,kBAAkB,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC;IAChE,CAAC,CAAC;AACJ,CAAC;AAhCD,0CAgCC"}
|
|
@@ -38,7 +38,7 @@ var themeHelper = {
|
|
|
38
38
|
};
|
|
39
39
|
var slotFn1 = function (tokens, theme) {
|
|
40
40
|
return {
|
|
41
|
-
style:
|
|
41
|
+
style: tslib_1.__assign(tslib_1.__assign({ a: tokens.a, b: tokens.b, c: tokens.c }, theme.vals), { instance: lastInstance++ }),
|
|
42
42
|
};
|
|
43
43
|
};
|
|
44
44
|
var extraCache = (0, memo_cache_1.getMemoCache)();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buildUseStyling.test.js","sourceRoot":"","sources":["../src/buildUseStyling.test.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"buildUseStyling.test.js","sourceRoot":"","sources":["../src/buildUseStyling.test.ts"],"names":[],"mappings":"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"}
|
package/lib-commonjs/index.d.ts
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export { buildUseStyling } from './buildUseStyling';
|
|
2
|
+
export type { ThemeHelper, UseStyling, UseStylingOptions } from './buildUseStyling';
|
|
3
|
+
export { buildProps, refinePropsFunctions } from './buildProps';
|
|
4
|
+
export type { BuildPropsBase, BuildSlotProps, RefinableBuildPropsBase, RefineFunctionBase, TokensThatAreAlsoProps } from './buildProps';
|
|
3
5
|
export { HasLayer, applyTokenLayers, TokenSettings, TokensFromTheme } from '@fluentui-react-native/use-tokens';
|
|
4
6
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,YAAY,EAAE,WAAW,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACpF,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAChE,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,uBAAuB,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACxI,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.applyTokenLayers = void 0;
|
|
4
|
-
var
|
|
5
|
-
(
|
|
6
|
-
|
|
3
|
+
exports.applyTokenLayers = exports.refinePropsFunctions = exports.buildProps = exports.buildUseStyling = void 0;
|
|
4
|
+
var buildUseStyling_1 = require("./buildUseStyling");
|
|
5
|
+
Object.defineProperty(exports, "buildUseStyling", { enumerable: true, get: function () { return buildUseStyling_1.buildUseStyling; } });
|
|
6
|
+
var buildProps_1 = require("./buildProps");
|
|
7
|
+
Object.defineProperty(exports, "buildProps", { enumerable: true, get: function () { return buildProps_1.buildProps; } });
|
|
8
|
+
Object.defineProperty(exports, "refinePropsFunctions", { enumerable: true, get: function () { return buildProps_1.refinePropsFunctions; } });
|
|
7
9
|
var use_tokens_1 = require("@fluentui-react-native/use-tokens");
|
|
8
10
|
Object.defineProperty(exports, "applyTokenLayers", { enumerable: true, get: function () { return use_tokens_1.applyTokenLayers; } });
|
|
9
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,qDAAoD;AAA3C,kHAAA,eAAe,OAAA;AAExB,2CAAgE;AAAvD,wGAAA,UAAU,OAAA;AAAE,kHAAA,oBAAoB,OAAA;AAEzC,gEAA+G;AAA5F,8GAAA,gBAAgB,OAAA"}
|
|
@@ -4,8 +4,8 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var buildUseStyling_1 = require("./buildUseStyling");
|
|
5
5
|
var react_native_1 = require("react-native");
|
|
6
6
|
var buildProps_1 = require("./buildProps");
|
|
7
|
-
var enzyme_to_json_1 =
|
|
8
|
-
var React =
|
|
7
|
+
var enzyme_to_json_1 = tslib_1.__importDefault(require("enzyme-to-json"));
|
|
8
|
+
var React = tslib_1.__importStar(require("react"));
|
|
9
9
|
var enzyme_1 = require("enzyme");
|
|
10
10
|
/**
|
|
11
11
|
* The default/base theme just contains base values
|
|
@@ -36,7 +36,7 @@ var themeHelper = {
|
|
|
36
36
|
useTheme: function () { return current.theme; },
|
|
37
37
|
getComponentInfo: function (theme, name) { return theme.components[name]; },
|
|
38
38
|
setActive: function (theme) {
|
|
39
|
-
current.theme = theme ?
|
|
39
|
+
current.theme = theme ? tslib_1.__assign(tslib_1.__assign({}, baseTheme), theme) : baseTheme;
|
|
40
40
|
},
|
|
41
41
|
};
|
|
42
42
|
describe('useStyling samples', function () {
|
|
@@ -72,7 +72,7 @@ describe('useStyling samples', function () {
|
|
|
72
72
|
*/
|
|
73
73
|
function (tokens /*, theme: Theme */) {
|
|
74
74
|
return {
|
|
75
|
-
style:
|
|
75
|
+
style: tslib_1.__assign({}, tokens),
|
|
76
76
|
};
|
|
77
77
|
},
|
|
78
78
|
/**
|
|
@@ -87,8 +87,8 @@ describe('useStyling samples', function () {
|
|
|
87
87
|
// now the sample 1 component becomes simple to build, just merge the styled props with the input props
|
|
88
88
|
var Sample1Text = function (props) {
|
|
89
89
|
var styledProps = useStylingSample1(props).content;
|
|
90
|
-
var merged =
|
|
91
|
-
return React.createElement(react_native_1.Text,
|
|
90
|
+
var merged = tslib_1.__assign(tslib_1.__assign({}, props), styledProps);
|
|
91
|
+
return React.createElement(react_native_1.Text, tslib_1.__assign({}, merged), props.children);
|
|
92
92
|
};
|
|
93
93
|
/** first render the component with no updates */
|
|
94
94
|
it('Sample1Text rendering with no overrides', function () {
|
|
@@ -112,7 +112,7 @@ describe('useStyling samples', function () {
|
|
|
112
112
|
* Build the styling hook for sample2. Because this isn't being recombined this is being specified inline rather
|
|
113
113
|
* than using a separate options object. Both are fine.
|
|
114
114
|
*/
|
|
115
|
-
var useStylingSample2 = (0, buildUseStyling_1.buildUseStyling)(
|
|
115
|
+
var useStylingSample2 = (0, buildUseStyling_1.buildUseStyling)(tslib_1.__assign(tslib_1.__assign({}, sample1StylingOptions), {
|
|
116
116
|
/**
|
|
117
117
|
* In sample1 tokens are set to defaults from the global theme section, then patched with any values looked up with
|
|
118
118
|
* the string 'Sample1'
|
|
@@ -124,7 +124,7 @@ describe('useStyling samples', function () {
|
|
|
124
124
|
* If we didn't want to add the extra 'Sample2' lookup this line would be omitted. If we didn't want to look up 'Sample1' first
|
|
125
125
|
* that could be filtered out of the array that is being copied
|
|
126
126
|
*/
|
|
127
|
-
tokens:
|
|
127
|
+
tokens: tslib_1.__spreadArray(tslib_1.__spreadArray([], sample1StylingOptions.tokens, true), ['Sample2'], false),
|
|
128
128
|
/**
|
|
129
129
|
* This is the final bit of magic. The tokens will already have values set from the global theme, they will then be patched with
|
|
130
130
|
* any customizations set into Sample1 and/or Sample2.
|
|
@@ -137,11 +137,11 @@ describe('useStyling samples', function () {
|
|
|
137
137
|
// the Sample2Text component is built the same way as sample1, just using the new hook that has been created
|
|
138
138
|
var Sample2Text = function (props) {
|
|
139
139
|
var styledProps = useStylingSample2(props).content;
|
|
140
|
-
var merged =
|
|
140
|
+
var merged = tslib_1.__assign(tslib_1.__assign({}, props), styledProps);
|
|
141
141
|
// delete the color key to not pass it through to the text props, could be done via destructuring, filtering, or any number of ways
|
|
142
142
|
delete merged.color;
|
|
143
143
|
// render the text
|
|
144
|
-
return React.createElement(react_native_1.Text,
|
|
144
|
+
return React.createElement(react_native_1.Text, tslib_1.__assign({}, merged), props.children);
|
|
145
145
|
};
|
|
146
146
|
/** rendering the Sample2 component with the base theme */
|
|
147
147
|
it('Sample2Text rendering with defaults and a color override', function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStyling.samples.test.js","sourceRoot":"","sources":["../src/useStyling.samples.test.tsx"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"useStyling.samples.test.js","sourceRoot":"","sources":["../src/useStyling.samples.test.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/use-styling",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.3",
|
|
4
4
|
"description": "Opinionated use styling hook implementation",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -27,8 +27,8 @@
|
|
|
27
27
|
"author": "",
|
|
28
28
|
"license": "MIT",
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@fluentui-react-native/memo-cache": "^1.1.
|
|
31
|
-
"@fluentui-react-native/use-tokens": "^0.3.
|
|
30
|
+
"@fluentui-react-native/memo-cache": "^1.1.8",
|
|
31
|
+
"@fluentui-react-native/use-tokens": "^0.3.3",
|
|
32
32
|
"tslib": "^2.3.1"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
@@ -39,15 +39,21 @@
|
|
|
39
39
|
"react-native": "^0.68.0"
|
|
40
40
|
},
|
|
41
41
|
"rnx-kit": {
|
|
42
|
-
"reactNativeVersion": "^0.68",
|
|
43
|
-
"reactNativeDevVersion": "^0.68",
|
|
44
42
|
"kitType": "library",
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
"
|
|
50
|
-
|
|
43
|
+
"alignDeps": {
|
|
44
|
+
"presets": [
|
|
45
|
+
"microsoft/react-native"
|
|
46
|
+
],
|
|
47
|
+
"requirements": [
|
|
48
|
+
"react-native@0.68"
|
|
49
|
+
],
|
|
50
|
+
"capabilities": [
|
|
51
|
+
"core",
|
|
52
|
+
"core-android",
|
|
53
|
+
"core-ios",
|
|
54
|
+
"react"
|
|
55
|
+
]
|
|
56
|
+
}
|
|
51
57
|
},
|
|
52
58
|
"peerDependencies": {
|
|
53
59
|
"react": "17.0.2",
|
package/src/buildProps.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import type { ThemeHelper, UseStylingOptions } from './buildUseStyling';
|
|
2
|
+
import { buildUseStyling } from './buildUseStyling';
|
|
2
3
|
import { getMemoCache } from '@fluentui-react-native/memo-cache';
|
|
3
4
|
import { buildProps } from './buildProps';
|
|
4
5
|
|
package/src/buildUseStyling.ts
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
import { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
2
|
-
import { TokensThatAreAlsoProps, BuildSlotProps
|
|
3
|
-
import {
|
|
1
|
+
import type { GetMemoValue } from '@fluentui-react-native/memo-cache';
|
|
2
|
+
import type { TokensThatAreAlsoProps, BuildSlotProps } from './buildProps';
|
|
3
|
+
import { refinePropsFunctions } from './buildProps';
|
|
4
|
+
import type { HasLayer, TokenSettings } from '@fluentui-react-native/use-tokens';
|
|
5
|
+
import { applyPropsToTokens, applyTokenLayers, buildUseTokens } from '@fluentui-react-native/use-tokens';
|
|
4
6
|
|
|
5
7
|
/**
|
|
6
8
|
* Options used to build up a useStyling hook
|
package/src/index.ts
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
1
|
+
export { buildUseStyling } from './buildUseStyling';
|
|
2
|
+
export type { ThemeHelper, UseStyling, UseStylingOptions } from './buildUseStyling';
|
|
3
|
+
export { buildProps, refinePropsFunctions } from './buildProps';
|
|
4
|
+
export type { BuildPropsBase, BuildSlotProps, RefinableBuildPropsBase, RefineFunctionBase, TokensThatAreAlsoProps } from './buildProps';
|
|
3
5
|
export { HasLayer, applyTokenLayers, TokenSettings, TokensFromTheme } from '@fluentui-react-native/use-tokens';
|
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
import { ThemeHelper,
|
|
2
|
-
import {
|
|
1
|
+
import type { ThemeHelper, UseStylingOptions } from './buildUseStyling';
|
|
2
|
+
import { buildUseStyling } from './buildUseStyling';
|
|
3
|
+
import type { TextProps, ColorValue } from 'react-native';
|
|
4
|
+
import { Text, View } from 'react-native';
|
|
3
5
|
import { buildProps } from './buildProps';
|
|
4
6
|
import toJson from 'enzyme-to-json';
|
|
5
7
|
import * as React from 'react';
|