@atlaskit/radio 5.3.3 → 5.3.4

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.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/radio
2
2
 
3
+ ## 5.3.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [`f460cc7c411`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f460cc7c411) - Builds for this package now pass through a tokens babel plugin, removing runtime invocations of the tokens() function and improving bundle size.
8
+ - Updated dependencies
9
+
3
10
  ## 5.3.3
4
11
 
5
12
  ### Patch Changes
package/dist/cjs/Radio.js CHANGED
@@ -23,13 +23,11 @@ var _components = _interopRequireDefault(require("@atlaskit/theme/components"));
23
23
 
24
24
  var _constants = require("@atlaskit/theme/constants");
25
25
 
26
- var _tokens = require("@atlaskit/tokens");
27
-
28
26
  var _styles = _interopRequireDefault(require("./styles"));
29
27
 
30
28
  /** @jsx jsx */
31
29
  var packageName = "@atlaskit/radio";
32
- var packageVersion = "5.3.3";
30
+ var packageVersion = "5.3.4";
33
31
  var fontFamily = (0, _constants.fontFamily)();
34
32
 
35
33
  var noop = function noop() {};
@@ -45,15 +43,15 @@ var labelStyles = (0, _core.css)({
45
43
  fontFamily: fontFamily,
46
44
  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
47
45
  '&[data-disabled]': {
48
- color: (0, _tokens.token)('color.text.disabled', _colors.N80),
46
+ color: "var(--ds-text-disabled, ".concat(_colors.N80, ")"),
49
47
  cursor: 'not-allowed'
50
48
  }
51
49
  });
52
50
  var lightLabelStyles = (0, _core.css)({
53
- color: (0, _tokens.token)('color.text.highEmphasis', _colors.N900)
51
+ color: "var(--ds-text-highEmphasis, ".concat(_colors.N900, ")")
54
52
  });
55
53
  var darkLabelStyles = (0, _core.css)({
56
- color: (0, _tokens.token)('color.text.highEmphasis', _colors.DN600)
54
+ color: "var(--ds-text-highEmphasis, ".concat(_colors.DN600, ")")
57
55
  });
