@instructure/ui-instructure 11.7.3-snapshot-25 → 11.7.3-snapshot-26

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.
Files changed (29) hide show
  1. package/CHANGELOG.md +5 -2
  2. package/es/AiInformation/v1/index.js +13 -18
  3. package/es/AiInformation/v1/theme.js +16 -15
  4. package/es/AiInformation/v2/index.js +14 -19
  5. package/es/DataPermissionLevels/v1/index.js +10 -15
  6. package/es/DataPermissionLevels/v1/styles.js +13 -13
  7. package/es/DataPermissionLevels/v1/theme.js +18 -17
  8. package/es/DataPermissionLevels/v2/index.js +10 -15
  9. package/es/DataPermissionLevels/v2/styles.js +16 -16
  10. package/es/NutritionFacts/v1/index.js +6 -10
  11. package/es/NutritionFacts/v1/styles.js +9 -9
  12. package/es/NutritionFacts/v1/theme.js +13 -12
  13. package/es/NutritionFacts/v2/index.js +6 -10
  14. package/es/NutritionFacts/v2/styles.js +9 -9
  15. package/lib/AiInformation/v1/index.js +16 -21
  16. package/lib/AiInformation/v1/theme.js +16 -15
  17. package/lib/AiInformation/v2/index.js +16 -21
  18. package/lib/DataPermissionLevels/v1/index.js +10 -15
  19. package/lib/DataPermissionLevels/v1/styles.js +13 -13
  20. package/lib/DataPermissionLevels/v1/theme.js +18 -17
  21. package/lib/DataPermissionLevels/v2/index.js +10 -15
  22. package/lib/DataPermissionLevels/v2/styles.js +16 -16
  23. package/lib/NutritionFacts/v1/index.js +6 -10
  24. package/lib/NutritionFacts/v1/styles.js +9 -9
  25. package/lib/NutritionFacts/v1/theme.js +13 -12
  26. package/lib/NutritionFacts/v2/index.js +6 -10
  27. package/lib/NutritionFacts/v2/styles.js +9 -9
  28. package/package.json +17 -17
  29. package/tsconfig.build.tsbuildinfo +1 -1
package/CHANGELOG.md CHANGED
@@ -3,9 +3,12 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [11.7.3-snapshot-25](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-25) (2026-04-30)
6
+ ## [11.7.3-snapshot-26](https://github.com/instructure/instructure-ui/compare/v11.7.2...v11.7.3-snapshot-26) (2026-05-05)
7
7
 
