@fluentui-react-native/framework 0.14.5 → 0.14.7
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 +56 -17
- package/CHANGELOG.md +14 -3
- package/lib/compose.d.ts +7 -6
- package/lib/compose.d.ts.map +1 -1
- package/lib/compose.js.map +1 -1
- package/lib/compressible.js +4 -8
- package/lib/compressible.js.map +1 -1
- package/lib/compressible.test.js +25 -27
- package/lib/compressible.test.js.map +1 -1
- package/lib/index.d.ts +6 -6
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +3 -3
- package/lib/index.js.map +1 -1
- package/lib/themeHelper.js +4 -4
- package/lib/themeHelper.js.map +1 -1
- package/lib/useTokens.js +2 -7
- package/lib/useTokens.js.map +1 -1
- package/lib-commonjs/compose.d.ts +7 -6
- package/lib-commonjs/compose.d.ts.map +1 -1
- package/lib-commonjs/compose.js +2 -2
- package/lib-commonjs/compose.js.map +1 -1
- package/lib-commonjs/compressible.js +5 -9
- package/lib-commonjs/compressible.js.map +1 -1
- package/lib-commonjs/compressible.test.js +32 -33
- package/lib-commonjs/compressible.test.js.map +1 -1
- package/lib-commonjs/index.d.ts +6 -6
- package/lib-commonjs/index.d.ts.map +1 -1
- package/lib-commonjs/index.js +10 -10
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/themeHelper.js +4 -4
- package/lib-commonjs/themeHelper.js.map +1 -1
- package/lib-commonjs/useFluentTheme.js +2 -2
- package/lib-commonjs/useFluentTheme.js.map +1 -1
- package/lib-commonjs/useStyling.js +2 -2
- package/lib-commonjs/useStyling.js.map +1 -1
- package/lib-commonjs/useTokens.js +4 -9
- package/lib-commonjs/useTokens.js.map +1 -1
- package/package.json +11 -12
- package/src/compose.ts +7 -12
- package/src/compressible.test.tsx +1 -1
- package/src/index.ts +7 -6
- package/just.config.js +0 -3
package/CHANGELOG.json
CHANGED
|
@@ -2,16 +2,63 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/framework",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
6
|
-
"version": "0.14.
|
|
7
|
-
"tag": "@fluentui-react-native/framework_v0.14.
|
|
5
|
+
"date": "Wed, 16 Jul 2025 20:02:37 GMT",
|
|
6
|
+
"version": "0.14.7",
|
|
7
|
+
"tag": "@fluentui-react-native/framework_v0.14.7",
|
|
8
8
|
"comments": {
|
|
9
|
-
"
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "jasonmo@microsoft.com",
|
|
12
|
+
"package": "@fluentui-react-native/framework",
|
|
13
|
+
"commit": "6ed0a256caf94e287c6a9120ec5d0458bd5c7bfc",
|
|
14
|
+
"comment": "create common framework-base package to share common utiltities more broadly"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Tue, 15 Jul 2025 23:27:11 GMT",
|
|
21
|
+
"version": "0.14.6",
|
|
22
|
+
"tag": "@fluentui-react-native/framework_v0.14.6",
|
|
23
|
+
"comments": {
|
|
24
|
+
"patch": [
|
|
25
|
+
{
|
|
26
|
+
"author": "jasonmo@microsoft.com",
|
|
27
|
+
"package": "@fluentui-react-native/framework",
|
|
28
|
+
"commit": "479b93cea460a26df70c55b5d3335927ed374713",
|
|
29
|
+
"comment": "update builds to use node16 settings and modern export maps"
|
|
30
|
+
},
|
|
10
31
|
{
|
|
11
32
|
"author": "sanajmi@microsoft.com",
|
|
12
33
|
"package": "@fluentui-react-native/framework",
|
|
13
|
-
"commit": "
|
|
14
|
-
"comment": "fix: run
|
|
34
|
+
"commit": "9cbe229ec7f6363d229dcaef506921b8d9f47d7d",
|
|
35
|
+
"comment": "fix: run beachball sync"
|
|
36
|
+
},
|
|
37
|
+
{
|
|
38
|
+
"author": "jasonmo@microsoft.com",
|
|
39
|
+
"package": "@fluentui-react-native/framework",
|
|
40
|
+
"commit": "3d36cc95620fdb938221cbe2c5ce002264108a50",
|
|
41
|
+
"comment": "fix repo linting with new configs and version, fixing linting errors as well"
|
|
42
|
+
},
|
|
43
|
+
{
|
|
44
|
+
"author": "jasonmo@microsoft.com",
|
|
45
|
+
"package": "@fluentui-react-native/framework",
|
|
46
|
+
"commit": "88ab939d36f2ab450189300ed308d45b8a600470",
|
|
47
|
+
"comment": "export missing type from framework to fix build error in Popover"
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"author": "jasonmo@microsoft.com",
|
|
51
|
+
"package": "@fluentui-react-native/framework",
|
|
52
|
+
"commit": "6b4d59227b1e9bbbf25cc93a3502015f663b363e",
|
|
53
|
+
"comment": "add react-native entrypoints that ensure metro targets TS files rather than JS files for bundling"
|
|
54
|
+
}
|
|
55
|
+
],
|
|
56
|
+
"none": [
|
|
57
|
+
{
|
|
58
|
+
"author": "jasonmo@microsoft.com",
|
|
59
|
+
"package": "@fluentui-react-native/framework",
|
|
60
|
+
"commit": "3e168e4363d1821818f219819d29532eace8d979",
|
|
61
|
+
"comment": "update scripts package to be fully js, use esm, and validate fully"
|
|
15
62
|
},
|
|
16
63
|
{
|
|
17
64
|
"author": "4123478+tido64@users.noreply.github.com",
|
|
@@ -30,20 +77,12 @@
|
|
|
30
77
|
"package": "@fluentui-react-native/framework",
|
|
31
78
|
"commit": "54087dca787180bbf34630470cd0d06e88366b30",
|
|
32
79
|
"comment": "update eslint to 9.x and use new flat config format with security rules"
|
|
33
|
-
}
|
|
34
|
-
],
|
|
35
|
-
"patch": [
|
|
36
|
-
{
|
|
37
|
-
"author": "jasonmo@microsoft.com",
|
|
38
|
-
"package": "@fluentui-react-native/framework",
|
|
39
|
-
"commit": "479b93cea460a26df70c55b5d3335927ed374713",
|
|
40
|
-
"comment": "update builds to use node16 settings and modern export maps"
|
|
41
80
|
},
|
|
42
81
|
{
|
|
43
|
-
"author": "
|
|
82
|
+
"author": "sanajmi@microsoft.com",
|
|
44
83
|
"package": "@fluentui-react-native/framework",
|
|
45
|
-
"commit": "
|
|
46
|
-
"comment": "
|
|
84
|
+
"commit": "405ca368dc3f2963bfc252a1952b1e14ff503499",
|
|
85
|
+
"comment": "fix: run `beachball sync` to sync package versions with NPM"
|
|
47
86
|
}
|
|
48
87
|
]
|
|
49
88
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -1,17 +1,28 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/framework
|
|
2
2
|
|
|
3
|
-
<!-- This log was last generated on
|
|
3
|
+
<!-- This log was last generated on Wed, 16 Jul 2025 20:02:37 GMT and should not be manually modified. -->
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## 0.14.
|
|
7
|
+
## 0.14.7
|
|
8
8
|
|
|
9
|
-
|
|
9
|
+
Wed, 16 Jul 2025 20:02:37 GMT
|
|
10
|
+
|
|
11
|
+
### Patches
|
|
12
|
+
|
|
13
|
+
- create common framework-base package to share common utiltities more broadly (jasonmo@microsoft.com)
|
|
14
|
+
|
|
15
|
+
## 0.14.6
|
|
16
|
+
|
|
17
|
+
Tue, 15 Jul 2025 23:27:11 GMT
|
|
10
18
|
|
|
11
19
|
### Patches
|
|
12
20
|
|
|
13
21
|
- update builds to use node16 settings and modern export maps (jasonmo@microsoft.com)
|
|
22
|
+
- fix: run beachball sync (sanajmi@microsoft.com)
|
|
23
|
+
- fix repo linting with new configs and version, fixing linting errors as well (jasonmo@microsoft.com)
|
|
14
24
|
- export missing type from framework to fix build error in Popover (jasonmo@microsoft.com)
|
|
25
|
+
- add react-native entrypoints that ensure metro targets TS files rather than JS files for bundling (jasonmo@microsoft.com)
|
|
15
26
|
|
|
16
27
|
## 0.14.3
|
|
17
28
|
|
package/lib/compose.d.ts
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import type { ComposeFactoryOptions, ComposeFactoryComponent, UseStyledSlots } from '@fluentui-react-native/composition';
|
|
2
2
|
import type { Theme } from '@fluentui-react-native/theme-types';
|
|
3
|
+
import type { ObjectBase } from '@fluentui-react-native/framework-base';
|
|
3
4
|
/**
|
|
4
5
|
* This is an object used purely for configuring the typings on composable. It is not necessary to define
|
|
5
6
|
* the type via the IComposableType interface, this is simply the format used to extract the type info.
|
|
6
7
|
*/
|
|
7
|
-
export interface ComposeType<TProps, TSlotProps, TTokens, TStatics =
|
|
8
|
+
export interface ComposeType<TProps, TSlotProps, TTokens, TStatics = ObjectBase> {
|
|
8
9
|
props: TProps;
|
|
9
10
|
slotProps: TSlotProps;
|
|
10
11
|
tokens: TTokens;
|
|
@@ -20,16 +21,16 @@ type SlotPropsFragment<TSlotProps> = {
|
|
|
20
21
|
type TokensFragment<TTokens> = {
|
|
21
22
|
tokens: TTokens;
|
|
22
23
|
};
|
|
23
|
-
type StaticsFragment<TStatics extends
|
|
24
|
+
type StaticsFragment<TStatics extends ObjectBase> = {
|
|
24
25
|
statics: TStatics;
|
|
25
26
|
};
|
|
26
27
|
/** Extraction types that get the various interface types from IComposableType */
|
|
27
28
|
export type ExtractProps<T> = T extends PropsFragment<infer U> ? U : never;
|
|
28
29
|
export type ExtractSlotProps<T> = T extends SlotPropsFragment<infer U> ? U : never;
|
|
29
|
-
export type ExtractTokens<T> = T extends TokensFragment<infer U> ? U :
|
|
30
|
-
export type ExtractStatics<T> = T extends StaticsFragment<infer U> ? U :
|
|
31
|
-
export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends
|
|
32
|
-
export type ComposableComponent<TProps, TSlotProps, TTokens, TStatics extends
|
|
30
|
+
export type ExtractTokens<T> = T extends TokensFragment<infer U> ? U : ObjectBase;
|
|
31
|
+
export type ExtractStatics<T> = T extends StaticsFragment<infer U> ? U : ObjectBase;
|
|
32
|
+
export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends ObjectBase> = ComposeFactoryOptions<TProps, TSlotProps, TTokens, Theme, TStatics>;
|
|
33
|
+
export type ComposableComponent<TProps, TSlotProps, TTokens, TStatics extends ObjectBase> = ComposeFactoryComponent<TProps, TSlotProps, TTokens, Theme, TStatics>;
|
|
33
34
|
export type UseSlots<T> = UseStyledSlots<ExtractProps<T>, ExtractSlotProps<T>>;
|
|
34
35
|
export declare function compose<T>(options: ComposeOptions<ExtractProps<T>, ExtractSlotProps<T>, ExtractTokens<T>, ExtractStatics<T>>, base?: ComposableComponent<ExtractProps<T>, ExtractSlotProps<T>, ExtractTokens<T>, ExtractStatics<T>>): ComposableComponent<ExtractProps<T>, ExtractSlotProps<T>, ExtractTokens<T>, ExtractStatics<T>>;
|
|
35
36
|
export {};
|
package/lib/compose.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compose.d.ts","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEzH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oCAAoC,CAAC;
|
|
1
|
+
{"version":3,"file":"compose.d.ts","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEzH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oCAAoC,CAAC;AAChE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAIxE;;;GAGG;AACH,MAAM,WAAW,WAAW,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,GAAG,UAAU;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,UAAU,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,QAAQ,CAAC;CACnB;AAED,wCAAwC;AACxC,KAAK,aAAa,CAAC,MAAM,IAAI;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAC/C,KAAK,iBAAiB,CAAC,UAAU,IAAI;IAAE,SAAS,EAAE,UAAU,CAAA;CAAE,CAAC;AAC/D,KAAK,cAAc,CAAC,OAAO,IAAI;IAAE,MAAM,EAAE,OAAO,CAAA;CAAE,CAAC;AAEnD,KAAK,eAAe,CAAC,QAAQ,SAAS,UAAU,IAAI;IAAE,OAAO,EAAE,QAAQ,CAAA;CAAE,CAAC;AAE1E,iFAAiF;AACjF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAC3E,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI,CAAC,SAAS,iBAAiB,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAEnF,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,CAAC,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,UAAU,CAAC;AAElF,MAAM,MAAM,cAAc,CAAC,CAAC,IAAI,CAAC,SAAS,eAAe,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,UAAU,CAAC;AAEpF,MAAM,MAAM,cAAc,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,SAAS,UAAU,IAAI,qBAAqB,CAC1G,MAAM,EACN,UAAU,EACV,OAAO,EACP,KAAK,EACL,QAAQ,CACT,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,SAAS,UAAU,IAAI,uBAAuB,CACjH,MAAM,EACN,UAAU,EACV,OAAO,EACP,KAAK,EACL,QAAQ,CACT,CAAC;AAEF,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;AAE/E,wBAAgB,OAAO,CAAC,CAAC,EACvB,OAAO,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,EAClG,IAAI,CAAC,EAAE,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,GACpG,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAEhG"}
|
package/lib/compose.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compose.js","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;
|
|
1
|
+
{"version":3,"file":"compose.js","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAIpE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AA8C5C,MAAM,UAAU,OAAO,CACrB,OAAkG,EAClG,IAAqG;IAErG,OAAO,cAAc,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,CAAC,CAAC;AACpD,CAAC"}
|
package/lib/compressible.js
CHANGED
|
@@ -7,14 +7,10 @@ import { stagedComponent } from '@fluentui-react-native/use-slot';
|
|
|
7
7
|
* @returns A tree compressed function component with the `.customize` method exposed to it
|
|
8
8
|
*/
|
|
9
9
|
export function compressible(fn, useTokens) {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
component.customize =
|
|
13
|
-
|
|
14
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
15
|
-
tokens[_i] = arguments[_i];
|
|
16
|
-
}
|
|
17
|
-
var useTokensNew = useTokens.customize.apply(useTokens, tokens);
|
|
10
|
+
const injectedWrapper = (props) => fn(props, useTokens);
|
|
11
|
+
const component = stagedComponent(injectedWrapper);
|
|
12
|
+
component.customize = (...tokens) => {
|
|
13
|
+
const useTokensNew = useTokens.customize(...tokens);
|
|
18
14
|
return compressible(fn, useTokensNew);
|
|
19
15
|
};
|
|
20
16
|
return component;
|
package/lib/compressible.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compressible.js","sourceRoot":"","sources":["../src/compressible.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAMlE;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAC1B,EAAwB,EACxB,SAA6B;IAI7B,
|
|
1
|
+
{"version":3,"file":"compressible.js","sourceRoot":"","sources":["../src/compressible.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAMlE;;;;;;GAMG;AACH,MAAM,UAAU,YAAY,CAC1B,EAAwB,EACxB,SAA6B;IAI7B,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,eAAe,CAAC,eAAe,CAAkB,CAAC;IAEpE,SAAS,CAAC,SAAS,GAAG,CAAC,GAAG,MAAgC,EAAE,EAAE;QAC5D,MAAM,YAAY,GAAG,SAAS,CAAC,SAAS,CAAC,GAAG,MAAM,CAAC,CAAC;QACpD,OAAO,YAAY,CAAC,EAAE,EAAE,YAAY,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,OAAO,SAAS,CAAC;AACnB,CAAC"}
|
package/lib/compressible.test.js
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
import { __assign, __rest } from "tslib";
|
|
2
1
|
import { Text, View } from 'react-native';
|
|
3
|
-
import { mergeStyles } from '@fluentui-react-native/
|
|
2
|
+
import { mergeStyles } from '@fluentui-react-native/framework-base';
|
|
4
3
|
import { useSlot, withSlots } from '@fluentui-react-native/use-slot';
|
|
5
4
|
import { applyTokenLayers } from '@fluentui-react-native/use-tokens';
|
|
6
5
|
import * as renderer from 'react-test-renderer';
|
|
7
6
|
import { compressible } from './compressible';
|
|
8
7
|
import { buildUseTokens } from './useTokens';
|
|
9
|
-
|
|
8
|
+
const useVariantTokens = buildUseTokens({
|
|
10
9
|
color: 'black',
|
|
11
10
|
fontSize: 12,
|
|
12
11
|
fontWeight: '500',
|
|
@@ -21,36 +20,35 @@ var useVariantTokens = buildUseTokens({
|
|
|
21
20
|
fontWeight: '300',
|
|
22
21
|
},
|
|
23
22
|
});
|
|
24
|
-
|
|
25
|
-
var _a;
|
|
23
|
+
const VariantText = compressible((props, useTokens) => {
|
|
26
24
|
// fake theme here
|
|
27
|
-
|
|
25
|
+
const theme = {};
|
|
28
26
|
// get the tokens
|
|
29
|
-
|
|
27
|
+
let [tokens, cache] = useTokens(theme);
|
|
30
28
|
// split the props, defaulting the variant type to the default type from the tokens
|
|
31
|
-
|
|
29
|
+
const { variant = tokens.defaultType, style, ...rest } = props;
|
|
32
30
|
// now apply the alternate layer tokens as appropriate
|
|
33
|
-
|
|
31
|
+
[tokens, cache] = applyTokenLayers(tokens, ['normal', 'header', 'caption'], cache, (layer) => layer === variant);
|
|
34
32
|
// merge styles together with what is passed in
|
|
35
|
-
|
|
33
|
+
const mergedStyle = mergeStyles({ color: tokens.color, fontSize: tokens.fontSize, fontWeight: tokens.fontWeight }, style);
|
|
36
34
|
// now get the slot
|
|
37
|
-
|
|
38
|
-
return
|
|
39
|
-
return withSlots(InnerText,
|
|
35
|
+
const InnerText = useSlot(Text, { ...rest, style: mergedStyle });
|
|
36
|
+
return (extra, children) => {
|
|
37
|
+
return withSlots(InnerText, { ...extra }, children);
|
|
40
38
|
};
|
|
41
39
|
}, useVariantTokens);
|
|
42
|
-
|
|
43
|
-
|
|
40
|
+
const SuperHeader = VariantText.customize({ header: { fontSize: 24, color: 'purple' } });
|
|
41
|
+
const useLabelTokens = buildUseTokens({
|
|
44
42
|
headerVariant: 'header',
|
|
45
43
|
captionVariant: 'caption',
|
|
46
44
|
});
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
return
|
|
45
|
+
const Label = compressible((props, useTokens) => {
|
|
46
|
+
const theme = {};
|
|
47
|
+
const [tokens] = useTokens(theme);
|
|
48
|
+
const { headerText, captionText, headerSlot, captionSlot } = props;
|
|
49
|
+
const Header = useSlot(headerSlot || VariantText, { variant: tokens.headerVariant });
|
|
50
|
+
const Caption = useSlot(captionSlot || VariantText, { variant: tokens.captionVariant });
|
|
51
|
+
return () => {
|
|
54
52
|
if (captionText) {
|
|
55
53
|
return (withSlots(View, null,
|
|
56
54
|
withSlots(Header, null, headerText),
|
|
@@ -59,17 +57,17 @@ var Label = compressible(function (props, useTokens) {
|
|
|
59
57
|
return withSlots(Header, null, headerText);
|
|
60
58
|
};
|
|
61
59
|
}, useLabelTokens);
|
|
62
|
-
describe('compressible tests',
|
|
63
|
-
it('Two labels, one with caption and one without',
|
|
64
|
-
|
|
60
|
+
describe('compressible tests', () => {
|
|
61
|
+
it('Two labels, one with caption and one without', () => {
|
|
62
|
+
const tree = renderer
|
|
65
63
|
.create(withSlots(View, null,
|
|
66
64
|
withSlots(Label, { headerText: "Header1" }),
|
|
67
65
|
withSlots(Label, { headerText: "Header2", captionText: "Caption2" })))
|
|
68
66
|
.toJSON();
|
|
69
67
|
expect(tree).toMatchSnapshot();
|
|
70
68
|
});
|
|
71
|
-
it('Two labels, one plugging in SuperHeader instead',
|
|
72
|
-
|
|
69
|
+
it('Two labels, one plugging in SuperHeader instead', () => {
|
|
70
|
+
const tree = renderer
|
|
73
71
|
.create(withSlots(View, null,
|
|
74
72
|
withSlots(Label, { headerText: "Super Header", headerSlot: SuperHeader, captionText: "Normal caption" }),
|
|
75
73
|
withSlots(Label, { headerText: "Normal Header", captionText: "Another normal caption" })))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compressible.test.js","sourceRoot":"","sources":["../src/compressible.test.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"compressible.test.js","sourceRoot":"","sources":["../src/compressible.test.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAEpE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,KAAK,QAAQ,MAAM,qBAAqB,CAAC;AAEhD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAe7C,MAAM,gBAAgB,GAAG,cAAc,CAAoB;IACzD,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,KAAK;IACjB,WAAW,EAAE,QAAQ;IACrB,MAAM,EAAE;QACN,KAAK,EAAE,MAAM;QACb,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,KAAK;KAClB;IACD,OAAO,EAAE;QACP,KAAK,EAAE,MAAM;QACb,UAAU,EAAE,KAAK;KAClB;CACF,CAAC,CAAC;AAEH,MAAM,WAAW,GAAG,YAAY,CAC9B,CAAC,KAAuB,EAAE,SAAuC,EAAE,EAAE;IACnE,kBAAkB;IAClB,MAAM,KAAK,GAAU,EAAW,CAAC;IACjC,iBAAiB;IACjB,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;IACvC,mFAAmF;IACnF,MAAM,EAAE,OAAO,GAAG,MAAM,CAAC,WAAW,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAC/D,sDAAsD;IACtD,CAAC,MAAM,EAAE,KAAK,CAAC,GAAG,gBAAgB,CAAC,MAAM,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC;IACjH,+CAA+C;IAC/C,MAAM,WAAW,GAAG,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,EAAE,UAAU,EAAE,MAAM,CAAC,UAAU,EAAE,EAAE,KAAK,CAAC,CAAC;IAC1H,mBAAmB;IACnB,MAAM,SAAS,GAAG,OAAO,CAAY,IAAI,EAAE,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC;IAE5E,OAAO,CAAC,KAAuB,EAAE,QAAyB,EAAE,EAAE;QAC5D,OAAO,UAAC,SAAS,OAAK,KAAK,IAAG,QAAQ,CAAa,CAAC;IACtD,CAAC,CAAC;AACJ,CAAC,EACD,gBAAgB,CACjB,CAAC;AAEF,MAAM,WAAW,GAAG,WAAW,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC;AAczF,MAAM,cAAc,GAAG,cAAc,CAAc;IACjD,aAAa,EAAE,QAAQ;IACvB,cAAc,EAAE,SAAS;CAC1B,CAAC,CAAC;AAEH,MAAM,KAAK,GAAG,YAAY,CAA0B,CAAC,KAAiB,EAAE,SAAiC,EAAE,EAAE;IAC3G,MAAM,KAAK,GAAU,EAAW,CAAC;IACjC,MAAM,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;IAClC,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IACnE,MAAM,MAAM,GAAG,OAAO,CAAmB,UAAU,IAAI,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,CAAC,aAAa,EAAE,CAAC,CAAC;IACvG,MAAM,OAAO,GAAG,OAAO,CAAmB,WAAW,IAAI,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,CAAC,cAAc,EAAE,CAAC,CAAC;IAC1G,OAAO,GAAG,EAAE;QACV,IAAI,WAAW,EAAE;YACf,OAAO,CACL,UAAC,IAAI;gBACH,UAAC,MAAM,QAAE,UAAU,CAAU;gBAC7B,UAAC,OAAO,QAAE,WAAW,CAAW,CAC3B,CACR,CAAC;SACH;QACD,OAAO,UAAC,MAAM,QAAE,UAAU,CAAU,CAAC;IACvC,CAAC,CAAC;AACJ,CAAC,EAAE,cAAc,CAAC,CAAC;AAEnB,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;IAClC,EAAE,CAAC,8CAA8C,EAAE,GAAG,EAAE;QACtD,MAAM,IAAI,GAAG,QAAQ;aAClB,MAAM,CACL,UAAC,IAAI;YACH,UAAC,KAAK,IAAC,UAAU,EAAC,SAAS,GAAG;YAC9B,UAAC,KAAK,IAAC,UAAU,EAAC,SAAS,EAAC,WAAW,EAAC,UAAU,GAAG,CAChD,CACR;aACA,MAAM,EAAE,CAAC;QACZ,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iDAAiD,EAAE,GAAG,EAAE;QACzD,MAAM,IAAI,GAAG,QAAQ;aAClB,MAAM,CACL,UAAC,IAAI;YACH,UAAC,KAAK,IAAC,UAAU,EAAC,cAAc,EAAC,UAAU,EAAE,WAAW,EAAE,WAAW,EAAC,gBAAgB,GAAG;YACzF,UAAC,KAAK,IAAC,UAAU,EAAC,eAAe,EAAC,WAAW,EAAC,wBAAwB,GAAG,CACpE,CACR;aACA,MAAM,EAAE,CAAC;QACZ,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
export type { GetMemoValue } from '@fluentui-react-native/
|
|
2
|
-
export { getMemoCache, memoize } from '@fluentui-react-native/
|
|
3
|
-
export type { StyleProp } from '@fluentui-react-native/
|
|
4
|
-
export { mergeProps, mergeStyles } from '@fluentui-react-native/
|
|
1
|
+
export type { GetMemoValue } from '@fluentui-react-native/framework-base';
|
|
2
|
+
export { getMemoCache, memoize } from '@fluentui-react-native/framework-base';
|
|
3
|
+
export type { StyleProp } from '@fluentui-react-native/framework-base';
|
|
4
|
+
export { mergeProps, mergeStyles } from '@fluentui-react-native/framework-base';
|
|
5
5
|
export { backgroundColorTokens, borderStyles, borderTokens, colorTokens, fontStyles, foregroundColorTokens, getPaletteFromTheme, layoutStyles, layoutTokens, shadowStyles, shadowTokens, textTokens, tokenBuilder, } from '@fluentui-react-native/tokens';
|
|
6
6
|
export type { FontStyleTokens, FontTokens, FontVariantTokens, IBackgroundColorTokens, IBorderTokens, IColorTokens, IForegroundColorTokens, IShadowTokens, LayoutTokens, TokenBuilder, } from '@fluentui-react-native/tokens';
|
|
7
7
|
export { renderSlot, stagedComponent, useSlot, withSlots } from '@fluentui-react-native/use-slot';
|
|
8
8
|
export type { ComposableFunction, FinalRender, NativeReactType, SlotFn, StagedRender } from '@fluentui-react-native/use-slot';
|
|
9
9
|
export { buildUseSlots } from '@fluentui-react-native/use-slots';
|
|
10
10
|
export type { GetSlotProps, Slots, UseSlotOptions, UseSlotsBase } from '@fluentui-react-native/use-slots';
|
|
11
|
-
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/
|
|
12
|
-
export type { BuiltinRecursionHandlers, CustomRecursionHandler, MergeOptions, RecursionHandler, RecursionOption, } from '@fluentui-react-native/
|
|
11
|
+
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/framework-base';
|
|
12
|
+
export type { BuiltinRecursionHandlers, CustomRecursionHandler, MergeOptions, ObjectBase, RecursionHandler, RecursionOption, } from '@fluentui-react-native/framework-base';
|
|
13
13
|
export { ThemeContext, useTheme } from '@fluentui-react-native/theme-types';
|
|
14
14
|
export type { AliasColorTokens, AppearanceOptions, Color, FontFamilies, FontFamily, FontFamilyValue, FontSize, FontSizeValuePoints, FontSizes, FontWeight, FontWeightValue, FontWeights, OfficePalette, Palette, PaletteBackgroundColors, PaletteTextColors, PartialPalette, PartialTheme, PartialTypography, Spacing, TextStyling, Theme, ThemeColorDefinition, ThemeOptions, Typography, Variant, VariantValue, Variants, } from '@fluentui-react-native/theme-types';
|
|
15
15
|
export { compose } from './compose';
|
package/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAE9E,YAAY,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAEhF,OAAO,EACL,qBAAqB,EACrB,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,UAAU,EACV,qBAAqB,EACrB,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,YAAY,GACb,MAAM,+BAA+B,CAAC;AACvC,YAAY,EACV,eAAe,EACf,UAAU,EACV,iBAAiB,EACjB,sBAAsB,EACtB,aAAa,EACb,YAAY,EACZ,sBAAsB,EACtB,aAAa,EACb,YAAY,EACZ,YAAY,GACb,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAClG,YAAY,EAAE,kBAAkB,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAE9H,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAE1G,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AAC7G,YAAY,EACV,wBAAwB,EACxB,sBAAsB,EACtB,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,eAAe,GAChB,MAAM,uCAAuC,CAAC;AAE/C,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC5E,YAAY,EACV,gBAAgB,EAChB,iBAAiB,EACjB,KAAK,EACL,YAAY,EACZ,UAAU,EACV,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,aAAa,EACb,OAAO,EACP,uBAAuB,EACvB,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,iBAAiB,EACjB,OAAO,EACP,WAAW,EACX,KAAK,EACL,oBAAoB,EACpB,YAAY,EACZ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,MAAM,oCAAoC,CAAC;AAE5C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EACV,mBAAmB,EACnB,cAAc,EACd,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,QAAQ,GACT,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,QAAQ,EAAE,sBAAsB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC3D,YAAY,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAClG,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC9G,YAAY,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC"}
|
package/lib/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
export { getMemoCache, memoize } from '@fluentui-react-native/
|
|
2
|
-
export { mergeProps, mergeStyles } from '@fluentui-react-native/
|
|
1
|
+
export { getMemoCache, memoize } from '@fluentui-react-native/framework-base';
|
|
2
|
+
export { mergeProps, mergeStyles } from '@fluentui-react-native/framework-base';
|
|
3
3
|
export { backgroundColorTokens, borderStyles, borderTokens, colorTokens, fontStyles, foregroundColorTokens, getPaletteFromTheme, layoutStyles, layoutTokens, shadowStyles, shadowTokens, textTokens, tokenBuilder, } from '@fluentui-react-native/tokens';
|
|
4
4
|
export { renderSlot, stagedComponent, useSlot, withSlots } from '@fluentui-react-native/use-slot';
|
|
5
5
|
export { buildUseSlots } from '@fluentui-react-native/use-slots';
|
|
6
|
-
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/
|
|
6
|
+
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/framework-base';
|
|
7
7
|
export { ThemeContext, useTheme } from '@fluentui-react-native/theme-types';
|
|
8
8
|
export { compose } from './compose';
|
|
9
9
|
export { compressible } from './compressible';
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAG9E,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAEhF,OAAO,EACL,qBAAqB,EACrB,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,UAAU,EACV,qBAAqB,EACrB,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,YAAY,GACb,MAAM,+BAA+B,CAAC;AAcvC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAGlG,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AAGjE,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AAU7G,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAgC5E,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAWpC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE3D,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC"}
|
package/lib/themeHelper.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { useFluentTheme } from './useFluentTheme';
|
|
2
|
-
export
|
|
3
|
-
useTheme:
|
|
4
|
-
getComponentInfo:
|
|
5
|
-
|
|
2
|
+
export const themeHelper = {
|
|
3
|
+
useTheme: () => useFluentTheme(),
|
|
4
|
+
getComponentInfo: (theme, name) => {
|
|
5
|
+
const components = theme.components || {};
|
|
6
6
|
return components[name];
|
|
7
7
|
},
|
|
8
8
|
};
|
package/lib/themeHelper.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeHelper.js","sourceRoot":"","sources":["../src/themeHelper.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"themeHelper.js","sourceRoot":"","sources":["../src/themeHelper.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,MAAM,WAAW,GAAuB;IAC7C,QAAQ,EAAE,GAAG,EAAE,CAAC,cAAc,EAAE;IAChC,gBAAgB,EAAE,CAAC,KAAY,EAAE,IAAY,EAAE,EAAE;QAC/C,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,IAAI,EAAE,CAAC;QAC1C,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;CACF,CAAC"}
|
package/lib/useTokens.js
CHANGED
|
@@ -1,12 +1,7 @@
|
|
|
1
|
-
import { __spreadArray } from "tslib";
|
|
2
1
|
import { buildUseTokens as buildUseTokensCore } from '@fluentui-react-native/use-tokens';
|
|
3
2
|
import { themeHelper } from './themeHelper';
|
|
4
3
|
export { applyTokenLayers, applyPropsToTokens, customizable, patchTokens } from '@fluentui-react-native/use-tokens';
|
|
5
|
-
export function buildUseTokens() {
|
|
6
|
-
|
|
7
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
8
|
-
tokens[_i] = arguments[_i];
|
|
9
|
-
}
|
|
10
|
-
return buildUseTokensCore.apply(void 0, __spreadArray([themeHelper.getComponentInfo], tokens, false));
|
|
4
|
+
export function buildUseTokens(...tokens) {
|
|
5
|
+
return buildUseTokensCore(themeHelper.getComponentInfo, ...tokens);
|
|
11
6
|
}
|
|
12
7
|
//# sourceMappingURL=useTokens.js.map
|
package/lib/useTokens.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTokens.js","sourceRoot":"","sources":["../src/useTokens.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useTokens.js","sourceRoot":"","sources":["../src/useTokens.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,IAAI,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AAEzF,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG5C,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAMpH,MAAM,UAAU,cAAc,CAAU,GAAG,MAAgC;IACzE,OAAO,kBAAkB,CAAC,WAAW,CAAC,gBAAgB,EAAE,GAAG,MAAM,CAAC,CAAC;AACrE,CAAC"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import type { ComposeFactoryOptions, ComposeFactoryComponent, UseStyledSlots } from '@fluentui-react-native/composition';
|
|
2
2
|
import type { Theme } from '@fluentui-react-native/theme-types';
|
|
3
|
+
import type { ObjectBase } from '@fluentui-react-native/framework-base';
|
|
3
4
|
/**
|
|
4
5
|
* This is an object used purely for configuring the typings on composable. It is not necessary to define
|
|
5
6
|
* the type via the IComposableType interface, this is simply the format used to extract the type info.
|
|
6
7
|
*/
|
|
7
|
-
export interface ComposeType<TProps, TSlotProps, TTokens, TStatics =
|
|
8
|
+
export interface ComposeType<TProps, TSlotProps, TTokens, TStatics = ObjectBase> {
|
|
8
9
|
props: TProps;
|
|
9
10
|
slotProps: TSlotProps;
|
|
10
11
|
tokens: TTokens;
|
|
@@ -20,16 +21,16 @@ type SlotPropsFragment<TSlotProps> = {
|
|
|
20
21
|
type TokensFragment<TTokens> = {
|
|
21
22
|
tokens: TTokens;
|
|
22
23
|
};
|
|
23
|
-
type StaticsFragment<TStatics extends
|
|
24
|
+
type StaticsFragment<TStatics extends ObjectBase> = {
|
|
24
25
|
statics: TStatics;
|
|
25
26
|
};
|
|
26
27
|
/** Extraction types that get the various interface types from IComposableType */
|
|
27
28
|
export type ExtractProps<T> = T extends PropsFragment<infer U> ? U : never;
|
|
28
29
|
export type ExtractSlotProps<T> = T extends SlotPropsFragment<infer U> ? U : never;
|
|
29
|
-
export type ExtractTokens<T> = T extends TokensFragment<infer U> ? U :
|
|
30
|
-
export type ExtractStatics<T> = T extends StaticsFragment<infer U> ? U :
|
|
31
|
-
export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends
|
|
32
|
-
export type ComposableComponent<TProps, TSlotProps, TTokens, TStatics extends
|
|
30
|
+
export type ExtractTokens<T> = T extends TokensFragment<infer U> ? U : ObjectBase;
|
|
31
|
+
export type ExtractStatics<T> = T extends StaticsFragment<infer U> ? U : ObjectBase;
|
|
32
|
+
export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends ObjectBase> = ComposeFactoryOptions<TProps, TSlotProps, TTokens, Theme, TStatics>;
|
|
33
|
+
export type ComposableComponent<TProps, TSlotProps, TTokens, TStatics extends ObjectBase> = ComposeFactoryComponent<TProps, TSlotProps, TTokens, Theme, TStatics>;
|
|
33
34
|
export type UseSlots<T> = UseStyledSlots<ExtractProps<T>, ExtractSlotProps<T>>;
|
|
34
35
|
export declare function compose<T>(options: ComposeOptions<ExtractProps<T>, ExtractSlotProps<T>, ExtractTokens<T>, ExtractStatics<T>>, base?: ComposableComponent<ExtractProps<T>, ExtractSlotProps<T>, ExtractTokens<T>, ExtractStatics<T>>): ComposableComponent<ExtractProps<T>, ExtractSlotProps<T>, ExtractTokens<T>, ExtractStatics<T>>;
|
|
35
36
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compose.d.ts","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEzH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oCAAoC,CAAC;
|
|
1
|
+
{"version":3,"file":"compose.d.ts","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEzH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,oCAAoC,CAAC;AAChE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAIxE;;;GAGG;AACH,MAAM,WAAW,WAAW,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,GAAG,UAAU;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,UAAU,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,QAAQ,CAAC;CACnB;AAED,wCAAwC;AACxC,KAAK,aAAa,CAAC,MAAM,IAAI;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAC/C,KAAK,iBAAiB,CAAC,UAAU,IAAI;IAAE,SAAS,EAAE,UAAU,CAAA;CAAE,CAAC;AAC/D,KAAK,cAAc,CAAC,OAAO,IAAI;IAAE,MAAM,EAAE,OAAO,CAAA;CAAE,CAAC;AAEnD,KAAK,eAAe,CAAC,QAAQ,SAAS,UAAU,IAAI;IAAE,OAAO,EAAE,QAAQ,CAAA;CAAE,CAAC;AAE1E,iFAAiF;AACjF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAC3E,MAAM,MAAM,gBAAgB,CAAC,CAAC,IAAI,CAAC,SAAS,iBAAiB,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAEnF,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI,CAAC,SAAS,cAAc,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,UAAU,CAAC;AAElF,MAAM,MAAM,cAAc,CAAC,CAAC,IAAI,CAAC,SAAS,eAAe,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,UAAU,CAAC;AAEpF,MAAM,MAAM,cAAc,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,SAAS,UAAU,IAAI,qBAAqB,CAC1G,MAAM,EACN,UAAU,EACV,OAAO,EACP,KAAK,EACL,QAAQ,CACT,CAAC;AAEF,MAAM,MAAM,mBAAmB,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,SAAS,UAAU,IAAI,uBAAuB,CACjH,MAAM,EACN,UAAU,EACV,OAAO,EACP,KAAK,EACL,QAAQ,CACT,CAAC;AAEF,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;AAE/E,wBAAgB,OAAO,CAAC,CAAC,EACvB,OAAO,EAAE,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,EAClG,IAAI,CAAC,EAAE,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,GACpG,mBAAmB,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAEhG"}
|
package/lib-commonjs/compose.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.compose = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
const composition_1 = require("@fluentui-react-native/composition");
|
|
5
|
+
const themeHelper_1 = require("./themeHelper");
|
|
6
6
|
function compose(options, base) {
|
|
7
7
|
return (0, composition_1.composeFactory)(options, themeHelper_1.themeHelper, base);
|
|
8
8
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compose.js","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":";;;AACA,
|
|
1
|
+
{"version":3,"file":"compose.js","sourceRoot":"","sources":["../src/compose.ts"],"names":[],"mappings":";;;AACA,oEAAoE;AAIpE,+CAA4C;AA8C5C,SAAgB,OAAO,CACrB,OAAkG,EAClG,IAAqG;IAErG,OAAO,IAAA,4BAAc,EAAC,OAAO,EAAE,yBAAW,EAAE,IAAI,CAAC,CAAC;AACpD,CAAC;AALD,0BAKC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.compressible = void 0;
|
|
4
|
-
|
|
4
|
+
const use_slot_1 = require("@fluentui-react-native/use-slot");
|
|
5
5
|
/**
|
|
6
6
|
* Utility function which can create function components that can be tree compressed (using the stagedRender pattern),
|
|
7
7
|
* and also have customize functionality.
|
|
@@ -10,14 +10,10 @@ var use_slot_1 = require("@fluentui-react-native/use-slot");
|
|
|
10
10
|
* @returns A tree compressed function component with the `.customize` method exposed to it
|
|
11
11
|
*/
|
|
12
12
|
function compressible(fn, useTokens) {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
component.customize =
|
|
16
|
-
|
|
17
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
18
|
-
tokens[_i] = arguments[_i];
|
|
19
|
-
}
|
|
20
|
-
var useTokensNew = useTokens.customize.apply(useTokens, tokens);
|
|
13
|
+
const injectedWrapper = (props) => fn(props, useTokens);
|
|
14
|
+
const component = (0, use_slot_1.stagedComponent)(injectedWrapper);
|
|
15
|
+
component.customize = (...tokens) => {
|
|
16
|
+
const useTokensNew = useTokens.customize(...tokens);
|
|
21
17
|
return compressible(fn, useTokensNew);
|
|
22
18
|
};
|
|
23
19
|
return component;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compressible.js","sourceRoot":"","sources":["../src/compressible.ts"],"names":[],"mappings":";;;AAEA,
|
|
1
|
+
{"version":3,"file":"compressible.js","sourceRoot":"","sources":["../src/compressible.ts"],"names":[],"mappings":";;;AAEA,8DAAkE;AAMlE;;;;;;GAMG;AACH,SAAgB,YAAY,CAC1B,EAAwB,EACxB,SAA6B;IAI7B,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;IAChE,MAAM,SAAS,GAAG,IAAA,0BAAe,EAAC,eAAe,CAAkB,CAAC;IAEpE,SAAS,CAAC,SAAS,GAAG,CAAC,GAAG,MAAgC,EAAE,EAAE;QAC5D,MAAM,YAAY,GAAG,SAAS,CAAC,SAAS,CAAC,GAAG,MAAM,CAAC,CAAC;QACpD,OAAO,YAAY,CAAC,EAAE,EAAE,YAAY,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,OAAO,SAAS,CAAC;AACnB,CAAC;AAfD,oCAeC"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
3
|
+
const tslib_1 = require("tslib");
|
|
4
|
+
const react_native_1 = require("react-native");
|
|
5
|
+
const framework_base_1 = require("@fluentui-react-native/framework-base");
|
|
6
|
+
const use_slot_1 = require("@fluentui-react-native/use-slot");
|
|
7
|
+
const use_tokens_1 = require("@fluentui-react-native/use-tokens");
|
|
8
|
+
const renderer = tslib_1.__importStar(require("react-test-renderer"));
|
|
9
|
+
const compressible_1 = require("./compressible");
|
|
10
|
+
const useTokens_1 = require("./useTokens");
|
|
11
|
+
const useVariantTokens = (0, useTokens_1.buildUseTokens)({
|
|
12
12
|
color: 'black',
|
|
13
13
|
fontSize: 12,
|
|
14
14
|
fontWeight: '500',
|
|
@@ -23,36 +23,35 @@ var useVariantTokens = (0, useTokens_1.buildUseTokens)({
|
|
|
23
23
|
fontWeight: '300',
|
|
24
24
|
},
|
|
25
25
|
});
|
|
26
|
-
|
|
27
|
-
var _a;
|
|
26
|
+
const VariantText = (0, compressible_1.compressible)((props, useTokens) => {
|
|
28
27
|
// fake theme here
|
|
29
|
-
|
|
28
|
+
const theme = {};
|
|
30
29
|
// get the tokens
|
|
31
|
-
|
|
30
|
+
let [tokens, cache] = useTokens(theme);
|
|
32
31
|
// split the props, defaulting the variant type to the default type from the tokens
|
|
33
|
-
|
|
32
|
+
const { variant = tokens.defaultType, style, ...rest } = props;
|
|
34
33
|
// now apply the alternate layer tokens as appropriate
|
|
35
|
-
|
|
34
|
+
[tokens, cache] = (0, use_tokens_1.applyTokenLayers)(tokens, ['normal', 'header', 'caption'], cache, (layer) => layer === variant);
|
|
36
35
|
// merge styles together with what is passed in
|
|
37
|
-
|
|
36
|
+
const mergedStyle = (0, framework_base_1.mergeStyles)({ color: tokens.color, fontSize: tokens.fontSize, fontWeight: tokens.fontWeight }, style);
|
|
38
37
|
// now get the slot
|
|
39
|
-
|
|
40
|
-
return
|
|
41
|
-
return (0, use_slot_1.withSlots)(InnerText,
|
|
38
|
+
const InnerText = (0, use_slot_1.useSlot)(react_native_1.Text, { ...rest, style: mergedStyle });
|
|
39
|
+
return (extra, children) => {
|
|
40
|
+
return (0, use_slot_1.withSlots)(InnerText, { ...extra }, children);
|
|
42
41
|
};
|
|
43
42
|
}, useVariantTokens);
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
const SuperHeader = VariantText.customize({ header: { fontSize: 24, color: 'purple' } });
|
|
44
|
+
const useLabelTokens = (0, useTokens_1.buildUseTokens)({
|
|
46
45
|
headerVariant: 'header',
|
|
47
46
|
captionVariant: 'caption',
|
|
48
47
|
});
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
return
|
|
48
|
+
const Label = (0, compressible_1.compressible)((props, useTokens) => {
|
|
49
|
+
const theme = {};
|
|
50
|
+
const [tokens] = useTokens(theme);
|
|
51
|
+
const { headerText, captionText, headerSlot, captionSlot } = props;
|
|
52
|
+
const Header = (0, use_slot_1.useSlot)(headerSlot || VariantText, { variant: tokens.headerVariant });
|
|
53
|
+
const Caption = (0, use_slot_1.useSlot)(captionSlot || VariantText, { variant: tokens.captionVariant });
|
|
54
|
+
return () => {
|
|
56
55
|
if (captionText) {
|
|
57
56
|
return ((0, use_slot_1.withSlots)(react_native_1.View, null,
|
|
58
57
|
(0, use_slot_1.withSlots)(Header, null, headerText),
|
|
@@ -61,17 +60,17 @@ var Label = (0, compressible_1.compressible)(function (props, useTokens) {
|
|
|
61
60
|
return (0, use_slot_1.withSlots)(Header, null, headerText);
|
|
62
61
|
};
|
|
63
62
|
}, useLabelTokens);
|
|
64
|
-
describe('compressible tests',
|
|
65
|
-
it('Two labels, one with caption and one without',
|
|
66
|
-
|
|
63
|
+
describe('compressible tests', () => {
|
|
64
|
+
it('Two labels, one with caption and one without', () => {
|
|
65
|
+
const tree = renderer
|
|
67
66
|
.create((0, use_slot_1.withSlots)(react_native_1.View, null,
|
|
68
67
|
(0, use_slot_1.withSlots)(Label, { headerText: "Header1" }),
|
|
69
68
|
(0, use_slot_1.withSlots)(Label, { headerText: "Header2", captionText: "Caption2" })))
|
|
70
69
|
.toJSON();
|
|
71
70
|
expect(tree).toMatchSnapshot();
|
|
72
71
|
});
|
|
73
|
-
it('Two labels, one plugging in SuperHeader instead',
|
|
74
|
-
|
|
72
|
+
it('Two labels, one plugging in SuperHeader instead', () => {
|
|
73
|
+
const tree = renderer
|
|
75
74
|
.create((0, use_slot_1.withSlots)(react_native_1.View, null,
|
|
76
75
|
(0, use_slot_1.withSlots)(Label, { headerText: "Super Header", headerSlot: SuperHeader, captionText: "Normal caption" }),
|
|
77
76
|
(0, use_slot_1.withSlots)(Label, { headerText: "Normal Header", captionText: "Another normal caption" })))
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"compressible.test.js","sourceRoot":"","sources":["../src/compressible.test.tsx"],"names":[],"mappings":";;;AAIA
|
|
1
|
+
{"version":3,"file":"compressible.test.js","sourceRoot":"","sources":["../src/compressible.test.tsx"],"names":[],"mappings":"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"}
|
package/lib-commonjs/index.d.ts
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
export type { GetMemoValue } from '@fluentui-react-native/
|
|
2
|
-
export { getMemoCache, memoize } from '@fluentui-react-native/
|
|
3
|
-
export type { StyleProp } from '@fluentui-react-native/
|
|
4
|
-
export { mergeProps, mergeStyles } from '@fluentui-react-native/
|
|
1
|
+
export type { GetMemoValue } from '@fluentui-react-native/framework-base';
|
|
2
|
+
export { getMemoCache, memoize } from '@fluentui-react-native/framework-base';
|
|
3
|
+
export type { StyleProp } from '@fluentui-react-native/framework-base';
|
|
4
|
+
export { mergeProps, mergeStyles } from '@fluentui-react-native/framework-base';
|
|
5
5
|
export { backgroundColorTokens, borderStyles, borderTokens, colorTokens, fontStyles, foregroundColorTokens, getPaletteFromTheme, layoutStyles, layoutTokens, shadowStyles, shadowTokens, textTokens, tokenBuilder, } from '@fluentui-react-native/tokens';
|
|
6
6
|
export type { FontStyleTokens, FontTokens, FontVariantTokens, IBackgroundColorTokens, IBorderTokens, IColorTokens, IForegroundColorTokens, IShadowTokens, LayoutTokens, TokenBuilder, } from '@fluentui-react-native/tokens';
|
|
7
7
|
export { renderSlot, stagedComponent, useSlot, withSlots } from '@fluentui-react-native/use-slot';
|
|
8
8
|
export type { ComposableFunction, FinalRender, NativeReactType, SlotFn, StagedRender } from '@fluentui-react-native/use-slot';
|
|
9
9
|
export { buildUseSlots } from '@fluentui-react-native/use-slots';
|
|
10
10
|
export type { GetSlotProps, Slots, UseSlotOptions, UseSlotsBase } from '@fluentui-react-native/use-slots';
|
|
11
|
-
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/
|
|
12
|
-
export type { BuiltinRecursionHandlers, CustomRecursionHandler, MergeOptions, RecursionHandler, RecursionOption, } from '@fluentui-react-native/
|
|
11
|
+
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/framework-base';
|
|
12
|
+
export type { BuiltinRecursionHandlers, CustomRecursionHandler, MergeOptions, ObjectBase, RecursionHandler, RecursionOption, } from '@fluentui-react-native/framework-base';
|
|
13
13
|
export { ThemeContext, useTheme } from '@fluentui-react-native/theme-types';
|
|
14
14
|
export type { AliasColorTokens, AppearanceOptions, Color, FontFamilies, FontFamily, FontFamilyValue, FontSize, FontSizeValuePoints, FontSizes, FontWeight, FontWeightValue, FontWeights, OfficePalette, Palette, PaletteBackgroundColors, PaletteTextColors, PartialPalette, PartialTheme, PartialTypography, Spacing, TextStyling, Theme, ThemeColorDefinition, ThemeOptions, Typography, Variant, VariantValue, Variants, } from '@fluentui-react-native/theme-types';
|
|
15
15
|
export { compose } from './compose';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,MAAM,uCAAuC,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uCAAuC,CAAC;AAE9E,YAAY,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AACvE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AAEhF,OAAO,EACL,qBAAqB,EACrB,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,UAAU,EACV,qBAAqB,EACrB,mBAAmB,EACnB,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,UAAU,EACV,YAAY,GACb,MAAM,+BAA+B,CAAC;AACvC,YAAY,EACV,eAAe,EACf,UAAU,EACV,iBAAiB,EACjB,sBAAsB,EACtB,aAAa,EACb,YAAY,EACZ,sBAAsB,EACtB,aAAa,EACb,YAAY,EACZ,YAAY,GACb,MAAM,+BAA+B,CAAC;AAEvC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAClG,YAAY,EAAE,kBAAkB,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,iCAAiC,CAAC;AAE9H,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,YAAY,EAAE,YAAY,EAAE,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAE1G,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AAC7G,YAAY,EACV,wBAAwB,EACxB,sBAAsB,EACtB,YAAY,EACZ,UAAU,EACV,gBAAgB,EAChB,eAAe,GAChB,MAAM,uCAAuC,CAAC;AAE/C,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC5E,YAAY,EACV,gBAAgB,EAChB,iBAAiB,EACjB,KAAK,EACL,YAAY,EACZ,UAAU,EACV,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,aAAa,EACb,OAAO,EACP,uBAAuB,EACvB,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,iBAAiB,EACjB,OAAO,EACP,WAAW,EACX,KAAK,EACL,oBAAoB,EACpB,YAAY,EACZ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,MAAM,oCAAoC,CAAC;AAE5C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EACV,mBAAmB,EACnB,cAAc,EACd,WAAW,EACX,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,QAAQ,GACT,MAAM,WAAW,CAAC;AACnB,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EAAE,QAAQ,EAAE,sBAAsB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AACjF,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC3D,YAAY,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAClG,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC9G,YAAY,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,aAAa,CAAC"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.patchTokens = exports.customizable = exports.buildUseTokens = exports.applyTokenLayers = exports.applyPropsToTokens = exports.buildUseStyling = exports.buildProps = exports.useFluentTheme = exports.compressible = exports.compose = exports.useTheme = exports.ThemeContext = exports.processImmutable = exports.immutableMergeCore = exports.immutableMerge = exports.buildUseSlots = exports.withSlots = exports.useSlot = exports.stagedComponent = exports.renderSlot = exports.tokenBuilder = exports.textTokens = exports.shadowTokens = exports.shadowStyles = exports.layoutTokens = exports.layoutStyles = exports.getPaletteFromTheme = exports.foregroundColorTokens = exports.fontStyles = exports.colorTokens = exports.borderTokens = exports.borderStyles = exports.backgroundColorTokens = exports.mergeStyles = exports.mergeProps = exports.memoize = exports.getMemoCache = void 0;
|
|
4
|
-
var
|
|
5
|
-
Object.defineProperty(exports, "getMemoCache", { enumerable: true, get: function () { return
|
|
6
|
-
Object.defineProperty(exports, "memoize", { enumerable: true, get: function () { return
|
|
7
|
-
var
|
|
8
|
-
Object.defineProperty(exports, "mergeProps", { enumerable: true, get: function () { return
|
|
9
|
-
Object.defineProperty(exports, "mergeStyles", { enumerable: true, get: function () { return
|
|
4
|
+
var framework_base_1 = require("@fluentui-react-native/framework-base");
|
|
5
|
+
Object.defineProperty(exports, "getMemoCache", { enumerable: true, get: function () { return framework_base_1.getMemoCache; } });
|
|
6
|
+
Object.defineProperty(exports, "memoize", { enumerable: true, get: function () { return framework_base_1.memoize; } });
|
|
7
|
+
var framework_base_2 = require("@fluentui-react-native/framework-base");
|
|
8
|
+
Object.defineProperty(exports, "mergeProps", { enumerable: true, get: function () { return framework_base_2.mergeProps; } });
|
|
9
|
+
Object.defineProperty(exports, "mergeStyles", { enumerable: true, get: function () { return framework_base_2.mergeStyles; } });
|
|
10
10
|
var tokens_1 = require("@fluentui-react-native/tokens");
|
|
11
11
|
Object.defineProperty(exports, "backgroundColorTokens", { enumerable: true, get: function () { return tokens_1.backgroundColorTokens; } });
|
|
12
12
|
Object.defineProperty(exports, "borderStyles", { enumerable: true, get: function () { return tokens_1.borderStyles; } });
|
|
@@ -28,10 +28,10 @@ Object.defineProperty(exports, "useSlot", { enumerable: true, get: function () {
|
|
|
28
28
|
Object.defineProperty(exports, "withSlots", { enumerable: true, get: function () { return use_slot_1.withSlots; } });
|
|
29
29
|
var use_slots_1 = require("@fluentui-react-native/use-slots");
|
|
30
30
|
Object.defineProperty(exports, "buildUseSlots", { enumerable: true, get: function () { return use_slots_1.buildUseSlots; } });
|
|
31
|
-
var
|
|
32
|
-
Object.defineProperty(exports, "immutableMerge", { enumerable: true, get: function () { return
|
|
33
|
-
Object.defineProperty(exports, "immutableMergeCore", { enumerable: true, get: function () { return
|
|
34
|
-
Object.defineProperty(exports, "processImmutable", { enumerable: true, get: function () { return
|
|
31
|
+
var framework_base_3 = require("@fluentui-react-native/framework-base");
|
|
32
|
+
Object.defineProperty(exports, "immutableMerge", { enumerable: true, get: function () { return framework_base_3.immutableMerge; } });
|
|
33
|
+
Object.defineProperty(exports, "immutableMergeCore", { enumerable: true, get: function () { return framework_base_3.immutableMergeCore; } });
|
|
34
|
+
Object.defineProperty(exports, "processImmutable", { enumerable: true, get: function () { return framework_base_3.processImmutable; } });
|
|
35
35
|
var theme_types_1 = require("@fluentui-react-native/theme-types");
|
|
36
36
|
Object.defineProperty(exports, "ThemeContext", { enumerable: true, get: function () { return theme_types_1.ThemeContext; } });
|
|
37
37
|
Object.defineProperty(exports, "useTheme", { enumerable: true, get: function () { return theme_types_1.useTheme; } });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AACA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AACA,wEAA8E;AAArE,8GAAA,YAAY,OAAA;AAAE,yGAAA,OAAO,OAAA;AAG9B,wEAAgF;AAAvE,4GAAA,UAAU,OAAA;AAAE,6GAAA,WAAW,OAAA;AAEhC,wDAcuC;AAbrC,+GAAA,qBAAqB,OAAA;AACrB,sGAAA,YAAY,OAAA;AACZ,sGAAA,YAAY,OAAA;AACZ,qGAAA,WAAW,OAAA;AACX,oGAAA,UAAU,OAAA;AACV,+GAAA,qBAAqB,OAAA;AACrB,6GAAA,mBAAmB,OAAA;AACnB,sGAAA,YAAY,OAAA;AACZ,sGAAA,YAAY,OAAA;AACZ,sGAAA,YAAY,OAAA;AACZ,sGAAA,YAAY,OAAA;AACZ,oGAAA,UAAU,OAAA;AACV,sGAAA,YAAY,OAAA;AAed,4DAAkG;AAAzF,sGAAA,UAAU,OAAA;AAAE,2GAAA,eAAe,OAAA;AAAE,mGAAA,OAAO,OAAA;AAAE,qGAAA,SAAS,OAAA;AAGxD,8DAAiE;AAAxD,0GAAA,aAAa,OAAA;AAGtB,wEAA6G;AAApG,gHAAA,cAAc,OAAA;AAAE,oHAAA,kBAAkB,OAAA;AAAE,kHAAA,gBAAgB,OAAA;AAU7D,kEAA4E;AAAnE,2GAAA,YAAY,OAAA;AAAE,uGAAA,QAAQ,OAAA;AAgC/B,qCAAoC;AAA3B,kGAAA,OAAO,OAAA;AAWhB,+CAA8C;AAArC,4GAAA,YAAY,OAAA;AACrB,mDAAkD;AAAzC,gHAAA,cAAc,OAAA;AAEvB,2CAA2D;AAAlD,wGAAA,UAAU,OAAA;AAAE,6GAAA,eAAe,OAAA;AAEpC,yCAA8G;AAArG,+GAAA,kBAAkB,OAAA;AAAE,6GAAA,gBAAgB,OAAA;AAAE,2GAAA,cAAc,OAAA;AAAE,yGAAA,YAAY,OAAA;AAAE,wGAAA,WAAW,OAAA"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.themeHelper = void 0;
|
|
4
|
-
|
|
4
|
+
const useFluentTheme_1 = require("./useFluentTheme");
|
|
5
5
|
exports.themeHelper = {
|
|
6
|
-
useTheme:
|
|
7
|
-
getComponentInfo:
|
|
8
|
-
|
|
6
|
+
useTheme: () => (0, useFluentTheme_1.useFluentTheme)(),
|
|
7
|
+
getComponentInfo: (theme, name) => {
|
|
8
|
+
const components = theme.components || {};
|
|
9
9
|
return components[name];
|
|
10
10
|
},
|
|
11
11
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"themeHelper.js","sourceRoot":"","sources":["../src/themeHelper.ts"],"names":[],"mappings":";;;AAGA,
|
|
1
|
+
{"version":3,"file":"themeHelper.js","sourceRoot":"","sources":["../src/themeHelper.ts"],"names":[],"mappings":";;;AAGA,qDAAkD;AAErC,QAAA,WAAW,GAAuB;IAC7C,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAA,+BAAc,GAAE;IAChC,gBAAgB,EAAE,CAAC,KAAY,EAAE,IAAY,EAAE,EAAE;QAC/C,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,IAAI,EAAE,CAAC;QAC1C,OAAO,UAAU,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;CACF,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useFluentTheme = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
const default_theme_1 = require("@fluentui-react-native/default-theme");
|
|
5
|
+
const theme_types_1 = require("@fluentui-react-native/theme-types");
|
|
6
6
|
/**
|
|
7
7
|
* Attempts to obtain a theme via the react context, failing that the default fluent theme will be returned. Used to ensure some theme
|
|
8
8
|
* object is provided for looking up color (and other) theme values
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFluentTheme.js","sourceRoot":"","sources":["../src/useFluentTheme.ts"],"names":[],"mappings":";;;AAAA,
|
|
1
|
+
{"version":3,"file":"useFluentTheme.js","sourceRoot":"","sources":["../src/useFluentTheme.ts"],"names":[],"mappings":";;;AAAA,wEAA0E;AAE1E,oEAA8D;AAE9D;;;;GAIG;AACH,SAAgB,cAAc;IAC5B,OAAO,IAAA,sBAAQ,GAAE,IAAI,kCAAkB,CAAC;AAC1C,CAAC;AAFD,wCAEC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.buildUseStyling = exports.buildProps = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
const use_styling_1 = require("@fluentui-react-native/use-styling");
|
|
5
|
+
const themeHelper_1 = require("./themeHelper");
|
|
6
6
|
function buildProps(fn, keys) {
|
|
7
7
|
return (0, use_styling_1.buildProps)(fn, keys);
|
|
8
8
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useStyling.js","sourceRoot":"","sources":["../src/useStyling.ts"],"names":[],"mappings":";;;AAaA,
|
|
1
|
+
{"version":3,"file":"useStyling.js","sourceRoot":"","sources":["../src/useStyling.ts"],"names":[],"mappings":";;;AAaA,oEAA0H;AAE1H,+CAA4C;AAI5C,SAAgB,UAAU,CACxB,EAA6C,EAC7C,IAAwB;IAExB,OAAO,IAAA,wBAAc,EAAyB,EAAE,EAAE,IAAI,CAAC,CAAC;AAC1D,CAAC;AALD,gCAKC;AAMD;;;;GAIG;AACH,SAAgB,eAAe,CAC7B,OAAuD;IAEvD,8DAA8D;IAC9D,OAAO,IAAA,6BAAmB,EAAC,OAAO,EAAE,yBAAW,CAAC,CAAC;AACnD,CAAC;AALD,0CAKC"}
|
|
@@ -1,20 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.buildUseTokens = exports.patchTokens = exports.customizable = exports.applyPropsToTokens = exports.applyTokenLayers = void 0;
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
var themeHelper_1 = require("./themeHelper");
|
|
4
|
+
const use_tokens_1 = require("@fluentui-react-native/use-tokens");
|
|
5
|
+
const themeHelper_1 = require("./themeHelper");
|
|
7
6
|
var use_tokens_2 = require("@fluentui-react-native/use-tokens");
|
|
8
7
|
Object.defineProperty(exports, "applyTokenLayers", { enumerable: true, get: function () { return use_tokens_2.applyTokenLayers; } });
|
|
9
8
|
Object.defineProperty(exports, "applyPropsToTokens", { enumerable: true, get: function () { return use_tokens_2.applyPropsToTokens; } });
|
|
10
9
|
Object.defineProperty(exports, "customizable", { enumerable: true, get: function () { return use_tokens_2.customizable; } });
|
|
11
10
|
Object.defineProperty(exports, "patchTokens", { enumerable: true, get: function () { return use_tokens_2.patchTokens; } });
|
|
12
|
-
function buildUseTokens() {
|
|
13
|
-
|
|
14
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
15
|
-
tokens[_i] = arguments[_i];
|
|
16
|
-
}
|
|
17
|
-
return use_tokens_1.buildUseTokens.apply(void 0, tslib_1.__spreadArray([themeHelper_1.themeHelper.getComponentInfo], tokens, false));
|
|
11
|
+
function buildUseTokens(...tokens) {
|
|
12
|
+
return (0, use_tokens_1.buildUseTokens)(themeHelper_1.themeHelper.getComponentInfo, ...tokens);
|
|
18
13
|
}
|
|
19
14
|
exports.buildUseTokens = buildUseTokens;
|
|
20
15
|
//# sourceMappingURL=useTokens.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTokens.js","sourceRoot":"","sources":["../src/useTokens.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useTokens.js","sourceRoot":"","sources":["../src/useTokens.ts"],"names":[],"mappings":";;;AAEA,kEAAyF;AAEzF,+CAA4C;AAG5C,gEAAoH;AAA3G,8GAAA,gBAAgB,OAAA;AAAE,gHAAA,kBAAkB,OAAA;AAAE,0GAAA,YAAY,OAAA;AAAE,yGAAA,WAAW,OAAA;AAMxE,SAAgB,cAAc,CAAU,GAAG,MAAgC;IACzE,OAAO,IAAA,2BAAkB,EAAC,yBAAW,CAAC,gBAAgB,EAAE,GAAG,MAAM,CAAC,CAAC;AACrE,CAAC;AAFD,wCAEC"}
|
package/package.json
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-react-native/framework",
|
|
3
|
-
"version": "0.14.
|
|
3
|
+
"version": "0.14.7",
|
|
4
4
|
"description": "Component framework used by fluentui react native controls",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
7
|
+
"react-native": "src/index.ts",
|
|
7
8
|
"typings": "lib/index.d.ts",
|
|
8
9
|
"exports": {
|
|
9
10
|
".": {
|
|
@@ -31,17 +32,15 @@
|
|
|
31
32
|
"directory": "packages/framework/framework"
|
|
32
33
|
},
|
|
33
34
|
"dependencies": {
|
|
34
|
-
"@fluentui-react-native/composition": "0.11.
|
|
35
|
-
"@fluentui-react-native/default-theme": "0.26.
|
|
36
|
-
"@fluentui-react-native/
|
|
37
|
-
"@fluentui-react-native/
|
|
38
|
-
"@fluentui-react-native/
|
|
39
|
-
"@fluentui-react-native/
|
|
40
|
-
"@fluentui-react-native/
|
|
41
|
-
"@fluentui-react-native/use-
|
|
42
|
-
"@fluentui-react-native/use-
|
|
43
|
-
"@fluentui-react-native/use-styling": "0.13.5",
|
|
44
|
-
"@fluentui-react-native/use-tokens": "0.6.5",
|
|
35
|
+
"@fluentui-react-native/composition": "0.11.7",
|
|
36
|
+
"@fluentui-react-native/default-theme": "0.26.7",
|
|
37
|
+
"@fluentui-react-native/framework-base": "0.1.1",
|
|
38
|
+
"@fluentui-react-native/theme-types": "0.39.5",
|
|
39
|
+
"@fluentui-react-native/tokens": "0.23.5",
|
|
40
|
+
"@fluentui-react-native/use-slot": "0.6.7",
|
|
41
|
+
"@fluentui-react-native/use-slots": "0.10.7",
|
|
42
|
+
"@fluentui-react-native/use-styling": "0.13.7",
|
|
43
|
+
"@fluentui-react-native/use-tokens": "0.6.7",
|
|
45
44
|
"tslib": "^2.3.1"
|
|
46
45
|
},
|
|
47
46
|
"devDependencies": {
|
package/src/compose.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { ComposeFactoryOptions, ComposeFactoryComponent, UseStyledSlots } from '@fluentui-react-native/composition';
|
|
2
2
|
import { composeFactory } from '@fluentui-react-native/composition';
|
|
3
3
|
import type { Theme } from '@fluentui-react-native/theme-types';
|
|
4
|
+
import type { ObjectBase } from '@fluentui-react-native/framework-base';
|
|
4
5
|
|
|
5
6
|
import { themeHelper } from './themeHelper';
|
|
6
7
|
|
|
@@ -8,8 +9,7 @@ import { themeHelper } from './themeHelper';
|
|
|
8
9
|
* This is an object used purely for configuring the typings on composable. It is not necessary to define
|
|
9
10
|
* the type via the IComposableType interface, this is simply the format used to extract the type info.
|
|
10
11
|
*/
|
|
11
|
-
|
|
12
|
-
export interface ComposeType<TProps, TSlotProps, TTokens, TStatics = object> {
|
|
12
|
+
export interface ComposeType<TProps, TSlotProps, TTokens, TStatics = ObjectBase> {
|
|
13
13
|
props: TProps;
|
|
14
14
|
slotProps: TSlotProps;
|
|
15
15
|
tokens: TTokens;
|
|
@@ -21,21 +21,17 @@ type PropsFragment<TProps> = { props: TProps };
|
|
|
21
21
|
type SlotPropsFragment<TSlotProps> = { slotProps: TSlotProps };
|
|
22
22
|
type TokensFragment<TTokens> = { tokens: TTokens };
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
type StaticsFragment<TStatics extends object> = { statics: TStatics };
|
|
24
|
+
type StaticsFragment<TStatics extends ObjectBase> = { statics: TStatics };
|
|
26
25
|
|
|
27
26
|
/** Extraction types that get the various interface types from IComposableType */
|
|
28
27
|
export type ExtractProps<T> = T extends PropsFragment<infer U> ? U : never;
|
|
29
28
|
export type ExtractSlotProps<T> = T extends SlotPropsFragment<infer U> ? U : never;
|
|
30
29
|
|
|
31
|
-
|
|
32
|
-
export type ExtractTokens<T> = T extends TokensFragment<infer U> ? U : object;
|
|
30
|
+
export type ExtractTokens<T> = T extends TokensFragment<infer U> ? U : ObjectBase;
|
|
33
31
|
|
|
34
|
-
|
|
35
|
-
export type ExtractStatics<T> = T extends StaticsFragment<infer U> ? U : object;
|
|
32
|
+
export type ExtractStatics<T> = T extends StaticsFragment<infer U> ? U : ObjectBase;
|
|
36
33
|
|
|
37
|
-
|
|
38
|
-
export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends object> = ComposeFactoryOptions<
|
|
34
|
+
export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends ObjectBase> = ComposeFactoryOptions<
|
|
39
35
|
TProps,
|
|
40
36
|
TSlotProps,
|
|
41
37
|
TTokens,
|
|
@@ -43,8 +39,7 @@ export type ComposeOptions<TProps, TSlotProps, TTokens, TStatics extends object>
|
|
|
43
39
|
TStatics
|
|
44
40
|
>;
|
|
45
41
|
|
|
46
|
-
|
|
47
|
-
export type ComposableComponent<TProps, TSlotProps, TTokens, TStatics extends object> = ComposeFactoryComponent<
|
|
42
|
+
export type ComposableComponent<TProps, TSlotProps, TTokens, TStatics extends ObjectBase> = ComposeFactoryComponent<
|
|
48
43
|
TProps,
|
|
49
44
|
TSlotProps,
|
|
50
45
|
TTokens,
|
|
@@ -4,7 +4,7 @@ import * as React from 'react';
|
|
|
4
4
|
import type { TextProps, TextStyle } from 'react-native';
|
|
5
5
|
import { Text, View } from 'react-native';
|
|
6
6
|
|
|
7
|
-
import { mergeStyles } from '@fluentui-react-native/
|
|
7
|
+
import { mergeStyles } from '@fluentui-react-native/framework-base';
|
|
8
8
|
import type { Theme } from '@fluentui-react-native/theme-types';
|
|
9
9
|
import { useSlot, withSlots } from '@fluentui-react-native/use-slot';
|
|
10
10
|
import { applyTokenLayers } from '@fluentui-react-native/use-tokens';
|
package/src/index.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export type { GetMemoValue } from '@fluentui-react-native/
|
|
2
|
-
export { getMemoCache, memoize } from '@fluentui-react-native/
|
|
1
|
+
export type { GetMemoValue } from '@fluentui-react-native/framework-base';
|
|
2
|
+
export { getMemoCache, memoize } from '@fluentui-react-native/framework-base';
|
|
3
3
|
|
|
4
|
-
export type { StyleProp } from '@fluentui-react-native/
|
|
5
|
-
export { mergeProps, mergeStyles } from '@fluentui-react-native/
|
|
4
|
+
export type { StyleProp } from '@fluentui-react-native/framework-base';
|
|
5
|
+
export { mergeProps, mergeStyles } from '@fluentui-react-native/framework-base';
|
|
6
6
|
|
|
7
7
|
export {
|
|
8
8
|
backgroundColorTokens,
|
|
@@ -38,14 +38,15 @@ export type { ComposableFunction, FinalRender, NativeReactType, SlotFn, StagedRe
|
|
|
38
38
|
export { buildUseSlots } from '@fluentui-react-native/use-slots';
|
|
39
39
|
export type { GetSlotProps, Slots, UseSlotOptions, UseSlotsBase } from '@fluentui-react-native/use-slots';
|
|
40
40
|
|
|
41
|
-
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/
|
|
41
|
+
export { immutableMerge, immutableMergeCore, processImmutable } from '@fluentui-react-native/framework-base';
|
|
42
42
|
export type {
|
|
43
43
|
BuiltinRecursionHandlers,
|
|
44
44
|
CustomRecursionHandler,
|
|
45
45
|
MergeOptions,
|
|
46
|
+
ObjectBase,
|
|
46
47
|
RecursionHandler,
|
|
47
48
|
RecursionOption,
|
|
48
|
-
} from '@fluentui-react-native/
|
|
49
|
+
} from '@fluentui-react-native/framework-base';
|
|
49
50
|
|
|
50
51
|
export { ThemeContext, useTheme } from '@fluentui-react-native/theme-types';
|
|
51
52
|
export type {
|
package/just.config.js
DELETED