58
56
  var radioStyles = (0, _core.css)({
59
57
  display: 'flex',
@@ -7,40 +7,38 @@ exports.default = getRadioCustomProperties;
7
7
 
8
8
  var _colors = require("@atlaskit/theme/colors");
9
9
 
10
- var _tokens = require("@atlaskit/tokens");
11
-
12
10
  var radioThemeColors = {
13
11
  light: {
14
- background: (0, _tokens.token)('color.background.subtleBorderedNeutral.resting', _colors.N10),
15
- backgroundHover: (0, _tokens.token)('color.background.default', _colors.N30),
16
- backgroundActive: (0, _tokens.token)('color.background.subtleBorderedNeutral.pressed', _colors.N30),
17
- backgroundChecked: (0, _tokens.token)('color.background.boldBrand.resting', _colors.B400),
18
- backgroundCheckedHover: (0, _tokens.token)('color.background.boldBrand.hover', _colors.B300),
19
- backgroundCheckedActive: (0, _tokens.token)('color.background.boldBrand.pressed', _colors.B50),
20
- backgroundDisabled: (0, _tokens.token)('color.background.subtleBorderedNeutral.resting', _colors.N20),
21
- dotChecked: (0, _tokens.token)('color.text.onBold', _colors.N10),
22
- dotDisabled: (0, _tokens.token)('color.text.disabled', _colors.N70),
23
- dotActive: (0, _tokens.token)('color.text.onBold', _colors.B400),
24
- border: (0, _tokens.token)('color.border.neutral', _colors.N40),
25
- borderHover: (0, _tokens.token)('color.border.neutral', _colors.N40),
26
- borderDisabled: (0, _tokens.token)('color.background.disabled', _colors.N20),
27
- borderFocus: (0, _tokens.token)('color.border.focus', _colors.B100)
12
+ background: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(_colors.N10, ")"),
13
+ backgroundHover: "var(--ds-background-default, ".concat(_colors.N30, ")"),
14
+ backgroundActive: "var(--ds-background-subtleBorderedNeutral-pressed, ".concat(_colors.N30, ")"),
15
+ backgroundChecked: "var(--ds-background-boldBrand-resting, ".concat(_colors.B400, ")"),
16
+ backgroundCheckedHover: "var(--ds-background-boldBrand-hover, ".concat(_colors.B300, ")"),
17
+ backgroundCheckedActive: "var(--ds-background-boldBrand-pressed, ".concat(_colors.B50, ")"),
18
+ backgroundDisabled: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(_colors.N20, ")"),
19
+ dotChecked: "var(--ds-text-onBold, ".concat(_colors.N10, ")"),
20
+ dotDisabled: "var(--ds-text-disabled, ".concat(_colors.N70, ")"),
21
+ dotActive: "var(--ds-text-onBold, ".concat(_colors.B400, ")"),
22
+ border: "var(--ds-border-neutral, ".concat(_colors.N40, ")"),
23
+ borderHover: "var(--ds-border-neutral, ".concat(_colors.N40, ")"),
24
+ borderDisabled: "var(--ds-background-disabled, ".concat(_colors.N20, ")"),
25
+ borderFocus: "var(--ds-border-focus, ".concat(_colors.B100, ")")
28
26
  },
29
27
  dark: {
30
- background: (0, _tokens.token)('color.background.subtleBorderedNeutral.resting', _colors.DN10),
31
- backgroundHover: (0, _tokens.token)('color.background.default', _colors.DN30),
32
- backgroundActive: (0, _tokens.token)('color.background.subtleBorderedNeutral.pressed', _colors.B200),
33
- backgroundChecked: (0, _tokens.token)('color.background.boldBrand.resting', _colors.B400),
34
- backgroundCheckedHover: (0, _tokens.token)('color.background.boldBrand.hover', _colors.B75),
35
- backgroundCheckedActive: (0, _tokens.token)('color.background.boldBrand.pressed', _colors.B200),
36
- backgroundDisabled: (0, _tokens.token)('color.background.subtleBorderedNeutral.resting', _colors.DN10),
37
- dotChecked: (0, _tokens.token)('color.text.onBold', _colors.DN10),
38
- dotDisabled: (0, _tokens.token)('color.text.disabled', _colors.DN90),
39
- dotActive: (0, _tokens.token)('color.text.onBold', _colors.DN10),
40
- border: (0, _tokens.token)('color.border.neutral', _colors.DN80),
41
- borderHover: (0, _tokens.token)('color.border.neutral', _colors.DN200),
42
- borderDisabled: (0, _tokens.token)('color.background.disabled', _colors.DN10),
43
- borderFocus: (0, _tokens.token)('color.border.focus', _colors.B75)
28
+ background: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(_colors.DN10, ")"),
29
+ backgroundHover: "var(--ds-background-default, ".concat(_colors.DN30, ")"),
30
+ backgroundActive: "var(--ds-background-subtleBorderedNeutral-pressed, ".concat(_colors.B200, ")"),
31
+ backgroundChecked: "var(--ds-background-boldBrand-resting, ".concat(_colors.B400, ")"),
32
+ backgroundCheckedHover: "var(--ds-background-boldBrand-hover, ".concat(_colors.B75, ")"),
33
+ backgroundCheckedActive: "var(--ds-background-boldBrand-pressed, ".concat(_colors.B200, ")"),
34
+ backgroundDisabled: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(_colors.DN10, ")"),
35
+ dotChecked: "var(--ds-text-onBold, ".concat(_colors.DN10, ")"),
36
+ dotDisabled: "var(--ds-text-disabled, ".concat(_colors.DN90, ")"),
37
+ dotActive: "var(--ds-text-onBold, ".concat(_colors.DN10, ")"),
38
+ border: "var(--ds-border-neutral, ".concat(_colors.DN80, ")"),
39
+ borderHover: "var(--ds-border-neutral, ".concat(_colors.DN200, ")"),
40
+ borderDisabled: "var(--ds-background-disabled, ".concat(_colors.DN10, ")"),
41
+ borderFocus: "var(--ds-border-focus, ".concat(_colors.B75, ")")
44
42
  }
45
43
  };
46
44
 
@@ -61,6 +59,6 @@ function getRadioCustomProperties(mode) {
61
59
  '--local-dot-active': radioColors.dotActive,
62
60
  '--local-dot-checked': radioColors.dotChecked,
63
61
  '--local-dot-disabled': radioColors.dotDisabled,
64
- '--local-invalid': (0, _tokens.token)('color.iconBorder.danger', _colors.R300)
62
+ '--local-invalid': "var(--ds-iconBorder-danger, ".concat(_colors.R300, ")")
65
63
  };
66
64
  }
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.3.3",
3
+ "version": "5.3.4",
4
4
  "sideEffects": false
5
5
  }
