@cloudscape-design/components-themeable 3.0.939 → 3.0.941
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/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/internal/components/selectable-item/styles.scss +48 -1
- package/lib/internal/template/internal/components/option/interfaces.d.ts +1 -0
- package/lib/internal/template/internal/components/option/interfaces.d.ts.map +1 -1
- package/lib/internal/template/internal/components/option/interfaces.js.map +1 -1
- package/lib/internal/template/internal/components/option/utils/filter-options.d.ts.map +1 -1
- package/lib/internal/template/internal/components/option/utils/filter-options.js +1 -1
- package/lib/internal/template/internal/components/option/utils/filter-options.js.map +1 -1
- package/lib/internal/template/internal/components/option/utils/flatten-options.d.ts.map +1 -1
- package/lib/internal/template/internal/components/option/utils/flatten-options.js +2 -1
- package/lib/internal/template/internal/components/option/utils/flatten-options.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/index.d.ts.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/index.js +5 -2
- package/lib/internal/template/internal/components/selectable-item/index.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/interfaces.d.ts +3 -0
- package/lib/internal/template/internal/components/selectable-item/interfaces.d.ts.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/interfaces.js.map +1 -1
- package/lib/internal/template/internal/components/selectable-item/styles.css.js +19 -16
- package/lib/internal/template/internal/components/selectable-item/styles.scoped.css +62 -29
- package/lib/internal/template/internal/components/selectable-item/styles.selectors.js +19 -16
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/internal/hooks/use-virtual/index.d.ts +2 -1
- package/lib/internal/template/internal/hooks/use-virtual/index.d.ts.map +1 -1
- package/lib/internal/template/internal/hooks/use-virtual/index.js +9 -2
- package/lib/internal/template/internal/hooks/use-virtual/index.js.map +1 -1
- package/lib/internal/template/internal/hooks/use-virtual/sticky-range-extractor.d.ts +9 -0
- package/lib/internal/template/internal/hooks/use-virtual/sticky-range-extractor.d.ts.map +1 -0
- package/lib/internal/template/internal/hooks/use-virtual/sticky-range-extractor.js +8 -0
- package/lib/internal/template/internal/hooks/use-virtual/sticky-range-extractor.js.map +1 -0
- package/lib/internal/template/internal/vendor/react-virtual.js +1 -1
- package/lib/internal/template/select/parts/item.d.ts +2 -0
- package/lib/internal/template/select/parts/item.d.ts.map +1 -1
- package/lib/internal/template/select/parts/item.js +2 -2
- package/lib/internal/template/select/parts/item.js.map +1 -1
- package/lib/internal/template/select/parts/multiselect-item.d.ts.map +1 -1
- package/lib/internal/template/select/parts/multiselect-item.js +2 -2
- package/lib/internal/template/select/parts/multiselect-item.js.map +1 -1
- package/lib/internal/template/select/parts/plain-list.d.ts +1 -0
- package/lib/internal/template/select/parts/plain-list.d.ts.map +1 -1
- package/lib/internal/template/select/parts/plain-list.js +9 -2
- package/lib/internal/template/select/parts/plain-list.js.map +1 -1
- package/lib/internal/template/select/parts/virtual-list.d.ts.map +1 -1
- package/lib/internal/template/select/parts/virtual-list.js +12 -6
- package/lib/internal/template/select/parts/virtual-list.js.map +1 -1
- package/lib/internal/template/select/utils/render-options.d.ts +3 -1
- package/lib/internal/template/select/utils/render-options.d.ts.map +1 -1
- package/lib/internal/template/select/utils/render-options.js +3 -2
- package/lib/internal/template/select/utils/render-options.js.map +1 -1
- package/lib/internal/template/table/interfaces.d.ts +4 -1
- package/lib/internal/template/table/interfaces.d.ts.map +1 -1
- package/lib/internal/template/table/interfaces.js.map +1 -1
- package/lib/internal/template/table/internal.d.ts.map +1 -1
- package/lib/internal/template/table/internal.js +10 -7
- package/lib/internal/template/table/internal.js.map +1 -1
- package/lib/internal/template/table/use-cell-editing.d.ts +4 -4
- package/lib/internal/template/table/use-cell-editing.d.ts.map +1 -1
- package/lib/internal/template/table/use-cell-editing.js +2 -2
- package/lib/internal/template/table/use-cell-editing.js.map +1 -1
- package/package.json +1 -1
|
@@ -34,7 +34,8 @@
|
|
|
34
34
|
border-block-end-color: transparent;
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
&:not(:first-child)
|
|
37
|
+
&:not(:first-child),
|
|
38
|
+
&.virtual {
|
|
38
39
|
margin-block-start: calc(-1 * #{awsui.$border-item-width});
|
|
39
40
|
}
|
|
40
41
|
|
|
@@ -124,6 +125,52 @@
|
|
|
124
125
|
}
|
|
125
126
|
}
|
|
126
127
|
|
|
128
|
+
&.sticky {
|
|
129
|
+
position: sticky;
|
|
130
|
+
inset-block-start: 0;
|
|
131
|
+
|
|
132
|
+
// Push the next option down to prevent its border in highlighted or selected state from being partially covered by the sticky option
|
|
133
|
+
margin-block-end: calc(#{awsui.$border-item-width} - #{awsui.$border-divider-list-width});
|
|
134
|
+
|
|
135
|
+
// Stay on top of the other options when they are scrolled up
|
|
136
|
+
z-index: 4;
|
|
137
|
+
|
|
138
|
+
&:not(.highlighted):not(.selected) {
|
|
139
|
+
// Prevent covering the list border despite the higher z-index
|
|
140
|
+
border-inline-start-width: awsui.$border-item-width;
|
|
141
|
+
border-inline-start-color: awsui.$color-border-dropdown-container;
|
|
142
|
+
border-inline-end-color: awsui.$color-border-dropdown-container;
|
|
143
|
+
padding-inline: styles.$control-padding-horizontal;
|
|
144
|
+
|
|
145
|
+
&:not(.with-scrollbar) {
|
|
146
|
+
border-inline-end-width: awsui.$border-item-width;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
&.with-scrollbar {
|
|
150
|
+
border-inline-end-width: 0;
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
// Only display top border when not being rendered after the filter
|
|
154
|
+
&:not(.after-header) {
|
|
155
|
+
border-start-start-radius: awsui.$border-radius-item;
|
|
156
|
+
&:not(&.with-scrollbar) {
|
|
157
|
+
border-start-end-radius: awsui.$border-radius-item;
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
&.after-header {
|
|
161
|
+
border-block-start-color: awsui.$color-background-dropdown-item-default;
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
&.disabled.highlighted,
|
|
166
|
+
&.disabled.selected {
|
|
167
|
+
border-block-end-color: transparent;
|
|
168
|
+
border-block-start-color: transparent;
|
|
169
|
+
border-inline-start-color: transparent;
|
|
170
|
+
border-inline-end-color: transparent;
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
|
|
127
174
|
&.disabled {
|
|
128
175
|
color: awsui.$color-text-dropdown-item-disabled;
|
|
129
176
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,UAAU,UAAU;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAiB,SAAQ,UAAU;IAClD,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,wBAAyB,SAAQ,gBAAgB;IACzD,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC;AAED,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C,OAAO,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,EAAE,gBAAgB,GAAG,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,UAAU,UAAU;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,gBAAiB,SAAQ,UAAU;IAClD,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,wBAAyB,SAAQ,gBAAgB;IACzD,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC;AAED,MAAM,WAAW,WAAY,SAAQ,UAAU;IAC7C,OAAO,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,cAAc;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,EAAE,gBAAgB,GAAG,WAAW,CAAC;IACvC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,WAAY,SAAQ,kBAAkB;IACrD,MAAM,CAAC,EAAE,wBAAwB,CAAC;IAClC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/option/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { IconProps } from '../../../icon/interfaces';\nimport { BaseComponentProps } from '../../base-component';\n\ninterface BaseOption {\n value?: string;\n label?: string;\n lang?: string;\n description?: string;\n disabled?: boolean;\n disabledReason?: string;\n labelTag?: string;\n tags?: ReadonlyArray<string>;\n filteringTags?: ReadonlyArray<string>;\n iconAlt?: string;\n iconName?: IconProps.Name;\n iconUrl?: string;\n iconSvg?: React.ReactNode;\n}\n\nexport interface OptionDefinition extends BaseOption {\n __labelPrefix?: string;\n}\n\ninterface InternalOptionDefinition extends OptionDefinition {\n __customIcon?: React.ReactNode;\n}\n\nexport interface OptionGroup extends BaseOption {\n options: ReadonlyArray<OptionDefinition>;\n}\n\nexport interface DropdownOption {\n type?: string;\n disabled?: boolean;\n disabledReason?: string;\n option: OptionDefinition | OptionGroup;\n}\n\nexport interface OptionProps extends BaseComponentProps {\n option?: InternalOptionDefinition;\n triggerVariant?: boolean;\n highlightText?: string;\n highlightedOption?: boolean;\n selectedOption?: boolean;\n isGroupOption?: boolean;\n isGenericGroup?: boolean;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/option/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { IconProps } from '../../../icon/interfaces';\nimport { BaseComponentProps } from '../../base-component';\n\ninterface BaseOption {\n value?: string;\n label?: string;\n lang?: string;\n description?: string;\n disabled?: boolean;\n disabledReason?: string;\n labelTag?: string;\n tags?: ReadonlyArray<string>;\n filteringTags?: ReadonlyArray<string>;\n iconAlt?: string;\n iconName?: IconProps.Name;\n iconUrl?: string;\n iconSvg?: React.ReactNode;\n}\n\nexport interface OptionDefinition extends BaseOption {\n __labelPrefix?: string;\n}\n\ninterface InternalOptionDefinition extends OptionDefinition {\n __customIcon?: React.ReactNode;\n}\n\nexport interface OptionGroup extends BaseOption {\n options: ReadonlyArray<OptionDefinition>;\n}\n\nexport interface DropdownOption {\n type?: string;\n disabled?: boolean;\n disabledReason?: string;\n option: OptionDefinition | OptionGroup;\n afterHeader?: boolean;\n}\n\nexport interface OptionProps extends BaseComponentProps {\n option?: InternalOptionDefinition;\n triggerVariant?: boolean;\n highlightText?: string;\n highlightedOption?: boolean;\n selectedOption?: boolean;\n isGroupOption?: boolean;\n isGenericGroup?: boolean;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-options.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/filter-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAO9E,eAAO,MAAM,aAAa,UAAW,MAAM,GAAG,SAAS,cAAc,MAAM,kBAAkB,OAAO,KAAG,OAMtG,CAAC;AAkBF,eAAO,MAAM,aAAa,YACf,cAAc,cAAc,CAAC,cAC1B,MAAM,+BAEjB,cAAc,cAAc,CAgC9B,CAAC;AAEF,eAAO,MAAM,aAAa,YAAa,cAAc,YAA6D,CAAC;AAEnH,eAAO,MAAM,kBAAkB,YAAa,cAAc,YAAiC,CAAC;AAE5F,eAAO,MAAM,OAAO,YAAa,gBAAgB,GAAG,WAAW,
|
|
1
|
+
{"version":3,"file":"filter-options.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/filter-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAO9E,eAAO,MAAM,aAAa,UAAW,MAAM,GAAG,SAAS,cAAc,MAAM,kBAAkB,OAAO,KAAG,OAMtG,CAAC;AAkBF,eAAO,MAAM,aAAa,YACf,cAAc,cAAc,CAAC,cAC1B,MAAM,+BAEjB,cAAc,cAAc,CAgC9B,CAAC;AAEF,eAAO,MAAM,aAAa,YAAa,cAAc,YAA6D,CAAC;AAEnH,eAAO,MAAM,kBAAkB,YAAa,cAAc,YAAiC,CAAC;AAE5F,eAAO,MAAM,OAAO,YAAa,gBAAgB,GAAG,WAAW,0BACV,CAAC"}
|
|
@@ -52,5 +52,5 @@ export const filterOptions = (options, searchText, strictMatching = false) => {
|
|
|
52
52
|
};
|
|
53
53
|
export const isInteractive = (option) => !!option && !option.disabled && option.type !== 'parent';
|
|
54
54
|
export const isGroupInteractive = (option) => !!option && !option.disabled;
|
|
55
|
-
export const isGroup = (option) => !!option && 'options' in option;
|
|
55
|
+
export const isGroup = (option) => !!option && 'options' in option && !!option.options;
|
|
56
56
|
//# sourceMappingURL=filter-options.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"filter-options.js","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/filter-options.ts"],"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 { DropdownOption, OptionDefinition, OptionGroup } from '../interfaces';\n\ntype SearchableField = 'value' | 'label' | 'description' | 'labelTag';\ntype SearchableTagField = 'tags' | 'filteringTags';\n\nconst searchableFields: SearchableField[] = ['value', 'label', 'description', 'labelTag'];\n\nexport const matchesString = (value: string | undefined, searchText: string, strictMatching: boolean): boolean => {\n if (!value) {\n return false;\n }\n const index = value.toLowerCase().indexOf(searchText);\n return strictMatching ? index === 0 : index > -1;\n};\n\nconst matchesSingleOption = (dropdownOption: DropdownOption, text: string, strictMatching: boolean): boolean => {\n const searchText = text.toLowerCase();\n\n const option: OptionDefinition = dropdownOption.option;\n const searchStrFields = (attr: SearchableField) => matchesString(option[attr], searchText, strictMatching);\n const searchTagsFields = (attr: SearchableTagField) =>\n option[attr]?.some(value => matchesString(value, searchText, strictMatching));\n\n const searchableTagFields: SearchableTagField[] = ['tags'];\n if (!strictMatching) {\n searchableTagFields.push('filteringTags');\n }\n\n return searchableFields.some(searchStrFields) || searchableTagFields.some(searchTagsFields);\n};\n\nexport const filterOptions = (\n options: ReadonlyArray<DropdownOption>,\n searchText: string,\n strictMatching = false\n): ReadonlyArray<DropdownOption> => {\n if (searchText === '') {\n return options;\n }\n\n let currentGroup: DropdownOption | null = null;\n let parentMatched = false;\n return options.reduce<DropdownOption[]>((acc, option) => {\n if (option.type === 'parent') {\n parentMatched = false;\n currentGroup = option;\n if (matchesSingleOption(option, searchText, strictMatching)) {\n parentMatched = true;\n acc.push(currentGroup);\n }\n return acc;\n }\n if (option.type !== 'child') {\n currentGroup = null;\n parentMatched = false;\n }\n if (parentMatched) {\n acc.push(option);\n } else if (matchesSingleOption(option, searchText, strictMatching)) {\n if (currentGroup) {\n acc.push(currentGroup);\n currentGroup = null;\n }\n acc.push(option);\n }\n return acc;\n }, []);\n};\n\nexport const isInteractive = (option?: DropdownOption) => !!option && !option.disabled && option.type !== 'parent';\n\nexport const isGroupInteractive = (option?: DropdownOption) => !!option && !option.disabled;\n\nexport const isGroup = (option?: OptionDefinition | OptionGroup): option is OptionGroup =>\n !!option && 'options' in option;\n"]}
|
|
1
|
+
{"version":3,"file":"filter-options.js","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/filter-options.ts"],"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 { DropdownOption, OptionDefinition, OptionGroup } from '../interfaces';\n\ntype SearchableField = 'value' | 'label' | 'description' | 'labelTag';\ntype SearchableTagField = 'tags' | 'filteringTags';\n\nconst searchableFields: SearchableField[] = ['value', 'label', 'description', 'labelTag'];\n\nexport const matchesString = (value: string | undefined, searchText: string, strictMatching: boolean): boolean => {\n if (!value) {\n return false;\n }\n const index = value.toLowerCase().indexOf(searchText);\n return strictMatching ? index === 0 : index > -1;\n};\n\nconst matchesSingleOption = (dropdownOption: DropdownOption, text: string, strictMatching: boolean): boolean => {\n const searchText = text.toLowerCase();\n\n const option: OptionDefinition = dropdownOption.option;\n const searchStrFields = (attr: SearchableField) => matchesString(option[attr], searchText, strictMatching);\n const searchTagsFields = (attr: SearchableTagField) =>\n option[attr]?.some(value => matchesString(value, searchText, strictMatching));\n\n const searchableTagFields: SearchableTagField[] = ['tags'];\n if (!strictMatching) {\n searchableTagFields.push('filteringTags');\n }\n\n return searchableFields.some(searchStrFields) || searchableTagFields.some(searchTagsFields);\n};\n\nexport const filterOptions = (\n options: ReadonlyArray<DropdownOption>,\n searchText: string,\n strictMatching = false\n): ReadonlyArray<DropdownOption> => {\n if (searchText === '') {\n return options;\n }\n\n let currentGroup: DropdownOption | null = null;\n let parentMatched = false;\n return options.reduce<DropdownOption[]>((acc, option) => {\n if (option.type === 'parent') {\n parentMatched = false;\n currentGroup = option;\n if (matchesSingleOption(option, searchText, strictMatching)) {\n parentMatched = true;\n acc.push(currentGroup);\n }\n return acc;\n }\n if (option.type !== 'child') {\n currentGroup = null;\n parentMatched = false;\n }\n if (parentMatched) {\n acc.push(option);\n } else if (matchesSingleOption(option, searchText, strictMatching)) {\n if (currentGroup) {\n acc.push(currentGroup);\n currentGroup = null;\n }\n acc.push(option);\n }\n return acc;\n }, []);\n};\n\nexport const isInteractive = (option?: DropdownOption) => !!option && !option.disabled && option.type !== 'parent';\n\nexport const isGroupInteractive = (option?: DropdownOption) => !!option && !option.disabled;\n\nexport const isGroup = (option?: OptionDefinition | OptionGroup): option is OptionGroup =>\n !!option && 'options' in option && !!option.options;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flatten-options.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/flatten-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"flatten-options.d.ts","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/flatten-options.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG9E,eAAO,MAAM,cAAc,YAAa,cAAc,gBAAgB,GAAG,WAAW,CAAC;;;CAmCpF,CAAC"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { __rest } from "tslib";
|
|
2
|
+
import { isGroup } from './filter-options';
|
|
2
3
|
export const flattenOptions = (options) => {
|
|
3
4
|
const parentMap = new Map();
|
|
4
5
|
const flatOptions = options.reduce((acc, option) => {
|
|
5
|
-
if (
|
|
6
|
+
if (isGroup(option)) {
|
|
6
7
|
const { options } = option, rest = __rest(option, ["options"]);
|
|
7
8
|
const parentDropdownOption = { type: 'parent', option };
|
|
8
9
|
const allOptionsDisabled = options.every(option => option.disabled);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"flatten-options.js","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/flatten-options.ts"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"flatten-options.js","sourceRoot":"","sources":["../../../../../../src/internal/components/option/utils/flatten-options.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAE3C,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,OAAsD,EAAE,EAAE;IACvF,MAAM,SAAS,GAAG,IAAI,GAAG,EAAkC,CAAC;IAE5D,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAmB,CAAC,GAAG,EAAE,MAAM,EAAE,EAAE;QACnE,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;YACnB,MAAM,EAAE,OAAO,KAAc,MAAM,EAAf,IAAI,UAAK,MAAM,EAA7B,WAAoB,CAAS,CAAC;YACpC,MAAM,oBAAoB,GAAmB,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC;YACxE,MAAM,kBAAkB,GAAG,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;YACpE,IAAI,MAAM,CAAC,QAAQ,IAAI,kBAAkB,EAAE;gBACzC,oBAAoB,CAAC,QAAQ,GAAG,IAAI,CAAC;aACtC;YACD,GAAG,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;YAC/B,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;gBACtB,MAAM,mBAAmB,GAAmB,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC;gBAC7E,IAAI,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,EAAE;oBACnC,mBAAmB,CAAC,QAAQ,GAAG,IAAI,CAAC;iBACrC;gBACD,GAAG,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;gBAC9B,SAAS,CAAC,GAAG,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,CAAC;YAC3D,CAAC,CAAC,CAAC;SACJ;aAAM;YACL,MAAM,cAAc,GAAmB,EAAE,MAAM,EAAE,CAAC;YAClD,IAAI,MAAM,CAAC,QAAQ,EAAE;gBACnB,cAAc,CAAC,QAAQ,GAAG,IAAI,CAAC;aAChC;YACD,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;SAC1B;QAED,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO;QACL,WAAW;QACX,SAAS;KACV,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DropdownOption, OptionDefinition, OptionGroup } from '../interfaces';\nimport { isGroup } from './filter-options';\n\nexport const flattenOptions = (options: ReadonlyArray<OptionDefinition | OptionGroup>) => {\n const parentMap = new Map<DropdownOption, DropdownOption>();\n\n const flatOptions = options.reduce<DropdownOption[]>((acc, option) => {\n if (isGroup(option)) {\n const { options, ...rest } = option;\n const parentDropdownOption: DropdownOption = { type: 'parent', option };\n const allOptionsDisabled = options.every(option => option.disabled);\n if (option.disabled || allOptionsDisabled) {\n parentDropdownOption.disabled = true;\n }\n acc.push(parentDropdownOption);\n options.forEach(child => {\n const childDropdownOption: DropdownOption = { type: 'child', option: child };\n if (rest.disabled || child.disabled) {\n childDropdownOption.disabled = true;\n }\n acc.push(childDropdownOption);\n parentMap.set(childDropdownOption, parentDropdownOption);\n });\n } else {\n const dropdownOption: DropdownOption = { option };\n if (option.disabled) {\n dropdownOption.disabled = true;\n }\n acc.push(dropdownOption);\n }\n\n return acc;\n }, []);\n\n return {\n flatOptions,\n parentMap,\n };\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAOvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKnD,OAAO,EAAE,mBAAmB,EAAE,CAAC;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAOvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAKnD,OAAO,EAAE,mBAAmB,EAAE,CAAC;;AAwH/B,wBAAgD"}
|
|
@@ -9,7 +9,7 @@ import { getAnalyticsSelectActionMetadata } from './analytics-metadata/utils';
|
|
|
9
9
|
import analyticsSelectors from './analytics-metadata/styles.css.js';
|
|
10
10
|
import styles from './styles.css.js';
|
|
11
11
|
const SelectableItem = (_a, ref) => {
|
|
12
|
-
var { children: content, ariaSelected, ariaChecked, selected, highlighted, disabled, hasBackground, isParent, isChild, virtualPosition, padBottom, isNextSelected, useInteractiveGroups, screenReaderContent, ariaPosinset, ariaSetsize, highlightType, value } = _a, restProps = __rest(_a, ["children", "ariaSelected", "ariaChecked", "selected", "highlighted", "disabled", "hasBackground", "isParent", "isChild", "virtualPosition", "padBottom", "isNextSelected", "useInteractiveGroups", "screenReaderContent", "ariaPosinset", "ariaSetsize", "highlightType", "value"]);
|
|
12
|
+
var { children: content, ariaSelected, ariaChecked, selected, highlighted, disabled, hasBackground, isParent, isChild, virtualPosition, padBottom, isNextSelected, useInteractiveGroups, screenReaderContent, ariaPosinset, ariaSetsize, highlightType, value, sticky, afterHeader, withScrollbar } = _a, restProps = __rest(_a, ["children", "ariaSelected", "ariaChecked", "selected", "highlighted", "disabled", "hasBackground", "isParent", "isChild", "virtualPosition", "padBottom", "isNextSelected", "useInteractiveGroups", "screenReaderContent", "ariaPosinset", "ariaSetsize", "highlightType", "value", "sticky", "afterHeader", "withScrollbar"]);
|
|
13
13
|
const _b = getBaseProps(restProps), { className } = _b, rest = __rest(_b, ["className"]);
|
|
14
14
|
const classNames = clsx(className, styles['selectable-item'], {
|
|
15
15
|
[styles.selected]: selected,
|
|
@@ -20,10 +20,13 @@ const SelectableItem = (_a, ref) => {
|
|
|
20
20
|
[styles.child]: isChild,
|
|
21
21
|
[styles['is-keyboard']]: highlightType === 'keyboard',
|
|
22
22
|
[styles.disabled]: disabled,
|
|
23
|
-
[styles.virtual]: virtualPosition !== undefined,
|
|
23
|
+
[styles.virtual]: virtualPosition !== undefined && !sticky,
|
|
24
24
|
[styles['pad-bottom']]: padBottom,
|
|
25
25
|
[styles['next-item-selected']]: isNextSelected,
|
|
26
26
|
[styles.interactiveGroups]: useInteractiveGroups,
|
|
27
|
+
[styles.sticky]: sticky,
|
|
28
|
+
[styles['after-header']]: !!afterHeader,
|
|
29
|
+
[styles['with-scrollbar']]: withScrollbar,
|
|
27
30
|
});
|
|
28
31
|
const contentRef = useRef(null);
|
|
29
32
|
const screenReaderContentRef = useRef(null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,gCAAgC,EAAE,MAAM,4BAA4B,CAAC;AAG9E,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,cAAc,GAAG,CACrB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/index.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, { useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { getBaseProps } from '../../base-component';\nimport { getAnalyticsSelectActionMetadata } from './analytics-metadata/utils';\nimport { SelectableItemProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport { SelectableItemProps };\n\nconst SelectableItem = (\n {\n children: content,\n ariaSelected,\n ariaChecked,\n selected,\n highlighted,\n disabled,\n hasBackground,\n isParent,\n isChild,\n virtualPosition,\n padBottom,\n isNextSelected,\n useInteractiveGroups,\n screenReaderContent,\n ariaPosinset,\n ariaSetsize,\n highlightType,\n value,\n sticky,\n afterHeader,\n withScrollbar,\n ...restProps\n }: SelectableItemProps,\n ref: React.Ref<HTMLDivElement>\n) => {\n const { className, ...rest } = getBaseProps(restProps);\n const classNames = clsx(className, styles['selectable-item'], {\n [styles.selected]: selected,\n [styles.highlighted]: highlighted,\n [styles['has-background']]: hasBackground,\n [styles.parent]: isParent,\n [analyticsSelectors.parent]: isParent,\n [styles.child]: isChild,\n [styles['is-keyboard']]: highlightType === 'keyboard',\n [styles.disabled]: disabled,\n [styles.virtual]: virtualPosition !== undefined && !sticky,\n [styles['pad-bottom']]: padBottom,\n [styles['next-item-selected']]: isNextSelected,\n [styles.interactiveGroups]: useInteractiveGroups,\n [styles.sticky]: sticky,\n [styles['after-header']]: !!afterHeader,\n [styles['with-scrollbar']]: withScrollbar,\n });\n\n const contentRef = useRef<HTMLDivElement>(null);\n const screenReaderContentRef = useRef<HTMLDivElement>(null);\n\n useLayoutEffect(() => {\n // the state of aria-hidden and announcement is not set back because NVDA+Firefox would announce\n // the item which lost highlight\n // set aria-hidden true when there is announcement content, so that screen reader still announce\n // meaningful content when navigate with screen reader cursor\n // imperatively update to avoid announcement made multiple times when content updates\n if (highlighted && screenReaderContent) {\n if (contentRef.current) {\n contentRef.current.setAttribute('aria-hidden', 'true');\n }\n if (screenReaderContentRef.current) {\n screenReaderContentRef.current.textContent = screenReaderContent;\n }\n }\n }, [highlighted, screenReaderContent, contentRef, screenReaderContentRef]);\n\n const style =\n virtualPosition !== undefined\n ? {\n transform: `translateY(${virtualPosition}px)`,\n }\n : undefined;\n\n const a11yProperties: Record<string, string | number | boolean | undefined> = {\n 'aria-disabled': disabled,\n };\n\n if (isParent && !useInteractiveGroups) {\n a11yProperties['aria-hidden'] = true;\n }\n\n if (ariaSelected !== undefined) {\n a11yProperties['aria-selected'] = ariaSelected;\n }\n\n // Safari+VO needs aria-checked for multi-selection. Otherwise it only announces selected option even though another option is highlighted.\n if (ariaChecked !== undefined) {\n a11yProperties['aria-checked'] = ariaChecked;\n }\n\n if (ariaPosinset && ariaSetsize) {\n a11yProperties['aria-posinset'] = ariaPosinset;\n a11yProperties['aria-setsize'] = ariaSetsize;\n }\n\n if (restProps.ariaDescribedby) {\n a11yProperties['aria-describedby'] = restProps.ariaDescribedby;\n }\n\n return (\n <li\n role=\"option\"\n className={classNames}\n style={style}\n {...a11yProperties}\n {...rest}\n {...(isParent || disabled\n ? {}\n : getAnalyticsMetadataAttribute(getAnalyticsSelectActionMetadata({ isChild, value, ...restProps })))}\n >\n <div className={clsx(styles['option-content'], analyticsSelectors['option-content'])} ref={contentRef}>\n {content}\n </div>\n <div className={styles['measure-strut']} ref={ref} />\n <div className={styles['screenreader-content']} ref={screenReaderContentRef}></div>\n </li>\n );\n};\n\nexport default React.forwardRef(SelectableItem);\n"]}
|
|
@@ -19,6 +19,9 @@ export type SelectableItemProps = BaseComponentProps & {
|
|
|
19
19
|
highlightType?: HighlightType['type'];
|
|
20
20
|
ariaDescribedby?: string;
|
|
21
21
|
value?: string;
|
|
22
|
+
sticky?: boolean;
|
|
23
|
+
afterHeader?: boolean;
|
|
24
|
+
withScrollbar?: boolean;
|
|
22
25
|
} & ({
|
|
23
26
|
ariaSelected?: boolean;
|
|
24
27
|
ariaChecked?: never;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,GAAG;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":";AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,4CAA4C,CAAC;AAE3E,MAAM,MAAM,mBAAmB,GAAG,kBAAkB,GAAG;IACrD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,GAAG,CAAC;IAAE,YAAY,CAAC,EAAE,OAAO,CAAC;IAAC,WAAW,CAAC,EAAE,KAAK,CAAA;CAAE,GAAG;IAAE,YAAY,CAAC,EAAE,KAAK,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,CAAA;CAAE,CAAC,CAAC;AAElH,MAAM,WAAW,kBAAkB;IACjC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseComponentProps } from '../../base-component';\nimport { HighlightType } from '../options-list/utils/use-highlight-option';\n\nexport type SelectableItemProps = BaseComponentProps & {\n children: React.ReactNode;\n selected?: boolean;\n highlighted?: boolean;\n disabled?: boolean;\n hasBackground?: boolean;\n isParent?: boolean;\n isChild?: boolean;\n virtualPosition?: number;\n padBottom?: boolean;\n isNextSelected?: boolean;\n useInteractiveGroups?: boolean;\n screenReaderContent?: string;\n ariaPosinset?: number;\n ariaSetsize?: number;\n highlightType?: HighlightType['type'];\n ariaDescribedby?: string;\n value?: string;\n} & ({ ariaSelected?: boolean; ariaChecked?: never } | { ariaSelected?: never; ariaChecked?: boolean | 'mixed' });\n\nexport interface ItemDataAttributes {\n 'data-group-index'?: string;\n 'data-child-index'?: string;\n 'data-in-group-index'?: string;\n 'data-test-index'?: string;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/internal/components/selectable-item/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseComponentProps } from '../../base-component';\nimport { HighlightType } from '../options-list/utils/use-highlight-option';\n\nexport type SelectableItemProps = BaseComponentProps & {\n children: React.ReactNode;\n selected?: boolean;\n highlighted?: boolean;\n disabled?: boolean;\n hasBackground?: boolean;\n isParent?: boolean;\n isChild?: boolean;\n virtualPosition?: number;\n padBottom?: boolean;\n isNextSelected?: boolean;\n useInteractiveGroups?: boolean;\n screenReaderContent?: string;\n ariaPosinset?: number;\n ariaSetsize?: number;\n highlightType?: HighlightType['type'];\n ariaDescribedby?: string;\n value?: string;\n sticky?: boolean;\n afterHeader?: boolean;\n withScrollbar?: boolean;\n} & ({ ariaSelected?: boolean; ariaChecked?: never } | { ariaSelected?: never; ariaChecked?: boolean | 'mixed' });\n\nexport interface ItemDataAttributes {\n 'data-group-index'?: string;\n 'data-child-index'?: string;\n 'data-in-group-index'?: string;\n 'data-test-index'?: string;\n}\n"]}
|
|
@@ -1,21 +1,24 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"selectable-item": "awsui_selectable-
|
|
5
|
-
"pad-bottom": "awsui_pad-
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
4
|
+
"selectable-item": "awsui_selectable-item_15o6u_1xp7c_145",
|
|
5
|
+
"pad-bottom": "awsui_pad-bottom_15o6u_1xp7c_167",
|
|
6
|
+
"virtual": "awsui_virtual_15o6u_1xp7c_171",
|
|
7
|
+
"has-background": "awsui_has-background_15o6u_1xp7c_174",
|
|
8
|
+
"highlighted": "awsui_highlighted_15o6u_1xp7c_177",
|
|
9
|
+
"selected": "awsui_selected_15o6u_1xp7c_177",
|
|
10
|
+
"disabled": "awsui_disabled_15o6u_1xp7c_195",
|
|
11
|
+
"next-item-selected": "awsui_next-item-selected_15o6u_1xp7c_205",
|
|
12
|
+
"is-keyboard": "awsui_is-keyboard_15o6u_1xp7c_217",
|
|
13
|
+
"parent": "awsui_parent_15o6u_1xp7c_221",
|
|
14
|
+
"interactiveGroups": "awsui_interactiveGroups_15o6u_1xp7c_225",
|
|
15
|
+
"child": "awsui_child_15o6u_1xp7c_241",
|
|
16
|
+
"sticky": "awsui_sticky_15o6u_1xp7c_247",
|
|
17
|
+
"with-scrollbar": "awsui_with-scrollbar_15o6u_1xp7c_259",
|
|
18
|
+
"after-header": "awsui_after-header_15o6u_1xp7c_265",
|
|
19
|
+
"measure-strut": "awsui_measure-strut_15o6u_1xp7c_300",
|
|
20
|
+
"measure-strut-first": "awsui_measure-strut-first_15o6u_1xp7c_309",
|
|
21
|
+
"screenreader-content": "awsui_screenreader-content_15o6u_1xp7c_313",
|
|
22
|
+
"option-content": "awsui_option-content_15o6u_1xp7c_319"
|
|
20
23
|
};
|
|
21
24
|
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
*/
|
|
143
143
|
/* Style used for links in slots/components that are text heavy, to help links stand out among
|
|
144
144
|
surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
|
|
145
|
-
.awsui_selectable-
|
|
145
|
+
.awsui_selectable-item_15o6u_1xp7c_145:not(#\9) {
|
|
146
146
|
font-size: var(--font-size-body-m-6wxxs5, 14px);
|
|
147
147
|
line-height: var(--line-height-body-m-gw0130, 22px);
|
|
148
148
|
color: var(--color-text-body-default-agk00h, #16191f);
|
|
@@ -164,17 +164,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
164
164
|
padding-block: calc(var(--space-xxs-y2432o, 4px) + var(--border-item-width-bjacxs, 1px) - var(--border-divider-list-width-x6rz7e, 1px));
|
|
165
165
|
padding-inline: calc(var(--space-field-horizontal-cxdor9, 8px) + var(--border-item-width-bjacxs, 1px));
|
|
166
166
|
}
|
|
167
|
-
.awsui_selectable-
|
|
167
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_pad-bottom_15o6u_1xp7c_167:not(#\9) {
|
|
168
168
|
padding-block-end: calc(calc(var(--space-xxs-y2432o, 4px) + var(--border-item-width-bjacxs, 1px) - var(--border-divider-list-width-x6rz7e, 1px)) + var(--space-xxxs-gn3248, 2px));
|
|
169
169
|
border-block-end-color: transparent;
|
|
170
170
|
}
|
|
171
|
-
.awsui_selectable-
|
|
171
|
+
.awsui_selectable-item_15o6u_1xp7c_145:not(#\9):not(:first-child), .awsui_selectable-item_15o6u_1xp7c_145.awsui_virtual_15o6u_1xp7c_171:not(#\9) {
|
|
172
172
|
margin-block-start: calc(-1 * var(--border-item-width-bjacxs, 1px));
|
|
173
173
|
}
|
|
174
|
-
.awsui_selectable-
|
|
174
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_has-background_15o6u_1xp7c_174:not(#\9) {
|
|
175
175
|
background-color: var(--color-background-dropdown-item-hover-r5jqv1, #f2f3f3);
|
|
176
176
|
}
|
|
177
|
-
.awsui_selectable-
|
|
177
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_highlighted_15o6u_1xp7c_177:not(#\9), .awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177:not(#\9) {
|
|
178
178
|
color: var(--color-text-dropdown-item-highlighted-xxoapj, #16191f);
|
|
179
179
|
border-width: var(--border-item-width-bjacxs, 1px);
|
|
180
180
|
border-start-start-radius: var(--border-radius-item-q4wr0w, 0px);
|
|
@@ -184,87 +184,120 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
184
184
|
padding-block: var(--space-xxs-y2432o, 4px);
|
|
185
185
|
padding-inline: var(--space-field-horizontal-cxdor9, 8px);
|
|
186
186
|
}
|
|
187
|
-
.awsui_selectable-
|
|
187
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_highlighted_15o6u_1xp7c_177.awsui_pad-bottom_15o6u_1xp7c_167:not(#\9), .awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177.awsui_pad-bottom_15o6u_1xp7c_167:not(#\9) {
|
|
188
188
|
padding-block-end: calc(var(--space-xxs-y2432o, 4px) + var(--space-xxxs-gn3248, 2px));
|
|
189
189
|
}
|
|
190
|
-
.awsui_selectable-
|
|
190
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_highlighted_15o6u_1xp7c_177:not(#\9) {
|
|
191
191
|
z-index: 3;
|
|
192
192
|
background-color: var(--color-background-dropdown-item-hover-r5jqv1, #f2f3f3);
|
|
193
193
|
border-color: var(--color-border-dropdown-item-hover-69t7jr, #879596);
|
|
194
194
|
}
|
|
195
|
-
.awsui_selectable-
|
|
195
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_highlighted_15o6u_1xp7c_177.awsui_disabled_15o6u_1xp7c_195:not(#\9) {
|
|
196
196
|
color: var(--color-text-dropdown-item-dimmed-xe0faj, #aab7b8);
|
|
197
197
|
border-color: var(--color-border-dropdown-item-dimmed-hover-0rwxkv, #879596);
|
|
198
198
|
background-color: var(--color-background-dropdown-item-dimmed-dtqtu6, transparent);
|
|
199
199
|
}
|
|
200
|
-
.awsui_selectable-
|
|
200
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177:not(#\9) {
|
|
201
201
|
z-index: 2;
|
|
202
202
|
background-color: var(--color-background-dropdown-item-selected-i187hy, #f1faff);
|
|
203
203
|
border-color: var(--color-border-dropdown-item-selected-3l3bsn, #eaeded);
|
|
204
204
|
}
|
|
205
|
-
.awsui_selectable-
|
|
205
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177.awsui_next-item-selected_15o6u_1xp7c_205:not(#\9) {
|
|
206
206
|
border-end-start-radius: 0;
|
|
207
207
|
border-end-end-radius: 0;
|
|
208
208
|
}
|
|
209
|
-
.awsui_selectable-
|
|
209
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177.awsui_highlighted_15o6u_1xp7c_177:not(#\9) {
|
|
210
210
|
border-color: var(--color-border-dropdown-item-hover-69t7jr, #879596);
|
|
211
211
|
z-index: 3;
|
|
212
212
|
}
|
|
213
|
-
.awsui_selectable-
|
|
213
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177 + .awsui_selectable-item_15o6u_1xp7c_145.awsui_selected_15o6u_1xp7c_177:not(#\9) {
|
|
214
214
|
border-start-start-radius: 0;
|
|
215
215
|
border-start-end-radius: 0;
|
|
216
216
|
}
|
|
217
|
-
.awsui_selectable-
|
|
217
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_highlighted_15o6u_1xp7c_177.awsui_is-keyboard_15o6u_1xp7c_217:not(#\9) {
|
|
218
218
|
border-color: var(--color-border-dropdown-item-focused-6wa092, #0073bb);
|
|
219
219
|
box-shadow: inset 0 0 0 var(--border-control-focus-ring-shadow-spread-kvz439, 1px) var(--color-border-item-focused-q68bgg, #0073bb);
|
|
220
220
|
}
|
|
221
|
-
.awsui_selectable-
|
|
221
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_parent_15o6u_1xp7c_221:not(#\9) {
|
|
222
222
|
font-weight: bold;
|
|
223
223
|
color: var(--color-text-dropdown-group-label-h1uzwg, #545b64);
|
|
224
224
|
}
|
|
225
|
-
.awsui_selectable-
|
|
225
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_parent_15o6u_1xp7c_221:not(#\9):not(.awsui_interactiveGroups_15o6u_1xp7c_225) {
|
|
226
226
|
border-block-start-color: var(--color-border-dropdown-group-ze4esa, #eaeded);
|
|
227
227
|
padding-block: var(--space-xs-6dgkww, 8px);
|
|
228
228
|
padding-inline: var(--space-xs-6dgkww, 8px);
|
|
229
229
|
}
|
|
230
|
-
.awsui_selectable-
|
|
230
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_parent_15o6u_1xp7c_221.awsui_interactiveGroups_15o6u_1xp7c_225:not(#\9) {
|
|
231
231
|
padding-block: calc(var(--space-xs-6dgkww, 8px) + var(--border-item-width-bjacxs, 1px) - var(--border-divider-list-width-x6rz7e, 1px));
|
|
232
232
|
padding-inline: calc(var(--space-field-horizontal-cxdor9, 8px) + var(--border-item-width-bjacxs, 1px));
|
|
233
233
|
}
|
|
234
|
-
.awsui_selectable-
|
|
234
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_parent_15o6u_1xp7c_221.awsui_interactiveGroups_15o6u_1xp7c_225.awsui_highlighted_15o6u_1xp7c_177:not(#\9) {
|
|
235
235
|
color: var(--color-text-dropdown-item-highlighted-xxoapj, #16191f);
|
|
236
236
|
}
|
|
237
|
-
.awsui_selectable-
|
|
237
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_parent_15o6u_1xp7c_221.awsui_interactiveGroups_15o6u_1xp7c_225.awsui_highlighted_15o6u_1xp7c_177:not(#\9), .awsui_selectable-item_15o6u_1xp7c_145.awsui_parent_15o6u_1xp7c_221.awsui_interactiveGroups_15o6u_1xp7c_225.awsui_selected_15o6u_1xp7c_177:not(#\9) {
|
|
238
238
|
padding-block: var(--space-xs-6dgkww, 8px);
|
|
239
239
|
padding-inline: var(--space-field-horizontal-cxdor9, 8px);
|
|
240
240
|
}
|
|
241
|
-
.awsui_selectable-
|
|
241
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_child_15o6u_1xp7c_241:not(#\9) {
|
|
242
242
|
padding-inline-start: calc(var(--space-xxl-thzxkv, 32px) + var(--border-item-width-bjacxs, 1px));
|
|
243
243
|
}
|
|
244
|
-
.awsui_selectable-
|
|
244
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_child_15o6u_1xp7c_241.awsui_highlighted_15o6u_1xp7c_177:not(#\9), .awsui_selectable-item_15o6u_1xp7c_145.awsui_child_15o6u_1xp7c_241.awsui_selected_15o6u_1xp7c_177:not(#\9) {
|
|
245
245
|
padding-inline-start: var(--space-xxl-thzxkv, 32px);
|
|
246
246
|
}
|
|
247
|
-
.awsui_selectable-
|
|
247
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9) {
|
|
248
|
+
position: sticky;
|
|
249
|
+
inset-block-start: 0;
|
|
250
|
+
margin-block-end: calc(var(--border-item-width-bjacxs, 1px) - var(--border-divider-list-width-x6rz7e, 1px));
|
|
251
|
+
z-index: 4;
|
|
252
|
+
}
|
|
253
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9):not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177) {
|
|
254
|
+
border-inline-start-width: var(--border-item-width-bjacxs, 1px);
|
|
255
|
+
border-inline-start-color: var(--color-border-dropdown-container-5hmq6y, transparent);
|
|
256
|
+
border-inline-end-color: var(--color-border-dropdown-container-5hmq6y, transparent);
|
|
257
|
+
padding-inline: var(--space-field-horizontal-cxdor9, 8px);
|
|
258
|
+
}
|
|
259
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9):not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177):not(.awsui_with-scrollbar_15o6u_1xp7c_259) {
|
|
260
|
+
border-inline-end-width: var(--border-item-width-bjacxs, 1px);
|
|
261
|
+
}
|
|
262
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9):not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177).awsui_with-scrollbar_15o6u_1xp7c_259 {
|
|
263
|
+
border-inline-end-width: 0;
|
|
264
|
+
}
|
|
265
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9):not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177):not(.awsui_after-header_15o6u_1xp7c_265) {
|
|
266
|
+
border-start-start-radius: var(--border-radius-item-q4wr0w, 0px);
|
|
267
|
+
}
|
|
268
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9):not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177):not(.awsui_after-header_15o6u_1xp7c_265):not(.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177):not(.awsui_after-header_15o6u_1xp7c_265).awsui_with-scrollbar_15o6u_1xp7c_259) {
|
|
269
|
+
border-start-end-radius: var(--border-radius-item-q4wr0w, 0px);
|
|
270
|
+
}
|
|
271
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247:not(#\9):not(.awsui_highlighted_15o6u_1xp7c_177):not(.awsui_selected_15o6u_1xp7c_177).awsui_after-header_15o6u_1xp7c_265 {
|
|
272
|
+
border-block-start-color: var(--color-background-dropdown-item-default-r1zm6a, #ffffff);
|
|
273
|
+
}
|
|
274
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247.awsui_disabled_15o6u_1xp7c_195.awsui_highlighted_15o6u_1xp7c_177:not(#\9), .awsui_selectable-item_15o6u_1xp7c_145.awsui_sticky_15o6u_1xp7c_247.awsui_disabled_15o6u_1xp7c_195.awsui_selected_15o6u_1xp7c_177:not(#\9) {
|
|
275
|
+
border-block-end-color: transparent;
|
|
276
|
+
border-block-start-color: transparent;
|
|
277
|
+
border-inline-start-color: transparent;
|
|
278
|
+
border-inline-end-color: transparent;
|
|
279
|
+
}
|
|
280
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_disabled_15o6u_1xp7c_195:not(#\9) {
|
|
248
281
|
color: var(--color-text-dropdown-item-disabled-gk1x2u, #aab7b8);
|
|
249
282
|
}
|
|
250
|
-
.awsui_selectable-
|
|
283
|
+
.awsui_selectable-item_15o6u_1xp7c_145:not(#\9):not(.awsui_disabled_15o6u_1xp7c_195):not(.awsui_parent_15o6u_1xp7c_221) {
|
|
251
284
|
cursor: pointer;
|
|
252
285
|
}
|
|
253
|
-
.awsui_selectable-
|
|
286
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_interactiveGroups_15o6u_1xp7c_225:not(#\9):not(.awsui_disabled_15o6u_1xp7c_195) {
|
|
254
287
|
cursor: pointer;
|
|
255
288
|
}
|
|
256
|
-
.awsui_selectable-
|
|
289
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_virtual_15o6u_1xp7c_171:not(#\9) {
|
|
257
290
|
position: absolute;
|
|
258
291
|
inset-block-start: var(--border-dropdown-virtual-offset-width-mojxsv, 0px);
|
|
259
292
|
inset-inline-start: 0;
|
|
260
293
|
inline-size: 100%;
|
|
261
294
|
box-sizing: border-box;
|
|
262
295
|
}
|
|
263
|
-
.awsui_selectable-
|
|
296
|
+
.awsui_selectable-item_15o6u_1xp7c_145.awsui_virtual_15o6u_1xp7c_171:not(#\9):first-of-type:not(.awsui_selected_15o6u_1xp7c_177, .awsui_highlighted_15o6u_1xp7c_177) {
|
|
264
297
|
border-block-start-color: var(--color-border-dropdown-item-top-k8ts00, #eaeded);
|
|
265
298
|
}
|
|
266
299
|
|
|
267
|
-
.awsui_measure-
|
|
300
|
+
.awsui_measure-strut_15o6u_1xp7c_300:not(#\9) {
|
|
268
301
|
position: absolute;
|
|
269
302
|
pointer-events: none;
|
|
270
303
|
block-size: 100%;
|
|
@@ -273,16 +306,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
273
306
|
inset-inline-start: 0;
|
|
274
307
|
padding-block-start: var(--border-divider-list-width-x6rz7e, 1px);
|
|
275
308
|
}
|
|
276
|
-
.awsui_measure-strut-
|
|
309
|
+
.awsui_measure-strut-first_15o6u_1xp7c_309:not(#\9) {
|
|
277
310
|
padding-block-end: var(--border-divider-list-width-x6rz7e, 1px);
|
|
278
311
|
}
|
|
279
312
|
|
|
280
|
-
.awsui_screenreader-
|
|
313
|
+
.awsui_screenreader-content_15o6u_1xp7c_313:not(#\9) {
|
|
281
314
|
position: absolute !important;
|
|
282
315
|
inset-block-start: -9999px !important;
|
|
283
316
|
inset-inline-start: -9999px !important;
|
|
284
317
|
}
|
|
285
318
|
|
|
286
|
-
.awsui_option-
|
|
319
|
+
.awsui_option-content_15o6u_1xp7c_319:not(#\9) {
|
|
287
320
|
/* used in test-utils */
|
|
288
321
|
}
|
|
@@ -2,21 +2,24 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"selectable-item": "awsui_selectable-
|
|
6
|
-
"pad-bottom": "awsui_pad-
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
5
|
+
"selectable-item": "awsui_selectable-item_15o6u_1xp7c_145",
|
|
6
|
+
"pad-bottom": "awsui_pad-bottom_15o6u_1xp7c_167",
|
|
7
|
+
"virtual": "awsui_virtual_15o6u_1xp7c_171",
|
|
8
|
+
"has-background": "awsui_has-background_15o6u_1xp7c_174",
|
|
9
|
+
"highlighted": "awsui_highlighted_15o6u_1xp7c_177",
|
|
10
|
+
"selected": "awsui_selected_15o6u_1xp7c_177",
|
|
11
|
+
"disabled": "awsui_disabled_15o6u_1xp7c_195",
|
|
12
|
+
"next-item-selected": "awsui_next-item-selected_15o6u_1xp7c_205",
|
|
13
|
+
"is-keyboard": "awsui_is-keyboard_15o6u_1xp7c_217",
|
|
14
|
+
"parent": "awsui_parent_15o6u_1xp7c_221",
|
|
15
|
+
"interactiveGroups": "awsui_interactiveGroups_15o6u_1xp7c_225",
|
|
16
|
+
"child": "awsui_child_15o6u_1xp7c_241",
|
|
17
|
+
"sticky": "awsui_sticky_15o6u_1xp7c_247",
|
|
18
|
+
"with-scrollbar": "awsui_with-scrollbar_15o6u_1xp7c_259",
|
|
19
|
+
"after-header": "awsui_after-header_15o6u_1xp7c_265",
|
|
20
|
+
"measure-strut": "awsui_measure-strut_15o6u_1xp7c_300",
|
|
21
|
+
"measure-strut-first": "awsui_measure-strut-first_15o6u_1xp7c_309",
|
|
22
|
+
"screenreader-content": "awsui_screenreader-content_15o6u_1xp7c_313",
|
|
23
|
+
"option-content": "awsui_option-content_15o6u_1xp7c_319"
|
|
21
24
|
};
|
|
22
25
|
|
|
@@ -4,6 +4,7 @@ interface UseVirtualProps<Item> {
|
|
|
4
4
|
items: readonly Item[];
|
|
5
5
|
parentRef: React.RefObject<HTMLElement>;
|
|
6
6
|
estimateSize: () => number;
|
|
7
|
+
firstItemSticky?: boolean;
|
|
7
8
|
}
|
|
8
9
|
interface RowVirtualizer {
|
|
9
10
|
virtualItems: VirtualItem[];
|
|
@@ -22,6 +23,6 @@ interface RowVirtualizer {
|
|
|
22
23
|
* The number of item refs assignments is limited to MAX_ITEM_MOUNTS unless items or indices change.
|
|
23
24
|
* That is based on the assumption the item height stays constant after its first render.
|
|
24
25
|
*/
|
|
25
|
-
export declare function useVirtual<Item extends object>({ items, parentRef, estimateSize, }: UseVirtualProps<Item>): RowVirtualizer;
|
|
26
|
+
export declare function useVirtual<Item extends object>({ items, parentRef, estimateSize, firstItemSticky, }: UseVirtualProps<Item>): RowVirtualizer;
|
|
26
27
|
export {};
|
|
27
28
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-virtual/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAmC,WAAW,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/hooks/use-virtual/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAmC,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAK1F,UAAU,eAAe,CAAC,IAAI;IAC5B,KAAK,EAAE,SAAS,IAAI,EAAE,CAAC;IACvB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,YAAY,EAAE,MAAM,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,UAAU,cAAc;IACtB,YAAY,EAAE,WAAW,EAAE,CAAC;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,IAAI,SAAS,MAAM,EAAE,EAC9C,KAAK,EACL,SAAS,EACT,YAAY,EACZ,eAAe,GAChB,EAAE,eAAe,CAAC,IAAI,CAAC,GAAG,cAAc,CAsCxC"}
|