@cloudscape-design/components 3.0.178 → 3.0.180
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/container/index.d.ts.map +1 -1
- package/container/index.js +1 -1
- package/container/index.js.map +1 -1
- package/container/internal.js +1 -1
- package/container/internal.js.map +1 -1
- 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/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/radio-group/interfaces.d.ts +5 -0
- package/radio-group/interfaces.d.ts.map +1 -1
- package/radio-group/interfaces.js.map +1 -1
- package/radio-group/internal.d.ts.map +1 -1
- package/radio-group/internal.js +2 -2
- package/radio-group/internal.js.map +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/container/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,GAAG,KAAK,EACT,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,GAAG,KAAK,EACT,EAAE,cAAc,eAYhB"}
|
package/container/index.js
CHANGED
|
@@ -10,7 +10,7 @@ export default function Container(_a) {
|
|
|
10
10
|
var _b = _a.variant, variant = _b === void 0 ? 'default' : _b, _c = _a.disableHeaderPaddings, disableHeaderPaddings = _c === void 0 ? false : _c, _d = _a.disableContentPaddings, disableContentPaddings = _d === void 0 ? false : _d, props = __rest(_a, ["variant", "disableHeaderPaddings", "disableContentPaddings"]);
|
|
11
11
|
var baseComponentProps = useBaseComponent('Container');
|
|
12
12
|
var externalProps = getExternalProps(props);
|
|
13
|
-
return (React.createElement(InternalContainer, __assign({ variant: variant, disableHeaderPaddings: disableHeaderPaddings, disableContentPaddings: disableContentPaddings }, externalProps, baseComponentProps
|
|
13
|
+
return (React.createElement(InternalContainer, __assign({ variant: variant, disableHeaderPaddings: disableHeaderPaddings, disableContentPaddings: disableContentPaddings }, externalProps, baseComponentProps)));
|
|
14
14
|
}
|
|
15
15
|
applyDisplayName(Container, 'Container');
|
|
16
16
|
//# sourceMappingURL=index.js.map
|
package/container/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAKjB;IAJf,IAAA,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA,EAC7B,8BAA8B,EAA9B,sBAAsB,mBAAG,KAAK,KAAA,EAC3B,KAAK,cAJwB,8DAKjC,CADS;IAER,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,IAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CACL,oBAAC,iBAAiB,aAChB,OAAO,EAAE,OAAO,EAChB,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,IAC1C,aAAa,EACb,kBAAkB,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/container/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAE3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAKjB;IAJf,IAAA,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA,EAC7B,8BAA8B,EAA9B,sBAAsB,mBAAG,KAAK,KAAA,EAC3B,KAAK,cAJwB,8DAKjC,CADS;IAER,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,IAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CACL,oBAAC,iBAAiB,aAChB,OAAO,EAAE,OAAO,EAChB,qBAAqB,EAAE,qBAAqB,EAC5C,sBAAsB,EAAE,sBAAsB,IAC1C,aAAa,EACb,kBAAkB,EACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,SAAS,EAAE,WAAW,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 InternalContainer from './internal';\nimport { ContainerProps } from './interfaces';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { ContainerProps };\n\nexport default function Container({\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n ...props\n}: ContainerProps) {\n const baseComponentProps = useBaseComponent('Container');\n const externalProps = getExternalProps(props);\n return (\n <InternalContainer\n variant={variant}\n disableHeaderPaddings={disableHeaderPaddings}\n disableContentPaddings={disableContentPaddings}\n {...externalProps}\n {...baseComponentProps}\n />\n );\n}\n\napplyDisplayName(Container, 'Container');\n"]}
|
package/container/internal.js
CHANGED
|
@@ -48,7 +48,7 @@ export default function InternalContainer(_a) {
|
|
|
48
48
|
_b[styles['header-dynamic-height']] = hasDynamicHeight,
|
|
49
49
|
_b[styles['header-stuck']] = isStuck,
|
|
50
50
|
_b[styles['with-paddings']] = !disableHeaderPaddings,
|
|
51
|
-
_b[styles['with-hidden-content']] = __hiddenContent,
|
|
51
|
+
_b[styles['with-hidden-content']] = !children || __hiddenContent,
|
|
52
52
|
_b)) }, headerIdProp, stickyStyles, { ref: headerMergedRef }), __darkHeader ? (React.createElement("div", { className: clsx(styles['dark-header'], 'awsui-context-content-header') }, header)) : (header)))),
|
|
53
53
|
React.createElement("div", { className: clsx(styles.content, (_c = {},
|
|
54
54
|
_c[styles['with-paddings']] = !disableContentPaddings,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.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 clsx from 'clsx';\nimport React, { useEffect, useRef } from 'react';\nimport { ContainerProps } from './interfaces';\nimport { getBaseProps } from '../internal/base-component';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\nimport { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport styles from './styles.css.js';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n __stickyHeader?: boolean;\n __stickyOffset?: number;\n __disableFooterDivider?: boolean;\n __disableFooterPaddings?: boolean;\n __hiddenContent?: boolean;\n __headerRef?: React.RefObject<HTMLDivElement>;\n __headerId?: string;\n __darkHeader?: boolean;\n /**\n * Additional internal variant:\n * * `embedded` - Use this variant within a parent container (such as a modal,\n * expandable section, container or split panel).\n * * `full-page` – Only for internal use in table, cards and other components\n */\n variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n}\n\nexport default function InternalContainer({\n header,\n footer,\n children,\n variant = 'default',\n disableHeaderPaddings = false,\n disableContentPaddings = false,\n fitHeight,\n __stickyOffset,\n __stickyHeader = false,\n __internalRootRef = null,\n __disableFooterDivider = false,\n __disableFooterPaddings = false,\n __hiddenContent = false,\n __headerRef,\n __headerId,\n __darkHeader = false,\n ...restProps\n}: InternalContainerProps) {\n const baseProps = getBaseProps(restProps);\n const rootRef = useRef<HTMLDivElement>(null);\n const headerRef = useRef<HTMLDivElement>(null);\n const { isSticky, isStuck, stickyStyles } = useStickyHeader(rootRef, headerRef, __stickyHeader, __stickyOffset);\n const { setHasStickyBackground } = useAppLayoutContext();\n const isRefresh = useVisualRefresh();\n\n const hasDynamicHeight = isRefresh && variant === 'full-page';\n const overlapElement = useDynamicOverlap({ disabled: !hasDynamicHeight || !__darkHeader });\n\n const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n const headerMergedRef = useMergeRefs(headerRef, overlapElement, __headerRef);\n const headerIdProp = __headerId ? { id: __headerId } : {};\n\n /**\n * The visual refresh AppLayout component needs to know if a child component\n * has a high contrast sticky header. This is to make sure the background element\n * stays in the same vertical position as the header content.\n */\n useEffect(() => {\n const shouldUpdateStickyBackground = isSticky && variant === 'full-page' && setHasStickyBackground;\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(true);\n }\n\n return () => {\n if (shouldUpdateStickyBackground) {\n setHasStickyBackground(false);\n }\n };\n }, [isSticky, setHasStickyBackground, variant]);\n\n return (\n <div\n {...baseProps}\n className={clsx(\n baseProps.className,\n styles.root,\n styles[`variant-${variant}`],\n fitHeight && styles['root-fit-height']\n )}\n ref={mergedRef}\n >\n {header && (\n <StickyHeaderContext.Provider value={{ isStuck }}>\n <div\n className={clsx(styles.header, styles[`header-variant-${variant}`], {\n [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n [styles['header-sticky-enabled']]: isSticky,\n [styles['header-dynamic-height']]: hasDynamicHeight,\n [styles['header-stuck']]: isStuck,\n [styles['with-paddings']]: !disableHeaderPaddings,\n [styles['with-hidden-content']]: !children || __hiddenContent,\n })}\n {...headerIdProp}\n {...stickyStyles}\n ref={headerMergedRef}\n >\n {__darkHeader ? (\n <div className={clsx(styles['dark-header'], 'awsui-context-content-header')}>{header}</div>\n ) : (\n header\n )}\n </div>\n </StickyHeaderContext.Provider>\n )}\n <div\n className={clsx(styles.content, {\n [styles['with-paddings']]: !disableContentPaddings,\n })}\n >\n {children}\n </div>\n {footer && (\n <div\n className={clsx(styles.footer, {\n [styles['with-divider']]: !__disableFooterDivider,\n [styles['with-paddings']]: !__disableFooterPaddings,\n })}\n >\n {footer}\n </div>\n )}\n </div>\n );\n}\n"]}
|
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;
|
|
@@ -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
|
@@ -32,6 +32,11 @@ export interface RadioGroupProps extends BaseComponentProps, FormFieldControlPro
|
|
|
32
32
|
* Adds `aria-required` to the group.
|
|
33
33
|
*/
|
|
34
34
|
ariaRequired?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Adds `aria-controls` attribute to the radio group.
|
|
37
|
+
* If the radio group controls any secondary content (for example, another form field), use this to provide an ID referring to the secondary content.
|
|
38
|
+
*/
|
|
39
|
+
ariaControls?: string;
|
|
35
40
|
/**
|
|
36
41
|
* Called when the user selects a different radio button. The event `detail` contains the current `value`.
|
|
37
42
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/radio-group/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAE/E,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,qBAAqB;IAChF;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC,eAAe,CAAC,qBAAqB,CAAC,CAAC;IAE7D;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;IAEnE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,qBAAqB;QACpC,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB;IAED,UAAiB,YAAY;QAC3B,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF"}
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/radio-group/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAE/E,MAAM,WAAW,eAAgB,SAAQ,kBAAkB,EAAE,qBAAqB;IAChF;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC,eAAe,CAAC,qBAAqB,CAAC,CAAC;IAE7D;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;IAEnE;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,qBAAqB;QACpC,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB;IAED,UAAiB,YAAY;QAC3B,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/radio-group/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 { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { FormFieldControlProps } from '../internal/context/form-field-context';\n\nexport interface RadioGroupProps extends BaseComponentProps, FormFieldControlProps {\n /**\n * Specify a custom name for the radio buttons. If not provided, the radio group generates a random name.\n */\n name?: string;\n\n /**\n * Sets the value of the selected radio button.\n * If you want to clear the selection, use `null`.\n */\n value: string | null;\n\n /**\n * Specifies an array of radio buttons to display. Each of these objects have the following properties:\n *\n * - `value` (string) - Sets the value of the radio button. Assigned to the radio group when a user selects the radio button.\n * - `label` (ReactNode) - Specifies a label for the radio button.\n * - `description` (ReactNode) - (Optional) Specifies descriptive text that appears below the label.\n * - `disabled` (boolean) - (Optional) Determines whether the radio button is disabled, which prevents the user from selecting it.\n * - `controlId` (string) - (Optional) Sets the ID of the internal input. You can use it to relate a label element's `for` attribute to this control.\n * In general it's not recommended to set this because the ID is automatically set by the radio group component.\n */\n items?: ReadonlyArray<RadioGroupProps.RadioButtonDefinition>;\n\n /**\n * Adds `aria-label` to the group. If you are using this form element within a form field,\n * don't set this property because the form field component automatically sets the correct labels to make the component accessible.\n */\n ariaLabel?: string;\n\n /**\n * Adds `aria-required` to the group.\n */\n ariaRequired?: boolean;\n\n /**\n * Called when the user selects a different radio button. The event `detail` contains the current `value`.\n */\n onChange?: NonCancelableEventHandler<RadioGroupProps.ChangeDetail>;\n\n /**\n * @deprecated Has no effect.\n */\n controlId?: string;\n}\n\nexport namespace RadioGroupProps {\n export interface RadioButtonDefinition {\n value: string;\n label: React.ReactNode;\n description?: React.ReactNode;\n disabled?: boolean;\n controlId?: string;\n }\n\n export interface ChangeDetail {\n value: string;\n }\n\n export interface Ref {\n /**\n * Sets input focus onto the UI control.\n */\n focus(): void;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/radio-group/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 { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { FormFieldControlProps } from '../internal/context/form-field-context';\n\nexport interface RadioGroupProps extends BaseComponentProps, FormFieldControlProps {\n /**\n * Specify a custom name for the radio buttons. If not provided, the radio group generates a random name.\n */\n name?: string;\n\n /**\n * Sets the value of the selected radio button.\n * If you want to clear the selection, use `null`.\n */\n value: string | null;\n\n /**\n * Specifies an array of radio buttons to display. Each of these objects have the following properties:\n *\n * - `value` (string) - Sets the value of the radio button. Assigned to the radio group when a user selects the radio button.\n * - `label` (ReactNode) - Specifies a label for the radio button.\n * - `description` (ReactNode) - (Optional) Specifies descriptive text that appears below the label.\n * - `disabled` (boolean) - (Optional) Determines whether the radio button is disabled, which prevents the user from selecting it.\n * - `controlId` (string) - (Optional) Sets the ID of the internal input. You can use it to relate a label element's `for` attribute to this control.\n * In general it's not recommended to set this because the ID is automatically set by the radio group component.\n */\n items?: ReadonlyArray<RadioGroupProps.RadioButtonDefinition>;\n\n /**\n * Adds `aria-label` to the group. If you are using this form element within a form field,\n * don't set this property because the form field component automatically sets the correct labels to make the component accessible.\n */\n ariaLabel?: string;\n\n /**\n * Adds `aria-required` to the group.\n */\n ariaRequired?: boolean;\n\n /**\n * Adds `aria-controls` attribute to the radio group.\n * If the radio group controls any secondary content (for example, another form field), use this to provide an ID referring to the secondary content.\n */\n ariaControls?: string;\n\n /**\n * Called when the user selects a different radio button. The event `detail` contains the current `value`.\n */\n onChange?: NonCancelableEventHandler<RadioGroupProps.ChangeDetail>;\n\n /**\n * @deprecated Has no effect.\n */\n controlId?: string;\n}\n\nexport namespace RadioGroupProps {\n export interface RadioButtonDefinition {\n value: string;\n label: React.ReactNode;\n description?: React.ReactNode;\n disabled?: boolean;\n controlId?: string;\n }\n\n export interface ChangeDetail {\n value: string;\n }\n\n export interface Ref {\n /**\n * Sets input focus onto the UI control.\n */\n focus(): void;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAK/C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAKlF,QAAA,MAAM,kBAAkB,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAK/C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAKlF,QAAA,MAAM,kBAAkB,0HAmDvB,CAAC;AAEF,eAAe,kBAAkB,CAAC"}
|
package/radio-group/internal.js
CHANGED
|
@@ -10,12 +10,12 @@ import { useFormFieldContext } from '../internal/context/form-field-context';
|
|
|
10
10
|
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
11
11
|
import useRadioGroupForwardFocus from '../internal/hooks/forward-focus/radio-group';
|
|
12
12
|
var InternalRadioGroup = React.forwardRef(function (_a, ref) {
|
|
13
|
-
var name = _a.name, value = _a.value, items = _a.items, ariaLabel = _a.ariaLabel, ariaRequired = _a.ariaRequired, onChange = _a.onChange, _b = _a.__internalRootRef, __internalRootRef = _b === void 0 ? null : _b, props = __rest(_a, ["name", "value", "items", "ariaLabel", "ariaRequired", "onChange", "__internalRootRef"]);
|
|
13
|
+
var name = _a.name, value = _a.value, items = _a.items, ariaLabel = _a.ariaLabel, ariaRequired = _a.ariaRequired, ariaControls = _a.ariaControls, onChange = _a.onChange, _b = _a.__internalRootRef, __internalRootRef = _b === void 0 ? null : _b, props = __rest(_a, ["name", "value", "items", "ariaLabel", "ariaRequired", "ariaControls", "onChange", "__internalRootRef"]);
|
|
14
14
|
var _c = useFormFieldContext(props), ariaDescribedby = _c.ariaDescribedby, ariaLabelledby = _c.ariaLabelledby;
|
|
15
15
|
var baseProps = getBaseProps(props);
|
|
16
16
|
var generatedName = useUniqueId('awsui-radio-');
|
|
17
17
|
var _d = useRadioGroupForwardFocus(ref, items, value), radioButtonRef = _d[0], radioButtonRefIndex = _d[1];
|
|
18
|
-
return (React.createElement("div", __assign({ role: "radiogroup", "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel, "aria-describedby": ariaDescribedby, "aria-required": ariaRequired }, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }), items &&
|
|
18
|
+
return (React.createElement("div", __assign({ role: "radiogroup", "aria-labelledby": ariaLabelledby, "aria-label": ariaLabel, "aria-describedby": ariaDescribedby, "aria-required": ariaRequired, "aria-controls": ariaControls }, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }), items &&
|
|
19
19
|
items.map(function (item, index) { return (React.createElement(RadioButton, { key: item.value, ref: index === radioButtonRefIndex ? radioButtonRef : undefined, checked: item.value === value, name: name || generatedName, value: item.value, label: item.label, description: item.description, disabled: item.disabled, onChange: onChange, controlId: item.controlId })); })));
|
|
20
20
|
});
|
|
21
21
|
export default InternalRadioGroup;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,yBAAyB,MAAM,6CAA6C,CAAC;AAIpF,IAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CACzC,UACE,
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/radio-group/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,yBAAyB,MAAM,6CAA6C,CAAC;AAIpF,IAAM,kBAAkB,GAAG,KAAK,CAAC,UAAU,CACzC,UACE,EAU0B,EAC1B,GAAmC;IAVjC,IAAA,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,KAAK,WAAA,EACL,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,YAAY,kBAAA,EACZ,QAAQ,cAAA,EACR,yBAAwB,EAAxB,iBAAiB,mBAAG,IAAI,KAAA,EACrB,KAAK,cATV,wGAUC,CADS;IAIJ,IAAA,KAAsC,mBAAmB,CAAC,KAAK,CAAC,EAA9D,eAAe,qBAAA,EAAE,cAAc,oBAA+B,CAAC;IACvE,IAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,IAAM,aAAa,GAAG,WAAW,CAAC,cAAc,CAAC,CAAC;IAE5C,IAAA,KAAwC,yBAAyB,CAAC,GAAG,EAAE,KAAK,EAAE,KAAK,CAAC,EAAnF,cAAc,QAAA,EAAE,mBAAmB,QAAgD,CAAC;IAE3F,OAAO,CACL,sCACE,IAAI,EAAC,YAAY,qBACA,cAAc,gBACnB,SAAS,sBACH,eAAe,mBAClB,YAAY,mBACZ,YAAY,IACvB,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,EACjD,GAAG,EAAE,iBAAiB,KAErB,KAAK;QACJ,KAAK,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,IAAK,OAAA,CACzB,oBAAC,WAAW,IACV,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,GAAG,EAAE,KAAK,KAAK,mBAAmB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EAC/D,OAAO,EAAE,IAAI,CAAC,KAAK,KAAK,KAAK,EAC7B,IAAI,EAAE,IAAI,IAAI,aAAa,EAC3B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,IAAI,CAAC,SAAS,GACzB,CACH,EAb0B,CAa1B,CAAC,CACA,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { RadioGroupProps } from './interfaces';\nimport RadioButton from './radio-button';\nimport styles from './styles.css.js';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport useRadioGroupForwardFocus from '../internal/hooks/forward-focus/radio-group';\n\ntype InternalRadioGroupProps = RadioGroupProps & InternalBaseComponentProps;\n\nconst InternalRadioGroup = React.forwardRef(\n (\n {\n name,\n value,\n items,\n ariaLabel,\n ariaRequired,\n ariaControls,\n onChange,\n __internalRootRef = null,\n ...props\n }: InternalRadioGroupProps,\n ref: React.Ref<RadioGroupProps.Ref>\n ) => {\n const { ariaDescribedby, ariaLabelledby } = useFormFieldContext(props);\n const baseProps = getBaseProps(props);\n const generatedName = useUniqueId('awsui-radio-');\n\n const [radioButtonRef, radioButtonRefIndex] = useRadioGroupForwardFocus(ref, items, value);\n\n return (\n <div\n role=\"radiogroup\"\n aria-labelledby={ariaLabelledby}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n aria-required={ariaRequired}\n aria-controls={ariaControls}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n ref={__internalRootRef}\n >\n {items &&\n items.map((item, index) => (\n <RadioButton\n key={item.value}\n ref={index === radioButtonRefIndex ? radioButtonRef : undefined}\n checked={item.value === value}\n name={name || generatedName}\n value={item.value}\n label={item.label}\n description={item.description}\n disabled={item.disabled}\n onChange={onChange}\n controlId={item.controlId}\n />\n ))}\n </div>\n );\n }\n);\n\nexport default InternalRadioGroup;\n"]}
|
|
@@ -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"]}
|