@@ -7,10 +7,9 @@ import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatfor
7
7
  import { DN600, N80, N900 } from '@atlaskit/theme/colors';
8
8
  import GlobalTheme from '@atlaskit/theme/components';
9
9
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
10
- import { token } from '@atlaskit/tokens';
11
10
  import getRadioCustomProperties from './styles';
12
11
  const packageName = "@atlaskit/radio";
13
- const packageVersion = "5.3.3";
12
+ const packageVersion = "5.3.4";
14
13
  const fontFamily = getFontFamily();
15
14
 
16
15
  const noop = () => {};
@@ -26,15 +25,15 @@ const labelStyles = css({
26
25
  fontFamily: fontFamily,
27
26
  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
28
27
  '&[data-disabled]': {
29
- color: token('color.text.disabled', N80),
28
+ color: `var(--ds-text-disabled, ${N80})`,
30
29
  cursor: 'not-allowed'
31
30
  }
32
31
  });
33
32
  const lightLabelStyles = css({
34
- color: token('color.text.highEmphasis', N900)
33
+ color: `var(--ds-text-highEmphasis, ${N900})`
35
34
  });
36
35
  const darkLabelStyles = css({
37
- color: token('color.text.highEmphasis', DN600)
36
+ color: `var(--ds-text-highEmphasis, ${DN600})`
38
37
  });