8
- **Note:** Version bump only for package @instructure/ui-instructure
8
+
9
+ ### Bug Fixes
10
+
11
+ * **many:** update dependencies, remove lots of Babel plugins, remove Webpack 4 support ([f916fca](https://github.com/instructure/instructure-ui/commit/f916fcafdddcb2d7de401f93e8ff92cfdfa47bba))
9
12
 
10
13
 
11
14
 
package/es/AiInformation/v1/index.js CHANGED
@@ -1,5 +1,3 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- var _IconExternalLinkLine;
3
1
  /*
4
2
  * The MIT License (MIT)
5
3
  *
@@ -60,10 +58,7 @@ const AiInformation = ({
60
58
  nutritionFactsCloseButtonText,
61
59
  nutritionFactsCloseIconButtonScreenReaderLabel
62
60
  }) => {
63
- const _useState = useState(false),
64
- _useState2 = _slicedToArray(_useState, 2),
65
- open = _useState2[0],
66
- setOpen = _useState2[1];
61
+ const [open, setOpen] = useState(false);
67
62
  const styles = useStyle({
68
63
  generateStyle,
69
64
  generateComponentTheme,
@@ -83,9 +78,9 @@ const AiInformation = ({
83
78
  onShowContent: () => setOpen(true),
84
79
  onHideContent: () => setOpen(false),
85
80
  children: _jsxs("div", {
86
- css: styles === null || styles === void 0 ? void 0 : styles.aiInformation,
81
+ css: styles?.aiInformation,
87
82
  children: [_jsxs("div", {
88
- css: styles === null || styles === void 0 ? void 0 : styles.header,
83
+ css: styles?.header,
89
84
  children: [_jsx(Heading, {
90
85
  level: "h2",
91
86
  aiVariant: "stacked",
@@ -111,43 +106,43 @@ const AiInformation = ({
111
106
  nutritionFactsModalTriggerText
112
107
  }, index) => _jsxs("div", {
113
108
  children: [_jsx("div", {
114
- css: styles === null || styles === void 0 ? void 0 : styles.privacyNotice,
109
+ css: styles?.privacyNotice,
115
110
  children: _jsx(Link, {
116
111
  href: privacyNoticeUrl,
117
- renderIcon: _IconExternalLinkLine || (_IconExternalLinkLine = _jsx(IconExternalLinkLine, {})),
112
+ renderIcon: _jsx(IconExternalLinkLine, {}),
118
113
  iconPlacement: "end",
119
114
  variant: "standalone",
120
115
  target: "_blank",
121
116
  children: privacyNoticeText
122
117
  })
123
118
  }), _jsx("div", {
124
- css: styles === null || styles === void 0 ? void 0 : styles.featureName,
119
+ css: styles?.featureName,
125
120
  children: _jsx(Heading, {
126
121
  level: "h3",
127
122
  variant: "titleCardRegular",
128
123
  children: featureName
129
124
  })
130
125
  }), _jsx("div", {
131
- css: styles === null || styles === void 0 ? void 0 : styles.permissionLevelText,
126
+ css: styles?.permissionLevelText,
132
127
  children: _jsx(Heading, {
133
128
  level: "h4",
134
129
  variant: "label",
135
130
  children: permissionLevelText
136
131
  })
137
132
  }), _jsx("div", {
138
- css: styles === null || styles === void 0 ? void 0 : styles.permissionLevel,
133
+ css: styles?.permissionLevel,
139
134
  children: _jsxs(Text, {
140
135
  variant: "legend",
141
136
  children: [" ", permissionLevel, " "]
142
137
  })
143
138
  }), _jsx("div", {
144
- css: styles === null || styles === void 0 ? void 0 : styles.description,
139
+ css: styles?.description,
145
140
  children: _jsxs(Text, {
146
141
  variant: "contentSmall",
147
142
  children: [" ", description, " "]
148
143
  })
149
144
  }), _jsx("div", {
150
- css: styles === null || styles === void 0 ? void 0 : styles.permissionLevelsModalTriggerText,
145
+ css: styles?.permissionLevelsModalTriggerText,
151
146
  children: _jsx(DataPermissionLevels, {
152
147
  fullscreen: fullscreenModals,
153
148
  title: dataPermissionLevelsTitle,
@@ -160,14 +155,14 @@ const AiInformation = ({
160
155
  data: dataPermissionLevelsData
161
156
  })
162
157
  }), _jsx("div", {
163
- css: styles === null || styles === void 0 ? void 0 : styles.modelNameText,
158
+ css: styles?.modelNameText,
164
159
  children: _jsxs(Heading, {
165
160
  level: "h3",
166
161
  variant: "label",
167
162
  children: [' ', modelNameText, ' ']
168
163
  })
169
164
  }), _jsx("div", {
170
- css: styles === null || styles === void 0 ? void 0 : styles.modelName,
165
+ css: styles?.modelName,
171
166
  children: _jsxs(Text, {
172
167
  variant: "contentSmall",
173
168
  children: [" ", modelName, " "]
@@ -182,7 +177,7 @@ const AiInformation = ({
182
177
  triggerText: nutritionFactsModalTriggerText,
183
178
  data: nutritionFactsData
184
179
  }), data.length !== index + 1 ? _jsx("div", {
185
- css: styles === null || styles === void 0 ? void 0 : styles.divider
180
+ css: styles?.divider
186
181
  }) : null]
187
182
  }, index))
188
183
  })]
package/es/AiInformation/v1/theme.js CHANGED
@@ -28,22 +28,23 @@
28
28
  * @return {Object} The final theme object with the overrides and component variables
29
29
  */
30
30
  const generateComponentTheme = theme => {
31
- var _colors$ui, _colors$contrasts;
32
- const colors = theme.colors,
33
- spacing = theme.spacing;
31
+ const {
32
+ colors,
33
+ spacing
34
+ } = theme;
34
35
  const componentVariables = {
35
- bodyPadding: spacing === null || spacing === void 0 ? void 0 : spacing.paddingCardLarge,
36
- headingBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.sectionElements,
37
- featureNameBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.moduleElements,
38
- permissionLevelTextBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space8,
39
- permissionLevelBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space8,
40
- descriptionBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space8,
41
- permissionLevelsModalTriggerBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.moduleElements,
42
- modelNameTextBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space4,
43
- modelNameBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space4,
44
- dividerMargin: spacing === null || spacing === void 0 ? void 0 : spacing.moduleElements,
45
- dividerColor: colors === null || colors === void 0 ? void 0 : (_colors$ui = colors.ui) === null || _colors$ui === void 0 ? void 0 : _colors$ui.surfaceDivider,
46
- levelColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.violet5790
36
+ bodyPadding: spacing?.paddingCardLarge,
37
+ headingBottomMargin: spacing?.sectionElements,
38
+ featureNameBottomMargin: spacing?.moduleElements,
39
+ permissionLevelTextBottomMargin: spacing?.space8,
40
+ permissionLevelBottomMargin: spacing?.space8,
41
+ descriptionBottomMargin: spacing?.space8,
42
+ permissionLevelsModalTriggerBottomMargin: spacing?.moduleElements,
43
+ modelNameTextBottomMargin: spacing?.space4,
44
+ modelNameBottomMargin: spacing?.space4,
45
+ dividerMargin: spacing?.moduleElements,
46
+ dividerColor: colors?.ui?.surfaceDivider,
47
+ levelColor: colors?.contrasts?.violet5790
47
48
  };
48
49
  return {
49
50
  ...componentVariables
package/es/AiInformation/v2/index.js CHANGED
@@ -1,5 +1,3 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
- var _ExternalLinkInstUIIc;
3
1
  /*
4
2
  * The MIT License (MIT)
5
3
  *
@@ -60,10 +58,7 @@ const AiInformation = ({
60
58
  nutritionFactsCloseIconButtonScreenReaderLabel,
61
59
  themeOverride
62
60
  }) => {
63
- const _useState = useState(false),
64
- _useState2 = _slicedToArray(_useState, 2),
65
- open = _useState2[0],
66
- setOpen = _useState2[1];
61
+ const [open, setOpen] = useState(false);
67
62
  const styles = useStyle({
68
63
  generateStyle,
69
64
  themeOverride,
@@ -83,9 +78,9 @@ const AiInformation = ({
83
78
  onShowContent: () => setOpen(true),
84
79
  onHideContent: () => setOpen(false),
85
80
  children: _jsxs("div", {
86
- css: styles === null || styles === void 0 ? void 0 : styles.aiInformation,
81
+ css: styles?.aiInformation,
87
82
  children: [_jsxs("div", {
88
- css: styles === null || styles === void 0 ? void 0 : styles.header,
83
+ css: styles?.header,
89
84
  children: [_jsx(Heading, {
90
85
  level: "h2",
91
86
  aiVariant: "stacked",
@@ -111,44 +106,44 @@ const AiInformation = ({
111
106
  nutritionFactsModalTriggerText
112
107
  }, index) => _jsxs("div", {
113
108
  children: [_jsx("div", {
114
- css: styles === null || styles === void 0 ? void 0 : styles.privacyNotice,
109
+ css: styles?.privacyNotice,
115
110
  children: _jsx(Link, {
116
111
  href: privacyNoticeUrl,
117
- renderIcon: _ExternalLinkInstUIIc || (_ExternalLinkInstUIIc = _jsx(ExternalLinkInstUIIcon, {
112
+ renderIcon: _jsx(ExternalLinkInstUIIcon, {
118
113
  size: "sm"
119
- })),
114
+ }),
120
115
  iconPlacement: "end",
121
116
  variant: "standalone",
122
117
  children: privacyNoticeText
123
118
  })
124
119
  }), _jsx("div", {
125
- css: styles === null || styles === void 0 ? void 0 : styles.featureName,
120
+ css: styles?.featureName,
126
121
  children: _jsx(Heading, {
127
122
  level: "h3",
128
123
  variant: "titleCardRegular",
129
124
  children: featureName
130
125
  })
131
126
  }), _jsx("div", {
132
- css: styles === null || styles === void 0 ? void 0 : styles.permissionLevelText,
127
+ css: styles?.permissionLevelText,
133
128
  children: _jsx(Heading, {
134
129
  level: "h4",
135
130
  variant: "label",
136
131
  children: permissionLevelText
137
132
  })
138
133
  }), _jsx("div", {
139
- css: styles === null || styles === void 0 ? void 0 : styles.permissionLevel,
134
+ css: styles?.permissionLevel,
140
135
  children: _jsxs(Text, {
141
136
  variant: "legend",
142
137
  children: [" ", permissionLevel, " "]
143
138
  })
144
139
  }), _jsx("div", {
145
- css: styles === null || styles === void 0 ? void 0 : styles.description,
140
+ css: styles?.description,
146
141
  children: _jsxs(Text, {
147
142
  variant: "contentSmall",
148
143
  children: [" ", description, " "]
149
144
  })
150
145
  }), _jsx("div", {
151
- css: styles === null || styles === void 0 ? void 0 : styles.permissionLevelsModalTriggerText,
146
+ css: styles?.permissionLevelsModalTriggerText,
152
147
  children: _jsx(DataPermissionLevels, {
153
148
  fullscreen: fullscreenModals,
154
149
  title: dataPermissionLevelsTitle,
@@ -161,14 +156,14 @@ const AiInformation = ({
161
156
  data: dataPermissionLevelsData
162
157
  })
163
158
  }), _jsx("div", {
164
- css: styles === null || styles === void 0 ? void 0 : styles.modelNameText,
159
+ css: styles?.modelNameText,
165
160
  children: _jsxs(Heading, {
166
161
  level: "h3",
167
162
  variant: "label",
168
163
  children: [' ', modelNameText, ' ']
169
164
  })
170
165
  }), _jsx("div", {
171
- css: styles === null || styles === void 0 ? void 0 : styles.modelName,
166
+ css: styles?.modelName,
172
167
  children: _jsxs(Text, {
173
168
  variant: "contentSmall",
174
169
  children: [" ", modelName, " "]
@@ -183,7 +178,7 @@ const AiInformation = ({
183
178
  triggerText: nutritionFactsModalTriggerText,
184
179
  data: nutritionFactsData
185
180
  }), data.length !== index + 1 ? _jsx("div", {
186
- css: styles === null || styles === void 0 ? void 0 : styles.divider
181
+ css: styles?.divider
187
182
  }) : null]
188
183
  }, index))
189
184
  })]
package/es/DataPermissionLevels/v1/index.js CHANGED
@@ -1,4 +1,3 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
1
  /*
3
2
  * The MIT License (MIT)
4
3
  *
@@ -48,11 +47,7 @@ const DataPermissionLevels = ({
48
47
  triggerText,
49
48
  fullscreen = false
50
49
  }) => {
51
- var _Heading, _Text;
52
- const _useState = useState(false),
53
- _useState2 = _slicedToArray(_useState, 2),
54
- open = _useState2[0],
55
- setOpen = _useState2[1];
50
+ const [open, setOpen] = useState(false);
56
51
  const styles = useStyle({
57
52
  generateStyle,
58
53
  generateComponentTheme,
@@ -91,33 +86,33 @@ const DataPermissionLevels = ({
91
86
  })]
92
87
  }), _jsx(Modal.Body, {
93
88
  children: _jsx("div", {
94
- css: styles === null || styles === void 0 ? void 0 : styles.body,
89
+ css: styles?.body,
95
90
  children: data.map(({
96
91
  level,
97
92
  title,
98
93
  description,
99
94
  highlighted
100
95
  }, index) => _jsxs("div", {
101
- css: highlighted ? styles === null || styles === void 0 ? void 0 : styles.highlightedCard : styles === null || styles === void 0 ? void 0 : styles.card,
96
+ css: highlighted ? styles?.highlightedCard : styles?.card,
102
97
  children: [highlighted ? _jsxs("div", {
103
- css: styles === null || styles === void 0 ? void 0 : styles.currentFeature,
104
- children: [_Heading || (_Heading = _jsxs(Heading, {
98
+ css: styles?.currentFeature,
99
+ children: [_jsxs(Heading, {
105
100
  color: "primary-inverse",
106
101
  level: "reset",
107
102
  variant: "labelInline",
108
103
  children: [currentFeatureText, ' ']
109
- })), _Text || (_Text = _jsx(Text, {
104
+ }), _jsx(Text, {
110
105
  color: "primary-inverse",
111
106
  variant: "content",
112
107
  children: currentFeature
113
- }))]
108
+ })]
114
109
  }) : null, _jsxs("div", {
115
- css: styles === null || styles === void 0 ? void 0 : styles.contentContainer,
110
+ css: styles?.contentContainer,
116
111
  children: [_jsx("div", {
117
- css: styles === null || styles === void 0 ? void 0 : styles.level,
112
+ css: styles?.level,
118
113
  children: level
119
114
  }), _jsx("div", {
120
- css: styles === null || styles === void 0 ? void 0 : styles.permissionTitle,
115
+ css: styles?.permissionTitle,
121
116
  children: _jsxs(Text, {
122
117
  variant: "descriptionPage",
123
118
  children: [title, " "]
package/es/DataPermissionLevels/v1/styles.js CHANGED
@@ -40,23 +40,23 @@ const generateStyle = (componentTheme, _props) => {
40
40
  label: 'data-permission-levels__body',
41
41
  display: 'flex',
42
42
  flexDirection: 'column',
43
- padding: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.bodyPadding
43
+ padding: componentTheme?.bodyPadding
44
44
  },
45
45
  card: {
46
46
  label: 'data-permission-levels__card',
47
47
  padding: '2px',
48
48
  borderStyle: 'solid',
49
49
  borderColor: 'transparent',
50
- borderWidth: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderWidth,
50
+ borderWidth: componentTheme?.cardBorderWidth,
51
51
  display: 'flex',
52
52
  flexDirection: 'column'
53
53
  },
54
54
  highlightedCard: {
55
55
  label: 'data-permission-levels__highlighted-card',
56
56
  borderStyle: 'solid',
57
- borderWidth: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderWidth,
58
- borderColor: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderColor,
59
- borderRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderRadius,
57
+ borderWidth: componentTheme?.cardBorderWidth,
58
+ borderColor: componentTheme?.cardBorderColor,
59
+ borderRadius: componentTheme?.cardBorderRadius,
60
60
  padding: '2px',
61
61
  display: 'flex',
62
62
  flexDirection: 'column',
@@ -67,18 +67,18 @@ const generateStyle = (componentTheme, _props) => {
67
67
  },
68
68
  level: {
69
69
  label: 'data-permission-levels__level',
70
- color: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.levelColor
70
+ color: componentTheme?.levelColor
71
71
  },
72
72
  currentFeature: {
73
73
  label: 'data-permission-levels__current-feature',
74
74
  background: `
75
75
  linear-gradient(to right, ${componentTheme.aiTextLeftGradientColor} 0%, ${componentTheme.aiTextRightGradientColor} 100%)`,
76
- paddingLeft: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingSides,
77
- paddingRight: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingSides,
78
- paddingTop: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingTopBottom,
79
- paddingBottom: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingTopBottom,
80
- borderTopLeftRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderRadius,
81
- borderTopRightRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderRadius
76
+ paddingLeft: componentTheme?.currentFeaturePaddingSides,
77
+ paddingRight: componentTheme?.currentFeaturePaddingSides,
78
+ paddingTop: componentTheme?.currentFeaturePaddingTopBottom,
79
+ paddingBottom: componentTheme?.currentFeaturePaddingTopBottom,
80
+ borderTopLeftRadius: componentTheme?.cardBorderRadius,
81
+ borderTopRightRadius: componentTheme?.cardBorderRadius
82
82
  },
83
83
  contentContainer: {
84
84
  label: 'data-permission-levels__content-container',
@@ -89,7 +89,7 @@ const generateStyle = (componentTheme, _props) => {
89
89
  },
90
90
  permissionTitle: {
91
91
  label: 'data-permission-levels__permission-title',
92
- marginBottom: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.permissionTitleBottomMargin
92
+ marginBottom: componentTheme?.permissionTitleBottomMargin
93
93
  }
94
94
  };
95
95
  };
package/es/DataPermissionLevels/v1/theme.js CHANGED
@@ -28,24 +28,25 @@
28
28
  * @return {Object} The final theme object with the overrides and component variables
29
29
  */
30
30
  const generateComponentTheme = theme => {
31
- var _colors$ui, _colors$contrasts, _colors$contrasts2, _colors$contrasts3;
32
- const colors = theme.colors,
33
- spacing = theme.spacing,
34
- borders = theme.borders;
31
+ const {
32
+ colors,
33
+ spacing,
34
+ borders
35
+ } = theme;
35
36
  const componentVariables = {
36
- cardBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusMedium,
37
- cardBorderColor: colors === null || colors === void 0 ? void 0 : (_colors$ui = colors.ui) === null || _colors$ui === void 0 ? void 0 : _colors$ui.lineStroke,
38
- cardBorderWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
39
- cardPadding: spacing === null || spacing === void 0 ? void 0 : spacing.space12,
40
- cardExplainerContainerBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space8,
41
- cardGap: spacing === null || spacing === void 0 ? void 0 : spacing.modalElements,
42
- currentFeaturePaddingSides: spacing === null || spacing === void 0 ? void 0 : spacing.space12,
43
- currentFeaturePaddingTopBottom: spacing === null || spacing === void 0 ? void 0 : spacing.space8,
44
- permissionTitleBottomMargin: spacing === null || spacing === void 0 ? void 0 : spacing.space8,
45
- levelColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts = colors.contrasts) === null || _colors$contrasts === void 0 ? void 0 : _colors$contrasts.violet5790,
46
- bodyPadding: spacing === null || spacing === void 0 ? void 0 : spacing.paddingCardLarge,
47
- aiTextLeftGradientColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts2 = colors.contrasts) === null || _colors$contrasts2 === void 0 ? void 0 : _colors$contrasts2.violet4570,
48
- aiTextRightGradientColor: colors === null || colors === void 0 ? void 0 : (_colors$contrasts3 = colors.contrasts) === null || _colors$contrasts3 === void 0 ? void 0 : _colors$contrasts3.sea4570
37
+ cardBorderRadius: borders?.radiusMedium,
38
+ cardBorderColor: colors?.ui?.lineStroke,
39
+ cardBorderWidth: borders?.widthMedium,
40
+ cardPadding: spacing?.space12,
41
+ cardExplainerContainerBottomMargin: spacing?.space8,
42
+ cardGap: spacing?.modalElements,
43
+ currentFeaturePaddingSides: spacing?.space12,
44
+ currentFeaturePaddingTopBottom: spacing?.space8,
45
+ permissionTitleBottomMargin: spacing?.space8,
46
+ levelColor: colors?.contrasts?.violet5790,
47
+ bodyPadding: spacing?.paddingCardLarge,
48
+ aiTextLeftGradientColor: colors?.contrasts?.violet4570,
49
+ aiTextRightGradientColor: colors?.contrasts?.sea4570
49
50
  };
50
51
  return {
51
52
  ...componentVariables
package/es/DataPermissionLevels/v2/index.js CHANGED
@@ -1,4 +1,3 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
1
  /*
3
2
  * The MIT License (MIT)
4
3
  *
@@ -48,11 +47,7 @@ const DataPermissionLevels = ({
48
47
  fullscreen = false,
49
48
  themeOverride
50
49
  }) => {
51
- var _Heading, _Text;
52
- const _useState = useState(false),
53
- _useState2 = _slicedToArray(_useState, 2),
54
- open = _useState2[0],
55
- setOpen = _useState2[1];
50
+ const [open, setOpen] = useState(false);
56
51
  const styles = useStyle({
57
52
  generateStyle,
58
53
  themeOverride,
@@ -91,33 +86,33 @@ const DataPermissionLevels = ({
91
86
  })]
92
87
  }), _jsx(Modal.Body, {
93
88
  children: _jsx("div", {
94
- css: styles === null || styles === void 0 ? void 0 : styles.body,
89
+ css: styles?.body,
95
90
  children: data.map(({
96
91
  level,
97
92
  title,
98
93
  description,
99
94
  highlighted
100
95
  }, index) => _jsxs("div", {
101
- css: highlighted ? styles === null || styles === void 0 ? void 0 : styles.highlightedCard : styles === null || styles === void 0 ? void 0 : styles.card,
96
+ css: highlighted ? styles?.highlightedCard : styles?.card,
102
97
  children: [highlighted ? _jsxs("div", {
103
- css: styles === null || styles === void 0 ? void 0 : styles.currentFeature,
104
- children: [_Heading || (_Heading = _jsxs(Heading, {
98
+ css: styles?.currentFeature,
99
+ children: [_jsxs(Heading, {
105
100
  color: "primary-on",
106
101
  level: "reset",
107
102
  variant: "labelInline",
108
103
  children: [currentFeatureText, ' ']
109
- })), _Text || (_Text = _jsx(Text, {
104
+ }), _jsx(Text, {
110
105
  color: "primary-on",
111
106
  variant: "content",
112
107
  children: currentFeature
113
- }))]
108
+ })]
114
109
  }) : null, _jsxs("div", {
115
- css: styles === null || styles === void 0 ? void 0 : styles.contentContainer,
110
+ css: styles?.contentContainer,
116
111
  children: [_jsx("div", {
117
- css: styles === null || styles === void 0 ? void 0 : styles.level,
112
+ css: styles?.level,
118
113
  children: level
119
114
  }), _jsx("div", {
120
- css: styles === null || styles === void 0 ? void 0 : styles.permissionTitle,
115
+ css: styles?.permissionTitle,
121
116
  children: _jsxs(Text, {
122
117
  variant: "descriptionPage",
123
118
  children: [title, " "]
package/es/DataPermissionLevels/v2/styles.js CHANGED
@@ -39,23 +39,23 @@ const generateStyle = componentTheme => {
39
39
  label: 'data-permission-levels__body',
40
40
  display: 'flex',
41
41
  flexDirection: 'column',
42
- padding: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.bodyPadding
42
+ padding: componentTheme?.bodyPadding
43
43
  },
44
44
  card: {
45
45
  label: 'data-permission-levels__card',
46
46
  padding: '2px',
47
47
  borderStyle: 'solid',
48
48
  borderColor: 'transparent',
49
- borderWidth: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderWidth,
49
+ borderWidth: componentTheme?.cardBorderWidth,
50
50
  display: 'flex',
51
51
  flexDirection: 'column'
52
52
  },
53
53
  highlightedCard: {
54
54
  label: 'data-permission-levels__highlighted-card',
55
55
  borderStyle: 'solid',
56
- borderWidth: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderWidth,
57
- borderColor: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderColor,
58
- borderRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderRadius,
56
+ borderWidth: componentTheme?.cardBorderWidth,
57
+ borderColor: componentTheme?.cardBorderColor,
58
+ borderRadius: componentTheme?.cardBorderRadius,
59
59
  padding: '2px',
60
60
  display: 'flex',
61
61
  flexDirection: 'column',
@@ -66,31 +66,31 @@ const generateStyle = componentTheme => {
66
66
  },
67
67
  level: {
68
68
  label: 'data-permission-levels__level',
69
- color: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.levelColor
69
+ color: componentTheme?.levelColor
70
70
  },
71
71
  currentFeature: {
72
72
  label: 'data-permission-levels__current-feature',
73
73
  background: `
74
74
  linear-gradient(to right, ${componentTheme.aiTextLeftGradientColor} 0%, ${componentTheme.aiTextRightGradientColor} 100%)`,
75
- paddingLeft: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingSides,
76
- paddingRight: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingSides,
77
- paddingTop: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingTopBottom,
78
- paddingBottom: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.currentFeaturePaddingTopBottom,
79
- borderTopLeftRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderRadius,
80
- borderTopRightRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.cardBorderRadius
75
+ paddingLeft: componentTheme?.currentFeaturePaddingSides,
76
+ paddingRight: componentTheme?.currentFeaturePaddingSides,
77
+ paddingTop: componentTheme?.currentFeaturePaddingTopBottom,
78
+ paddingBottom: componentTheme?.currentFeaturePaddingTopBottom,
79
+ borderTopLeftRadius: componentTheme?.cardBorderRadius,
80
+ borderTopRightRadius: componentTheme?.cardBorderRadius
81
81
  },
82
82
  contentContainer: {
83
83
  label: 'data-permission-levels__content-container',
84
- background: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.contentContainerColor,
85
- borderBottomLeftRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.contentContainerBorderRadius,
86
- borderBottomRightRadius: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.contentContainerBorderRadius,
84
+ background: componentTheme?.contentContainerColor,
85
+ borderBottomLeftRadius: componentTheme?.contentContainerBorderRadius,
86
+ borderBottomRightRadius: componentTheme?.contentContainerBorderRadius,
87
87
  padding: '10px',
88
88
  display: 'flex',
89
89
  flexDirection: 'column'
90
90
  },
91
91
  permissionTitle: {
92
92
  label: 'data-permission-levels__permission-title',
93
- marginBottom: componentTheme === null || componentTheme === void 0 ? void 0 : componentTheme.permissionTitleBottomMargin
93
+ marginBottom: componentTheme?.permissionTitleBottomMargin
94
94
  }
95
95
  };
96
96
  };
package/es/NutritionFacts/v1/index.js CHANGED
@@ -1,4 +1,3 @@
1
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
2
1
  /*
3
2
  * The MIT License (MIT)
4
3
  *
@@ -47,10 +46,7 @@ const NutritionFacts = ({
47
46
  triggerText,
48
47
  fullscreen = false
49
48
  }) => {
50
- const _useState = useState(false),
51
- _useState2 = _slicedToArray(_useState, 2),
52
- open = _useState2[0],
53
- setOpen = _useState2[1];
49
+ const [open, setOpen] = useState(false);
54
50
  const styles = useStyle({
55
51
  generateStyle,
56
52
  generateComponentTheme,
@@ -89,7 +85,7 @@ const NutritionFacts = ({
89
85
  })]
90
86
  }), _jsx(Modal.Body, {
91
87
  children: _jsxs("div", {
92
- css: styles === null || styles === void 0 ? void 0 : styles.body,
88
+ css: styles?.body,
93
89
  children: [_jsxs(Heading, {
94
90
  variant: "titleSection",
95
91
  level: "h3",
@@ -99,13 +95,13 @@ const NutritionFacts = ({
99
95
  segmentData
100
96
  }, index) => {
101
97
  return _jsxs("div", {
102
- css: styles === null || styles === void 0 ? void 0 : styles.blockContainer,
98
+ css: styles?.blockContainer,
103
99
  children: [_jsxs(Heading, {
104
100
  variant: "titleModule",
105
101
  level: "h4",
106
102
  children: [' ', blockTitle, ' ']
107
103
  }), _jsx("div", {
108
- css: styles === null || styles === void 0 ? void 0 : styles.segmentContainer,
104
+ css: styles?.segmentContainer,
109
105
  children: segmentData.map(({
110
106
  segmentTitle,
111
107
  description,
@@ -113,9 +109,9 @@ const NutritionFacts = ({
113
109
  valueDescription
114
110
  }, index) => {
115
111
  return _jsxs("div", {
116
- css: styles === null || styles === void 0 ? void 0 : styles.segmentCard,
112
+ css: styles?.segmentCard,
117
113
  children: [_jsxs("div", {
118
- css: styles === null || styles === void 0 ? void 0 : styles.segmentCardExplainerContainer,
114
+ css: styles?.segmentCardExplainerContainer,
119
115
  children: [_jsxs(Heading, {
120
116
  variant: "label",
121
117
  children: [' ', segmentTitle, ' ']