@cloudscape-design/components 3.0.179 → 3.0.181
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/autosuggest/autosuggest-option.js +1 -1
- package/autosuggest/autosuggest-option.js.map +1 -1
- package/checkbox/styles.css.js +3 -3
- package/checkbox/styles.scoped.css +5 -5
- package/checkbox/styles.selectors.js +3 -3
- package/flashbar/interfaces.d.ts +2 -2
- package/flashbar/interfaces.js.map +1 -1
- package/internal/base-component/styles.scoped.css +4 -0
- package/internal/components/abstract-switch/index.js +2 -2
- package/internal/components/abstract-switch/index.js.map +1 -1
- package/internal/components/option/index.d.ts +1 -1
- package/internal/components/option/index.d.ts.map +1 -1
- package/internal/components/option/index.js +4 -4
- package/internal/components/option/index.js.map +1 -1
- package/internal/components/option/interfaces.d.ts +2 -0
- package/internal/components/option/interfaces.d.ts.map +1 -1
- package/internal/components/option/interfaces.js.map +1 -1
- package/internal/components/option/option-parts.d.ts +9 -3
- package/internal/components/option/option-parts.d.ts.map +1 -1
- package/internal/components/option/option-parts.js +20 -16
- package/internal/components/option/option-parts.js.map +1 -1
- package/internal/components/option/styles.css.js +17 -15
- package/internal/components/option/styles.scoped.css +33 -25
- package/internal/components/option/styles.selectors.js +17 -15
- package/internal/environment.js +1 -1
- package/internal/generated/theming/index.cjs +23 -0
- package/internal/generated/theming/index.js +23 -0
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/select/parts/item.d.ts.map +1 -1
- package/select/parts/item.js +1 -1
- package/select/parts/item.js.map +1 -1
- package/select/parts/multiselect-item.d.ts.map +1 -1
- package/select/parts/multiselect-item.js +1 -1
- package/select/parts/multiselect-item.js.map +1 -1
|
@@ -27,7 +27,7 @@ var AutosuggestOption = function (_a, ref) {
|
|
|
27
27
|
a11yProperties['aria-label'] = nativeAttributes['aria-label'];
|
|
28
28
|
}
|
|
29
29
|
optionContent = (React.createElement("div", __assign({}, a11yProperties),
|
|
30
|
-
React.createElement(OptionComponent, { option: option, highlightText: highlightText })));
|
|
30
|
+
React.createElement(OptionComponent, { option: option, highlightedOption: highlighted, highlightText: highlightText })));
|
|
31
31
|
}
|
|
32
32
|
return (React.createElement(SelectableItem, __assign({}, baseProps, { className: styles.option, ariaSelected: highlighted, highlighted: highlighted, disabled: option.disabled, hasBackground: useEntered, isParent: isParent, isChild: isChild, virtualPosition: virtualPosition, "data-test-index": throughIndex, "data-in-group-index": inGroupIndex, "data-group-index": groupIndex, ref: ref, padBottom: padBottom, screenReaderContent: screenReaderContent, ariaSetsize: ariaSetsize, ariaPosinset: ariaPosinset, highlightType: highlightType }), optionContent));
|
|
33
33
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"autosuggest-option.js","sourceRoot":"","sources":["../../../src/autosuggest/autosuggest-option.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,eAAe,MAAM,+BAA+B,CAAC;AAC5D,OAAO,cAAc,MAAM,wCAAwC,CAAC;AACpE,OAAO,EAAsB,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wDAAwD,CAAC;AAE9F,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAkBrC,IAAM,iBAAiB,GAAG,UACxB,EAayB,EACzB,GAA8B;IAb5B,IAAA,wBAAqB,EAArB,gBAAgB,mBAAG,EAAE,KAAA,EACrB,aAAa,mBAAA,EACb,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,mBAAmB,yBAAA,EACnB,WAAW,iBAAA,EACX,YAAY,kBAAA,EACT,IAAI,cAZT,yLAaC,CADQ;IAIT,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,IAAM,UAAU,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,aAAa,CAAC;IACrE,IAAM,QAAQ,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;IAC9D,IAAM,OAAO,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC;IACtD,IAAA,KAA6C,oBAAoB,CAAC,MAAM,CAAC,IAAI,EAAE,EAA7E,YAAY,kBAAA,EAAE,YAAY,kBAAA,EAAE,UAAU,gBAAuC,CAAC;IAEtF,IAAI,aAAa,CAAC;IAClB,IAAI,UAAU,EAAE;QACd,aAAa,GAAG,gBAAgB,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;KACtD;SAAM,IAAI,QAAQ,EAAE;QACnB,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC;KAC9B;SAAM;QACL,IAAM,cAAc,GAA+C,EAAE,CAAC;QACtE,IAAI,gBAAgB,CAAC,YAAY,CAAC,EAAE;YAClC,cAAc,CAAC,YAAY,CAAC,GAAG,gBAAgB,CAAC,YAAY,CAAC,CAAC;SAC/D;QAED,aAAa,GAAG,CACd,wCAAS,cAAc;YACrB,oBAAC,eAAe,IAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,GAAI,
|
|
1
|
+
{"version":3,"file":"autosuggest-option.js","sourceRoot":"","sources":["../../../src/autosuggest/autosuggest-option.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,eAAe,MAAM,+BAA+B,CAAC;AAC5D,OAAO,cAAc,MAAM,wCAAwC,CAAC;AACpE,OAAO,EAAsB,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,wDAAwD,CAAC;AAE9F,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAkBrC,IAAM,iBAAiB,GAAG,UACxB,EAayB,EACzB,GAA8B;IAb5B,IAAA,wBAAqB,EAArB,gBAAgB,mBAAG,EAAE,KAAA,EACrB,aAAa,mBAAA,EACb,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,gBAAgB,sBAAA,EAChB,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,mBAAmB,yBAAA,EACnB,WAAW,iBAAA,EACX,YAAY,kBAAA,EACT,IAAI,cAZT,yLAaC,CADQ;IAIT,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,IAAM,UAAU,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,aAAa,CAAC;IACrE,IAAM,QAAQ,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;IAC9D,IAAM,OAAO,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC;IACtD,IAAA,KAA6C,oBAAoB,CAAC,MAAM,CAAC,IAAI,EAAE,EAA7E,YAAY,kBAAA,EAAE,YAAY,kBAAA,EAAE,UAAU,gBAAuC,CAAC;IAEtF,IAAI,aAAa,CAAC;IAClB,IAAI,UAAU,EAAE;QACd,aAAa,GAAG,gBAAgB,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;KACtD;SAAM,IAAI,QAAQ,EAAE;QACnB,aAAa,GAAG,MAAM,CAAC,KAAK,CAAC;KAC9B;SAAM;QACL,IAAM,cAAc,GAA+C,EAAE,CAAC;QACtE,IAAI,gBAAgB,CAAC,YAAY,CAAC,EAAE;YAClC,cAAc,CAAC,YAAY,CAAC,GAAG,gBAAgB,CAAC,YAAY,CAAC,CAAC;SAC/D;QAED,aAAa,GAAG,CACd,wCAAS,cAAc;YACrB,oBAAC,eAAe,IAAC,MAAM,EAAE,MAAM,EAAE,iBAAiB,EAAE,WAAW,EAAE,aAAa,EAAE,aAAa,GAAI,CAC7F,CACP,CAAC;KACH;IAED,OAAO,CACL,oBAAC,cAAc,eACT,SAAS,IACb,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,YAAY,EAAE,WAAW,EACzB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,aAAa,EAAE,UAAU,EACzB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,eAAe,qBACf,YAAY,yBACR,YAAY,sBACf,UAAU,EAC5B,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,KAE3B,aAAa,CACC,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport OptionComponent from '../internal/components/option';\nimport SelectableItem from '../internal/components/selectable-item';\nimport { BaseComponentProps, getBaseProps } from '../internal/base-component';\nimport { getTestOptionIndexes } from '../internal/components/options-list/utils/test-indexes';\n\nimport styles from './styles.css.js';\nimport { AutosuggestItem } from './interfaces';\nimport { HighlightType } from '../internal/components/options-list/utils/use-highlight-option';\n\nexport interface AutosuggestOptionProps extends BaseComponentProps {\n nativeAttributes?: Record<string, any>;\n highlightText: string;\n option: AutosuggestItem;\n highlighted: boolean;\n highlightType: HighlightType;\n enteredTextLabel: (value: string) => string;\n virtualPosition?: number;\n padBottom?: boolean;\n screenReaderContent?: string;\n ariaSetsize?: number;\n ariaPosinset?: number;\n}\n\nconst AutosuggestOption = (\n {\n nativeAttributes = {},\n highlightText,\n option,\n highlighted,\n highlightType,\n enteredTextLabel,\n virtualPosition,\n padBottom,\n screenReaderContent,\n ariaSetsize,\n ariaPosinset,\n ...rest\n }: AutosuggestOptionProps,\n ref: React.Ref<HTMLDivElement>\n) => {\n const baseProps = getBaseProps(rest);\n const useEntered = 'type' in option && option.type === 'use-entered';\n const isParent = 'type' in option && option.type === 'parent';\n const isChild = 'type' in option && option.type === 'child';\n const { throughIndex, inGroupIndex, groupIndex } = getTestOptionIndexes(option) || {};\n\n let optionContent;\n if (useEntered) {\n optionContent = enteredTextLabel(option.value || '');\n } else if (isParent) {\n optionContent = option.label;\n } else {\n const a11yProperties: AutosuggestOptionProps['nativeAttributes'] = {};\n if (nativeAttributes['aria-label']) {\n a11yProperties['aria-label'] = nativeAttributes['aria-label'];\n }\n\n optionContent = (\n <div {...a11yProperties}>\n <OptionComponent option={option} highlightedOption={highlighted} highlightText={highlightText} />\n </div>\n );\n }\n\n return (\n <SelectableItem\n {...baseProps}\n className={styles.option}\n ariaSelected={highlighted}\n highlighted={highlighted}\n disabled={option.disabled}\n hasBackground={useEntered}\n isParent={isParent}\n isChild={isChild}\n virtualPosition={virtualPosition}\n data-test-index={throughIndex}\n data-in-group-index={inGroupIndex}\n data-group-index={groupIndex}\n ref={ref}\n padBottom={padBottom}\n screenReaderContent={screenReaderContent}\n ariaSetsize={ariaSetsize}\n ariaPosinset={ariaPosinset}\n highlightType={highlightType}\n >\n {optionContent}\n </SelectableItem>\n );\n};\n\nexport default React.memo(React.forwardRef(AutosuggestOption));\n"]}
|
package/checkbox/styles.css.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"root": "
|
|
5
|
-
"checkbox-control": "awsui_checkbox-
|
|
6
|
-
"outline": "
|
|
4
|
+
"root": "awsui_root_k2y2q_3fvr1_93",
|
|
5
|
+
"checkbox-control": "awsui_checkbox-control_k2y2q_3fvr1_107",
|
|
6
|
+
"outline": "awsui_outline_k2y2q_3fvr1_115"
|
|
7
7
|
};
|
|
8
8
|
|
|
@@ -90,7 +90,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
90
90
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
91
91
|
SPDX-License-Identifier: Apache-2.0
|
|
92
92
|
*/
|
|
93
|
-
|
|
93
|
+
.awsui_root_k2y2q_3fvr1_93.awsui_root_k2y2q_3fvr1_93:not(#\9) {
|
|
94
94
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
95
95
|
border-collapse: separate;
|
|
96
96
|
border-spacing: 0;
|
|
@@ -130,7 +130,7 @@ div.awsui_root_k2y2q_16ths_93:not(#\9) {
|
|
|
130
130
|
display: flex;
|
|
131
131
|
}
|
|
132
132
|
|
|
133
|
-
.awsui_checkbox-
|
|
133
|
+
.awsui_checkbox-control_k2y2q_3fvr1_107:not(#\9) {
|
|
134
134
|
margin-top: calc((var(--font-body-m-line-height-i7xxvv, 22px) - var(--size-control-n9i4yo, 16px)) / 2);
|
|
135
135
|
min-height: var(--size-control-n9i4yo, 16px);
|
|
136
136
|
min-width: var(--size-control-n9i4yo, 16px);
|
|
@@ -138,14 +138,14 @@ div.awsui_root_k2y2q_16ths_93:not(#\9) {
|
|
|
138
138
|
width: var(--size-control-n9i4yo, 16px);
|
|
139
139
|
}
|
|
140
140
|
|
|
141
|
-
.
|
|
141
|
+
.awsui_outline_k2y2q_3fvr1_115:not(#\9) {
|
|
142
142
|
position: relative;
|
|
143
143
|
}
|
|
144
|
-
.
|
|
144
|
+
.awsui_outline_k2y2q_3fvr1_115:not(#\9) {
|
|
145
145
|
outline: 2px dotted transparent;
|
|
146
146
|
outline-offset: calc(2px - 1px);
|
|
147
147
|
}
|
|
148
|
-
.
|
|
148
|
+
.awsui_outline_k2y2q_3fvr1_115:not(#\9)::before {
|
|
149
149
|
content: " ";
|
|
150
150
|
display: block;
|
|
151
151
|
position: absolute;
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"root": "
|
|
6
|
-
"checkbox-control": "awsui_checkbox-
|
|
7
|
-
"outline": "
|
|
5
|
+
"root": "awsui_root_k2y2q_3fvr1_93",
|
|
6
|
+
"checkbox-control": "awsui_checkbox-control_k2y2q_3fvr1_107",
|
|
7
|
+
"outline": "awsui_outline_k2y2q_3fvr1_115"
|
|
8
8
|
};
|
|
9
9
|
|
package/flashbar/interfaces.d.ts
CHANGED
|
@@ -40,14 +40,14 @@ export interface FlashbarProps extends BaseComponentProps {
|
|
|
40
40
|
* * `action` (ReactNode) - Specifies an action for the flash message. Although it is technically possible to insert any content,
|
|
41
41
|
* our UX guidelines only allow you to add a button.
|
|
42
42
|
* * `buttonText` (string) - Specifies that an action button should be displayed, with the specified text.
|
|
43
|
-
* When a user clicks on this button the `onButtonClick` handler is called.
|
|
43
|
+
* When a user clicks on this button the `onButtonClick` handler is called.
|
|
44
|
+
* If the `action` property is set, this property is ignored. **Deprecated**, replaced by `action`.
|
|
44
45
|
* * `onButtonClick` (event => void) - Called when a user clicks on the action button. This is not called if you create a custom button
|
|
45
46
|
* using the `action` property. **Deprecated**, replaced by `action`.
|
|
46
47
|
* * `id` (string) - Specifies a unique flash message identifier. This property is used in two ways:
|
|
47
48
|
* 1. As a [keys](https://reactjs.org/docs/lists-and-keys.html#keys) source for React rendering.
|
|
48
49
|
* 2. To identify which flash message will be removed from the DOM when it is dismissed, to animate it out.
|
|
49
50
|
*
|
|
50
|
-
* @deprecated Replaced by `action`.
|
|
51
51
|
* @visualrefresh `id` property
|
|
52
52
|
*/
|
|
53
53
|
items: ReadonlyArray<FlashbarProps.MessageDefinition>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/flashbar/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport React from 'react';\nimport { ButtonProps } from '../button/interfaces';\n\nexport namespace FlashbarProps {\n export interface MessageDefinition {\n header?: React.ReactNode;\n content?: React.ReactNode;\n dismissible?: boolean;\n dismissLabel?: string;\n statusIconAriaLabel?: string;\n loading?: boolean;\n type?: FlashbarProps.Type;\n ariaRole?: FlashbarProps.AriaRole;\n action?: React.ReactNode;\n id?: string;\n buttonText?: ButtonProps['children'];\n onButtonClick?: ButtonProps['onClick'];\n onDismiss?: ButtonProps['onClick'];\n }\n\n export type Type = 'success' | 'warning' | 'info' | 'error';\n export type AriaRole = 'alert' | 'status';\n}\n\nexport interface FlashbarProps extends BaseComponentProps {\n /**\n * Specifies flash messages that appear in the same order that they are listed.\n * The value is an array of flash message definition objects.\n *\n * A flash message object contains the following properties:\n * * `header` (ReactNode) - Specifies the heading text.\n * * `content` (ReactNode) - Specifies the primary text displayed in the flash element.\n * * `type` (string) - Indicates the type of the message to be displayed. Allowed values are as follows: `success, error, warning, info`. The default is `info`.\n * * `loading` (boolean) - Replaces the status icon with a spinner and forces the type to `info`.\n * * `dismissible` (boolean) - Determines whether the component includes a close button icon. By default, the close button is not included.\n * When a user clicks on this button the `onDismiss` handler is called.\n * * `dismissLabel` (string) - Specifies an `aria-label` for to the dismiss icon button for improved accessibility.\n * * `statusIconAriaLabel` (string) - Specifies an `aria-label` for to the status icon for improved accessibility.\n * * `ariaRole` (boolean) - For flash messages added after page load, specifies how this message is communicated to assistive\n * technology. Use \"status\" for status updates or informational content. Use \"alert\" for important messages that need the\n * user's attention.\n * * `action` (ReactNode) - Specifies an action for the flash message. Although it is technically possible to insert any content,\n * our UX guidelines only allow you to add a button.\n * * `buttonText` (string) - Specifies that an action button should be displayed, with the specified text.\n * When a user clicks on this button the `onButtonClick` handler is called
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/flashbar/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport React from 'react';\nimport { ButtonProps } from '../button/interfaces';\n\nexport namespace FlashbarProps {\n export interface MessageDefinition {\n header?: React.ReactNode;\n content?: React.ReactNode;\n dismissible?: boolean;\n dismissLabel?: string;\n statusIconAriaLabel?: string;\n loading?: boolean;\n type?: FlashbarProps.Type;\n ariaRole?: FlashbarProps.AriaRole;\n action?: React.ReactNode;\n id?: string;\n buttonText?: ButtonProps['children'];\n onButtonClick?: ButtonProps['onClick'];\n onDismiss?: ButtonProps['onClick'];\n }\n\n export type Type = 'success' | 'warning' | 'info' | 'error';\n export type AriaRole = 'alert' | 'status';\n}\n\nexport interface FlashbarProps extends BaseComponentProps {\n /**\n * Specifies flash messages that appear in the same order that they are listed.\n * The value is an array of flash message definition objects.\n *\n * A flash message object contains the following properties:\n * * `header` (ReactNode) - Specifies the heading text.\n * * `content` (ReactNode) - Specifies the primary text displayed in the flash element.\n * * `type` (string) - Indicates the type of the message to be displayed. Allowed values are as follows: `success, error, warning, info`. The default is `info`.\n * * `loading` (boolean) - Replaces the status icon with a spinner and forces the type to `info`.\n * * `dismissible` (boolean) - Determines whether the component includes a close button icon. By default, the close button is not included.\n * When a user clicks on this button the `onDismiss` handler is called.\n * * `dismissLabel` (string) - Specifies an `aria-label` for to the dismiss icon button for improved accessibility.\n * * `statusIconAriaLabel` (string) - Specifies an `aria-label` for to the status icon for improved accessibility.\n * * `ariaRole` (boolean) - For flash messages added after page load, specifies how this message is communicated to assistive\n * technology. Use \"status\" for status updates or informational content. Use \"alert\" for important messages that need the\n * user's attention.\n * * `action` (ReactNode) - Specifies an action for the flash message. Although it is technically possible to insert any content,\n * our UX guidelines only allow you to add a button.\n * * `buttonText` (string) - Specifies that an action button should be displayed, with the specified text.\n * When a user clicks on this button the `onButtonClick` handler is called.\n * If the `action` property is set, this property is ignored. **Deprecated**, replaced by `action`.\n * * `onButtonClick` (event => void) - Called when a user clicks on the action button. This is not called if you create a custom button\n * using the `action` property. **Deprecated**, replaced by `action`.\n * * `id` (string) - Specifies a unique flash message identifier. This property is used in two ways:\n * 1. As a [keys](https://reactjs.org/docs/lists-and-keys.html#keys) source for React rendering.\n * 2. To identify which flash message will be removed from the DOM when it is dismissed, to animate it out.\n *\n * @visualrefresh `id` property\n */\n items: ReadonlyArray<FlashbarProps.MessageDefinition>;\n}\n\nexport interface StackedFlashbarProps {\n stackItems: true;\n ariaLabels?: StackedFlashbarProps.AriaLabels;\n items: ReadonlyArray<FlashbarProps.MessageDefinition>;\n}\n\nexport namespace StackedFlashbarProps {\n export interface AriaLabels {\n stackCollapseLabel?: string;\n stackExpandLabel?: string;\n }\n}\n"]}
|
|
@@ -305,6 +305,7 @@
|
|
|
305
305
|
--color-text-dropdown-item-filter-match-x302if:#0972d3;
|
|
306
306
|
--color-text-dropdown-item-highlighted-oaabyk:#000716;
|
|
307
307
|
--color-text-dropdown-item-secondary-0me7js:#5f6b7a;
|
|
308
|
+
--color-text-dropdown-item-secondary-hover-7ii1ru:#5f6b7a;
|
|
308
309
|
--color-text-empty-fjv325:#5f6b7a;
|
|
309
310
|
--color-text-expandable-section-default-k03p1p:#000716;
|
|
310
311
|
--color-text-expandable-section-hover-73g3du:#0972d3;
|
|
@@ -862,6 +863,7 @@
|
|
|
862
863
|
--color-text-dropdown-item-filter-match-x302if:#89bdee;
|
|
863
864
|
--color-text-dropdown-item-highlighted-oaabyk:#e9ebed;
|
|
864
865
|
--color-text-dropdown-item-secondary-0me7js:#8d99a8;
|
|
866
|
+
--color-text-dropdown-item-secondary-hover-7ii1ru:colorGrey300;
|
|
865
867
|
--color-text-empty-fjv325:#d1d5db;
|
|
866
868
|
--color-text-expandable-section-default-k03p1p:#fbfbfb;
|
|
867
869
|
--color-text-expandable-section-hover-73g3du:#539fe5;
|
|
@@ -1098,6 +1100,7 @@
|
|
|
1098
1100
|
--color-text-dropdown-item-filter-match-x302if:#89bdee;
|
|
1099
1101
|
--color-text-dropdown-item-highlighted-oaabyk:#e9ebed;
|
|
1100
1102
|
--color-text-dropdown-item-secondary-0me7js:#8d99a8;
|
|
1103
|
+
--color-text-dropdown-item-secondary-hover-7ii1ru:colorGrey300;
|
|
1101
1104
|
--color-text-empty-fjv325:#d1d5db;
|
|
1102
1105
|
--color-text-expandable-section-default-k03p1p:#fbfbfb;
|
|
1103
1106
|
--color-text-expandable-section-hover-73g3du:#539fe5;
|
|
@@ -1268,6 +1271,7 @@
|
|
|
1268
1271
|
--color-text-dropdown-item-filter-match-x302if:#89bdee;
|
|
1269
1272
|
--color-text-dropdown-item-highlighted-oaabyk:#e9ebed;
|
|
1270
1273
|
--color-text-dropdown-item-secondary-0me7js:#8d99a8;
|
|
1274
|
+
--color-text-dropdown-item-secondary-hover-7ii1ru:colorGrey300;
|
|
1271
1275
|
--color-text-empty-fjv325:#d1d5db;
|
|
1272
1276
|
--color-text-expandable-section-default-k03p1p:#fbfbfb;
|
|
1273
1277
|
--color-text-expandable-section-hover-73g3du:#539fe5;
|
|
@@ -31,8 +31,8 @@ export default function AbstractSwitch(_a) {
|
|
|
31
31
|
if (description) {
|
|
32
32
|
ariaDescriptons.push(descriptionId);
|
|
33
33
|
}
|
|
34
|
-
return (React.createElement("
|
|
35
|
-
React.createElement("
|
|
34
|
+
return (React.createElement("span", __assign({}, rest, { className: clsx(styles.wrapper, rest.className), ref: __internalRootRef }),
|
|
35
|
+
React.createElement("span", { className: styles['label-wrapper'], "aria-disabled": disabled ? 'true' : undefined, onClick: disabled ? undefined : onClick },
|
|
36
36
|
React.createElement("span", { className: clsx(styles.control, controlClassName) },
|
|
37
37
|
styledControl,
|
|
38
38
|
nativeControl(__assign(__assign({}, focusVisible), { id: id, disabled: disabled, className: styles['native-input'], 'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined, 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined, 'aria-label': ariaLabel })),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,eAAe,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAmBxD,SAAS,UAAU,CAAC,MAA8B;IAChD,OAAO,MAAM,CAAC,MAAM,CAAC,UAAC,KAAK,IAAsB,OAAA,CAAC,CAAC,KAAK,EAAP,CAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACtE,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EAgBjB;;IAfpB,IAAA,SAAS,eAAA,EACT,gBAAgB,sBAAA,EAChB,gBAAgB,sBAAA,EAChB,QAAQ,cAAA,EACR,aAAa,mBAAA,EACb,aAAa,mBAAA,EACb,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,wBAAwB,8BAAA,EACxB,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,eAAe,qBAAA,EACf,OAAO,aAAA,EACP,iBAAiB,uBAAA,EACd,IAAI,cAf8B,yOAgBtC,CADQ;IAEP,IAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,IAAM,EAAE,GAAG,SAAS,IAAI,QAAQ,CAAC;IAEjC,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACvC,IAAM,OAAO,GAAG,UAAG,EAAE,WAAQ,CAAC;IAC9B,IAAM,aAAa,GAAG,UAAG,EAAE,iBAAc,CAAC;IAE1C,IAAM,iBAAiB,GAAG,EAAE,CAAC;IAC7B,IAAI,KAAK,EAAE;QACT,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KACjC;IACD,IAAI,cAAc,EAAE;QAClB,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;KACxC;IAED,IAAM,eAAe,GAAG,EAAE,CAAC;IAC3B,IAAI,eAAe,EAAE;QACnB,eAAe,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;KACvC;IACD,IAAI,WAAW,EAAE;QACf,eAAe,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;KACrC;IAED,OAAO,CACL,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/abstract-switch/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 from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport useFocusVisible from '../../hooks/focus-visible';\nimport { useUniqueId } from '../../hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../../hooks/use-base-component/index.js';\n\nexport interface AbstractSwitchProps extends React.HTMLAttributes<HTMLElement>, InternalBaseComponentProps {\n controlId?: string;\n controlClassName: string;\n outlineClassName: string;\n disabled?: boolean;\n nativeControl: (props: React.InputHTMLAttributes<HTMLInputElement>) => React.ReactElement;\n styledControl: React.ReactElement;\n label?: React.ReactNode;\n description?: React.ReactNode;\n descriptionBottomPadding?: boolean;\n ariaLabel?: string;\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n onClick: () => void;\n}\n\nfunction joinString(values: (string | undefined)[]) {\n return values.filter((value): value is string => !!value).join(' ');\n}\n\nexport default function AbstractSwitch({\n controlId,\n controlClassName,\n outlineClassName,\n disabled,\n nativeControl,\n styledControl,\n label,\n description,\n descriptionBottomPadding,\n ariaLabel,\n ariaLabelledby,\n ariaDescribedby,\n onClick,\n __internalRootRef,\n ...rest\n}: AbstractSwitchProps) {\n const uniqueId = useUniqueId();\n const id = controlId || uniqueId;\n\n const focusVisible = useFocusVisible();\n const labelId = `${id}-label`;\n const descriptionId = `${id}-description`;\n\n const ariaLabelledByIds = [];\n if (label) {\n ariaLabelledByIds.push(labelId);\n }\n if (ariaLabelledby) {\n ariaLabelledByIds.push(ariaLabelledby);\n }\n\n const ariaDescriptons = [];\n if (ariaDescribedby) {\n ariaDescriptons.push(ariaDescribedby);\n }\n if (description) {\n ariaDescriptons.push(descriptionId);\n }\n\n return (\n <span {...rest} className={clsx(styles.wrapper, rest.className)} ref={__internalRootRef}>\n <span\n className={styles['label-wrapper']}\n aria-disabled={disabled ? 'true' : undefined}\n onClick={disabled ? undefined : onClick}\n >\n <span className={clsx(styles.control, controlClassName)}>\n {styledControl}\n {nativeControl({\n ...focusVisible,\n id,\n disabled,\n className: styles['native-input'],\n 'aria-describedby': ariaDescriptons.length ? joinString(ariaDescriptons) : undefined,\n 'aria-labelledby': ariaLabelledByIds.length ? joinString(ariaLabelledByIds) : undefined,\n 'aria-label': ariaLabel,\n })}\n <span className={clsx(styles.outline, outlineClassName)} />\n </span>\n <span className={clsx(styles.content, !label && !description && styles['empty-content'])}>\n {label && (\n <span id={labelId} className={clsx(styles.label, { [styles['label-disabled']]: disabled })}>\n {label}\n </span>\n )}\n {description && (\n <span\n id={descriptionId}\n className={clsx(styles.description, {\n [styles['description-disabled']]: disabled,\n [styles['description-bottom-padding']]: descriptionBottomPadding,\n })}\n >\n {description}\n </span>\n )}\n </span>\n </span>\n </span>\n );\n}\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { OptionProps } from './interfaces';
|
|
2
2
|
export { OptionProps };
|
|
3
|
-
declare const Option: ({ option, highlightText, triggerVariant, isGroupOption, ...restProps }: OptionProps) => JSX.Element | null;
|
|
3
|
+
declare const Option: ({ option, highlightText, triggerVariant, isGroupOption, highlightedOption, selectedOption, ...restProps }: OptionProps) => JSX.Element | null;
|
|
4
4
|
export default Option;
|
|
5
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAM3C,OAAO,EAAE,WAAW,EAAE,CAAC;AAWvB,QAAA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAM3C,OAAO,EAAE,WAAW,EAAE,CAAC;AAWvB,QAAA,MAAM,MAAM,8GAQT,WAAW,uBA0Eb,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
|
@@ -15,7 +15,7 @@ function validateStringValue(value, propertyName) {
|
|
|
15
15
|
}
|
|
16
16
|
var Option = function (_a) {
|
|
17
17
|
var _b, _c, _d, _e;
|
|
18
|
-
var option = _a.option, highlightText = _a.highlightText, _f = _a.triggerVariant, triggerVariant = _f === void 0 ? false : _f, _g = _a.isGroupOption, isGroupOption = _g === void 0 ? false : _g, restProps = __rest(_a, ["option", "highlightText", "triggerVariant", "isGroupOption"]);
|
|
18
|
+
var option = _a.option, highlightText = _a.highlightText, _f = _a.triggerVariant, triggerVariant = _f === void 0 ? false : _f, _g = _a.isGroupOption, isGroupOption = _g === void 0 ? false : _g, _h = _a.highlightedOption, highlightedOption = _h === void 0 ? false : _h, _j = _a.selectedOption, selectedOption = _j === void 0 ? false : _j, restProps = __rest(_a, ["option", "highlightText", "triggerVariant", "isGroupOption", "highlightedOption", "selectedOption"]);
|
|
19
19
|
if (!option) {
|
|
20
20
|
return null;
|
|
21
21
|
}
|
|
@@ -40,9 +40,9 @@ var Option = function (_a) {
|
|
|
40
40
|
React.createElement("span", { className: clsx(styles['label-content']) },
|
|
41
41
|
React.createElement(Label, { label: (_e = option.label) !== null && _e !== void 0 ? _e : option.value, prefix: option.__labelPrefix, highlightText: highlightText, triggerVariant: triggerVariant }),
|
|
42
42
|
React.createElement(LabelTag, { labelTag: option.labelTag, highlightText: highlightText, triggerVariant: triggerVariant })),
|
|
43
|
-
React.createElement(Description, { description: option.description, highlightText: highlightText, triggerVariant: triggerVariant }),
|
|
44
|
-
React.createElement(Tags, { tags: option.tags, highlightText: highlightText, triggerVariant: triggerVariant }),
|
|
45
|
-
React.createElement(FilteringTags, { filteringTags: option.filteringTags, highlightText: highlightText, triggerVariant: triggerVariant }))));
|
|
43
|
+
React.createElement(Description, { description: option.description, highlightedOption: highlightedOption, selectedOption: selectedOption, highlightText: highlightText, triggerVariant: triggerVariant }),
|
|
44
|
+
React.createElement(Tags, { tags: option.tags, highlightedOption: highlightedOption, selectedOption: selectedOption, highlightText: highlightText, triggerVariant: triggerVariant }),
|
|
45
|
+
React.createElement(FilteringTags, { filteringTags: option.filteringTags, highlightedOption: highlightedOption, selectedOption: selectedOption, highlightText: highlightText, triggerVariant: triggerVariant }))));
|
|
46
46
|
};
|
|
47
47
|
export default Option;
|
|
48
48
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/option/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC/F,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAIrD,SAAS,mBAAmB,CAAC,KAAyB,EAAE,YAAoB;IAC1E,IAAI,OAAO,KAAK,KAAK,WAAW,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC7D,QAAQ,CACN,gBAAgB,EAChB,mEAA2D,YAAY,oBAAS,OAAO,KAAK,+CAA4C,CACzI,CAAC;KACH;AACH,CAAC;AAED,IAAM,MAAM,GAAG,UAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/option/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 from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { OptionProps } from './interfaces';\nimport { Label, LabelTag, Description, Tags, FilteringTags, OptionIcon } from './option-parts';\nimport { getBaseProps } from '../../base-component';\nimport { warnOnce } from '../../logging';\nimport { isDevelopment } from '../../is-development';\n\nexport { OptionProps };\n\nfunction validateStringValue(value: string | undefined, propertyName: string) {\n if (typeof value !== 'undefined' && typeof value !== 'string') {\n warnOnce(\n 'DropdownOption',\n `This component only supports string values, but \"option.${propertyName}\" has ${typeof value} type. The component may work incorrectly.`\n );\n }\n}\n\nconst Option = ({\n option,\n highlightText,\n triggerVariant = false,\n isGroupOption = false,\n highlightedOption = false,\n selectedOption = false,\n ...restProps\n}: OptionProps) => {\n if (!option) {\n return null;\n }\n const { disabled } = option;\n const baseProps = getBaseProps(restProps);\n\n if (isDevelopment) {\n validateStringValue(option.label, 'label');\n validateStringValue(option.description, 'description');\n validateStringValue(option.labelTag, 'labelTag');\n option.tags?.forEach((tag, index) => {\n validateStringValue(tag, `tags[${index}]`);\n });\n option.filteringTags?.forEach((tag, index) => {\n validateStringValue(tag, `filteringTags[${index}]`);\n });\n }\n\n const className = clsx(styles.option, disabled && styles.disabled, isGroupOption && styles.parent);\n\n const icon = option.__customIcon || (\n <OptionIcon\n name={option.iconName}\n url={option.iconUrl}\n svg={option.iconSvg}\n alt={option.iconAlt}\n size={option.description || option.tags ? 'big' : 'normal'}\n />\n );\n\n return (\n <span\n title={option.label ?? option.value}\n data-value={option.value}\n className={className}\n aria-disabled={disabled}\n {...baseProps}\n >\n {icon}\n <span className={clsx(styles.content)}>\n <span className={clsx(styles['label-content'])}>\n <Label\n label={option.label ?? option.value}\n prefix={option.__labelPrefix}\n highlightText={highlightText}\n triggerVariant={triggerVariant}\n />\n <LabelTag labelTag={option.labelTag} highlightText={highlightText} triggerVariant={triggerVariant} />\n </span>\n <Description\n description={option.description}\n highlightedOption={highlightedOption}\n selectedOption={selectedOption}\n highlightText={highlightText}\n triggerVariant={triggerVariant}\n />\n <Tags\n tags={option.tags}\n highlightedOption={highlightedOption}\n selectedOption={selectedOption}\n highlightText={highlightText}\n triggerVariant={triggerVariant}\n />\n <FilteringTags\n filteringTags={option.filteringTags}\n highlightedOption={highlightedOption}\n selectedOption={selectedOption}\n highlightText={highlightText}\n triggerVariant={triggerVariant}\n />\n </span>\n </span>\n );\n};\n\nexport default Option;\n"]}
|
|
@@ -32,6 +32,8 @@ export interface OptionProps extends BaseComponentProps {
|
|
|
32
32
|
option?: InternalOptionDefinition;
|
|
33
33
|
triggerVariant?: boolean;
|
|
34
34
|
highlightText?: string;
|
|
35
|
+
highlightedOption?: boolean;
|
|
36
|
+
selectedOption?: boolean;
|
|
35
37
|
isGroupOption?: boolean;
|
|
36
38
|
}
|
|
37
39
|
//# sourceMappingURL=interfaces.d.ts.map
|
|
@@ -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;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,gBAAiB,SAAQ,UAAU;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,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;IAC1B,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB;IAChE,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,MAAM,EAAE,gBAAgB,GAAG,WAAW,CAAC;CACxC;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,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB"}
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAE1D,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,gBAAiB,SAAQ,UAAU;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,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;IAC1B,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB;IAChE,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,MAAM,EAAE,gBAAgB,GAAG,WAAW,CAAC;CACxC;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;CACzB"}
|
|
@@ -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';\nimport { IconProps } from '../../../icon/interfaces';\nimport { BaseComponentProps } from '../../base-component';\n\nexport interface BaseOption {\n label?: string;\n disabled?: boolean;\n}\n\nexport interface OptionDefinition extends BaseOption {\n value?: string;\n labelTag?: string;\n description?: string;\n iconAlt?: string;\n iconName?: IconProps.Name;\n iconUrl?: string;\n iconSvg?: React.ReactNode;\n tags?: ReadonlyArray<string>;\n filteringTags?: ReadonlyArray<string>;\n __labelPrefix?: string;\n}\n\nexport interface 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 option: OptionDefinition | OptionGroup;\n}\n\nexport interface OptionProps extends BaseComponentProps {\n option?: InternalOptionDefinition;\n triggerVariant?: boolean;\n highlightText?: string;\n isGroupOption?: 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';\nimport { IconProps } from '../../../icon/interfaces';\nimport { BaseComponentProps } from '../../base-component';\n\nexport interface BaseOption {\n label?: string;\n disabled?: boolean;\n}\n\nexport interface OptionDefinition extends BaseOption {\n value?: string;\n labelTag?: string;\n description?: string;\n iconAlt?: string;\n iconName?: IconProps.Name;\n iconUrl?: string;\n iconSvg?: React.ReactNode;\n tags?: ReadonlyArray<string>;\n filteringTags?: ReadonlyArray<string>;\n __labelPrefix?: string;\n}\n\nexport interface 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 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}\n"]}
|
|
@@ -14,22 +14,28 @@ interface LabelTagProps {
|
|
|
14
14
|
export declare const LabelTag: ({ labelTag, highlightText, triggerVariant }: LabelTagProps) => JSX.Element | null;
|
|
15
15
|
interface DescriptionProps {
|
|
16
16
|
description?: string;
|
|
17
|
+
highlightedOption: boolean;
|
|
17
18
|
highlightText?: string;
|
|
19
|
+
selectedOption: boolean;
|
|
18
20
|
triggerVariant: boolean;
|
|
19
21
|
}
|
|
20
|
-
export declare const Description: ({ description, highlightText, triggerVariant }: DescriptionProps) => JSX.Element | null;
|
|
22
|
+
export declare const Description: ({ description, highlightedOption, highlightText, selectedOption, triggerVariant, }: DescriptionProps) => JSX.Element | null;
|
|
21
23
|
interface TagsProps {
|
|
22
24
|
tags?: ReadonlyArray<string>;
|
|
25
|
+
highlightedOption: boolean;
|
|
23
26
|
highlightText?: string;
|
|
27
|
+
selectedOption: boolean;
|
|
24
28
|
triggerVariant: boolean;
|
|
25
29
|
}
|
|
26
|
-
export declare const Tags: ({ tags, highlightText, triggerVariant }: TagsProps) => JSX.Element | null;
|
|
30
|
+
export declare const Tags: ({ tags, highlightedOption, highlightText, selectedOption, triggerVariant }: TagsProps) => JSX.Element | null;
|
|
27
31
|
interface FilteringTagProps {
|
|
28
32
|
filteringTags?: ReadonlyArray<string>;
|
|
33
|
+
highlightedOption: boolean;
|
|
29
34
|
highlightText?: string;
|
|
35
|
+
selectedOption: boolean;
|
|
30
36
|
triggerVariant: boolean;
|
|
31
37
|
}
|
|
32
|
-
export declare const FilteringTags: ({ filteringTags, highlightText, triggerVariant }: FilteringTagProps) => JSX.Element | null;
|
|
38
|
+
export declare const FilteringTags: ({ filteringTags, highlightedOption, highlightText, selectedOption, triggerVariant, }: FilteringTagProps) => JSX.Element | null;
|
|
33
39
|
export declare const OptionIcon: (props: IconProps) => JSX.Element | null;
|
|
34
40
|
export {};
|
|
35
41
|
//# sourceMappingURL=option-parts.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"option-parts.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/option-parts.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAIrD,UAAU,UAAU;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,KAAK,qDAAsD,UAAU,gBAOjF,CAAC;AAEF,UAAU,aAAa;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,QAAQ,gDAAiD,aAAa,uBAKzE,CAAC;AAEX,UAAU,gBAAgB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"option-parts.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/option/option-parts.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAIrD,UAAU,UAAU;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,KAAK,qDAAsD,UAAU,gBAOjF,CAAC;AAEF,UAAU,aAAa;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,QAAQ,gDAAiD,aAAa,uBAKzE,CAAC;AAEX,UAAU,gBAAgB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;IACxB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,WAAW,uFAMrB,gBAAgB,uBAWT,CAAC;AAEX,UAAU,SAAS;IACjB,IAAI,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IAC7B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;IACxB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,IAAI,+EAAgF,SAAS,uBAchG,CAAC;AAEX,UAAU,iBAAiB;IACzB,aAAa,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC;IACtC,iBAAiB,EAAE,OAAO,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,OAAO,CAAC;IACxB,cAAc,EAAE,OAAO,CAAC;CACzB;AACD,eAAO,MAAM,aAAa,yFAMvB,iBAAiB,uBA+BnB,CAAC;AAEF,eAAO,MAAM,UAAU,UAAW,SAAS,uBAU1C,CAAC"}
|
|
@@ -20,34 +20,38 @@ export var LabelTag = function (_a) {
|
|
|
20
20
|
React.createElement(HighlightMatch, { str: labelTag, highlightText: highlightText }))) : null;
|
|
21
21
|
};
|
|
22
22
|
export var Description = function (_a) {
|
|
23
|
-
var
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
23
|
+
var _b;
|
|
24
|
+
var description = _a.description, highlightedOption = _a.highlightedOption, highlightText = _a.highlightText, selectedOption = _a.selectedOption, triggerVariant = _a.triggerVariant;
|
|
25
|
+
return description ? (React.createElement("span", { className: clsx(styles.description, (_b = {},
|
|
26
|
+
_b[styles['trigger-variant']] = triggerVariant,
|
|
27
|
+
_b[styles.highlighted] = highlightedOption,
|
|
28
|
+
_b[styles.selected] = selectedOption,
|
|
29
|
+
_b)) },
|
|
28
30
|
React.createElement(HighlightMatch, { str: description, highlightText: highlightText }))) : null;
|
|
29
31
|
};
|
|
30
32
|
export var Tags = function (_a) {
|
|
31
|
-
var
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
33
|
+
var _b;
|
|
34
|
+
var tags = _a.tags, highlightedOption = _a.highlightedOption, highlightText = _a.highlightText, selectedOption = _a.selectedOption, triggerVariant = _a.triggerVariant;
|
|
35
|
+
return tags ? (React.createElement("span", { className: clsx(styles.tags, (_b = {},
|
|
36
|
+
_b[styles.highlighted] = highlightedOption,
|
|
37
|
+
_b[styles.selected] = selectedOption,
|
|
38
|
+
_b)) }, tags.map(function (tag, idx) { return (React.createElement("span", { key: idx, className: clsx(styles.tag, triggerVariant && styles['trigger-variant']) },
|
|
36
39
|
React.createElement(HighlightMatch, { str: tag, highlightText: highlightText }))); }))) : null;
|
|
37
40
|
};
|
|
38
41
|
export var FilteringTags = function (_a) {
|
|
39
|
-
var
|
|
42
|
+
var _b;
|
|
43
|
+
var filteringTags = _a.filteringTags, highlightedOption = _a.highlightedOption, highlightText = _a.highlightText, selectedOption = _a.selectedOption, triggerVariant = _a.triggerVariant;
|
|
40
44
|
if (!highlightText || !filteringTags) {
|
|
41
45
|
return null;
|
|
42
46
|
}
|
|
43
47
|
var searchElement = highlightText.toLowerCase();
|
|
44
|
-
return (React.createElement("span", { className: clsx(styles.tags
|
|
48
|
+
return (React.createElement("span", { className: clsx(styles.tags, (_b = {},
|
|
49
|
+
_b[styles.highlighted] = highlightedOption,
|
|
50
|
+
_b[styles.selected] = selectedOption,
|
|
51
|
+
_b)) }, filteringTags.map(function (filteringTag, key) {
|
|
45
52
|
var match = filteringTag.toLowerCase().indexOf(searchElement) !== -1;
|
|
46
53
|
if (match) {
|
|
47
|
-
return (
|
|
48
|
-
// We do not reach AA compliance in Dark mode for highlighted state
|
|
49
|
-
// TODO: Remove aria-disabled={true} when we fix AWSUI-10333
|
|
50
|
-
React.createElement("span", { className: clsx(styles.tag, triggerVariant && styles['trigger-variant']), key: key, "aria-disabled": true },
|
|
54
|
+
return (React.createElement("span", { className: clsx(styles.tag, triggerVariant && styles['trigger-variant']), key: key, "aria-disabled": true },
|
|
51
55
|
React.createElement(HighlightMatch, { str: filteringTag, highlightText: highlightText })));
|
|
52
56
|
}
|
|
53
57
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"option-parts.js","sourceRoot":"","sources":["../../../../../src/internal/components/option/option-parts.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAClD,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAQ/C,MAAM,CAAC,IAAM,KAAK,GAAG,UAAC,EAA4D;QAA1D,KAAK,WAAA,EAAE,MAAM,YAAA,EAAE,aAAa,mBAAA,EAAE,cAAc,oBAAA;IAAmB,OAAA,CACrF,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE,cAAc,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;QAC7E,MAAM,IAAI,CACT,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,cAAc,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;YAAG,MAAM;gBAAS,CAC7G;QACD,oBAAC,cAAc,IAAC,GAAG,EAAE,KAAK,EAAE,aAAa,EAAE,aAAa,GAAI,CACvD,CACR;AAPsF,CAOtF,CAAC;AAOF,MAAM,CAAC,IAAM,QAAQ,GAAG,UAAC,EAA0D;QAAxD,QAAQ,cAAA,EAAE,aAAa,mBAAA,EAAE,cAAc,oBAAA;IAChE,OAAA,QAAQ,CAAC,CAAC,CAAC,CACT,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,cAAc,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACrF,oBAAC,cAAc,IAAC,GAAG,EAAE,QAAQ,EAAE,aAAa,EAAE,aAAa,GAAI,CAC1D,CACR,CAAC,CAAC,CAAC,IAAI;AAJR,CAIQ,CAAC;
|
|
1
|
+
{"version":3,"file":"option-parts.js","sourceRoot":"","sources":["../../../../../src/internal/components/option/option-parts.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 styles from './styles.css.js';\nimport clsx from 'clsx';\nimport React from 'react';\nimport { IconProps } from '../../../icon/interfaces';\nimport InternalIcon from '../../../icon/internal';\nimport HighlightMatch from './highlight-match';\n\ninterface LabelProps {\n label?: string;\n prefix?: string;\n highlightText?: string;\n triggerVariant: boolean;\n}\nexport const Label = ({ label, prefix, highlightText, triggerVariant }: LabelProps) => (\n <span className={clsx(styles.label, triggerVariant && styles['trigger-variant'])}>\n {prefix && (\n <span className={clsx(styles['label-prefix'], triggerVariant && styles['trigger-variant'])}>{prefix} </span>\n )}\n <HighlightMatch str={label} highlightText={highlightText} />\n </span>\n);\n\ninterface LabelTagProps {\n labelTag?: string;\n highlightText?: string;\n triggerVariant: boolean;\n}\nexport const LabelTag = ({ labelTag, highlightText, triggerVariant }: LabelTagProps) =>\n labelTag ? (\n <span className={clsx(styles['label-tag'], triggerVariant && styles['trigger-variant'])}>\n <HighlightMatch str={labelTag} highlightText={highlightText} />\n </span>\n ) : null;\n\ninterface DescriptionProps {\n description?: string;\n highlightedOption: boolean;\n highlightText?: string;\n selectedOption: boolean;\n triggerVariant: boolean;\n}\nexport const Description = ({\n description,\n highlightedOption,\n highlightText,\n selectedOption,\n triggerVariant,\n}: DescriptionProps) =>\n description ? (\n <span\n className={clsx(styles.description, {\n [styles['trigger-variant']]: triggerVariant,\n [styles.highlighted]: highlightedOption,\n [styles.selected]: selectedOption,\n })}\n >\n <HighlightMatch str={description} highlightText={highlightText} />\n </span>\n ) : null;\n\ninterface TagsProps {\n tags?: ReadonlyArray<string>;\n highlightedOption: boolean;\n highlightText?: string;\n selectedOption: boolean;\n triggerVariant: boolean;\n}\nexport const Tags = ({ tags, highlightedOption, highlightText, selectedOption, triggerVariant }: TagsProps) =>\n tags ? (\n <span\n className={clsx(styles.tags, {\n [styles.highlighted]: highlightedOption,\n [styles.selected]: selectedOption,\n })}\n >\n {tags.map((tag, idx) => (\n <span key={idx} className={clsx(styles.tag, triggerVariant && styles['trigger-variant'])}>\n <HighlightMatch str={tag} highlightText={highlightText} />\n </span>\n ))}\n </span>\n ) : null;\n\ninterface FilteringTagProps {\n filteringTags?: ReadonlyArray<string>;\n highlightedOption: boolean;\n highlightText?: string;\n selectedOption: boolean;\n triggerVariant: boolean;\n}\nexport const FilteringTags = ({\n filteringTags,\n highlightedOption,\n highlightText,\n selectedOption,\n triggerVariant,\n}: FilteringTagProps) => {\n if (!highlightText || !filteringTags) {\n return null;\n }\n\n const searchElement = highlightText.toLowerCase();\n\n return (\n <span\n className={clsx(styles.tags, {\n [styles.highlighted]: highlightedOption,\n [styles.selected]: selectedOption,\n })}\n >\n {filteringTags.map((filteringTag, key) => {\n const match = filteringTag.toLowerCase().indexOf(searchElement) !== -1;\n if (match) {\n return (\n <span\n className={clsx(styles.tag, triggerVariant && styles['trigger-variant'])}\n key={key}\n aria-disabled={true}\n >\n <HighlightMatch str={filteringTag} highlightText={highlightText} />\n </span>\n );\n }\n return null;\n })}\n </span>\n );\n};\n\nexport const OptionIcon = (props: IconProps) => {\n if (!props.name && !props.url && !props.svg) {\n return null;\n }\n\n return (\n <span className={clsx(styles.icon, props.size === 'big' && [styles[`icon-size-big`]])}>\n <InternalIcon {...props} />\n </span>\n );\n};\n"]}
|
|
@@ -1,20 +1,22 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"option": "
|
|
5
|
-
"disabled": "
|
|
6
|
-
"parent": "
|
|
7
|
-
"content": "
|
|
8
|
-
"label-content": "awsui_label-
|
|
9
|
-
"label": "
|
|
10
|
-
"tag": "
|
|
11
|
-
"label-tag": "awsui_label-
|
|
12
|
-
"label-prefix": "awsui_label-
|
|
13
|
-
"tags": "
|
|
14
|
-
"description": "
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
4
|
+
"option": "awsui_option_1p2cx_mh23j_97",
|
|
5
|
+
"disabled": "awsui_disabled_1p2cx_mh23j_115",
|
|
6
|
+
"parent": "awsui_parent_1p2cx_mh23j_118",
|
|
7
|
+
"content": "awsui_content_1p2cx_mh23j_125",
|
|
8
|
+
"label-content": "awsui_label-content_1p2cx_mh23j_132",
|
|
9
|
+
"label": "awsui_label_1p2cx_mh23j_132",
|
|
10
|
+
"tag": "awsui_tag_1p2cx_mh23j_139",
|
|
11
|
+
"label-tag": "awsui_label-tag_1p2cx_mh23j_140",
|
|
12
|
+
"label-prefix": "awsui_label-prefix_1p2cx_mh23j_151",
|
|
13
|
+
"tags": "awsui_tags_1p2cx_mh23j_164",
|
|
14
|
+
"description": "awsui_description_1p2cx_mh23j_165",
|
|
15
|
+
"highlighted": "awsui_highlighted_1p2cx_mh23j_172",
|
|
16
|
+
"selected": "awsui_selected_1p2cx_mh23j_176",
|
|
17
|
+
"icon": "awsui_icon_1p2cx_mh23j_190",
|
|
18
|
+
"icon-size-big": "awsui_icon-size-big_1p2cx_mh23j_197",
|
|
19
|
+
"filtering-match-highlight": "awsui_filtering-match-highlight_1p2cx_mh23j_201",
|
|
20
|
+
"trigger-variant": "awsui_trigger-variant_1p2cx_mh23j_216"
|
|
19
21
|
};
|
|
20
22
|
|
|
@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
94
94
|
Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
95
95
|
SPDX-License-Identifier: Apache-2.0
|
|
96
96
|
*/
|
|
97
|
-
.
|
|
97
|
+
.awsui_option_1p2cx_mh23j_97:not(#\9) {
|
|
98
98
|
/* stylelint-disable-next-line plugin/no-unsupported-browser-features */
|
|
99
99
|
border-collapse: separate;
|
|
100
100
|
border-spacing: 0;
|
|
@@ -138,100 +138,108 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
|
|
|
138
138
|
box-sizing: border-box;
|
|
139
139
|
color: inherit;
|
|
140
140
|
}
|
|
141
|
-
.
|
|
141
|
+
.awsui_option_1p2cx_mh23j_97:not(#\9):not(.awsui_disabled_1p2cx_mh23j_115) {
|
|
142
142
|
cursor: inherit;
|
|
143
143
|
}
|
|
144
|
-
.
|
|
144
|
+
.awsui_option_1p2cx_mh23j_97.awsui_parent_1p2cx_mh23j_118:not(#\9) {
|
|
145
145
|
font-weight: bold;
|
|
146
146
|
}
|
|
147
|
-
.
|
|
147
|
+
.awsui_option_1p2cx_mh23j_97.awsui_parent_1p2cx_mh23j_118:not(#\9):not(.awsui_disabled_1p2cx_mh23j_115) {
|
|
148
148
|
color: var(--color-text-dropdown-group-label-eaqlcl, #414d5c);
|
|
149
149
|
}
|
|
150
150
|
|
|
151
|
-
.
|
|
151
|
+
.awsui_content_1p2cx_mh23j_125:not(#\9) {
|
|
152
152
|
width: 100%;
|
|
153
153
|
display: flex;
|
|
154
154
|
flex-direction: column;
|
|
155
155
|
min-width: 0;
|
|
156
156
|
}
|
|
157
157
|
|
|
158
|
-
.awsui_label-
|
|
158
|
+
.awsui_label-content_1p2cx_mh23j_132:not(#\9) {
|
|
159
159
|
display: flex;
|
|
160
160
|
justify-content: space-between;
|
|
161
161
|
flex-wrap: wrap;
|
|
162
162
|
}
|
|
163
163
|
|
|
164
|
-
.
|
|
165
|
-
.
|
|
166
|
-
.awsui_label-
|
|
164
|
+
.awsui_label_1p2cx_mh23j_132:not(#\9),
|
|
165
|
+
.awsui_tag_1p2cx_mh23j_139:not(#\9),
|
|
166
|
+
.awsui_label-tag_1p2cx_mh23j_140:not(#\9) {
|
|
167
167
|
min-width: 0;
|
|
168
168
|
-ms-word-break: break-all;
|
|
169
169
|
word-break: break-word;
|
|
170
170
|
}
|
|
171
171
|
|
|
172
|
-
.
|
|
173
|
-
.
|
|
172
|
+
.awsui_label_1p2cx_mh23j_132:not(#\9),
|
|
173
|
+
.awsui_tag_1p2cx_mh23j_139:not(#\9) {
|
|
174
174
|
flex-wrap: wrap;
|
|
175
175
|
}
|
|
176
176
|
|
|
177
|
-
.awsui_label-
|
|
177
|
+
.awsui_label-prefix_1p2cx_mh23j_151:not(#\9) {
|
|
178
178
|
font-weight: 700;
|
|
179
179
|
}
|
|
180
180
|
|
|
181
|
-
.awsui_label-
|
|
181
|
+
.awsui_label-tag_1p2cx_mh23j_140:not(#\9) {
|
|
182
182
|
padding-left: var(--space-s-hv8c1d, 12px);
|
|
183
183
|
flex: auto;
|
|
184
184
|
text-align: right;
|
|
185
185
|
}
|
|
186
|
-
.awsui_label-
|
|
186
|
+
.awsui_label-tag_1p2cx_mh23j_140:not(#\9):empty {
|
|
187
187
|
display: none;
|
|
188
188
|
}
|
|
189
189
|
|
|
190
|
-
.
|
|
191
|
-
.
|
|
190
|
+
.awsui_tags_1p2cx_mh23j_164:not(#\9),
|
|
191
|
+
.awsui_description_1p2cx_mh23j_165:not(#\9) {
|
|
192
192
|
font-size: var(--font-body-s-size-ukw2p9, 12px);
|
|
193
193
|
line-height: var(--font-body-s-line-height-kdsbrl, 16px);
|
|
194
194
|
letter-spacing: var(--font-body-s-letter-spacing-cy0oxj, 0.005em);
|
|
195
195
|
color: var(--color-text-dropdown-item-secondary-0me7js, #5f6b7a);
|
|
196
196
|
flex-wrap: wrap;
|
|
197
197
|
}
|
|
198
|
+
.awsui_tags_1p2cx_mh23j_164.awsui_highlighted_1p2cx_mh23j_172:not(#\9),
|
|
199
|
+
.awsui_description_1p2cx_mh23j_165.awsui_highlighted_1p2cx_mh23j_172:not(#\9) {
|
|
200
|
+
color: var(--color-text-dropdown-item-secondary-hover-7ii1ru, #5f6b7a);
|
|
201
|
+
}
|
|
202
|
+
.awsui_tags_1p2cx_mh23j_164.awsui_selected_1p2cx_mh23j_176:not(#\9),
|
|
203
|
+
.awsui_description_1p2cx_mh23j_165.awsui_selected_1p2cx_mh23j_176:not(#\9) {
|
|
204
|
+
color: var(--color-text-dropdown-item-secondary-0me7js, #5f6b7a);
|
|
205
|
+
}
|
|
198
206
|
|
|
199
|
-
.
|
|
207
|
+
.awsui_tags_1p2cx_mh23j_164:not(#\9) {
|
|
200
208
|
display: flex;
|
|
201
209
|
align-items: stretch;
|
|
202
210
|
}
|
|
203
211
|
|
|
204
|
-
.
|
|
212
|
+
.awsui_tag_1p2cx_mh23j_139:not(#\9):not(:last-child) {
|
|
205
213
|
padding-right: var(--space-m-17eucw, 16px);
|
|
206
214
|
}
|
|
207
215
|
|
|
208
|
-
.
|
|
216
|
+
.awsui_icon_1p2cx_mh23j_190:not(#\9) {
|
|
209
217
|
padding-right: var(--space-xs-rsr2qu, 8px);
|
|
210
218
|
align-content: center;
|
|
211
219
|
display: flex;
|
|
212
220
|
flex-shrink: 0;
|
|
213
221
|
}
|
|
214
222
|
|
|
215
|
-
.awsui_icon-size-
|
|
223
|
+
.awsui_icon-size-big_1p2cx_mh23j_197:not(#\9) {
|
|
216
224
|
padding-top: var(--space-xxxs-k2w98v, 2px);
|
|
217
225
|
}
|
|
218
226
|
|
|
219
|
-
.awsui_filtering-match-
|
|
227
|
+
.awsui_filtering-match-highlight_1p2cx_mh23j_201:not(#\9) {
|
|
220
228
|
background-color: var(--color-background-dropdown-item-filter-match-6ac2mw, #f2f8fd);
|
|
221
229
|
color: var(--color-text-dropdown-item-filter-match-x302if, #0972d3);
|
|
222
230
|
font-weight: bold;
|
|
223
231
|
}
|
|
224
232
|
|
|
225
|
-
.
|
|
233
|
+
.awsui_disabled_1p2cx_mh23j_115:not(#\9) {
|
|
226
234
|
color: var(--color-text-dropdown-item-disabled-varol7, #9ba7b6);
|
|
227
235
|
pointer-events: none;
|
|
228
236
|
}
|
|
229
|
-
.
|
|
230
|
-
.
|
|
237
|
+
.awsui_disabled_1p2cx_mh23j_115 > .awsui_content_1p2cx_mh23j_125 > .awsui_tags_1p2cx_mh23j_164:not(#\9),
|
|
238
|
+
.awsui_disabled_1p2cx_mh23j_115 > .awsui_content_1p2cx_mh23j_125 > .awsui_description_1p2cx_mh23j_165:not(#\9) {
|
|
231
239
|
color: currentColor;
|
|
232
240
|
}
|
|
233
241
|
|
|
234
|
-
.awsui_trigger-
|
|
242
|
+
.awsui_trigger-variant_1p2cx_mh23j_216:not(#\9) {
|
|
235
243
|
white-space: nowrap;
|
|
236
244
|
overflow: hidden;
|
|
237
245
|
text-overflow: ellipsis;
|
|
@@ -2,20 +2,22 @@
|
|
|
2
2
|
// es-module interop with Babel and Typescript
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
4
|
module.exports.default = {
|
|
5
|
-
"option": "
|
|
6
|
-
"disabled": "
|
|
7
|
-
"parent": "
|
|
8
|
-
"content": "
|
|
9
|
-
"label-content": "awsui_label-
|
|
10
|
-
"label": "
|
|
11
|
-
"tag": "
|
|
12
|
-
"label-tag": "awsui_label-
|
|
13
|
-
"label-prefix": "awsui_label-
|
|
14
|
-
"tags": "
|
|
15
|
-
"description": "
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
5
|
+
"option": "awsui_option_1p2cx_mh23j_97",
|
|
6
|
+
"disabled": "awsui_disabled_1p2cx_mh23j_115",
|
|
7
|
+
"parent": "awsui_parent_1p2cx_mh23j_118",
|
|
8
|
+
"content": "awsui_content_1p2cx_mh23j_125",
|
|
9
|
+
"label-content": "awsui_label-content_1p2cx_mh23j_132",
|
|
10
|
+
"label": "awsui_label_1p2cx_mh23j_132",
|
|
11
|
+
"tag": "awsui_tag_1p2cx_mh23j_139",
|
|
12
|
+
"label-tag": "awsui_label-tag_1p2cx_mh23j_140",
|
|
13
|
+
"label-prefix": "awsui_label-prefix_1p2cx_mh23j_151",
|
|
14
|
+
"tags": "awsui_tags_1p2cx_mh23j_164",
|
|
15
|
+
"description": "awsui_description_1p2cx_mh23j_165",
|
|
16
|
+
"highlighted": "awsui_highlighted_1p2cx_mh23j_172",
|
|
17
|
+
"selected": "awsui_selected_1p2cx_mh23j_176",
|
|
18
|
+
"icon": "awsui_icon_1p2cx_mh23j_190",
|
|
19
|
+
"icon-size-big": "awsui_icon-size-big_1p2cx_mh23j_197",
|
|
20
|
+
"filtering-match-highlight": "awsui_filtering-match-highlight_1p2cx_mh23j_201",
|
|
21
|
+
"trigger-variant": "awsui_trigger-variant_1p2cx_mh23j_216"
|
|
20
22
|
};
|
|
21
23
|
|
package/internal/environment.js
CHANGED
|
@@ -1367,6 +1367,10 @@ module.exports.preset = {
|
|
|
1367
1367
|
"light": "{colorTextFormSecondary}",
|
|
1368
1368
|
"dark": "{colorTextFormSecondary}"
|
|
1369
1369
|
},
|
|
1370
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
1371
|
+
"light": "{colorGrey550}",
|
|
1372
|
+
"dark": "colorGrey300"
|
|
1373
|
+
},
|
|
1370
1374
|
"colorTextEmpty": {
|
|
1371
1375
|
"light": "{colorGrey550}",
|
|
1372
1376
|
"dark": "{colorGrey300}"
|
|
@@ -2901,6 +2905,10 @@ module.exports.preset = {
|
|
|
2901
2905
|
"light": "{colorTextFormSecondary}",
|
|
2902
2906
|
"dark": "{colorTextFormSecondary}"
|
|
2903
2907
|
},
|
|
2908
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
2909
|
+
"light": "colorGrey300",
|
|
2910
|
+
"dark": "colorGrey300"
|
|
2911
|
+
},
|
|
2904
2912
|
"colorTextEmpty": {
|
|
2905
2913
|
"light": "{colorGrey300}",
|
|
2906
2914
|
"dark": "{colorGrey300}"
|
|
@@ -3811,6 +3819,10 @@ module.exports.preset = {
|
|
|
3811
3819
|
"light": "{colorTextFormSecondary}",
|
|
3812
3820
|
"dark": "{colorTextFormSecondary}"
|
|
3813
3821
|
},
|
|
3822
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
3823
|
+
"light": "colorGrey300",
|
|
3824
|
+
"dark": "colorGrey300"
|
|
3825
|
+
},
|
|
3814
3826
|
"colorTextEmpty": {
|
|
3815
3827
|
"light": "{colorGrey300}",
|
|
3816
3828
|
"dark": "{colorGrey300}"
|
|
@@ -4669,6 +4681,10 @@ module.exports.preset = {
|
|
|
4669
4681
|
"light": "{colorTextFormSecondary}",
|
|
4670
4682
|
"dark": "{colorTextFormSecondary}"
|
|
4671
4683
|
},
|
|
4684
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
4685
|
+
"light": "{colorGrey550}",
|
|
4686
|
+
"dark": "colorGrey300"
|
|
4687
|
+
},
|
|
4672
4688
|
"colorTextEmpty": {
|
|
4673
4689
|
"light": "{colorGrey550}",
|
|
4674
4690
|
"dark": "{colorGrey300}"
|
|
@@ -5527,6 +5543,10 @@ module.exports.preset = {
|
|
|
5527
5543
|
"light": "{colorTextFormSecondary}",
|
|
5528
5544
|
"dark": "{colorTextFormSecondary}"
|
|
5529
5545
|
},
|
|
5546
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
5547
|
+
"light": "{colorGrey550}",
|
|
5548
|
+
"dark": "colorGrey300"
|
|
5549
|
+
},
|
|
5530
5550
|
"colorTextEmpty": {
|
|
5531
5551
|
"light": "{colorGrey550}",
|
|
5532
5552
|
"dark": "{colorGrey300}"
|
|
@@ -6036,6 +6056,7 @@ module.exports.preset = {
|
|
|
6036
6056
|
"colorTextDropdownItemFilterMatch": "color",
|
|
6037
6057
|
"colorTextDropdownItemHighlighted": "color",
|
|
6038
6058
|
"colorTextDropdownItemSecondary": "color",
|
|
6059
|
+
"colorTextDropdownItemSecondaryHover": "color",
|
|
6039
6060
|
"colorTextEmpty": "color",
|
|
6040
6061
|
"colorTextExpandableSectionDefault": "color",
|
|
6041
6062
|
"colorTextExpandableSectionHover": "color",
|
|
@@ -7043,6 +7064,7 @@ module.exports.preset = {
|
|
|
7043
7064
|
"colorTextDropdownItemFilterMatch": "color-text-dropdown-item-filter-match",
|
|
7044
7065
|
"colorTextDropdownItemHighlighted": "color-text-dropdown-item-highlighted",
|
|
7045
7066
|
"colorTextDropdownItemSecondary": "color-text-dropdown-item-secondary",
|
|
7067
|
+
"colorTextDropdownItemSecondaryHover": "color-text-dropdown-item-secondary-hover",
|
|
7046
7068
|
"colorTextEmpty": "color-text-empty",
|
|
7047
7069
|
"colorTextExpandableSectionDefault": "color-text-expandable-section-default",
|
|
7048
7070
|
"colorTextExpandableSectionHover": "color-text-expandable-section-hover",
|
|
@@ -7692,6 +7714,7 @@ module.exports.preset = {
|
|
|
7692
7714
|
"colorTextDropdownItemFilterMatch": "--color-text-dropdown-item-filter-match-x302if",
|
|
7693
7715
|
"colorTextDropdownItemHighlighted": "--color-text-dropdown-item-highlighted-oaabyk",
|
|
7694
7716
|
"colorTextDropdownItemSecondary": "--color-text-dropdown-item-secondary-0me7js",
|
|
7717
|
+
"colorTextDropdownItemSecondaryHover": "--color-text-dropdown-item-secondary-hover-7ii1ru",
|
|
7695
7718
|
"colorTextEmpty": "--color-text-empty-fjv325",
|
|
7696
7719
|
"colorTextExpandableSectionDefault": "--color-text-expandable-section-default-k03p1p",
|
|
7697
7720
|
"colorTextExpandableSectionHover": "--color-text-expandable-section-hover-73g3du",
|
|
@@ -1367,6 +1367,10 @@ export var preset = {
|
|
|
1367
1367
|
"light": "{colorTextFormSecondary}",
|
|
1368
1368
|
"dark": "{colorTextFormSecondary}"
|
|
1369
1369
|
},
|
|
1370
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
1371
|
+
"light": "{colorGrey550}",
|
|
1372
|
+
"dark": "colorGrey300"
|
|
1373
|
+
},
|
|
1370
1374
|
"colorTextEmpty": {
|
|
1371
1375
|
"light": "{colorGrey550}",
|
|
1372
1376
|
"dark": "{colorGrey300}"
|
|
@@ -2901,6 +2905,10 @@ export var preset = {
|
|
|
2901
2905
|
"light": "{colorTextFormSecondary}",
|
|
2902
2906
|
"dark": "{colorTextFormSecondary}"
|
|
2903
2907
|
},
|
|
2908
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
2909
|
+
"light": "colorGrey300",
|
|
2910
|
+
"dark": "colorGrey300"
|
|
2911
|
+
},
|
|
2904
2912
|
"colorTextEmpty": {
|
|
2905
2913
|
"light": "{colorGrey300}",
|
|
2906
2914
|
"dark": "{colorGrey300}"
|
|
@@ -3811,6 +3819,10 @@ export var preset = {
|
|
|
3811
3819
|
"light": "{colorTextFormSecondary}",
|
|
3812
3820
|
"dark": "{colorTextFormSecondary}"
|
|
3813
3821
|
},
|
|
3822
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
3823
|
+
"light": "colorGrey300",
|
|
3824
|
+
"dark": "colorGrey300"
|
|
3825
|
+
},
|
|
3814
3826
|
"colorTextEmpty": {
|
|
3815
3827
|
"light": "{colorGrey300}",
|
|
3816
3828
|
"dark": "{colorGrey300}"
|
|
@@ -4669,6 +4681,10 @@ export var preset = {
|
|
|
4669
4681
|
"light": "{colorTextFormSecondary}",
|
|
4670
4682
|
"dark": "{colorTextFormSecondary}"
|
|
4671
4683
|
},
|
|
4684
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
4685
|
+
"light": "{colorGrey550}",
|
|
4686
|
+
"dark": "colorGrey300"
|
|
4687
|
+
},
|
|
4672
4688
|
"colorTextEmpty": {
|
|
4673
4689
|
"light": "{colorGrey550}",
|
|
4674
4690
|
"dark": "{colorGrey300}"
|
|
@@ -5527,6 +5543,10 @@ export var preset = {
|
|
|
5527
5543
|
"light": "{colorTextFormSecondary}",
|
|
5528
5544
|
"dark": "{colorTextFormSecondary}"
|
|
5529
5545
|
},
|
|
5546
|
+
"colorTextDropdownItemSecondaryHover": {
|
|
5547
|
+
"light": "{colorGrey550}",
|
|
5548
|
+
"dark": "colorGrey300"
|
|
5549
|
+
},
|
|
5530
5550
|
"colorTextEmpty": {
|
|
5531
5551
|
"light": "{colorGrey550}",
|
|
5532
5552
|
"dark": "{colorGrey300}"
|
|
@@ -6036,6 +6056,7 @@ export var preset = {
|
|
|
6036
6056
|
"colorTextDropdownItemFilterMatch": "color",
|
|
6037
6057
|
"colorTextDropdownItemHighlighted": "color",
|
|
6038
6058
|
"colorTextDropdownItemSecondary": "color",
|
|
6059
|
+
"colorTextDropdownItemSecondaryHover": "color",
|
|
6039
6060
|
"colorTextEmpty": "color",
|
|
6040
6061
|
"colorTextExpandableSectionDefault": "color",
|
|
6041
6062
|
"colorTextExpandableSectionHover": "color",
|
|
@@ -7043,6 +7064,7 @@ export var preset = {
|
|
|
7043
7064
|
"colorTextDropdownItemFilterMatch": "color-text-dropdown-item-filter-match",
|
|
7044
7065
|
"colorTextDropdownItemHighlighted": "color-text-dropdown-item-highlighted",
|
|
7045
7066
|
"colorTextDropdownItemSecondary": "color-text-dropdown-item-secondary",
|
|
7067
|
+
"colorTextDropdownItemSecondaryHover": "color-text-dropdown-item-secondary-hover",
|
|
7046
7068
|
"colorTextEmpty": "color-text-empty",
|
|
7047
7069
|
"colorTextExpandableSectionDefault": "color-text-expandable-section-default",
|
|
7048
7070
|
"colorTextExpandableSectionHover": "color-text-expandable-section-hover",
|
|
@@ -7692,6 +7714,7 @@ export var preset = {
|
|
|
7692
7714
|
"colorTextDropdownItemFilterMatch": "--color-text-dropdown-item-filter-match-x302if",
|
|
7693
7715
|
"colorTextDropdownItemHighlighted": "--color-text-dropdown-item-highlighted-oaabyk",
|
|
7694
7716
|
"colorTextDropdownItemSecondary": "--color-text-dropdown-item-secondary-0me7js",
|
|
7717
|
+
"colorTextDropdownItemSecondaryHover": "--color-text-dropdown-item-secondary-hover-7ii1ru",
|
|
7695
7718
|
"colorTextEmpty": "--color-text-empty-fjv325",
|
|
7696
7719
|
"colorTextExpandableSectionDefault": "--color-text-expandable-section-default-k03p1p",
|
|
7697
7720
|
"colorTextExpandableSectionHover": "--color-text-expandable-section-hover-73g3du",
|
package/internal/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/item.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,cAAc,EAAoB,MAAM,6CAA6C,CAAC;AAG/F,OAAO,EAAE,aAAa,EAAE,MAAM,sEAAsE,CAAC;AAErG,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,cAAc,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;;
|
|
1
|
+
{"version":3,"file":"item.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/item.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,cAAc,EAAoB,MAAM,6CAA6C,CAAC;AAG/F,OAAO,EAAE,aAAa,EAAE,MAAM,sEAAsE,CAAC;AAErG,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,cAAc,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;;AAuED,wBAAkD"}
|
package/select/parts/item.js
CHANGED
|
@@ -20,7 +20,7 @@ var Item = function (_a, ref) {
|
|
|
20
20
|
React.createElement("div", { className: clsx(styles.item, !isParent && wrappedOption.labelTag && styles['show-label-tag']) },
|
|
21
21
|
hasCheckbox && !isParent && (React.createElement("div", { className: styles.checkbox },
|
|
22
22
|
React.createElement(CheckboxIcon, { checked: selected || false, disabled: option.disabled }))),
|
|
23
|
-
isParent ? (wrappedOption.label || wrappedOption.value) : (React.createElement(Option, { option: __assign(__assign({}, wrappedOption), { disabled: disabled }), highlightText: filteringValue })),
|
|
23
|
+
isParent ? (wrappedOption.label || wrappedOption.value) : (React.createElement(Option, { option: __assign(__assign({}, wrappedOption), { disabled: disabled }), highlightedOption: highlighted, selectedOption: selected, highlightText: filteringValue })),
|
|
24
24
|
!hasCheckbox && !isParent && selected && (React.createElement("div", { className: styles['selected-icon'] },
|
|
25
25
|
React.createElement(InternalIcon, { name: "check" }))))));
|
|
26
26
|
};
|
package/select/parts/item.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../../src/select/parts/item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,MAAM,MAAM,kCAAkC,CAAC;AACtD,OAAO,cAAc,MAAM,2CAA2C,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAE7D,OAAO,YAAY,MAAM,yCAAyC,CAAC;AACnE,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAkBlD,IAAM,IAAI,GAAG,UACX,EAcY,EACZ,GAA8B;IAd5B,IAAA,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,aAAa,mBAAA,EACV,SAAS,cAbd,+LAcC,CADa;IAId,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAE1C,IAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;IAC1C,IAAM,OAAO,GAAG,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC;IACxC,IAAM,aAAa,GAAqB,MAAM,CAAC,MAAM,CAAC;IACtD,IAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC;IAE3D,OAAO,CACL,oBAAC,cAAc,aACb,YAAY,EAAE,OAAO,CAAC,QAAQ,CAAC,EAC/B,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,IACxB,SAAS;QAEb,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,IAAI,MAAM,CAAC,gBAAgB,CAAC,CAAC;YAC/F,WAAW,IAAI,CAAC,QAAQ,IAAI,CAC3B,6BAAK,SAAS,EAAE,MAAM,CAAC,QAAQ;gBAC7B,oBAAC,YAAY,IAAC,OAAO,EAAE,QAAQ,IAAI,KAAK,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,GAAI,CACnE,CACP;YACA,QAAQ,CAAC,CAAC,CAAC,CACV,aAAa,CAAC,KAAK,IAAI,aAAa,CAAC,KAAK,CAC3C,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"item.js","sourceRoot":"","sources":["../../../../src/select/parts/item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,MAAM,MAAM,kCAAkC,CAAC;AACtD,OAAO,cAAc,MAAM,2CAA2C,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAE7D,OAAO,YAAY,MAAM,yCAAyC,CAAC;AACnE,OAAO,YAAY,MAAM,wBAAwB,CAAC;AAkBlD,IAAM,IAAI,GAAG,UACX,EAcY,EACZ,GAA8B;IAd5B,IAAA,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,aAAa,mBAAA,EACV,SAAS,cAbd,+LAcC,CADa;IAId,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAE1C,IAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;IAC1C,IAAM,OAAO,GAAG,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC;IACxC,IAAM,aAAa,GAAqB,MAAM,CAAC,MAAM,CAAC;IACtD,IAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC;IAE3D,OAAO,CACL,oBAAC,cAAc,aACb,YAAY,EAAE,OAAO,CAAC,QAAQ,CAAC,EAC/B,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,MAAM,CAAC,QAAQ,EACzB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,EACR,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,aAAa,EAAE,aAAa,IACxB,SAAS;QAEb,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,IAAI,MAAM,CAAC,gBAAgB,CAAC,CAAC;YAC/F,WAAW,IAAI,CAAC,QAAQ,IAAI,CAC3B,6BAAK,SAAS,EAAE,MAAM,CAAC,QAAQ;gBAC7B,oBAAC,YAAY,IAAC,OAAO,EAAE,QAAQ,IAAI,KAAK,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,GAAI,CACnE,CACP;YACA,QAAQ,CAAC,CAAC,CAAC,CACV,aAAa,CAAC,KAAK,IAAI,aAAa,CAAC,KAAK,CAC3C,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IACL,MAAM,wBAAO,aAAa,KAAE,QAAQ,UAAA,KACpC,iBAAiB,EAAE,WAAW,EAC9B,cAAc,EAAE,QAAQ,EACxB,aAAa,EAAE,cAAc,GAC7B,CACH;YACA,CAAC,WAAW,IAAI,CAAC,QAAQ,IAAI,QAAQ,IAAI,CACxC,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC;gBACrC,oBAAC,YAAY,IAAC,IAAI,EAAC,OAAO,GAAG,CACzB,CACP,CACG,CACS,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport Option from '../../internal/components/option';\nimport SelectableItem from '../../internal/components/selectable-item';\nimport { getBaseProps } from '../../internal/base-component';\nimport { DropdownOption, OptionDefinition } from '../../internal/components/option/interfaces';\nimport CheckboxIcon from '../../internal/components/checkbox-icon';\nimport InternalIcon from '../../icon/internal.js';\nimport { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option.js';\n\nexport interface ItemProps {\n option: DropdownOption;\n highlighted?: boolean;\n selected?: boolean;\n filteringValue?: string;\n hasCheckbox?: boolean;\n virtualPosition?: number;\n padBottom?: boolean;\n isNextSelected?: boolean;\n screenReaderContent?: string;\n ariaPosinset?: number;\n ariaSetsize?: number;\n highlightType?: HighlightType;\n}\n\nconst Item = (\n {\n option,\n highlighted,\n selected,\n filteringValue,\n hasCheckbox,\n virtualPosition,\n padBottom,\n isNextSelected,\n screenReaderContent,\n ariaPosinset,\n ariaSetsize,\n highlightType,\n ...restProps\n }: ItemProps,\n ref: React.Ref<HTMLDivElement>\n) => {\n const baseProps = getBaseProps(restProps);\n\n const isParent = option.type === 'parent';\n const isChild = option.type === 'child';\n const wrappedOption: OptionDefinition = option.option;\n const disabled = option.disabled || wrappedOption.disabled;\n\n return (\n <SelectableItem\n ariaSelected={Boolean(selected)}\n selected={selected}\n isNextSelected={isNextSelected}\n highlighted={highlighted}\n disabled={option.disabled}\n isParent={isParent}\n isChild={isChild}\n ref={ref}\n virtualPosition={virtualPosition}\n padBottom={padBottom}\n screenReaderContent={screenReaderContent}\n ariaPosinset={ariaPosinset}\n ariaSetsize={ariaSetsize}\n highlightType={highlightType}\n {...baseProps}\n >\n <div className={clsx(styles.item, !isParent && wrappedOption.labelTag && styles['show-label-tag'])}>\n {hasCheckbox && !isParent && (\n <div className={styles.checkbox}>\n <CheckboxIcon checked={selected || false} disabled={option.disabled} />\n </div>\n )}\n {isParent ? (\n wrappedOption.label || wrappedOption.value\n ) : (\n <Option\n option={{ ...wrappedOption, disabled }}\n highlightedOption={highlighted}\n selectedOption={selected}\n highlightText={filteringValue}\n />\n )}\n {!hasCheckbox && !isParent && selected && (\n <div className={styles['selected-icon']}>\n <InternalIcon name=\"check\" />\n </div>\n )}\n </div>\n </SelectableItem>\n );\n};\n\nexport default React.memo(React.forwardRef(Item));\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multiselect-item.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/multiselect-item.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,cAAc,EAAoB,MAAM,6CAA6C,CAAC;AAE/F,OAAO,EAAE,aAAa,EAAE,MAAM,sEAAsE,CAAC;AACrG,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,cAAc,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;;
|
|
1
|
+
{"version":3,"file":"multiselect-item.d.ts","sourceRoot":"","sources":["../../../../src/select/parts/multiselect-item.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,cAAc,EAAoB,MAAM,6CAA6C,CAAC;AAE/F,OAAO,EAAE,aAAa,EAAE,MAAM,sEAAsE,CAAC;AACrG,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,cAAc,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B;;AAoED,wBAA6D"}
|
|
@@ -23,7 +23,7 @@ var MultiSelectItem = function (_a, ref) {
|
|
|
23
23
|
React.createElement("div", { className: className },
|
|
24
24
|
hasCheckbox && (React.createElement("div", { className: styles.checkbox },
|
|
25
25
|
React.createElement(CheckboxIcon, { checked: selected, indeterminate: isParent && indeterminate, disabled: option.disabled }))),
|
|
26
|
-
React.createElement(Option, { option: __assign(__assign({}, wrappedOption), { disabled: disabled }), highlightText: filteringValue, isGroupOption: isParent }))));
|
|
26
|
+
React.createElement(Option, { option: __assign(__assign({}, wrappedOption), { disabled: disabled }), highlightedOption: highlighted, selectedOption: selected, highlightText: filteringValue, isGroupOption: isParent }))));
|
|
27
27
|
};
|
|
28
28
|
export default React.memo(React.forwardRef(MultiSelectItem));
|
|
29
29
|
//# sourceMappingURL=multiselect-item.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multiselect-item.js","sourceRoot":"","sources":["../../../../src/select/parts/multiselect-item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,MAAM,MAAM,kCAAkC,CAAC;AACtD,OAAO,cAAc,MAAM,2CAA2C,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAE7D,OAAO,YAAY,MAAM,yCAAyC,CAAC;AAkBnE,IAAM,eAAe,GAAG,UACtB,EAeY,EACZ,GAA8B;;IAf5B,IAAA,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,aAAa,mBAAA,EACb,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,aAAa,mBAAA,EACV,SAAS,cAdd,gNAeC,CADa;IAId,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAE1C,IAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;IAC1C,IAAM,OAAO,GAAG,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC;IACxC,IAAM,aAAa,GAAqB,MAAM,CAAC,MAAM,CAAC;IACtD,IAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC;IAC3D,IAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI;QAChC,GAAC,MAAM,CAAC,QAAQ,IAAG,QAAQ;YAC3B,CAAC;IAEH,OAAO,CACL,oBAAC,cAAc,aACb,WAAW,EAAE,QAAQ,IAAI,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EACpE,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,GAAG,EAAE,GAAG,EACR,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,oBAAoB,EAAE,IAAI,EAC1B,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,IACpB,SAAS;QAEb,6BAAK,SAAS,EAAE,SAAS;YACtB,WAAW,IAAI,CACd,6BAAK,SAAS,EAAE,MAAM,CAAC,QAAQ;gBAC7B,oBAAC,YAAY,IAAC,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,IAAI,aAAa,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,GAAI,CACpG,CACP;YACD,oBAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"multiselect-item.js","sourceRoot":"","sources":["../../../../src/select/parts/multiselect-item.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,MAAM,MAAM,kCAAkC,CAAC;AACtD,OAAO,cAAc,MAAM,2CAA2C,CAAC;AACvE,OAAO,EAAE,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAE7D,OAAO,YAAY,MAAM,yCAAyC,CAAC;AAkBnE,IAAM,eAAe,GAAG,UACtB,EAeY,EACZ,GAA8B;;IAf5B,IAAA,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,cAAc,oBAAA,EACd,WAAW,iBAAA,EACX,eAAe,qBAAA,EACf,SAAS,eAAA,EACT,cAAc,oBAAA,EACd,aAAa,mBAAA,EACb,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,WAAW,iBAAA,EACX,aAAa,mBAAA,EACV,SAAS,cAdd,gNAeC,CADa;IAId,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAE1C,IAAM,QAAQ,GAAG,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC;IAC1C,IAAM,OAAO,GAAG,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC;IACxC,IAAM,aAAa,GAAqB,MAAM,CAAC,MAAM,CAAC;IACtD,IAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC;IAC3D,IAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI;QAChC,GAAC,MAAM,CAAC,QAAQ,IAAG,QAAQ;YAC3B,CAAC;IAEH,OAAO,CACL,oBAAC,cAAc,aACb,WAAW,EAAE,QAAQ,IAAI,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,EACpE,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,aAAa,EAC5B,GAAG,EAAE,GAAG,EACR,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,oBAAoB,EAAE,IAAI,EAC1B,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,IACpB,SAAS;QAEb,6BAAK,SAAS,EAAE,SAAS;YACtB,WAAW,IAAI,CACd,6BAAK,SAAS,EAAE,MAAM,CAAC,QAAQ;gBAC7B,oBAAC,YAAY,IAAC,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,IAAI,aAAa,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,GAAI,CACpG,CACP;YACD,oBAAC,MAAM,IACL,MAAM,wBAAO,aAAa,KAAE,QAAQ,UAAA,KACpC,iBAAiB,EAAE,WAAW,EAC9B,cAAc,EAAE,QAAQ,EACxB,aAAa,EAAE,cAAc,EAC7B,aAAa,EAAE,QAAQ,GACvB,CACE,CACS,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport Option from '../../internal/components/option';\nimport SelectableItem from '../../internal/components/selectable-item';\nimport { getBaseProps } from '../../internal/base-component';\nimport { DropdownOption, OptionDefinition } from '../../internal/components/option/interfaces';\nimport CheckboxIcon from '../../internal/components/checkbox-icon';\nimport { HighlightType } from '../../internal/components/options-list/utils/use-highlight-option.js';\nexport interface ItemProps {\n option: DropdownOption;\n highlighted?: boolean;\n selected?: boolean;\n indeterminate?: boolean;\n filteringValue?: string;\n hasCheckbox?: boolean;\n virtualPosition?: number;\n padBottom?: boolean;\n isNextSelected?: boolean;\n screenReaderContent?: string;\n ariaPosinset?: number;\n ariaSetsize?: number;\n highlightType?: HighlightType;\n}\n\nconst MultiSelectItem = (\n {\n option,\n highlighted,\n selected,\n filteringValue,\n hasCheckbox,\n virtualPosition,\n padBottom,\n isNextSelected,\n indeterminate,\n screenReaderContent,\n ariaPosinset,\n ariaSetsize,\n highlightType,\n ...restProps\n }: ItemProps,\n ref: React.Ref<HTMLDivElement>\n) => {\n const baseProps = getBaseProps(restProps);\n\n const isParent = option.type === 'parent';\n const isChild = option.type === 'child';\n const wrappedOption: OptionDefinition = option.option;\n const disabled = option.disabled || wrappedOption.disabled;\n const className = clsx(styles.item, {\n [styles.disabled]: disabled,\n });\n\n return (\n <SelectableItem\n ariaChecked={isParent && indeterminate ? 'mixed' : Boolean(selected)}\n selected={selected}\n isNextSelected={isNextSelected}\n highlighted={highlighted}\n disabled={disabled}\n isParent={isParent}\n isChild={isChild}\n highlightType={highlightType}\n ref={ref}\n virtualPosition={virtualPosition}\n padBottom={padBottom}\n useInteractiveGroups={true}\n screenReaderContent={screenReaderContent}\n ariaPosinset={ariaPosinset}\n ariaSetsize={ariaSetsize}\n {...baseProps}\n >\n <div className={className}>\n {hasCheckbox && (\n <div className={styles.checkbox}>\n <CheckboxIcon checked={selected} indeterminate={isParent && indeterminate} disabled={option.disabled} />\n </div>\n )}\n <Option\n option={{ ...wrappedOption, disabled }}\n highlightedOption={highlighted}\n selectedOption={selected}\n highlightText={filteringValue}\n isGroupOption={isParent}\n />\n </div>\n </SelectableItem>\n );\n};\n\nexport default React.memo(React.forwardRef(MultiSelectItem));\n"]}
|