39
38
  const radioStyles = css({
40
39
  display: 'flex',
@@ -1,37 +1,36 @@
1
1
  import { B100, B200, B300, B400, B50, B75, DN10, DN200, DN30, DN80, DN90, N10, N20, N30, N40, N70, R300 } from '@atlaskit/theme/colors';
2
- import { token } from '@atlaskit/tokens';
3
2
  const radioThemeColors = {
4
3
  light: {
5
- background: token('color.background.subtleBorderedNeutral.resting', N10),
6
- backgroundHover: token('color.background.default', N30),
7
- backgroundActive: token('color.background.subtleBorderedNeutral.pressed', N30),
8
- backgroundChecked: token('color.background.boldBrand.resting', B400),
9
- backgroundCheckedHover: token('color.background.boldBrand.hover', B300),
10
- backgroundCheckedActive: token('color.background.boldBrand.pressed', B50),
11
- backgroundDisabled: token('color.background.subtleBorderedNeutral.resting', N20),
12
- dotChecked: token('color.text.onBold', N10),
13
- dotDisabled: token('color.text.disabled', N70),
14
- dotActive: token('color.text.onBold', B400),
15
- border: token('color.border.neutral', N40),
16
- borderHover: token('color.border.neutral', N40),
17
- borderDisabled: token('color.background.disabled', N20),
18
- borderFocus: token('color.border.focus', B100)
4
+ background: `var(--ds-background-subtleBorderedNeutral-resting, ${N10})`,
5
+ backgroundHover: `var(--ds-background-default, ${N30})`,
6
+ backgroundActive: `var(--ds-background-subtleBorderedNeutral-pressed, ${N30})`,
7
+ backgroundChecked: `var(--ds-background-boldBrand-resting, ${B400})`,
8
+ backgroundCheckedHover: `var(--ds-background-boldBrand-hover, ${B300})`,
9
+ backgroundCheckedActive: `var(--ds-background-boldBrand-pressed, ${B50})`,
10
+ backgroundDisabled: `var(--ds-background-subtleBorderedNeutral-resting, ${N20})`,
11
+ dotChecked: `var(--ds-text-onBold, ${N10})`,
12
+ dotDisabled: `var(--ds-text-disabled, ${N70})`,
13
+ dotActive: `var(--ds-text-onBold, ${B400})`,
14
+ border: `var(--ds-border-neutral, ${N40})`,
15
+ borderHover: `var(--ds-border-neutral, ${N40})`,
16
+ borderDisabled: `var(--ds-background-disabled, ${N20})`,
17
+ borderFocus: `var(--ds-border-focus, ${B100})`
19
18
  },
20
19
  dark: {
21
- background: token('color.background.subtleBorderedNeutral.resting', DN10),
22
- backgroundHover: token('color.background.default', DN30),
23
- backgroundActive: token('color.background.subtleBorderedNeutral.pressed', B200),
24
- backgroundChecked: token('color.background.boldBrand.resting', B400),
25
- backgroundCheckedHover: token('color.background.boldBrand.hover', B75),
26
- backgroundCheckedActive: token('color.background.boldBrand.pressed', B200),
27
- backgroundDisabled: token('color.background.subtleBorderedNeutral.resting', DN10),
28
- dotChecked: token('color.text.onBold', DN10),
29
- dotDisabled: token('color.text.disabled', DN90),
30
- dotActive: token('color.text.onBold', DN10),
31
- border: token('color.border.neutral', DN80),
32
- borderHover: token('color.border.neutral', DN200),
33
- borderDisabled: token('color.background.disabled', DN10),
34
- borderFocus: token('color.border.focus', B75)
20
+ background: `var(--ds-background-subtleBorderedNeutral-resting, ${DN10})`,
21
+ backgroundHover: `var(--ds-background-default, ${DN30})`,
22
+ backgroundActive: `var(--ds-background-subtleBorderedNeutral-pressed, ${B200})`,
23
+ backgroundChecked: `var(--ds-background-boldBrand-resting, ${B400})`,
24
+ backgroundCheckedHover: `var(--ds-background-boldBrand-hover, ${B75})`,
25
+ backgroundCheckedActive: `var(--ds-background-boldBrand-pressed, ${B200})`,
26
+ backgroundDisabled: `var(--ds-background-subtleBorderedNeutral-resting, ${DN10})`,
27
+ dotChecked: `var(--ds-text-onBold, ${DN10})`,
28
+ dotDisabled: `var(--ds-text-disabled, ${DN90})`,
29
+ dotActive: `var(--ds-text-onBold, ${DN10})`,
30
+ border: `var(--ds-border-neutral, ${DN80})`,
31
+ borderHover: `var(--ds-border-neutral, ${DN200})`,
32
+ borderDisabled: `var(--ds-background-disabled, ${DN10})`,
33
+ borderFocus: `var(--ds-border-focus, ${B75})`
35
34
  }
36
35
  };
37
36
  export default function getRadioCustomProperties(mode) {
@@ -51,6 +50,6 @@ export default function getRadioCustomProperties(mode) {
51
50
  '--local-dot-active': radioColors.dotActive,
52
51
  '--local-dot-checked': radioColors.dotChecked,
53
52
  '--local-dot-disabled': radioColors.dotDisabled,
54
- '--local-invalid': token('color.iconBorder.danger', R300)
53
+ '--local-invalid': `var(--ds-iconBorder-danger, ${R300})`
55
54
  };
56
55
  }
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.3.3",
3
+ "version": "5.3.4",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/Radio.js CHANGED
@@ -8,10 +8,9 @@ import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatfor
8
8
  import { DN600, N80, N900 } from '@atlaskit/theme/colors';
9
9
  import GlobalTheme from '@atlaskit/theme/components';
10
10
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
11
- import { token } from '@atlaskit/tokens';
12
11
  import getRadioCustomProperties from './styles';
13
12
  var packageName = "@atlaskit/radio";
14
- var packageVersion = "5.3.3";
13
+ var packageVersion = "5.3.4";
15
14
  var fontFamily = getFontFamily();
16
15
 
17
16
  var noop = function noop() {};
@@ -27,15 +26,15 @@ var labelStyles = css({
27
26
  fontFamily: fontFamily,
28
27
  // eslint-disable-next-line @repo/internal/styles/no-nested-styles
29
28
  '&[data-disabled]': {
30
- color: token('color.text.disabled', N80),
29
+ color: "var(--ds-text-disabled, ".concat(N80, ")"),
31
30
  cursor: 'not-allowed'
32
31
  }
33
32
  });
34
33
  var lightLabelStyles = css({
35
- color: token('color.text.highEmphasis', N900)
34
+ color: "var(--ds-text-highEmphasis, ".concat(N900, ")")
36
35
  });
37
36
  var darkLabelStyles = css({
38
- color: token('color.text.highEmphasis', DN600)
37
+ color: "var(--ds-text-highEmphasis, ".concat(DN600, ")")
39
38
  });
40
39
  var radioStyles = css({
41
40
  display: 'flex',
@@ -1,37 +1,36 @@
1
1
  import { B100, B200, B300, B400, B50, B75, DN10, DN200, DN30, DN80, DN90, N10, N20, N30, N40, N70, R300 } from '@atlaskit/theme/colors';
2
- import { token } from '@atlaskit/tokens';
3
2
  var radioThemeColors = {
4
3
  light: {
5
- background: token('color.background.subtleBorderedNeutral.resting', N10),
6
- backgroundHover: token('color.background.default', N30),
7
- backgroundActive: token('color.background.subtleBorderedNeutral.pressed', N30),
8
- backgroundChecked: token('color.background.boldBrand.resting', B400),
9
- backgroundCheckedHover: token('color.background.boldBrand.hover', B300),
10
- backgroundCheckedActive: token('color.background.boldBrand.pressed', B50),
11
- backgroundDisabled: token('color.background.subtleBorderedNeutral.resting', N20),
12
- dotChecked: token('color.text.onBold', N10),
13
- dotDisabled: token('color.text.disabled', N70),
14
- dotActive: token('color.text.onBold', B400),
15
- border: token('color.border.neutral', N40),
16
- borderHover: token('color.border.neutral', N40),
17
- borderDisabled: token('color.background.disabled', N20),
18
- borderFocus: token('color.border.focus', B100)
4
+ background: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(N10, ")"),
5
+ backgroundHover: "var(--ds-background-default, ".concat(N30, ")"),
6
+ backgroundActive: "var(--ds-background-subtleBorderedNeutral-pressed, ".concat(N30, ")"),
7
+ backgroundChecked: "var(--ds-background-boldBrand-resting, ".concat(B400, ")"),
8
+ backgroundCheckedHover: "var(--ds-background-boldBrand-hover, ".concat(B300, ")"),
9
+ backgroundCheckedActive: "var(--ds-background-boldBrand-pressed, ".concat(B50, ")"),
10
+ backgroundDisabled: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(N20, ")"),
11
+ dotChecked: "var(--ds-text-onBold, ".concat(N10, ")"),
12
+ dotDisabled: "var(--ds-text-disabled, ".concat(N70, ")"),
13
+ dotActive: "var(--ds-text-onBold, ".concat(B400, ")"),
14
+ border: "var(--ds-border-neutral, ".concat(N40, ")"),
15
+ borderHover: "var(--ds-border-neutral, ".concat(N40, ")"),
16
+ borderDisabled: "var(--ds-background-disabled, ".concat(N20, ")"),
17
+ borderFocus: "var(--ds-border-focus, ".concat(B100, ")")
19
18
  },
20
19
  dark: {
21
- background: token('color.background.subtleBorderedNeutral.resting', DN10),
22
- backgroundHover: token('color.background.default', DN30),
23
- backgroundActive: token('color.background.subtleBorderedNeutral.pressed', B200),
24
- backgroundChecked: token('color.background.boldBrand.resting', B400),
25
- backgroundCheckedHover: token('color.background.boldBrand.hover', B75),
26
- backgroundCheckedActive: token('color.background.boldBrand.pressed', B200),
27
- backgroundDisabled: token('color.background.subtleBorderedNeutral.resting', DN10),
28
- dotChecked: token('color.text.onBold', DN10),
29
- dotDisabled: token('color.text.disabled', DN90),
30
- dotActive: token('color.text.onBold', DN10),
31
- border: token('color.border.neutral', DN80),
32
- borderHover: token('color.border.neutral', DN200),
33
- borderDisabled: token('color.background.disabled', DN10),
34
- borderFocus: token('color.border.focus', B75)
20
+ background: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(DN10, ")"),
21
+ backgroundHover: "var(--ds-background-default, ".concat(DN30, ")"),
22
+ backgroundActive: "var(--ds-background-subtleBorderedNeutral-pressed, ".concat(B200, ")"),
23
+ backgroundChecked: "var(--ds-background-boldBrand-resting, ".concat(B400, ")"),
24
+ backgroundCheckedHover: "var(--ds-background-boldBrand-hover, ".concat(B75, ")"),
25
+ backgroundCheckedActive: "var(--ds-background-boldBrand-pressed, ".concat(B200, ")"),
26
+ backgroundDisabled: "var(--ds-background-subtleBorderedNeutral-resting, ".concat(DN10, ")"),
27
+ dotChecked: "var(--ds-text-onBold, ".concat(DN10, ")"),
28
+ dotDisabled: "var(--ds-text-disabled, ".concat(DN90, ")"),
29
+ dotActive: "var(--ds-text-onBold, ".concat(DN10, ")"),
30
+ border: "var(--ds-border-neutral, ".concat(DN80, ")"),
31
+ borderHover: "var(--ds-border-neutral, ".concat(DN200, ")"),
32
+ borderDisabled: "var(--ds-background-disabled, ".concat(DN10, ")"),
33
+ borderFocus: "var(--ds-border-focus, ".concat(B75, ")")
35
34
  }
36
35
  };
37
36
  export default function getRadioCustomProperties(mode) {
@@ -51,6 +50,6 @@ export default function getRadioCustomProperties(mode) {
51
50
  '--local-dot-active': radioColors.dotActive,
52
51
  '--local-dot-checked': radioColors.dotChecked,
53
52
  '--local-dot-disabled': radioColors.dotDisabled,
54
- '--local-invalid': token('color.iconBorder.danger', R300)
53
+ '--local-invalid': "var(--ds-iconBorder-danger, ".concat(R300, ")")
55
54
  };
56
55
  }
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.3.3",
3
+ "version": "5.3.4",
4
4
  "sideEffects": false
5
5
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.3.3",
3
+ "version": "5.3.4",
4
4
  "description": "A radio input allows people to select only one option from a number of choices. Radio is generally displayed in a radio group.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -31,7 +31,7 @@
31
31
  "dependencies": {
32
32
  "@atlaskit/analytics-next": "^8.0.0",
33
33
  "@atlaskit/theme": "^12.0.0",
34
- "@atlaskit/tokens": "^0.3.0",
34
+ "@atlaskit/tokens": "^0.4.0",
35
35
  "@babel/runtime": "^7.0.0",
36
36
  "@emotion/core": "^10.0.9"
37
37
  },
@@ -66,7 +66,10 @@
66
66
  "@repo/internal": {
67
67
  "ui-components": "lite-mode",
68
68
  "analytics": "analytics-next",
69
- "styling": "emotion",
69
+ "styling": [
70
+ "static",
71
+ "emotion"
72
+ ],
70
73
  "theming": "tokens",
71
74
  "deprecation": "no-deprecated-imports"
72
75
  }