@cloudscape-design/components 3.0.183 → 3.0.184

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.
@@ -1,25 +1,25 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "visible-content": "awsui_visible-content_tc96w_1b1c1_185",
5
- "visible-content-toggle": "awsui_visible-content-toggle_tc96w_1b1c1_186",
6
- "visible-content-groups": "awsui_visible-content-groups_tc96w_1b1c1_187",
7
- "visible-content-group": "awsui_visible-content-group_tc96w_1b1c1_187",
8
- "visible-content-title": "awsui_visible-content-title_tc96w_1b1c1_192",
9
- "visible-content-group-label": "awsui_visible-content-group-label_tc96w_1b1c1_200",
10
- "visible-content-option": "awsui_visible-content-option_tc96w_1b1c1_206",
11
- "visible-content-option-label": "awsui_visible-content-option-label_tc96w_1b1c1_217",
12
- "root": "awsui_root_tc96w_1b1c1_224",
13
- "modal-root": "awsui_modal-root_tc96w_1b1c1_225",
14
- "trigger-button": "awsui_trigger-button_tc96w_1b1c1_226",
15
- "cancel-button": "awsui_cancel-button_tc96w_1b1c1_227",
16
- "confirm-button": "awsui_confirm-button_tc96w_1b1c1_228",
17
- "custom": "awsui_custom_tc96w_1b1c1_229",
18
- "second-column-small": "awsui_second-column-small_tc96w_1b1c1_233",
19
- "wrap-lines": "awsui_wrap-lines_tc96w_1b1c1_237",
20
- "striped-rows": "awsui_striped-rows_tc96w_1b1c1_238",
21
- "page-size": "awsui_page-size_tc96w_1b1c1_239",
22
- "page-size-form-field": "awsui_page-size-form-field_tc96w_1b1c1_240",
23
- "page-size-radio-group": "awsui_page-size-radio-group_tc96w_1b1c1_241"
4
+ "visible-content": "awsui_visible-content_tc96w_17l6y_185",
5
+ "visible-content-toggle": "awsui_visible-content-toggle_tc96w_17l6y_186",
6
+ "visible-content-groups": "awsui_visible-content-groups_tc96w_17l6y_187",
7
+ "visible-content-group": "awsui_visible-content-group_tc96w_17l6y_187",
8
+ "visible-content-title": "awsui_visible-content-title_tc96w_17l6y_192",
9
+ "visible-content-group-label": "awsui_visible-content-group-label_tc96w_17l6y_201",
10
+ "visible-content-option": "awsui_visible-content-option_tc96w_17l6y_207",
11
+ "visible-content-option-label": "awsui_visible-content-option-label_tc96w_17l6y_218",
12
+ "root": "awsui_root_tc96w_17l6y_225",
13
+ "modal-root": "awsui_modal-root_tc96w_17l6y_226",
14
+ "trigger-button": "awsui_trigger-button_tc96w_17l6y_227",
15
+ "cancel-button": "awsui_cancel-button_tc96w_17l6y_228",
16
+ "confirm-button": "awsui_confirm-button_tc96w_17l6y_229",
17
+ "custom": "awsui_custom_tc96w_17l6y_230",
18
+ "second-column-small": "awsui_second-column-small_tc96w_17l6y_234",
19
+ "wrap-lines": "awsui_wrap-lines_tc96w_17l6y_238",
20
+ "striped-rows": "awsui_striped-rows_tc96w_17l6y_239",
21
+ "page-size": "awsui_page-size_tc96w_17l6y_240",
22
+ "page-size-form-field": "awsui_page-size-form-field_tc96w_17l6y_241",
23
+ "page-size-radio-group": "awsui_page-size-radio-group_tc96w_17l6y_242"
24
24
  };
25
25
 
@@ -182,62 +182,63 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
182
182
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
183
183
  SPDX-License-Identifier: Apache-2.0
184
184
  */
