@fluentui-react-native/theme-types 0.14.1 → 0.15.0
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 +46 -1
- package/CHANGELOG.md +26 -2
- package/lib/Shadow.types.d.ts +49 -0
- package/lib/Shadow.types.d.ts.map +1 -0
- package/lib/Shadow.types.js +2 -0
- package/lib/Shadow.types.js.map +1 -0
- package/lib/Theme.types.d.ts +5 -2
- package/lib/Theme.types.d.ts.map +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Shadow.types.d.ts +49 -0
- package/lib-commonjs/Shadow.types.d.ts.map +1 -0
- package/lib-commonjs/Shadow.types.js +3 -0
- package/lib-commonjs/Shadow.types.js.map +1 -0
- package/lib-commonjs/Theme.types.d.ts +5 -2
- package/lib-commonjs/Theme.types.d.ts.map +1 -1
- package/lib-commonjs/index.d.ts +1 -0
- package/lib-commonjs/index.d.ts.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +1 -1
- package/src/Shadow.types.ts +51 -0
- package/src/Theme.types.ts +5 -2
- package/src/index.ts +1 -0
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,52 @@
|
|
|
2
2
|
"name": "@fluentui-react-native/theme-types",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Sat, 21 May 2022 01:46:24 GMT",
|
|
6
|
+
"tag": "@fluentui-react-native/theme-types_v0.15.0",
|
|
7
|
+
"version": "0.15.0",
|
|
8
|
+
"comments": {
|
|
9
|
+
"minor": [
|
|
10
|
+
{
|
|
11
|
+
"author": "ruaraki@microsoft.com",
|
|
12
|
+
"package": "@fluentui-react-native/theme-types",
|
|
13
|
+
"commit": "3fdd5fccdcd5e76c90bac7ad2fa436917b1c84e0",
|
|
14
|
+
"comment": "Add shadows to the theme"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Thu, 28 Apr 2022 19:09:51 GMT",
|
|
21
|
+
"tag": "@fluentui-react-native/theme-types_v0.14.3",
|
|
22
|
+
"version": "0.14.3",
|
|
23
|
+
"comments": {
|
|
24
|
+
"patch": [
|
|
25
|
+
{
|
|
26
|
+
"author": "sanajmi@microsoft.com",
|
|
27
|
+
"package": "@fluentui-react-native/theme-types",
|
|
28
|
+
"commit": "8cff404ca31eaa61017551a1d73fd3fdae7da132",
|
|
29
|
+
"comment": "Revert \"Add Text props and test new Variant types (#1615)\""
|
|
30
|
+
}
|
|
31
|
+
]
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"date": "Wed, 27 Apr 2022 19:30:38 GMT",
|
|
36
|
+
"tag": "@fluentui-react-native/theme-types_v0.14.2",
|
|
37
|
+
"version": "0.14.2",
|
|
38
|
+
"comments": {
|
|
39
|
+
"patch": [
|
|
40
|
+
{
|
|
41
|
+
"author": "email not defined",
|
|
42
|
+
"package": "@fluentui-react-native/theme-types",
|
|
43
|
+
"commit": "f3481f50e20c6ab33f7f3ffca63e9f1e424fe2c1",
|
|
44
|
+
"comment": "initial Text implementation"
|
|
45
|
+
}
|
|
46
|
+
]
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"date": "Thu, 31 Mar 2022 07:27:48 GMT",
|
|
6
51
|
"tag": "@fluentui-react-native/theme-types_v0.14.1",
|
|
7
52
|
"version": "0.14.1",
|
|
8
53
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,36 @@
|
|
|
1
1
|
# Change Log - @fluentui-react-native/theme-types
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Sat, 21 May 2022 01:46:24 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## 0.15.0
|
|
8
|
+
|
|
9
|
+
Sat, 21 May 2022 01:46:24 GMT
|
|
10
|
+
|
|
11
|
+
### Minor changes
|
|
12
|
+
|
|
13
|
+
- Add shadows to the theme (ruaraki@microsoft.com)
|
|
14
|
+
|
|
15
|
+
## 0.14.3
|
|
16
|
+
|
|
17
|
+
Thu, 28 Apr 2022 19:09:51 GMT
|
|
18
|
+
|
|
19
|
+
### Patches
|
|
20
|
+
|
|
21
|
+
- Revert "Add Text props and test new Variant types (#1615)" (sanajmi@microsoft.com)
|
|
22
|
+
|
|
23
|
+
## 0.14.2
|
|
24
|
+
|
|
25
|
+
Wed, 27 Apr 2022 19:30:38 GMT
|
|
26
|
+
|
|
27
|
+
### Patches
|
|
28
|
+
|
|
29
|
+
- initial Text implementation (email not defined)
|
|
30
|
+
|
|
7
31
|
## 0.14.1
|
|
8
32
|
|
|
9
|
-
Thu, 31 Mar 2022 07:
|
|
33
|
+
Thu, 31 Mar 2022 07:27:48 GMT
|
|
10
34
|
|
|
11
35
|
### Patches
|
|
12
36
|
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { ColorValue } from 'react-native';
|
|
2
|
+
/**
|
|
3
|
+
* Base structure of a shadow style, which has x and y offset, blur amount, and color specified
|
|
4
|
+
*/
|
|
5
|
+
export interface ShadowValue {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
blur: number;
|
|
9
|
+
color: ColorValue;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* In FluentUI a shadow is specified as having two parts - an ambient shadow and a key shadow.
|
|
13
|
+
* The ambient shadow is shading around the entire control
|
|
14
|
+
* The key shadow is the offset shadow which gives the control a sense of elevation or distance from the page
|
|
15
|
+
*/
|
|
16
|
+
export interface ShadowToken {
|
|
17
|
+
ambient: ShadowValue;
|
|
18
|
+
key: ShadowValue;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Shadows alias tokens as defined by FluentUI v2 design system
|
|
22
|
+
*/
|
|
23
|
+
export interface BaseShadowAliasTokens {
|
|
24
|
+
shadow2: ShadowToken;
|
|
25
|
+
shadow4: ShadowToken;
|
|
26
|
+
shadow8: ShadowToken;
|
|
27
|
+
shadow16: ShadowToken;
|
|
28
|
+
shadow28: ShadowToken;
|
|
29
|
+
shadow64: ShadowToken;
|
|
30
|
+
shadow2brand: ShadowToken;
|
|
31
|
+
shadow4brand: ShadowToken;
|
|
32
|
+
shadow8brand: ShadowToken;
|
|
33
|
+
shadow16brand: ShadowToken;
|
|
34
|
+
shadow28brand: ShadowToken;
|
|
35
|
+
shadow64brand: ShadowToken;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Shadows on the theme object. This allows for flexibility on entries but retains base alias tokens
|
|
39
|
+
*/
|
|
40
|
+
export declare type ThemeShadowDefinition = BaseShadowAliasTokens & {
|
|
41
|
+
[key: string]: ShadowToken;
|
|
42
|
+
};
|
|
43
|
+
/**
|
|
44
|
+
* A partially specified shadow definition.
|
|
45
|
+
*/
|
|
46
|
+
export declare type PartialShadowDefinition = {
|
|
47
|
+
[P in keyof ThemeShadowDefinition]?: Partial<ThemeShadowDefinition[P]>;
|
|
48
|
+
};
|
|
49
|
+
//# sourceMappingURL=Shadow.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Shadow.types.d.ts","sourceRoot":"","sources":["../src/Shadow.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,CAAC;CACnB;AAED;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,WAAW,CAAC;IACrB,GAAG,EAAE,WAAW,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,YAAY,EAAE,WAAW,CAAC;IAC1B,YAAY,EAAE,WAAW,CAAC;IAC1B,YAAY,EAAE,WAAW,CAAC;IAC1B,aAAa,EAAE,WAAW,CAAC;IAC3B,aAAa,EAAE,WAAW,CAAC;IAC3B,aAAa,EAAE,WAAW,CAAC;CAC5B;AAED;;GAEG;AACH,oBAAY,qBAAqB,GAAG,qBAAqB,GAAG;IAC1D,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,CAAC;CAC5B,CAAC;AAEF;;GAEG;AACH,oBAAY,uBAAuB,GAAG;KAAG,CAAC,IAAI,MAAM,qBAAqB,CAAC,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Shadow.types.js","sourceRoot":"","sources":["../src/Shadow.types.ts"],"names":[],"mappings":""}
|
package/lib/Theme.types.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { ThemeColorDefinition } from './Color.types';
|
|
|
2
2
|
import { OfficePalette } from './palette.types';
|
|
3
3
|
import { Typography, PartialTypography } from './Typography.types';
|
|
4
4
|
import { ColorValue } from 'react-native';
|
|
5
|
+
import { PartialShadowDefinition, ThemeShadowDefinition } from './Shadow.types';
|
|
5
6
|
declare type TwoLevelPartial<T> = {
|
|
6
7
|
[K in keyof T]?: Partial<T[K]>;
|
|
7
8
|
};
|
|
@@ -22,6 +23,7 @@ export interface Theme {
|
|
|
22
23
|
components: {
|
|
23
24
|
[key: string]: object;
|
|
24
25
|
};
|
|
26
|
+
shadows: ThemeShadowDefinition;
|
|
25
27
|
spacing: Spacing;
|
|
26
28
|
host: {
|
|
27
29
|
appearance: AppearanceOptions | 'dynamic';
|
|
@@ -32,10 +34,11 @@ export interface Theme {
|
|
|
32
34
|
};
|
|
33
35
|
}
|
|
34
36
|
/**
|
|
35
|
-
* Generally a partial theme is comprised of partial versions of the objects within the theme, with the exception of typography
|
|
37
|
+
* Generally a partial theme is comprised of partial versions of the objects within the theme, with the exception of shadow and typography
|
|
36
38
|
* which has additional levels of hierarchy
|
|
37
39
|
*/
|
|
38
|
-
export declare type PartialTheme = Omit<TwoLevelPartial<Theme>, 'typography' | 'host'> & {
|
|
40
|
+
export declare type PartialTheme = Omit<TwoLevelPartial<Theme>, 'shadows' | 'typography' | 'host'> & {
|
|
41
|
+
shadows?: PartialShadowDefinition;
|
|
39
42
|
typography?: PartialTypography;
|
|
40
43
|
host?: TwoLevelPartial<Theme['host']>;
|
|
41
44
|
};
|
package/lib/Theme.types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Theme.types.d.ts","sourceRoot":"","sources":["../src/Theme.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Theme.types.d.ts","sourceRoot":"","sources":["../src/Theme.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAEhF,aAAK,eAAe,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AAE7D,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,EAAE,MAAM,CAAC;IACV,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;CACZ;AAED;;GAEG;AACH,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,oBAAoB,CAAC;IAC7B,UAAU,EAAE,UAAU,CAAC;IACvB,UAAU,EAAE;QACV,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,OAAO,EAAE,qBAAqB,CAAC;IAC/B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE;QAGJ,UAAU,EAAE,iBAAiB,GAAG,SAAS,CAAC;QAG1C,OAAO,CAAC,EAAE,aAAa,CAAC;QACxB,MAAM,CAAC,EAAE;YAAE,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAA;SAAE,CAAC;KACxC,CAAC;CACH;AAED;;;GAGG;AACH,oBAAY,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,MAAM,CAAC,GAAG;IAC3F,OAAO,CAAC,EAAE,uBAAuB,CAAC;IAClC,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,IAAI,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;CACvC,CAAC;AAEF,oBAAY,iBAAiB,GAAG,OAAO,GAAG,MAAM,GAAG,cAAc,CAAC;AAElE,MAAM,WAAW,YAAY;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,iBAAiB,GAAG,SAAS,CAAC;IAE3C;;OAEG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IAEtC;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB"}
|
package/lib/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export type { AliasColorTokens, Color, ControlColorTokens, FabricWebPalette, Palette, PaletteBackgroundColors, PaletteTextColors, PartialPalette, ThemeColorDefinition, } from './Color.types';
|
|
2
|
+
export type { ShadowValue, ShadowToken, BaseShadowAliasTokens, ThemeShadowDefinition, PartialShadowDefinition } from './Shadow.types';
|
|
2
3
|
export type { AppearanceOptions, PartialTheme, Spacing, Theme, ThemeOptions } from './Theme.types';
|
|
3
4
|
export type { FontFamilies, FontFamily, FontFamilyValue, FontSize, FontSizeValuePoints, FontSizes, FontWeight, FontWeightValue, FontWeights, PartialTypography, TextStyling, Typography, Variant, VariantValue, Variants, } from './Typography.types';
|
|
4
5
|
export { ThemeContext, useTheme } from './context';
|
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,EACV,gBAAgB,EAChB,KAAK,EACL,kBAAkB,EAClB,gBAAgB,EAChB,OAAO,EACP,uBAAuB,EACvB,iBAAiB,EACjB,cAAc,EACd,oBAAoB,GACrB,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACnG,YAAY,EACV,YAAY,EACZ,UAAU,EACV,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACnD,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,gBAAgB,EAChB,KAAK,EACL,kBAAkB,EAClB,gBAAgB,EAChB,OAAO,EACP,uBAAuB,EACvB,iBAAiB,EACjB,cAAc,EACd,oBAAoB,GACrB,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AACtI,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACnG,YAAY,EACV,YAAY,EACZ,UAAU,EACV,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACnD,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
|
package/lib/index.js.map
CHANGED
|
@@ -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":"AA8BA,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { ColorValue } from 'react-native';
|
|
2
|
+
/**
|
|
3
|
+
* Base structure of a shadow style, which has x and y offset, blur amount, and color specified
|
|
4
|
+
*/
|
|
5
|
+
export interface ShadowValue {
|
|
6
|
+
x: number;
|
|
7
|
+
y: number;
|
|
8
|
+
blur: number;
|
|
9
|
+
color: ColorValue;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* In FluentUI a shadow is specified as having two parts - an ambient shadow and a key shadow.
|
|
13
|
+
* The ambient shadow is shading around the entire control
|
|
14
|
+
* The key shadow is the offset shadow which gives the control a sense of elevation or distance from the page
|
|
15
|
+
*/
|
|
16
|
+
export interface ShadowToken {
|
|
17
|
+
ambient: ShadowValue;
|
|
18
|
+
key: ShadowValue;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Shadows alias tokens as defined by FluentUI v2 design system
|
|
22
|
+
*/
|
|
23
|
+
export interface BaseShadowAliasTokens {
|
|
24
|
+
shadow2: ShadowToken;
|
|
25
|
+
shadow4: ShadowToken;
|
|
26
|
+
shadow8: ShadowToken;
|
|
27
|
+
shadow16: ShadowToken;
|
|
28
|
+
shadow28: ShadowToken;
|
|
29
|
+
shadow64: ShadowToken;
|
|
30
|
+
shadow2brand: ShadowToken;
|
|
31
|
+
shadow4brand: ShadowToken;
|
|
32
|
+
shadow8brand: ShadowToken;
|
|
33
|
+
shadow16brand: ShadowToken;
|
|
34
|
+
shadow28brand: ShadowToken;
|
|
35
|
+
shadow64brand: ShadowToken;
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Shadows on the theme object. This allows for flexibility on entries but retains base alias tokens
|
|
39
|
+
*/
|
|
40
|
+
export declare type ThemeShadowDefinition = BaseShadowAliasTokens & {
|
|
41
|
+
[key: string]: ShadowToken;
|
|
42
|
+
};
|
|
43
|
+
/**
|
|
44
|
+
* A partially specified shadow definition.
|
|
45
|
+
*/
|
|
46
|
+
export declare type PartialShadowDefinition = {
|
|
47
|
+
[P in keyof ThemeShadowDefinition]?: Partial<ThemeShadowDefinition[P]>;
|
|
48
|
+
};
|
|
49
|
+
//# sourceMappingURL=Shadow.types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Shadow.types.d.ts","sourceRoot":"","sources":["../src/Shadow.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,UAAU,CAAC;CACnB;AAED;;;;GAIG;AACH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,WAAW,CAAC;IACrB,GAAG,EAAE,WAAW,CAAC;CAClB;AAED;;GAEG;AACH,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,EAAE,WAAW,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,YAAY,EAAE,WAAW,CAAC;IAC1B,YAAY,EAAE,WAAW,CAAC;IAC1B,YAAY,EAAE,WAAW,CAAC;IAC1B,aAAa,EAAE,WAAW,CAAC;IAC3B,aAAa,EAAE,WAAW,CAAC;IAC3B,aAAa,EAAE,WAAW,CAAC;CAC5B;AAED;;GAEG;AACH,oBAAY,qBAAqB,GAAG,qBAAqB,GAAG;IAC1D,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,CAAC;CAC5B,CAAC;AAEF;;GAEG;AACH,oBAAY,uBAAuB,GAAG;KAAG,CAAC,IAAI,MAAM,qBAAqB,CAAC,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Shadow.types.js","sourceRoot":"","sources":["../src/Shadow.types.ts"],"names":[],"mappings":""}
|
|
@@ -2,6 +2,7 @@ import { ThemeColorDefinition } from './Color.types';
|
|
|
2
2
|
import { OfficePalette } from './palette.types';
|
|
3
3
|
import { Typography, PartialTypography } from './Typography.types';
|
|
4
4
|
import { ColorValue } from 'react-native';
|
|
5
|
+
import { PartialShadowDefinition, ThemeShadowDefinition } from './Shadow.types';
|
|
5
6
|
declare type TwoLevelPartial<T> = {
|
|
6
7
|
[K in keyof T]?: Partial<T[K]>;
|
|
7
8
|
};
|
|
@@ -22,6 +23,7 @@ export interface Theme {
|
|
|
22
23
|
components: {
|
|
23
24
|
[key: string]: object;
|
|
24
25
|
};
|
|
26
|
+
shadows: ThemeShadowDefinition;
|
|
25
27
|
spacing: Spacing;
|
|
26
28
|
host: {
|
|
27
29
|
appearance: AppearanceOptions | 'dynamic';
|
|
@@ -32,10 +34,11 @@ export interface Theme {
|
|
|
32
34
|
};
|
|
33
35
|
}
|
|
34
36
|
/**
|
|
35
|
-
* Generally a partial theme is comprised of partial versions of the objects within the theme, with the exception of typography
|
|
37
|
+
* Generally a partial theme is comprised of partial versions of the objects within the theme, with the exception of shadow and typography
|
|
36
38
|
* which has additional levels of hierarchy
|
|
37
39
|
*/
|
|
38
|
-
export declare type PartialTheme = Omit<TwoLevelPartial<Theme>, 'typography' | 'host'> & {
|
|
40
|
+
export declare type PartialTheme = Omit<TwoLevelPartial<Theme>, 'shadows' | 'typography' | 'host'> & {
|
|
41
|
+
shadows?: PartialShadowDefinition;
|
|
39
42
|
typography?: PartialTypography;
|
|
40
43
|
host?: TwoLevelPartial<Theme['host']>;
|
|
41
44
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Theme.types.d.ts","sourceRoot":"","sources":["../src/Theme.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Theme.types.d.ts","sourceRoot":"","sources":["../src/Theme.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAC;AAEhF,aAAK,eAAe,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AAE7D,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,CAAC,EAAE,MAAM,CAAC;IACV,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;CACZ;AAED;;GAEG;AACH,MAAM,WAAW,KAAK;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,oBAAoB,CAAC;IAC7B,UAAU,EAAE,UAAU,CAAC;IACvB,UAAU,EAAE;QACV,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;KACvB,CAAC;IACF,OAAO,EAAE,qBAAqB,CAAC;IAC/B,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE;QAGJ,UAAU,EAAE,iBAAiB,GAAG,SAAS,CAAC;QAG1C,OAAO,CAAC,EAAE,aAAa,CAAC;QACxB,MAAM,CAAC,EAAE;YAAE,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAA;SAAE,CAAC;KACxC,CAAC;CACH;AAED;;;GAGG;AACH,oBAAY,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,MAAM,CAAC,GAAG;IAC3F,OAAO,CAAC,EAAE,uBAAuB,CAAC;IAClC,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,IAAI,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;CACvC,CAAC;AAEF,oBAAY,iBAAiB,GAAG,OAAO,GAAG,MAAM,GAAG,cAAc,CAAC;AAElE,MAAM,WAAW,YAAY;IAC3B;;OAEG;IACH,UAAU,CAAC,EAAE,iBAAiB,GAAG,SAAS,CAAC;IAE3C;;OAEG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IAEtC;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB"}
|
package/lib-commonjs/index.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export type { AliasColorTokens, Color, ControlColorTokens, FabricWebPalette, Palette, PaletteBackgroundColors, PaletteTextColors, PartialPalette, ThemeColorDefinition, } from './Color.types';
|
|
2
|
+
export type { ShadowValue, ShadowToken, BaseShadowAliasTokens, ThemeShadowDefinition, PartialShadowDefinition } from './Shadow.types';
|
|
2
3
|
export type { AppearanceOptions, PartialTheme, Spacing, Theme, ThemeOptions } from './Theme.types';
|
|
3
4
|
export type { FontFamilies, FontFamily, FontFamilyValue, FontSize, FontSizeValuePoints, FontSizes, FontWeight, FontWeightValue, FontWeights, PartialTypography, TextStyling, Typography, Variant, VariantValue, Variants, } from './Typography.types';
|
|
4
5
|
export { ThemeContext, useTheme } from './context';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,gBAAgB,EAChB,KAAK,EACL,kBAAkB,EAClB,gBAAgB,EAChB,OAAO,EACP,uBAAuB,EACvB,iBAAiB,EACjB,cAAc,EACd,oBAAoB,GACrB,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACnG,YAAY,EACV,YAAY,EACZ,UAAU,EACV,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACnD,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,gBAAgB,EAChB,KAAK,EACL,kBAAkB,EAClB,gBAAgB,EAChB,OAAO,EACP,uBAAuB,EACvB,iBAAiB,EACjB,cAAc,EACd,oBAAoB,GACrB,MAAM,eAAe,CAAC;AACvB,YAAY,EAAE,WAAW,EAAE,WAAW,EAAE,qBAAqB,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAC;AACtI,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AACnG,YAAY,EACV,YAAY,EACZ,UAAU,EACV,eAAe,EACf,QAAQ,EACR,mBAAmB,EACnB,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,GACT,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AACnD,YAAY,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}
|
|
@@ -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":";;;AA8BA,qCAAmD;AAA1C,uGAAA,YAAY,OAAA;AAAE,mGAAA,QAAQ,OAAA"}
|
package/package.json
CHANGED
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { ColorValue } from 'react-native';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Base structure of a shadow style, which has x and y offset, blur amount, and color specified
|
|
5
|
+
*/
|
|
6
|
+
export interface ShadowValue {
|
|
7
|
+
x: number;
|
|
8
|
+
y: number;
|
|
9
|
+
blur: number;
|
|
10
|
+
color: ColorValue;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* In FluentUI a shadow is specified as having two parts - an ambient shadow and a key shadow.
|
|
15
|
+
* The ambient shadow is shading around the entire control
|
|
16
|
+
* The key shadow is the offset shadow which gives the control a sense of elevation or distance from the page
|
|
17
|
+
*/
|
|
18
|
+
export interface ShadowToken {
|
|
19
|
+
ambient: ShadowValue;
|
|
20
|
+
key: ShadowValue;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* Shadows alias tokens as defined by FluentUI v2 design system
|
|
25
|
+
*/
|
|
26
|
+
export interface BaseShadowAliasTokens {
|
|
27
|
+
shadow2: ShadowToken;
|
|
28
|
+
shadow4: ShadowToken;
|
|
29
|
+
shadow8: ShadowToken;
|
|
30
|
+
shadow16: ShadowToken;
|
|
31
|
+
shadow28: ShadowToken;
|
|
32
|
+
shadow64: ShadowToken;
|
|
33
|
+
shadow2brand: ShadowToken;
|
|
34
|
+
shadow4brand: ShadowToken;
|
|
35
|
+
shadow8brand: ShadowToken;
|
|
36
|
+
shadow16brand: ShadowToken;
|
|
37
|
+
shadow28brand: ShadowToken;
|
|
38
|
+
shadow64brand: ShadowToken;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
/**
|
|
42
|
+
* Shadows on the theme object. This allows for flexibility on entries but retains base alias tokens
|
|
43
|
+
*/
|
|
44
|
+
export type ThemeShadowDefinition = BaseShadowAliasTokens & {
|
|
45
|
+
[key: string]: ShadowToken;
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
/**
|
|
49
|
+
* A partially specified shadow definition.
|
|
50
|
+
*/
|
|
51
|
+
export type PartialShadowDefinition = { [P in keyof ThemeShadowDefinition]?: Partial<ThemeShadowDefinition[P]> };
|
package/src/Theme.types.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { ThemeColorDefinition } from './Color.types';
|
|
|
2
2
|
import { OfficePalette } from './palette.types';
|
|
3
3
|
import { Typography, PartialTypography } from './Typography.types';
|
|
4
4
|
import { ColorValue } from 'react-native';
|
|
5
|
+
import { PartialShadowDefinition, ThemeShadowDefinition } from './Shadow.types';
|
|
5
6
|
|
|
6
7
|
type TwoLevelPartial<T> = { [K in keyof T]?: Partial<T[K]> };
|
|
7
8
|
|
|
@@ -23,6 +24,7 @@ export interface Theme {
|
|
|
23
24
|
components: {
|
|
24
25
|
[key: string]: object; // eslint-disable-line @typescript-eslint/ban-types
|
|
25
26
|
};
|
|
27
|
+
shadows: ThemeShadowDefinition;
|
|
26
28
|
spacing: Spacing;
|
|
27
29
|
host: {
|
|
28
30
|
// appearance of the theme, this corresponds to the react-native Appearance library values, though can be overwritten
|
|
@@ -36,10 +38,11 @@ export interface Theme {
|
|
|
36
38
|
}
|
|
37
39
|
|
|
38
40
|
/**
|
|
39
|
-
* Generally a partial theme is comprised of partial versions of the objects within the theme, with the exception of typography
|
|
41
|
+
* Generally a partial theme is comprised of partial versions of the objects within the theme, with the exception of shadow and typography
|
|
40
42
|
* which has additional levels of hierarchy
|
|
41
43
|
*/
|
|
42
|
-
export type PartialTheme = Omit<TwoLevelPartial<Theme>, 'typography' | 'host'> & {
|
|
44
|
+
export type PartialTheme = Omit<TwoLevelPartial<Theme>, 'shadows' | 'typography' | 'host'> & {
|
|
45
|
+
shadows?: PartialShadowDefinition;
|
|
43
46
|
typography?: PartialTypography;
|
|
44
47
|
host?: TwoLevelPartial<Theme['host']>;
|
|
45
48
|
};
|
package/src/index.ts
CHANGED
|
@@ -9,6 +9,7 @@ export type {
|
|
|
9
9
|
PartialPalette,
|
|
10
10
|
ThemeColorDefinition,
|
|
11
11
|
} from './Color.types';
|
|
12
|
+
export type { ShadowValue, ShadowToken, BaseShadowAliasTokens, ThemeShadowDefinition, PartialShadowDefinition } from './Shadow.types';
|
|
12
13
|
export type { AppearanceOptions, PartialTheme, Spacing, Theme, ThemeOptions } from './Theme.types';
|
|
13
14
|
export type {
|
|
14
15
|
FontFamilies,
|