@cloudscape-design/components-themeable 3.0.1325 → 3.0.1327
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/action-card/styles.scss +4 -2
- package/lib/internal/scss/badge/styles.scss +4 -4
- package/lib/internal/scss/box/styles.scss +1 -0
- package/lib/internal/scss/box/visual-accent.scss +117 -0
- package/lib/internal/scss/button-dropdown/styles.scss +6 -0
- package/lib/internal/scss/internal/generated/custom-css-properties/index.scss +1 -1
- package/lib/internal/scss/link/constants.scss +2 -2
- package/lib/internal/scss/side-navigation/styles.scss +6 -0
- package/lib/internal/template/action-card/interfaces.d.ts +40 -1
- package/lib/internal/template/action-card/interfaces.d.ts.map +1 -1
- package/lib/internal/template/action-card/interfaces.js.map +1 -1
- package/lib/internal/template/action-card/internal.d.ts.map +1 -1
- package/lib/internal/template/action-card/internal.js +32 -9
- package/lib/internal/template/action-card/internal.js.map +1 -1
- package/lib/internal/template/action-card/styles.css.js +17 -17
- package/lib/internal/template/action-card/styles.scoped.css +96 -92
- package/lib/internal/template/action-card/styles.selectors.js +17 -17
- package/lib/internal/template/badge/styles.css.js +10 -10
- package/lib/internal/template/badge/styles.scoped.css +14 -14
- package/lib/internal/template/badge/styles.selectors.js +10 -10
- package/lib/internal/template/box/interfaces.d.ts +59 -0
- package/lib/internal/template/box/interfaces.d.ts.map +1 -1
- package/lib/internal/template/box/interfaces.js.map +1 -1
- package/lib/internal/template/box/internal.d.ts +1 -1
- package/lib/internal/template/box/internal.d.ts.map +1 -1
- package/lib/internal/template/box/internal.js +4 -2
- package/lib/internal/template/box/internal.js.map +1 -1
- package/lib/internal/template/box/styles.css.js +224 -193
- package/lib/internal/template/box/styles.scoped.css +424 -238
- package/lib/internal/template/box/styles.selectors.js +224 -193
- package/lib/internal/template/button-dropdown/category-elements/category-element.d.ts +1 -1
- package/lib/internal/template/button-dropdown/category-elements/category-element.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/category-elements/category-element.js +3 -3
- package/lib/internal/template/button-dropdown/category-elements/category-element.js.map +1 -1
- package/lib/internal/template/button-dropdown/category-elements/expandable-category-element.d.ts +1 -1
- package/lib/internal/template/button-dropdown/category-elements/expandable-category-element.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/category-elements/expandable-category-element.js +22 -12
- package/lib/internal/template/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
- package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.d.ts +1 -1
- package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.js +12 -10
- package/lib/internal/template/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
- package/lib/internal/template/button-dropdown/filter.d.ts +8 -0
- package/lib/internal/template/button-dropdown/filter.d.ts.map +1 -0
- package/lib/internal/template/button-dropdown/filter.js +18 -0
- package/lib/internal/template/button-dropdown/filter.js.map +1 -0
- package/lib/internal/template/button-dropdown/index.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/index.js +3 -3
- package/lib/internal/template/button-dropdown/index.js.map +1 -1
- package/lib/internal/template/button-dropdown/interfaces.d.ts +41 -0
- package/lib/internal/template/button-dropdown/interfaces.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/interfaces.js.map +1 -1
- package/lib/internal/template/button-dropdown/internal-interfaces.d.ts +12 -0
- package/lib/internal/template/button-dropdown/internal-interfaces.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/internal-interfaces.js.map +1 -1
- package/lib/internal/template/button-dropdown/internal.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/internal.js +46 -7
- package/lib/internal/template/button-dropdown/internal.js.map +1 -1
- package/lib/internal/template/button-dropdown/item-element/index.d.ts +1 -1
- package/lib/internal/template/button-dropdown/item-element/index.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/item-element/index.js +35 -16
- package/lib/internal/template/button-dropdown/item-element/index.js.map +1 -1
- package/lib/internal/template/button-dropdown/items-list.d.ts +1 -1
- package/lib/internal/template/button-dropdown/items-list.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/items-list.js +4 -4
- package/lib/internal/template/button-dropdown/items-list.js.map +1 -1
- package/lib/internal/template/button-dropdown/styles.css.js +23 -22
- package/lib/internal/template/button-dropdown/styles.scoped.css +38 -32
- package/lib/internal/template/button-dropdown/styles.selectors.js +23 -22
- package/lib/internal/template/button-dropdown/tooltip.d.ts +2 -1
- package/lib/internal/template/button-dropdown/tooltip.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/tooltip.js +22 -14
- package/lib/internal/template/button-dropdown/tooltip.js.map +1 -1
- package/lib/internal/template/button-dropdown/utils/filter-items.d.ts +4 -0
- package/lib/internal/template/button-dropdown/utils/filter-items.d.ts.map +1 -0
- package/lib/internal/template/button-dropdown/utils/filter-items.js +55 -0
- package/lib/internal/template/button-dropdown/utils/filter-items.js.map +1 -0
- package/lib/internal/template/button-dropdown/utils/use-button-dropdown.d.ts +7 -1
- package/lib/internal/template/button-dropdown/utils/use-button-dropdown.d.ts.map +1 -1
- package/lib/internal/template/button-dropdown/utils/use-button-dropdown.js +77 -13
- package/lib/internal/template/button-dropdown/utils/use-button-dropdown.js.map +1 -1
- package/lib/internal/template/code-editor/interfaces.js.map +1 -1
- package/lib/internal/template/error-boundary/internal.d.ts.map +1 -1
- package/lib/internal/template/error-boundary/internal.js +1 -0
- package/lib/internal/template/error-boundary/internal.js.map +1 -1
- package/lib/internal/template/help-panel/styles.css.js +6 -6
- package/lib/internal/template/help-panel/styles.scoped.css +69 -69
- package/lib/internal/template/help-panel/styles.selectors.js +6 -6
- package/lib/internal/template/icon/generated/icons.d.ts +1 -0
- package/lib/internal/template/icon/generated/icons.d.ts.map +1 -1
- package/lib/internal/template/icon/generated/icons.js +2 -0
- package/lib/internal/template/icon/generated/icons.js.map +1 -1
- package/lib/internal/template/icon-provider/interfaces.d.ts +1 -1
- package/lib/internal/template/icon-provider/interfaces.d.ts.map +1 -1
- package/lib/internal/template/icon-provider/interfaces.js.map +1 -1
- package/lib/internal/template/internal/base-component/index.js +3 -3
- package/lib/internal/template/internal/base-component/index.js.map +1 -1
- package/lib/internal/template/internal/base-component/styles.scoped.css +33 -1
- package/lib/internal/template/internal/components/token-list/styles.css.js +10 -10
- package/lib/internal/template/internal/components/token-list/styles.scoped.css +24 -24
- package/lib/internal/template/internal/components/token-list/styles.selectors.js +10 -10
- package/lib/internal/template/internal/environment.js +2 -2
- package/lib/internal/template/internal/environment.json +2 -2
- package/lib/internal/template/internal/generated/styles/tokens.d.ts +140 -0
- package/lib/internal/template/internal/generated/styles/tokens.js +140 -0
- package/lib/internal/template/internal/generated/theming/index.cjs +2080 -20
- package/lib/internal/template/internal/generated/theming/index.cjs.d.ts +45 -0
- package/lib/internal/template/internal/generated/theming/index.d.ts +45 -0
- package/lib/internal/template/internal/generated/theming/index.js +2080 -20
- package/lib/internal/template/internal/utils/external-props.js +7 -5
- package/lib/internal/template/internal/utils/external-props.js.map +1 -1
- package/lib/internal/template/item-card/internal.js +1 -1
- package/lib/internal/template/item-card/internal.js.map +1 -1
- package/lib/internal/template/link/styles.css.js +21 -21
- package/lib/internal/template/link/styles.scoped.css +86 -86
- package/lib/internal/template/link/styles.selectors.js +21 -21
- package/lib/internal/template/multiselect/embedded.d.ts +2 -2
- package/lib/internal/template/multiselect/internal.d.ts +1 -1
- package/lib/internal/template/pagination/internal.d.ts.map +1 -1
- package/lib/internal/template/pagination/internal.js +2 -2
- package/lib/internal/template/pagination/internal.js.map +1 -1
- package/lib/internal/template/select/parts/filter.d.ts +1 -1
- package/lib/internal/template/select/utils/connect-options.d.ts.map +1 -1
- package/lib/internal/template/select/utils/connect-options.js +11 -7
- package/lib/internal/template/select/utils/connect-options.js.map +1 -1
- package/lib/internal/template/select/utils/use-select.d.ts.map +1 -1
- package/lib/internal/template/select/utils/use-select.js +5 -4
- package/lib/internal/template/select/utils/use-select.js.map +1 -1
- package/lib/internal/template/side-navigation/parts.js +4 -3
- package/lib/internal/template/side-navigation/parts.js.map +1 -1
- package/lib/internal/template/side-navigation/styles.css.js +47 -46
- package/lib/internal/template/side-navigation/styles.scoped.css +76 -70
- package/lib/internal/template/side-navigation/styles.selectors.js +47 -46
- package/lib/internal/template/table/index.d.ts.map +1 -1
- package/lib/internal/template/table/index.js +5 -3
- package/lib/internal/template/table/index.js.map +1 -1
- package/lib/internal/template/test-utils/dom/action-card/index.d.ts +4 -2
- package/lib/internal/template/test-utils/dom/action-card/index.js +5 -3
- package/lib/internal/template/test-utils/dom/action-card/index.js.map +1 -1
- package/lib/internal/template/test-utils/dom/button-dropdown/index.d.ts +16 -0
- package/lib/internal/template/test-utils/dom/button-dropdown/index.js +24 -0
- package/lib/internal/template/test-utils/dom/button-dropdown/index.js.map +1 -1
- package/lib/internal/template/test-utils/dom/pagination/index.d.ts +9 -6
- package/lib/internal/template/test-utils/dom/pagination/index.js +15 -5
- package/lib/internal/template/test-utils/dom/pagination/index.js.map +1 -1
- package/lib/internal/template/test-utils/selectors/button-dropdown/index.d.ts +16 -0
- package/lib/internal/template/test-utils/selectors/button-dropdown/index.js +24 -0
- package/lib/internal/template/test-utils/selectors/button-dropdown/index.js.map +1 -1
- package/lib/internal/template/test-utils/selectors/pagination/index.d.ts +8 -6
- package/lib/internal/template/test-utils/selectors/pagination/index.js +9 -5
- package/lib/internal/template/test-utils/selectors/pagination/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"items-list.js","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,eAAe,MAAM,sCAAsC,CAAC;AACnE,OAAO,yBAAyB,MAAM,iDAAiD,CAAC;AACxF,OAAO,+BAA+B,MAAM,wDAAwD,CAAC;AAErG,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,KAAK,EACL,cAAc,EACd,aAAa,EACb,UAAU,EACV,aAAa,EACb,mBAAmB,EACnB,UAAU,EACV,cAAc,EACd,aAAa,EACb,gBAAgB,GAAG,KAAK,EACxB,mBAAmB,GAAG,KAAK,EAC3B,iBAAiB,GAAG,KAAK,EACzB,gBAAgB,GAAG,KAAK,EACxB,OAAO,GAAG,QAAQ,EAClB,4BAA4B,EAC5B,QAAQ,EACR,SAAS,EACT,UAAU,EACV,WAAW,
|
|
1
|
+
{"version":3,"file":"items-list.js","sourceRoot":"","sources":["../../../src/button-dropdown/items-list.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';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport CategoryElement from './category-elements/category-element';\nimport ExpandableCategoryElement from './category-elements/expandable-category-element';\nimport MobileExpandableCategoryElement from './category-elements/mobile-expandable-category-element';\nimport { ItemListProps } from './internal-interfaces';\nimport ItemElement from './item-element';\nimport { isItemGroup } from './utils/utils';\n\nexport default function ItemsList({\n items,\n onItemActivate,\n onGroupToggle,\n targetItem,\n isHighlighted,\n isKeyboardHighlight,\n isExpanded,\n lastInDropdown,\n highlightItem,\n categoryDisabled = false,\n hasExpandableGroups = false,\n hasCategoryHeader = false,\n expandToViewport = false,\n variant = 'normal',\n analyticsMetadataTransformer,\n position,\n linkStyle,\n renderItem,\n parentProps,\n filteringText,\n filteringEnabled,\n menuId,\n filteringDescriptionId,\n}: ItemListProps) {\n const isMobile = useMobile();\n\n const elements = items.map((item, index) => {\n if (!isItemGroup(item)) {\n const showDivider = (index === items.length - 1 && !lastInDropdown) || isItemGroup(items[index + 1]);\n\n return (\n <ItemElement\n key={index}\n index={index}\n item={item}\n onItemActivate={onItemActivate}\n disabled={item.disabled ?? categoryDisabled}\n highlighted={isHighlighted(item)}\n isKeyboardHighlighted={isKeyboardHighlight(item)}\n highlightItem={highlightItem}\n showDivider={showDivider}\n hasCategoryHeader={hasCategoryHeader}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n analyticsMetadataTransformer={analyticsMetadataTransformer}\n linkStyle={linkStyle}\n renderItem={renderItem}\n parentProps={parentProps}\n filteringText={filteringText}\n filteringEnabled={filteringEnabled}\n menuId={menuId}\n filteringDescriptionId={filteringDescriptionId}\n />\n );\n }\n if (hasExpandableGroups) {\n return item.text ? (\n isMobile ? (\n <MobileExpandableCategoryElement\n key={index}\n index={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={lastInDropdown && index === items.length - 1}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n renderItem={renderItem}\n filteringText={filteringText}\n filteringEnabled={filteringEnabled}\n menuId={menuId}\n filteringDescriptionId={filteringDescriptionId}\n />\n ) : (\n <ExpandableCategoryElement\n key={index}\n index={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={true}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n expandToViewport={expandToViewport}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n renderItem={renderItem}\n filteringText={filteringText}\n filteringEnabled={filteringEnabled}\n menuId={menuId}\n filteringDescriptionId={filteringDescriptionId}\n />\n )\n ) : null;\n }\n return (\n <CategoryElement\n key={index}\n index={index}\n item={item}\n onItemActivate={onItemActivate}\n onGroupToggle={onGroupToggle}\n targetItem={targetItem}\n isHighlighted={isHighlighted}\n isKeyboardHighlight={isKeyboardHighlight}\n isExpanded={isExpanded}\n lastInDropdown={lastInDropdown && index === items.length - 1}\n highlightItem={highlightItem}\n disabled={item.disabled ?? false}\n variant={variant}\n position={`${position ? `${position},` : ''}${index + 1}`}\n renderItem={renderItem}\n filteringText={filteringText}\n filteringEnabled={filteringEnabled}\n menuId={menuId}\n filteringDescriptionId={filteringDescriptionId}\n />\n );\n });\n\n return <>{elements}</>;\n}\n"]}
|
|
@@ -1,27 +1,28 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"button-dropdown": "awsui_button-
|
|
5
|
-
"full-width": "awsui_full-
|
|
6
|
-
"items-list-container": "awsui_items-list-
|
|
7
|
-
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-
|
|
8
|
-
"rotate": "
|
|
9
|
-
"rotate-open": "awsui_rotate-
|
|
10
|
-
"header": "
|
|
11
|
-
"title": "
|
|
12
|
-
"description": "
|
|
13
|
-
"trigger-button": "awsui_trigger-
|
|
14
|
-
"loading": "
|
|
15
|
-
"split-trigger-wrapper": "awsui_split-trigger-
|
|
16
|
-
"trigger-item": "awsui_trigger-
|
|
17
|
-
"has-no-text": "awsui_has-no-
|
|
18
|
-
"visual-refresh": "awsui_visual-
|
|
19
|
-
"has-trigger-text": "awsui_has-trigger-
|
|
20
|
-
"variant-normal": "awsui_variant-
|
|
21
|
-
"split-trigger": "awsui_split-
|
|
22
|
-
"dropdown-trigger": "awsui_dropdown-
|
|
23
|
-
"main-action-full-width": "awsui_main-action-full-
|
|
24
|
-
"main-action-trigger-full-width": "awsui_main-action-trigger-full-
|
|
25
|
-
"
|
|
4
|
+
"button-dropdown": "awsui_button-dropdown_sne0l_1b9rr_145",
|
|
5
|
+
"full-width": "awsui_full-width_sne0l_1b9rr_148",
|
|
6
|
+
"items-list-container": "awsui_items-list-container_sne0l_1b9rr_153",
|
|
7
|
+
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_sne0l_1b9rr_1",
|
|
8
|
+
"rotate": "awsui_rotate_sne0l_1b9rr_172",
|
|
9
|
+
"rotate-open": "awsui_rotate-open_sne0l_1b9rr_186",
|
|
10
|
+
"header": "awsui_header_sne0l_1b9rr_190",
|
|
11
|
+
"title": "awsui_title_sne0l_1b9rr_201",
|
|
12
|
+
"description": "awsui_description_sne0l_1b9rr_202",
|
|
13
|
+
"trigger-button": "awsui_trigger-button_sne0l_1b9rr_206",
|
|
14
|
+
"loading": "awsui_loading_sne0l_1b9rr_214",
|
|
15
|
+
"split-trigger-wrapper": "awsui_split-trigger-wrapper_sne0l_1b9rr_218",
|
|
16
|
+
"trigger-item": "awsui_trigger-item_sne0l_1b9rr_221",
|
|
17
|
+
"has-no-text": "awsui_has-no-text_sne0l_1b9rr_230",
|
|
18
|
+
"visual-refresh": "awsui_visual-refresh_sne0l_1b9rr_233",
|
|
19
|
+
"has-trigger-text": "awsui_has-trigger-text_sne0l_1b9rr_247",
|
|
20
|
+
"variant-normal": "awsui_variant-normal_sne0l_1b9rr_250",
|
|
21
|
+
"split-trigger": "awsui_split-trigger_sne0l_1b9rr_218",
|
|
22
|
+
"dropdown-trigger": "awsui_dropdown-trigger_sne0l_1b9rr_261",
|
|
23
|
+
"main-action-full-width": "awsui_main-action-full-width_sne0l_1b9rr_265",
|
|
24
|
+
"main-action-trigger-full-width": "awsui_main-action-trigger-full-width_sne0l_1b9rr_269",
|
|
25
|
+
"filter": "awsui_filter_sne0l_1b9rr_273",
|
|
26
|
+
"test-utils-button-trigger": "awsui_test-utils-button-trigger_sne0l_1b9rr_279"
|
|
26
27
|
};
|
|
27
28
|
|
|
@@ -142,52 +142,52 @@
|
|
|
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_button-
|
|
145
|
+
.awsui_button-dropdown_sne0l_1b9rr_145:not(#\9) {
|
|
146
146
|
display: inline-block;
|
|
147
147
|
}
|
|
148
|
-
.awsui_button-
|
|
148
|
+
.awsui_button-dropdown_sne0l_1b9rr_145.awsui_full-width_sne0l_1b9rr_148:not(#\9) {
|
|
149
149
|
inline-size: 100%;
|
|
150
150
|
display: block;
|
|
151
151
|
}
|
|
152
152
|
|
|
153
|
-
.awsui_items-list-
|
|
153
|
+
.awsui_items-list-container_sne0l_1b9rr_153:not(#\9) {
|
|
154
154
|
padding-block: 0;
|
|
155
155
|
padding-inline: 0;
|
|
156
156
|
margin-block: 0;
|
|
157
157
|
margin-inline: 0;
|
|
158
|
-
animation: awsui_awsui-motion-fade-in-
|
|
158
|
+
animation: awsui_awsui-motion-fade-in-0_sne0l_1b9rr_1 500ms var(--motion-easing-show-quick-xucy9w, ease-out);
|
|
159
159
|
animation-fill-mode: none;
|
|
160
160
|
}
|
|
161
161
|
@media (prefers-reduced-motion: reduce) {
|
|
162
|
-
.awsui_items-list-
|
|
162
|
+
.awsui_items-list-container_sne0l_1b9rr_153:not(#\9) {
|
|
163
163
|
animation: none;
|
|
164
164
|
transition: none;
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
|
-
.awsui-motion-disabled .awsui_items-list-
|
|
167
|
+
.awsui-motion-disabled .awsui_items-list-container_sne0l_1b9rr_153:not(#\9), .awsui-mode-entering .awsui_items-list-container_sne0l_1b9rr_153:not(#\9) {
|
|
168
168
|
animation: none;
|
|
169
169
|
transition: none;
|
|
170
170
|
}
|
|
171
171
|
|
|
172
|
-
.
|
|
172
|
+
.awsui_rotate_sne0l_1b9rr_172:not(#\9) {
|
|
173
173
|
transform: rotate(0deg);
|
|
174
174
|
transition: transform var(--motion-duration-rotate-180-4er9qu, 135ms) var(--motion-easing-rotate-180-xlspcm, cubic-bezier(0.165, 0.84, 0.44, 1));
|
|
175
175
|
}
|
|
176
176
|
@media (prefers-reduced-motion: reduce) {
|
|
177
|
-
.
|
|
177
|
+
.awsui_rotate_sne0l_1b9rr_172:not(#\9) {
|
|
178
178
|
animation: none;
|
|
179
179
|
transition: none;
|
|
180
180
|
}
|
|
181
181
|
}
|
|
182
|
-
.awsui-motion-disabled .
|
|
182
|
+
.awsui-motion-disabled .awsui_rotate_sne0l_1b9rr_172:not(#\9), .awsui-mode-entering .awsui_rotate_sne0l_1b9rr_172:not(#\9) {
|
|
183
183
|
animation: none;
|
|
184
184
|
transition: none;
|
|
185
185
|
}
|
|
186
|
-
.awsui_rotate-
|
|
186
|
+
.awsui_rotate-open_sne0l_1b9rr_186:not(#\9) {
|
|
187
187
|
transform: rotate(-180deg);
|
|
188
188
|
}
|
|
189
189
|
|
|
190
|
-
.
|
|
190
|
+
.awsui_header_sne0l_1b9rr_190:not(#\9) {
|
|
191
191
|
display: flex;
|
|
192
192
|
flex-direction: column;
|
|
193
193
|
list-style: none;
|
|
@@ -198,78 +198,84 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
198
198
|
border-inline: var(--border-width-dropdown-qic2p4, 1px) solid transparent;
|
|
199
199
|
}
|
|
200
200
|
|
|
201
|
-
.
|
|
202
|
-
.
|
|
201
|
+
.awsui_title_sne0l_1b9rr_201:not(#\9),
|
|
202
|
+
.awsui_description_sne0l_1b9rr_202:not(#\9) {
|
|
203
203
|
color: var(--color-text-top-navigation-title-4lkrln, #16191f);
|
|
204
204
|
}
|
|
205
205
|
|
|
206
|
-
.awsui-one-theme .awsui_trigger-
|
|
206
|
+
.awsui-one-theme .awsui_trigger-button_sne0l_1b9rr_206:not(#\9) {
|
|
207
207
|
display: flex;
|
|
208
208
|
align-items: center;
|
|
209
209
|
}
|
|
210
|
-
.awsui_trigger-
|
|
210
|
+
.awsui_trigger-button_sne0l_1b9rr_206.awsui_full-width_sne0l_1b9rr_148:not(#\9) {
|
|
211
211
|
display: grid;
|
|
212
212
|
grid-template-columns: 1fr auto;
|
|
213
213
|
}
|
|
214
|
-
.awsui_trigger-
|
|
214
|
+
.awsui_trigger-button_sne0l_1b9rr_206.awsui_full-width_sne0l_1b9rr_148.awsui_loading_sne0l_1b9rr_214:not(#\9) {
|
|
215
215
|
grid-template-columns: auto 1fr auto;
|
|
216
216
|
}
|
|
217
217
|
|
|
218
|
-
.awsui_split-trigger-
|
|
218
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218:not(#\9) {
|
|
219
219
|
display: flex;
|
|
220
220
|
}
|
|
221
|
-
.awsui_split-trigger-
|
|
221
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221 > .awsui_trigger-button_sne0l_1b9rr_206:not(#\9):focus, .awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221 > .awsui_trigger-button_sne0l_1b9rr_206:not(#\9):hover {
|
|
222
222
|
z-index: 1;
|
|
223
223
|
}
|
|
224
|
-
.awsui_split-trigger-
|
|
224
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:last-child) > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
225
225
|
border-start-end-radius: 0;
|
|
226
226
|
border-end-end-radius: 0;
|
|
227
227
|
padding-inline-end: var(--space-m-n2lypl, 16px);
|
|
228
228
|
margin-inline-end: var(--space-xxxs-3w1kr2, 2px);
|
|
229
229
|
}
|
|
230
|
-
.awsui_split-trigger-
|
|
230
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:last-child) > .awsui_trigger-button_sne0l_1b9rr_206.awsui_has-no-text_sne0l_1b9rr_230 {
|
|
231
231
|
padding-inline: var(--space-button-icon-only-horizontal-67q6rd, 16px);
|
|
232
232
|
}
|
|
233
|
-
.awsui_split-trigger-
|
|
233
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:last-child) > .awsui_trigger-button_sne0l_1b9rr_206.awsui_has-no-text_sne0l_1b9rr_230.awsui_visual-refresh_sne0l_1b9rr_233 {
|
|
234
234
|
padding-inline-start: calc(var(--space-s-4a5hs8, 12px) - 2px);
|
|
235
235
|
}
|
|
236
|
-
.awsui_split-trigger-
|
|
236
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:first-child) > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
237
237
|
border-start-start-radius: 0;
|
|
238
238
|
border-end-start-radius: 0;
|
|
239
239
|
padding-inline: calc(var(--space-xs-kw7k3v, 8px) - 2px);
|
|
240
240
|
}
|
|
241
|
-
.awsui_split-trigger-
|
|
241
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:first-child).awsui_visual-refresh_sne0l_1b9rr_233 > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
242
242
|
padding-inline-end: calc(var(--space-s-4a5hs8, 12px) - 2px);
|
|
243
243
|
}
|
|
244
|
-
.awsui-one-theme .awsui_split-trigger-
|
|
244
|
+
.awsui-one-theme .awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:first-child) > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
245
245
|
padding-inline: calc(var(--space-xs-kw7k3v, 8px) - 2px);
|
|
246
246
|
}
|
|
247
|
-
.awsui-one-theme .awsui_split-trigger-
|
|
247
|
+
.awsui-one-theme .awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221:not(#\9):not(:first-child).awsui_has-trigger-text_sne0l_1b9rr_247 > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
248
248
|
padding-inline: calc(var(--space-xs-kw7k3v, 8px) + 2px);
|
|
249
249
|
}
|
|
250
|
-
.awsui_split-trigger-
|
|
250
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221.awsui_variant-normal_sne0l_1b9rr_250:not(#\9):not(:last-child) > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
251
251
|
margin-inline-end: 0;
|
|
252
252
|
}
|
|
253
|
-
.awsui_split-trigger-
|
|
253
|
+
.awsui_split-trigger-wrapper_sne0l_1b9rr_218 > .awsui_trigger-item_sne0l_1b9rr_221.awsui_variant-normal_sne0l_1b9rr_250:not(#\9):not(:first-child) > .awsui_trigger-button_sne0l_1b9rr_206 {
|
|
254
254
|
margin-inline-start: calc(var(--border-width-button-40y1n5, 1px) * -1);
|
|
255
255
|
}
|
|
256
256
|
|
|
257
|
-
.awsui_split-
|
|
257
|
+
.awsui_split-trigger_sne0l_1b9rr_218:not(#\9) {
|
|
258
258
|
display: contents;
|
|
259
259
|
}
|
|
260
260
|
|
|
261
|
-
.awsui_dropdown-
|
|
261
|
+
.awsui_dropdown-trigger_sne0l_1b9rr_261:not(#\9) {
|
|
262
262
|
display: contents;
|
|
263
263
|
}
|
|
264
264
|
|
|
265
|
-
.awsui_main-action-full-
|
|
265
|
+
.awsui_main-action-full-width_sne0l_1b9rr_265:not(#\9) {
|
|
266
266
|
flex: 1 1 0;
|
|
267
267
|
}
|
|
268
268
|
|
|
269
|
-
.awsui_main-action-trigger-full-
|
|
269
|
+
.awsui_main-action-trigger-full-width_sne0l_1b9rr_269:not(#\9) {
|
|
270
270
|
flex: 0 0 auto;
|
|
271
271
|
}
|
|
272
272
|
|
|
273
|
-
.
|
|
273
|
+
.awsui_filter_sne0l_1b9rr_273:not(#\9) {
|
|
274
|
+
position: relative;
|
|
275
|
+
z-index: 4;
|
|
276
|
+
flex-shrink: 0;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
.awsui_test-utils-button-trigger_sne0l_1b9rr_279:not(#\9) {
|
|
274
280
|
/* used in test-utils */
|
|
275
281
|
}
|
|
@@ -2,27 +2,28 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"button-dropdown": "awsui_button-
|
|
6
|
-
"full-width": "awsui_full-
|
|
7
|
-
"items-list-container": "awsui_items-list-
|
|
8
|
-
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-
|
|
9
|
-
"rotate": "
|
|
10
|
-
"rotate-open": "awsui_rotate-
|
|
11
|
-
"header": "
|
|
12
|
-
"title": "
|
|
13
|
-
"description": "
|
|
14
|
-
"trigger-button": "awsui_trigger-
|
|
15
|
-
"loading": "
|
|
16
|
-
"split-trigger-wrapper": "awsui_split-trigger-
|
|
17
|
-
"trigger-item": "awsui_trigger-
|
|
18
|
-
"has-no-text": "awsui_has-no-
|
|
19
|
-
"visual-refresh": "awsui_visual-
|
|
20
|
-
"has-trigger-text": "awsui_has-trigger-
|
|
21
|
-
"variant-normal": "awsui_variant-
|
|
22
|
-
"split-trigger": "awsui_split-
|
|
23
|
-
"dropdown-trigger": "awsui_dropdown-
|
|
24
|
-
"main-action-full-width": "awsui_main-action-full-
|
|
25
|
-
"main-action-trigger-full-width": "awsui_main-action-trigger-full-
|
|
26
|
-
"
|
|
5
|
+
"button-dropdown": "awsui_button-dropdown_sne0l_1b9rr_145",
|
|
6
|
+
"full-width": "awsui_full-width_sne0l_1b9rr_148",
|
|
7
|
+
"items-list-container": "awsui_items-list-container_sne0l_1b9rr_153",
|
|
8
|
+
"awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_sne0l_1b9rr_1",
|
|
9
|
+
"rotate": "awsui_rotate_sne0l_1b9rr_172",
|
|
10
|
+
"rotate-open": "awsui_rotate-open_sne0l_1b9rr_186",
|
|
11
|
+
"header": "awsui_header_sne0l_1b9rr_190",
|
|
12
|
+
"title": "awsui_title_sne0l_1b9rr_201",
|
|
13
|
+
"description": "awsui_description_sne0l_1b9rr_202",
|
|
14
|
+
"trigger-button": "awsui_trigger-button_sne0l_1b9rr_206",
|
|
15
|
+
"loading": "awsui_loading_sne0l_1b9rr_214",
|
|
16
|
+
"split-trigger-wrapper": "awsui_split-trigger-wrapper_sne0l_1b9rr_218",
|
|
17
|
+
"trigger-item": "awsui_trigger-item_sne0l_1b9rr_221",
|
|
18
|
+
"has-no-text": "awsui_has-no-text_sne0l_1b9rr_230",
|
|
19
|
+
"visual-refresh": "awsui_visual-refresh_sne0l_1b9rr_233",
|
|
20
|
+
"has-trigger-text": "awsui_has-trigger-text_sne0l_1b9rr_247",
|
|
21
|
+
"variant-normal": "awsui_variant-normal_sne0l_1b9rr_250",
|
|
22
|
+
"split-trigger": "awsui_split-trigger_sne0l_1b9rr_218",
|
|
23
|
+
"dropdown-trigger": "awsui_dropdown-trigger_sne0l_1b9rr_261",
|
|
24
|
+
"main-action-full-width": "awsui_main-action-full-width_sne0l_1b9rr_265",
|
|
25
|
+
"main-action-trigger-full-width": "awsui_main-action-trigger-full-width_sne0l_1b9rr_269",
|
|
26
|
+
"filter": "awsui_filter_sne0l_1b9rr_273",
|
|
27
|
+
"test-utils-button-trigger": "awsui_test-utils-button-trigger_sne0l_1b9rr_279"
|
|
27
28
|
};
|
|
28
29
|
|
|
@@ -4,7 +4,8 @@ interface TooltipProps {
|
|
|
4
4
|
content?: React.ReactNode;
|
|
5
5
|
position?: 'top' | 'right' | 'bottom' | 'left';
|
|
6
6
|
className?: string;
|
|
7
|
+
controlledOpen?: boolean;
|
|
7
8
|
}
|
|
8
|
-
export default function Tooltip({ children, content, position, className }: TooltipProps): JSX.Element;
|
|
9
|
+
export default function Tooltip({ children, content, position, className, controlledOpen }: TooltipProps): JSX.Element;
|
|
9
10
|
export {};
|
|
10
11
|
//# sourceMappingURL=tooltip.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/button-dropdown/tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAyE,MAAM,OAAO,CAAC;AAS9F,UAAU,YAAY;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAID,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAkB,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,YAAY,eAsCjH"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
-
import React, { useEffect, useRef, useState } from 'react';
|
|
3
|
+
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
4
4
|
import { Portal, useReducedMotion } from '@cloudscape-design/component-toolkit/internal';
|
|
5
5
|
import { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';
|
|
6
6
|
import Arrow from '../popover/arrow';
|
|
7
7
|
import PopoverBody from '../popover/body';
|
|
8
8
|
import PopoverContainer from '../popover/container';
|
|
9
9
|
const DEFAULT_OPEN_TIMEOUT_IN_MS = 120;
|
|
10
|
-
export default function Tooltip({ children, content, position = 'right', className }) {
|
|
10
|
+
export default function Tooltip({ children, content, position = 'right', className, controlledOpen }) {
|
|
11
11
|
const ref = useRef(null);
|
|
12
12
|
const isReducedMotion = useReducedMotion(ref);
|
|
13
|
-
const { open, triggerProps } = useTooltipOpen(isReducedMotion ? 0 : DEFAULT_OPEN_TIMEOUT_IN_MS);
|
|
13
|
+
const { open, triggerProps } = useTooltipOpen(controlledOpen, isReducedMotion ? 0 : DEFAULT_OPEN_TIMEOUT_IN_MS);
|
|
14
14
|
const portalClasses = usePortalModeClasses(ref);
|
|
15
15
|
return (React.createElement("span", { ref: ref, ...triggerProps, className: className },
|
|
16
16
|
children,
|
|
@@ -20,7 +20,7 @@ export default function Tooltip({ children, content, position = 'right', classNa
|
|
|
20
20
|
React.createElement(PopoverBody, { dismissButton: false, dismissAriaLabel: undefined, header: null, onDismiss: () => { }, overflowVisible: "both" },
|
|
21
21
|
React.createElement("span", { "data-testid": "button-dropdown-disabled-reason", role: "tooltip" }, content))))))));
|
|
22
22
|
}
|
|
23
|
-
function useTooltipOpen(timeout) {
|
|
23
|
+
function useTooltipOpen(controlledOpen, timeout) {
|
|
24
24
|
const [isOpen, setIsOpen] = useState(false);
|
|
25
25
|
// The delayed effect is aborted in case the component unmounts. We cannot use the conventional clearTimeout()
|
|
26
26
|
// as it causes cleanup of a legitimate state update when used with React 18+ strict mode.
|
|
@@ -32,22 +32,30 @@ function useTooltipOpen(timeout) {
|
|
|
32
32
|
timeoutAbortRef.current = true;
|
|
33
33
|
};
|
|
34
34
|
}, []);
|
|
35
|
-
const close = () => {
|
|
35
|
+
const close = useCallback(() => {
|
|
36
36
|
clearTimeout(timeoutRef.current);
|
|
37
37
|
setIsOpen(false);
|
|
38
|
-
};
|
|
39
|
-
const open = () => {
|
|
38
|
+
}, []);
|
|
39
|
+
const open = useCallback(() => {
|
|
40
40
|
if (!timeoutAbortRef.current) {
|
|
41
41
|
setIsOpen(true);
|
|
42
42
|
}
|
|
43
|
-
};
|
|
44
|
-
const openDelayed = () => {
|
|
43
|
+
}, []);
|
|
44
|
+
const openDelayed = useCallback(() => {
|
|
45
45
|
timeoutRef.current = setTimeout(open, timeout);
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
if (
|
|
49
|
-
|
|
50
|
-
|
|
46
|
+
}, [open, timeout]);
|
|
47
|
+
useEffect(() => {
|
|
48
|
+
if (controlledOpen === true) {
|
|
49
|
+
openDelayed();
|
|
50
|
+
}
|
|
51
|
+
if (controlledOpen === false) {
|
|
52
|
+
close();
|
|
53
|
+
}
|
|
54
|
+
}, [controlledOpen, openDelayed, close]);
|
|
55
|
+
const onKeyDown = event => {
|
|
56
|
+
if (isOpen && isEscape(event.key)) {
|
|
57
|
+
event.preventDefault();
|
|
58
|
+
event.stopPropagation();
|
|
51
59
|
close();
|
|
52
60
|
}
|
|
53
61
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../src/button-dropdown/tooltip.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAwB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"tooltip.js","sourceRoot":"","sources":["../../../src/button-dropdown/tooltip.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, { KeyboardEventHandler, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Portal, useReducedMotion } from '@cloudscape-design/component-toolkit/internal';\n\nimport { usePortalModeClasses } from '../internal/hooks/use-portal-mode-classes';\nimport Arrow from '../popover/arrow';\nimport PopoverBody from '../popover/body';\nimport PopoverContainer from '../popover/container';\n\ninterface TooltipProps {\n children?: React.ReactNode;\n content?: React.ReactNode;\n position?: 'top' | 'right' | 'bottom' | 'left';\n className?: string;\n controlledOpen?: boolean;\n}\n\nconst DEFAULT_OPEN_TIMEOUT_IN_MS = 120;\n\nexport default function Tooltip({ children, content, position = 'right', className, controlledOpen }: TooltipProps) {\n const ref = useRef<HTMLSpanElement | null>(null);\n const isReducedMotion = useReducedMotion(ref);\n const { open, triggerProps } = useTooltipOpen(controlledOpen, isReducedMotion ? 0 : DEFAULT_OPEN_TIMEOUT_IN_MS);\n const portalClasses = usePortalModeClasses(ref);\n\n return (\n <span ref={ref} {...triggerProps} className={className}>\n {children}\n {open && (\n <Portal>\n <span className={portalClasses}>\n <PopoverContainer\n size=\"small\"\n fixedWidth={false}\n position={position}\n trackRef={ref}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={true}\n zIndex={7000}\n >\n <PopoverBody\n dismissButton={false}\n dismissAriaLabel={undefined}\n header={null}\n onDismiss={() => {}}\n overflowVisible=\"both\"\n >\n <span data-testid=\"button-dropdown-disabled-reason\" role=\"tooltip\">\n {content}\n </span>\n </PopoverBody>\n </PopoverContainer>\n </span>\n </Portal>\n )}\n </span>\n );\n}\n\nfunction useTooltipOpen(controlledOpen: boolean | undefined, timeout: number) {\n const [isOpen, setIsOpen] = useState(false);\n\n // The delayed effect is aborted in case the component unmounts. We cannot use the conventional clearTimeout()\n // as it causes cleanup of a legitimate state update when used with React 18+ strict mode.\n const timeoutRef = useRef<number>();\n const timeoutAbortRef = useRef(false);\n useEffect(() => {\n timeoutAbortRef.current = false;\n return () => {\n timeoutAbortRef.current = true;\n };\n }, []);\n\n const close = useCallback(() => {\n clearTimeout(timeoutRef.current);\n setIsOpen(false);\n }, []);\n\n const open = useCallback(() => {\n if (!timeoutAbortRef.current) {\n setIsOpen(true);\n }\n }, []);\n\n const openDelayed = useCallback(() => {\n timeoutRef.current = setTimeout(open, timeout);\n }, [open, timeout]);\n\n useEffect(() => {\n if (controlledOpen === true) {\n openDelayed();\n }\n if (controlledOpen === false) {\n close();\n }\n }, [controlledOpen, openDelayed, close]);\n\n const onKeyDown: KeyboardEventHandler = event => {\n if (isOpen && isEscape(event.key)) {\n event.preventDefault();\n event.stopPropagation();\n close();\n }\n };\n\n const onFocus = openDelayed;\n const onBlur = close;\n\n return {\n open: isOpen,\n triggerProps: {\n onBlur,\n onFocus,\n onKeyDown,\n },\n };\n}\n\nconst isEscape = (key: string) => key === 'Escape' || key === 'Esc';\n"]}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { ButtonDropdownProps } from '../interfaces';
|
|
2
|
+
export declare function filterItems(items: ButtonDropdownProps.Items, filterText: string): ButtonDropdownProps.Items;
|
|
3
|
+
export declare function countLeafItems(items: ButtonDropdownProps.Items): number;
|
|
4
|
+
//# sourceMappingURL=filter-items.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter-items.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/utils/filter-items.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAkBpD,wBAAgB,WAAW,CAAC,KAAK,EAAE,mBAAmB,CAAC,KAAK,EAAE,UAAU,EAAE,MAAM,GAAG,mBAAmB,CAAC,KAAK,CAsB3G;AAgBD,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,CAAC,KAAK,GAAG,MAAM,CAUvE"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { isItemGroup } from './utils';
|
|
2
|
+
function matchesString(value, lowerCaseSearchText) {
|
|
3
|
+
if (!value) {
|
|
4
|
+
return false;
|
|
5
|
+
}
|
|
6
|
+
return value.toLowerCase().indexOf(lowerCaseSearchText) > -1;
|
|
7
|
+
}
|
|
8
|
+
function matchesItem(item, searchText) {
|
|
9
|
+
return (matchesString(item.text, searchText) ||
|
|
10
|
+
matchesString(item.secondaryText, searchText) ||
|
|
11
|
+
matchesString(item.labelTag, searchText));
|
|
12
|
+
}
|
|
13
|
+
export function filterItems(items, filterText) {
|
|
14
|
+
const lowerCaseSearchText = filterText.toLowerCase();
|
|
15
|
+
return items.reduce((acc, item) => {
|
|
16
|
+
if (!isItemGroup(item)) {
|
|
17
|
+
if (matchesItem(item, lowerCaseSearchText)) {
|
|
18
|
+
acc.push(item);
|
|
19
|
+
}
|
|
20
|
+
return acc;
|
|
21
|
+
}
|
|
22
|
+
// Filtered results are rendered as a collapsed (flat) list, so nested
|
|
23
|
+
// groups would otherwise render a header per level. Flatten all matching
|
|
24
|
+
// descendants into the top-most group and keep only its header.
|
|
25
|
+
const matchingChildren = collectMatchingLeaves(item.items, lowerCaseSearchText);
|
|
26
|
+
if (matchingChildren.length > 0) {
|
|
27
|
+
acc.push({ ...item, items: matchingChildren });
|
|
28
|
+
}
|
|
29
|
+
return acc;
|
|
30
|
+
}, []);
|
|
31
|
+
}
|
|
32
|
+
function collectMatchingLeaves(items, searchText) {
|
|
33
|
+
return items.reduce((acc, item) => {
|
|
34
|
+
if (isItemGroup(item)) {
|
|
35
|
+
acc.push(...collectMatchingLeaves(item.items, searchText));
|
|
36
|
+
}
|
|
37
|
+
else if (matchesItem(item, searchText)) {
|
|
38
|
+
acc.push(item);
|
|
39
|
+
}
|
|
40
|
+
return acc;
|
|
41
|
+
}, []);
|
|
42
|
+
}
|
|
43
|
+
export function countLeafItems(items) {
|
|
44
|
+
let count = 0;
|
|
45
|
+
for (const item of items) {
|
|
46
|
+
if (isItemGroup(item)) {
|
|
47
|
+
count += countLeafItems(item.items);
|
|
48
|
+
}
|
|
49
|
+
else {
|
|
50
|
+
count++;
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
return count;
|
|
54
|
+
}
|
|
55
|
+
//# sourceMappingURL=filter-items.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filter-items.js","sourceRoot":"","sources":["../../../../src/button-dropdown/utils/filter-items.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAEtC,SAAS,aAAa,CAAC,KAAyB,EAAE,mBAA2B;IAC3E,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,KAAK,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC,CAAC;AAC/D,CAAC;AAED,SAAS,WAAW,CAAC,IAAiE,EAAE,UAAkB;IACxG,OAAO,CACL,aAAa,CAAC,IAAI,CAAC,IAAI,EAAE,UAAU,CAAC;QACpC,aAAa,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,CAAC;QAC7C,aAAa,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,CACzC,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAgC,EAAE,UAAkB;IAC9E,MAAM,mBAAmB,GAAG,UAAU,CAAC,WAAW,EAAE,CAAC;IAErD,OAAO,KAAK,CAAC,MAAM,CAAoC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;QACnE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;YACvB,IAAI,WAAW,CAAC,IAAI,EAAE,mBAAmB,CAAC,EAAE,CAAC;gBAC3C,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACjB,CAAC;YACD,OAAO,GAAG,CAAC;QACb,CAAC;QAED,sEAAsE;QACtE,yEAAyE;QACzE,gEAAgE;QAChE,MAAM,gBAAgB,GAAG,qBAAqB,CAAC,IAAI,CAAC,KAAK,EAAE,mBAAmB,CAAC,CAAC;QAEhF,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAChC,GAAG,CAAC,IAAI,CAAC,EAAE,GAAG,IAAI,EAAE,KAAK,EAAE,gBAAgB,EAAE,CAAC,CAAC;QACjD,CAAC;QAED,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC;AAED,SAAS,qBAAqB,CAC5B,KAAgC,EAChC,UAAkB;IAElB,OAAO,KAAK,CAAC,MAAM,CAAqE,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;QACpG,IAAI,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;YACtB,GAAG,CAAC,IAAI,CAAC,GAAG,qBAAqB,CAAC,IAAI,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC;QAC7D,CAAC;aAAM,IAAI,WAAW,CAAC,IAAI,EAAE,UAAU,CAAC,EAAE,CAAC;YACzC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACjB,CAAC;QACD,OAAO,GAAG,CAAC;IACb,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,KAAgC;IAC7D,IAAI,KAAK,GAAG,CAAC,CAAC;IACd,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE,CAAC;QACzB,IAAI,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;YACtB,KAAK,IAAI,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACtC,CAAC;aAAM,CAAC;YACN,KAAK,EAAE,CAAC;QACV,CAAC;IACH,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { ButtonDropdownProps } from '../interfaces';\nimport { isItemGroup } from './utils';\n\nfunction matchesString(value: string | undefined, lowerCaseSearchText: string): boolean {\n if (!value) {\n return false;\n }\n return value.toLowerCase().indexOf(lowerCaseSearchText) > -1;\n}\n\nfunction matchesItem(item: ButtonDropdownProps.Item | ButtonDropdownProps.CheckboxItem, searchText: string): boolean {\n return (\n matchesString(item.text, searchText) ||\n matchesString(item.secondaryText, searchText) ||\n matchesString(item.labelTag, searchText)\n );\n}\n\nexport function filterItems(items: ButtonDropdownProps.Items, filterText: string): ButtonDropdownProps.Items {\n const lowerCaseSearchText = filterText.toLowerCase();\n\n return items.reduce<ButtonDropdownProps.ItemOrGroup[]>((acc, item) => {\n if (!isItemGroup(item)) {\n if (matchesItem(item, lowerCaseSearchText)) {\n acc.push(item);\n }\n return acc;\n }\n\n // Filtered results are rendered as a collapsed (flat) list, so nested\n // groups would otherwise render a header per level. Flatten all matching\n // descendants into the top-most group and keep only its header.\n const matchingChildren = collectMatchingLeaves(item.items, lowerCaseSearchText);\n\n if (matchingChildren.length > 0) {\n acc.push({ ...item, items: matchingChildren });\n }\n\n return acc;\n }, []);\n}\n\nfunction collectMatchingLeaves(\n items: ButtonDropdownProps.Items,\n searchText: string\n): Array<ButtonDropdownProps.Item | ButtonDropdownProps.CheckboxItem> {\n return items.reduce<Array<ButtonDropdownProps.Item | ButtonDropdownProps.CheckboxItem>>((acc, item) => {\n if (isItemGroup(item)) {\n acc.push(...collectMatchingLeaves(item.items, searchText));\n } else if (matchesItem(item, searchText)) {\n acc.push(item);\n }\n return acc;\n }, []);\n}\n\nexport function countLeafItems(items: ButtonDropdownProps.Items): number {\n let count = 0;\n for (const item of items) {\n if (isItemGroup(item)) {\n count += countLeafItems(item.items);\n } else {\n count++;\n }\n }\n return count;\n}\n"]}
|
|
@@ -7,6 +7,7 @@ interface UseButtonDropdownOptions extends ButtonDropdownSettings {
|
|
|
7
7
|
onItemFollow?: CancelableEventHandler<ButtonDropdownProps.ItemClickDetails>;
|
|
8
8
|
onReturnFocus: () => void;
|
|
9
9
|
expandToViewport?: boolean;
|
|
10
|
+
hasFiltering: boolean;
|
|
10
11
|
}
|
|
11
12
|
interface UseButtonDropdownApi extends HighlightProps {
|
|
12
13
|
isOpen: boolean;
|
|
@@ -14,12 +15,17 @@ interface UseButtonDropdownApi extends HighlightProps {
|
|
|
14
15
|
onKeyUp: (event: React.KeyboardEvent) => void;
|
|
15
16
|
onItemActivate: ItemActivate;
|
|
16
17
|
onGroupToggle: GroupToggle;
|
|
18
|
+
onDropdownFocusLeave: () => void;
|
|
17
19
|
toggleDropdown: (options?: {
|
|
18
20
|
moveHighlightOnOpen?: boolean;
|
|
19
21
|
}) => void;
|
|
20
22
|
closeDropdown: () => void;
|
|
21
23
|
setIsUsingMouse: (isUsingMouse: boolean) => void;
|
|
24
|
+
filteringValue: string;
|
|
25
|
+
setFilteringValue: (value: string) => void;
|
|
26
|
+
filteredItems: ButtonDropdownProps.Items;
|
|
27
|
+
showExpandableGroups: boolean;
|
|
22
28
|
}
|
|
23
|
-
export declare function useButtonDropdown({ items, onItemClick, onItemFollow, onReturnFocus, hasExpandableGroups, isInRestrictedView, expandToViewport, }: UseButtonDropdownOptions): UseButtonDropdownApi;
|
|
29
|
+
export declare function useButtonDropdown({ items, onItemClick, onItemFollow, onReturnFocus, hasExpandableGroups, isInRestrictedView, expandToViewport, hasFiltering, }: UseButtonDropdownOptions): UseButtonDropdownApi;
|
|
24
30
|
export {};
|
|
25
31
|
//# sourceMappingURL=use-button-dropdown.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-button-dropdown.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/utils/use-button-dropdown.ts"],"names":[],"mappings":"AAEA,OAAO,
|
|
1
|
+
{"version":3,"file":"use-button-dropdown.d.ts","sourceRoot":"","sources":["../../../../src/button-dropdown/utils/use-button-dropdown.ts"],"names":[],"mappings":"AAEA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAKpE,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,WAAW,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAKvH,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D,KAAK,EAAE,mBAAmB,CAAC,KAAK,CAAC;IACjC,WAAW,CAAC,EAAE,sBAAsB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IAC3E,YAAY,CAAC,EAAE,sBAAsB,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IAC5E,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,UAAU,oBAAqB,SAAQ,cAAc;IACnD,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IAChD,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IAC9C,cAAc,EAAE,YAAY,CAAC;IAC7B,aAAa,EAAE,WAAW,CAAC;IAC3B,oBAAoB,EAAE,MAAM,IAAI,CAAC;IACjC,cAAc,EAAE,CAAC,OAAO,CAAC,EAAE;QAAE,mBAAmB,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,IAAI,CAAC;IACtE,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,eAAe,EAAE,CAAC,YAAY,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,aAAa,EAAE,mBAAmB,CAAC,KAAK,CAAC;IACzC,oBAAoB,EAAE,OAAO,CAAC;CAC/B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,WAAW,EACX,YAAY,EACZ,aAAa,EACb,mBAAmB,EACnB,kBAA0B,EAC1B,gBAAwB,EACxB,YAAY,GACb,EAAE,wBAAwB,GAAG,oBAAoB,CAkPjD"}
|