185
- .awsui_visible-content_tc96w_1b1c1_185:not(#\9),
186
- .awsui_visible-content-toggle_tc96w_1b1c1_186:not(#\9),
187
- .awsui_visible-content-groups_tc96w_1b1c1_187:not(#\9),
188
- .awsui_visible-content-group_tc96w_1b1c1_187:not(#\9) {
185
+ .awsui_visible-content_tc96w_17l6y_185:not(#\9),
186
+ .awsui_visible-content-toggle_tc96w_17l6y_186:not(#\9),
187
+ .awsui_visible-content-groups_tc96w_17l6y_187:not(#\9),
188
+ .awsui_visible-content-group_tc96w_17l6y_187:not(#\9) {
189
189
  /* used in test-utils */
190
190
  }
191
191
 
192
- .awsui_visible-content-title_tc96w_1b1c1_192:not(#\9) {
192
+ .awsui_visible-content-title_tc96w_17l6y_192:not(#\9) {
193
193
  font-size: var(--font-body-m-size-sregvd, 14px);
194
194
  line-height: var(--font-body-m-line-height-i7xxvv, 22px);
195
195
  font-weight: var(--font-display-label-weight-m18hjh, 700);
196
196
  color: var(--color-text-form-label-k3j0b4, #000716);
197
+ margin: 0;
197
198
  margin-bottom: var(--space-scaled-l-t03y3z, 20px);
198
199
  }
199
200
 
200
- .awsui_visible-content-group-label_tc96w_1b1c1_200:not(#\9) {
201
+ .awsui_visible-content-group-label_tc96w_17l6y_201:not(#\9) {
201
202
  color: var(--color-text-group-label-w9to2i, #414d5c);
202
203
  padding-bottom: var(--space-xs-rsr2qu, 8px);
203
204
  border-bottom: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
204
205
  }
205
206
 
206
- .awsui_visible-content-option_tc96w_1b1c1_206:not(#\9) {
207
+ .awsui_visible-content-option_tc96w_17l6y_207:not(#\9) {
207
208
  display: flex;
208
209
  flex-wrap: nowrap;
209
210
  justify-content: space-between;
210
211
  padding: var(--space-xs-rsr2qu, 8px) 0px var(--space-xs-rsr2qu, 8px) var(--space-scaled-l-t03y3z, 20px);
211
212
  border-bottom: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
212
213
  }
213
- .awsui_visible-content-option_tc96w_1b1c1_206:not(#\9):last-child {
214
+ .awsui_visible-content-option_tc96w_17l6y_207:not(#\9):last-child {
214
215
  border-bottom: none;
215
216
  }
216
217
 
217
- .awsui_visible-content-option-label_tc96w_1b1c1_217:not(#\9) {
218
+ .awsui_visible-content-option-label_tc96w_17l6y_218:not(#\9) {
218
219
  overflow: hidden;
219
220
  text-overflow: ellipsis;
220
221
  padding-right: var(--space-l-4vl6xu, 20px);
221
222
  flex-grow: 1;
222
223
  }
223
224
 
224
- .awsui_root_tc96w_1b1c1_224:not(#\9),
225
- .awsui_modal-root_tc96w_1b1c1_225:not(#\9),
226
- .awsui_trigger-button_tc96w_1b1c1_226:not(#\9),
227
- .awsui_cancel-button_tc96w_1b1c1_227:not(#\9),
228
- .awsui_confirm-button_tc96w_1b1c1_228:not(#\9),
229
- .awsui_custom_tc96w_1b1c1_229:not(#\9) {
225
+ .awsui_root_tc96w_17l6y_225:not(#\9),
226
+ .awsui_modal-root_tc96w_17l6y_226:not(#\9),
227
+ .awsui_trigger-button_tc96w_17l6y_227:not(#\9),
228
+ .awsui_cancel-button_tc96w_17l6y_228:not(#\9),
229
+ .awsui_confirm-button_tc96w_17l6y_229:not(#\9),
230
+ .awsui_custom_tc96w_17l6y_230:not(#\9) {
230
231
  /* used in test-utils */
231
232
  }
232
233
 
233
- .awsui_second-column-small_tc96w_1b1c1_233:not(#\9) {
234
+ .awsui_second-column-small_tc96w_17l6y_234:not(#\9) {
234
235
  padding-top: calc(2 * var(--space-scaled-l-t03y3z, 20px));
235
236
  }
236
237
 
237
- .awsui_wrap-lines_tc96w_1b1c1_237:not(#\9),
238
- .awsui_striped-rows_tc96w_1b1c1_238:not(#\9),
239
- .awsui_page-size_tc96w_1b1c1_239:not(#\9),
240
- .awsui_page-size-form-field_tc96w_1b1c1_240:not(#\9),
241
- .awsui_page-size-radio-group_tc96w_1b1c1_241:not(#\9) {
238
+ .awsui_wrap-lines_tc96w_17l6y_238:not(#\9),
239
+ .awsui_striped-rows_tc96w_17l6y_239:not(#\9),
240
+ .awsui_page-size_tc96w_17l6y_240:not(#\9),
241
+ .awsui_page-size-form-field_tc96w_17l6y_241:not(#\9),
242
+ .awsui_page-size-radio-group_tc96w_17l6y_242:not(#\9) {
242
243
  /* used in test-utils */
243
244
  }
@@ -2,25 +2,25 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "visible-content": "awsui_visible-content_tc96w_1b1c1_185",
6
- "visible-content-toggle": "awsui_visible-content-toggle_tc96w_1b1c1_186",
7
- "visible-content-groups": "awsui_visible-content-groups_tc96w_1b1c1_187",
8
- "visible-content-group": "awsui_visible-content-group_tc96w_1b1c1_187",
9
- "visible-content-title": "awsui_visible-content-title_tc96w_1b1c1_192",
10
- "visible-content-group-label": "awsui_visible-content-group-label_tc96w_1b1c1_200",
11
- "visible-content-option": "awsui_visible-content-option_tc96w_1b1c1_206",
12
- "visible-content-option-label": "awsui_visible-content-option-label_tc96w_1b1c1_217",
13
- "root": "awsui_root_tc96w_1b1c1_224",
14
- "modal-root": "awsui_modal-root_tc96w_1b1c1_225",
15
- "trigger-button": "awsui_trigger-button_tc96w_1b1c1_226",
16
- "cancel-button": "awsui_cancel-button_tc96w_1b1c1_227",
17
- "confirm-button": "awsui_confirm-button_tc96w_1b1c1_228",
18
- "custom": "awsui_custom_tc96w_1b1c1_229",
19
- "second-column-small": "awsui_second-column-small_tc96w_1b1c1_233",
20
- "wrap-lines": "awsui_wrap-lines_tc96w_1b1c1_237",
21
- "striped-rows": "awsui_striped-rows_tc96w_1b1c1_238",
22
- "page-size": "awsui_page-size_tc96w_1b1c1_239",
23
- "page-size-form-field": "awsui_page-size-form-field_tc96w_1b1c1_240",
24
- "page-size-radio-group": "awsui_page-size-radio-group_tc96w_1b1c1_241"
5
+ "visible-content": "awsui_visible-content_tc96w_17l6y_185",
6
+ "visible-content-toggle": "awsui_visible-content-toggle_tc96w_17l6y_186",
7
+ "visible-content-groups": "awsui_visible-content-groups_tc96w_17l6y_187",
8
+ "visible-content-group": "awsui_visible-content-group_tc96w_17l6y_187",
9
+ "visible-content-title": "awsui_visible-content-title_tc96w_17l6y_192",
10
+ "visible-content-group-label": "awsui_visible-content-group-label_tc96w_17l6y_201",
11
+ "visible-content-option": "awsui_visible-content-option_tc96w_17l6y_207",
12
+ "visible-content-option-label": "awsui_visible-content-option-label_tc96w_17l6y_218",
13
+ "root": "awsui_root_tc96w_17l6y_225",
14
+ "modal-root": "awsui_modal-root_tc96w_17l6y_226",
15
+ "trigger-button": "awsui_trigger-button_tc96w_17l6y_227",
16
+ "cancel-button": "awsui_cancel-button_tc96w_17l6y_228",
17
+ "confirm-button": "awsui_confirm-button_tc96w_17l6y_229",
18
+ "custom": "awsui_custom_tc96w_17l6y_230",
19
+ "second-column-small": "awsui_second-column-small_tc96w_17l6y_234",
20
+ "wrap-lines": "awsui_wrap-lines_tc96w_17l6y_238",
21
+ "striped-rows": "awsui_striped-rows_tc96w_17l6y_239",
22
+ "page-size": "awsui_page-size_tc96w_17l6y_240",
23
+ "page-size-form-field": "awsui_page-size-form-field_tc96w_17l6y_241",
24
+ "page-size-radio-group": "awsui_page-size-radio-group_tc96w_17l6y_242"
25
25
  };
26
26
 
@@ -31,7 +31,7 @@ export default function VisibleContentPreference(_a) {
31
31
  };
32
32
  var outerGroupLabelId = "".concat(idPrefix, "-outer");
33
33
  return (React.createElement("div", { className: styles['visible-content'] },
34
- React.createElement("div", __assign({}, className('title'), { id: outerGroupLabelId }), title),
34
+ React.createElement("h3", __assign({}, className('title'), { id: outerGroupLabelId }), title),
35
35
  React.createElement(InternalSpaceBetween, __assign({}, className('groups'), { size: "xs" }), options.map(function (optionGroup, optionGroupIndex) {
36
36
  var groupLabelId = "".concat(idPrefix, "-").concat(optionGroupIndex);
37
37
  return (React.createElement("div", __assign({ key: optionGroupIndex }, className('group'), { role: "group", "aria-labelledby": "".concat(outerGroupLabelId, " ").concat(groupLabelId) }),
@@ -1 +1 @@
1
- {"version":3,"file":"visible-content.js","sourceRoot":"","sources":["../../../src/collection-preferences/visible-content.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalSpaceBetween from '../space-between/internal';\nimport InternalToggle from '../toggle/internal';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nimport { CollectionPreferencesProps } from './interfaces';\nimport styles from './styles.css.js';\n\nconst isVisible = (id: string, visibleIds: ReadonlyArray<string>) => visibleIds.indexOf(id) !== -1;\n\ninterface ClassNameProps {\n className: string;\n}\nconst className = (suffix: string): ClassNameProps => ({\n className: styles[`visible-content-${suffix}`],\n});\n\ninterface VisibleContentPreferenceProps extends CollectionPreferencesProps.VisibleContentPreference {\n onChange: (value: ReadonlyArray<string>) => void;\n value?: ReadonlyArray<string>;\n}\n\nexport default function VisibleContentPreference({\n title,\n options,\n value = [],\n onChange,\n}: VisibleContentPreferenceProps) {\n const idPrefix = useUniqueId('visible-content');\n\n const flatOptionsIds = options.reduce<string[]>(\n (ids, group) => [...ids, ...group.options.reduce<string[]>((groupIds, option) => [...groupIds, option.id], [])],\n []\n );\n\n const onToggle = (id: string) => {\n if (!isVisible(id, value)) {\n onChange(\n [...value, id].sort((firstId, secondId) => flatOptionsIds.indexOf(firstId) - flatOptionsIds.indexOf(secondId))\n );\n } else {\n onChange(value.filter(currentId => currentId !== id));\n }\n };\n\n const selectionOption = (\n option: CollectionPreferencesProps.VisibleContentOption,\n optionGroupIndex: number,\n optionIndex: number\n ) => {\n const labelId = `${idPrefix}-${optionGroupIndex}-${optionIndex}`;\n return (\n <div key={optionIndex} {...className('option')}>\n <label {...className('option-label')} htmlFor={labelId}>\n {option.label}\n </label>\n <div {...className('toggle')}>\n <InternalToggle\n checked={isVisible(option.id, value)}\n onChange={() => onToggle(option.id)}\n disabled={option.editable === false}\n controlId={labelId}\n />\n </div>\n </div>\n );\n };\n\n const outerGroupLabelId = `${idPrefix}-outer`;\n return (\n <div className={styles['visible-content']}>\n <div {...className('title')} id={outerGroupLabelId}>\n {title}\n </div>\n <InternalSpaceBetween {...className('groups')} size=\"xs\">\n {options.map((optionGroup, optionGroupIndex) => {\n const groupLabelId = `${idPrefix}-${optionGroupIndex}`;\n return (\n <div\n key={optionGroupIndex}\n {...className('group')}\n role=\"group\"\n aria-labelledby={`${outerGroupLabelId} ${groupLabelId}`}\n >\n <div {...className('group-label')} id={groupLabelId}>\n {optionGroup.label}\n </div>\n <div>\n {optionGroup.options.map((option, optionIndex) =>\n selectionOption(option, optionGroupIndex, optionIndex)\n )}\n </div>\n </div>\n );\n })}\n </InternalSpaceBetween>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"visible-content.js","sourceRoot":"","sources":["../../../src/collection-preferences/visible-content.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalSpaceBetween from '../space-between/internal';\nimport InternalToggle from '../toggle/internal';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nimport { CollectionPreferencesProps } from './interfaces';\nimport styles from './styles.css.js';\n\nconst isVisible = (id: string, visibleIds: ReadonlyArray<string>) => visibleIds.indexOf(id) !== -1;\n\ninterface ClassNameProps {\n className: string;\n}\nconst className = (suffix: string): ClassNameProps => ({\n className: styles[`visible-content-${suffix}`],\n});\n\ninterface VisibleContentPreferenceProps extends CollectionPreferencesProps.VisibleContentPreference {\n onChange: (value: ReadonlyArray<string>) => void;\n value?: ReadonlyArray<string>;\n}\n\nexport default function VisibleContentPreference({\n title,\n options,\n value = [],\n onChange,\n}: VisibleContentPreferenceProps) {\n const idPrefix = useUniqueId('visible-content');\n\n const flatOptionsIds = options.reduce<string[]>(\n (ids, group) => [...ids, ...group.options.reduce<string[]>((groupIds, option) => [...groupIds, option.id], [])],\n []\n );\n\n const onToggle = (id: string) => {\n if (!isVisible(id, value)) {\n onChange(\n [...value, id].sort((firstId, secondId) => flatOptionsIds.indexOf(firstId) - flatOptionsIds.indexOf(secondId))\n );\n } else {\n onChange(value.filter(currentId => currentId !== id));\n }\n };\n\n const selectionOption = (\n option: CollectionPreferencesProps.VisibleContentOption,\n optionGroupIndex: number,\n optionIndex: number\n ) => {\n const labelId = `${idPrefix}-${optionGroupIndex}-${optionIndex}`;\n return (\n <div key={optionIndex} {...className('option')}>\n <label {...className('option-label')} htmlFor={labelId}>\n {option.label}\n </label>\n <div {...className('toggle')}>\n <InternalToggle\n checked={isVisible(option.id, value)}\n onChange={() => onToggle(option.id)}\n disabled={option.editable === false}\n controlId={labelId}\n />\n </div>\n </div>\n );\n };\n\n const outerGroupLabelId = `${idPrefix}-outer`;\n return (\n <div className={styles['visible-content']}>\n <h3 {...className('title')} id={outerGroupLabelId}>\n {title}\n </h3>\n <InternalSpaceBetween {...className('groups')} size=\"xs\">\n {options.map((optionGroup, optionGroupIndex) => {\n const groupLabelId = `${idPrefix}-${optionGroupIndex}`;\n return (\n <div\n key={optionGroupIndex}\n {...className('group')}\n role=\"group\"\n aria-labelledby={`${outerGroupLabelId} ${groupLabelId}`}\n >\n <div {...className('group-label')} id={groupLabelId}>\n {optionGroup.label}\n </div>\n <div>\n {optionGroup.options.map((option, optionIndex) =>\n selectionOption(option, optionGroupIndex, optionIndex)\n )}\n </div>\n </div>\n );\n })}\n </InternalSpaceBetween>\n </div>\n );\n}\n"]}
@@ -1,5 +1,5 @@
1
1
 
2
- export var PACKAGE_VERSION = '3.0.0 (f13bb5c)';
2
+ export var PACKAGE_VERSION = '3.0.0 (ed68979)';
3
3
  export var THEME = 'open-source-visual-refresh';
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
5
5
 
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "f13bb5caa9bac0e3b101cf077e3c551c16dfcdad"
2
+ "commit": "ed68979606c1e81f9bd6d30c27f27aaa4b6501b0"
3
3
  }
package/package.json CHANGED
@@ -81,7 +81,7 @@
81
81
  "./internal/base-component/index.js",
82
82
  "./internal/base-component/styles.css.js"
83
83
  ],
84
- "version": "3.0.183",
84
+ "version": "3.0.184",
85
85
  "repository": {
86
86
  "type": "git",
87
87
  "url": "https://github.com/cloudscape-design/components.git"