@cloudscape-design/components 3.0.163 → 3.0.164
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/attribute-editor/additional-info.d.ts +2 -1
- package/attribute-editor/additional-info.d.ts.map +1 -1
- package/attribute-editor/additional-info.js +4 -2
- package/attribute-editor/additional-info.js.map +1 -1
- package/attribute-editor/internal.d.ts.map +1 -1
- package/attribute-editor/internal.js +5 -2
- package/attribute-editor/internal.js.map +1 -1
- package/internal/components/live-region/index.d.ts +2 -1
- package/internal/components/live-region/index.d.ts.map +1 -1
- package/internal/components/live-region/index.js +3 -3
- package/internal/components/live-region/index.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/manifest.json +1 -1
- package/package.json +1 -1
- package/tag-editor/index.d.ts.map +1 -1
- package/tag-editor/index.js +1 -1
- package/tag-editor/index.js.map +1 -1
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
interface AdditionalInfoProps {
|
|
3
3
|
children: React.ReactNode;
|
|
4
|
+
id?: string;
|
|
4
5
|
}
|
|
5
|
-
export declare const AdditionalInfo: ({ children }: AdditionalInfoProps) => JSX.Element;
|
|
6
|
+
export declare const AdditionalInfo: ({ children, id }: AdditionalInfoProps) => JSX.Element;
|
|
6
7
|
export {};
|
|
7
8
|
//# sourceMappingURL=additional-info.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"additional-info.d.ts","sourceRoot":"","sources":["../../../src/attribute-editor/additional-info.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"additional-info.d.ts","sourceRoot":"","sources":["../../../src/attribute-editor/additional-info.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,mBAAmB;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,eAAO,MAAM,cAAc,qBAAsB,mBAAmB,gBAMnE,CAAC"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
2
|
// SPDX-License-Identifier: Apache-2.0
|
|
3
3
|
import React from 'react';
|
|
4
|
+
import LiveRegion from '../internal/components/live-region';
|
|
4
5
|
import styles from './styles.css.js';
|
|
5
6
|
export var AdditionalInfo = function (_a) {
|
|
6
|
-
var children = _a.children;
|
|
7
|
-
return (React.createElement("div",
|
|
7
|
+
var children = _a.children, id = _a.id;
|
|
8
|
+
return (React.createElement(LiveRegion, { visible: true, tagName: "div", "data-testid": "info-live-region" },
|
|
9
|
+
React.createElement("div", { id: id, className: styles['additional-info'] }, children)));
|
|
8
10
|
};
|
|
9
11
|
//# sourceMappingURL=additional-info.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"additional-info.js","sourceRoot":"","sources":["../../../src/attribute-editor/additional-info.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"additional-info.js","sourceRoot":"","sources":["../../../src/attribute-editor/additional-info.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,UAAU,MAAM,oCAAoC,CAAC;AAC5D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAOrC,MAAM,CAAC,IAAM,cAAc,GAAG,UAAC,EAAqC;QAAnC,QAAQ,cAAA,EAAE,EAAE,QAAA;IAA4B,OAAA,CACvE,oBAAC,UAAU,IAAC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAC,KAAK,iBAAa,kBAAkB;QACrE,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,IAC9C,QAAQ,CACL,CACK,CACd;AANwE,CAMxE,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport LiveRegion from '../internal/components/live-region';\nimport styles from './styles.css.js';\n\ninterface AdditionalInfoProps {\n children: React.ReactNode;\n id?: string;\n}\n\nexport const AdditionalInfo = ({ children, id }: AdditionalInfoProps) => (\n <LiveRegion visible={true} tagName=\"div\" data-testid=\"info-live-region\">\n <div id={id} className={styles['additional-info']}>\n {children}\n </div>\n </LiveRegion>\n);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/attribute-editor/internal.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,6BAA6B,EAAwB,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/attribute-editor/internal.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,6BAA6B,EAAwB,MAAM,cAAc,CAAC;AAcnF,QAAA,MAAM,uBAAuB,+BAuEK,CAAC;AAEnC,eAAe,uBAAuB,CAAC"}
|
|
@@ -11,6 +11,7 @@ import styles from './styles.css.js';
|
|
|
11
11
|
import { useContainerBreakpoints } from '../internal/hooks/container-queries';
|
|
12
12
|
import InternalBox from '../box/internal';
|
|
13
13
|
import { useMergeRefs } from '../internal/hooks/use-merge-refs';
|
|
14
|
+
import { useUniqueId } from '../internal/hooks/use-unique-id';
|
|
14
15
|
var InternalAttributeEditor = React.forwardRef(function (_a, ref) {
|
|
15
16
|
var additionalInfo = _a.additionalInfo, disableAddButton = _a.disableAddButton, definition = _a.definition, items = _a.items, _b = _a.isItemRemovable, isItemRemovable = _b === void 0 ? function () { return true; } : _b, empty = _a.empty, addButtonText = _a.addButtonText, removeButtonText = _a.removeButtonText, i18nStrings = _a.i18nStrings, onAddButtonClick = _a.onAddButtonClick, onRemoveButtonClick = _a.onRemoveButtonClick, _c = _a.__internalRootRef, __internalRootRef = _c === void 0 ? null : _c, props = __rest(_a, ["additionalInfo", "disableAddButton", "definition", "items", "isItemRemovable", "empty", "addButtonText", "removeButtonText", "i18nStrings", "onAddButtonClick", "onRemoveButtonClick", "__internalRootRef"]);
|
|
16
17
|
var _d = useContainerBreakpoints(['default', 'xxs', 'xs']), breakpoint = _d[0], breakpointRef = _d[1];
|
|
@@ -26,12 +27,14 @@ var InternalAttributeEditor = React.forwardRef(function (_a, ref) {
|
|
|
26
27
|
}
|
|
27
28
|
}); });
|
|
28
29
|
var mergedRef = useMergeRefs(breakpointRef, __internalRootRef);
|
|
30
|
+
var additionalInfoId = useUniqueId('attribute-editor-info');
|
|
31
|
+
var infoAriaDescribedBy = additionalInfo ? additionalInfoId : undefined;
|
|
29
32
|
return (React.createElement("div", __assign({}, baseProps, { ref: mergedRef, className: clsx(baseProps.className, styles.root) }),
|
|
30
33
|
React.createElement(InternalBox, { margin: { bottom: 'l' } },
|
|
31
34
|
isEmpty && React.createElement("div", { className: clsx(styles.empty, wasNonEmpty.current && styles['empty-appear']) }, empty),
|
|
32
35
|
items.map(function (item, index) { return (React.createElement(Row, { key: index, index: index, breakpoint: breakpoint, item: item, definition: definition, i18nStrings: i18nStrings, removable: isItemRemovable(item), removeButtonText: removeButtonText, removeButtonRefs: removeButtonRefs.current, onRemoveButtonClick: onRemoveButtonClick })); })),
|
|
33
|
-
React.createElement(InternalButton, { className: styles['add-button'], disabled: disableAddButton, onClick: onAddButtonClick, formAction: "none" }, addButtonText),
|
|
34
|
-
additionalInfo && React.createElement(AdditionalInfo,
|
|
36
|
+
React.createElement(InternalButton, { className: styles['add-button'], disabled: disableAddButton, onClick: onAddButtonClick, formAction: "none", __nativeAttributes: { 'aria-describedby': infoAriaDescribedBy } }, addButtonText),
|
|
37
|
+
additionalInfo && React.createElement(AdditionalInfo, { id: infoAriaDescribedBy }, additionalInfo)));
|
|
35
38
|
});
|
|
36
39
|
export default InternalAttributeEditor;
|
|
37
40
|
//# sourceMappingURL=internal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/attribute-editor/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,mBAAmB,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAG1D,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAGpD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAE1C,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/attribute-editor/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 React, { useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\n\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\n\nimport { AttributeEditorForwardRefType, AttributeEditorProps } from './interfaces';\nimport { AdditionalInfo } from './additional-info';\nimport { Row } from './row';\n\nimport styles from './styles.css.js';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport InternalBox from '../box/internal';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { SomeRequired } from '../internal/types';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\ntype InternalAttributeEditorProps<T> = SomeRequired<AttributeEditorProps<T>, 'items'> & InternalBaseComponentProps;\n\nconst InternalAttributeEditor = React.forwardRef(\n <T,>(\n {\n additionalInfo,\n disableAddButton,\n definition,\n items,\n isItemRemovable = () => true,\n empty,\n addButtonText,\n removeButtonText,\n i18nStrings,\n onAddButtonClick,\n onRemoveButtonClick,\n __internalRootRef = null,\n ...props\n }: InternalAttributeEditorProps<T>,\n ref: React.Ref<AttributeEditorProps.Ref>\n ) => {\n const [breakpoint, breakpointRef] = useContainerBreakpoints(['default', 'xxs', 'xs']);\n const removeButtonRefs = useRef<Array<ButtonProps.Ref | undefined>>([]);\n const wasNonEmpty = useRef<boolean>(false);\n\n const baseProps = getBaseProps(props);\n const isEmpty = items && items.length === 0;\n\n wasNonEmpty.current = wasNonEmpty.current || !isEmpty;\n\n useImperativeHandle(ref, () => ({\n focusRemoveButton(rowIndex: number) {\n removeButtonRefs.current[rowIndex]?.focus();\n },\n }));\n\n const mergedRef = useMergeRefs(breakpointRef, __internalRootRef);\n\n const additionalInfoId = useUniqueId('attribute-editor-info');\n const infoAriaDescribedBy = additionalInfo ? additionalInfoId : undefined;\n\n return (\n <div {...baseProps} ref={mergedRef} className={clsx(baseProps.className, styles.root)}>\n <InternalBox margin={{ bottom: 'l' }}>\n {isEmpty && <div className={clsx(styles.empty, wasNonEmpty.current && styles['empty-appear'])}>{empty}</div>}\n {items.map((item, index) => (\n <Row\n key={index}\n index={index}\n breakpoint={breakpoint}\n item={item}\n definition={definition}\n i18nStrings={i18nStrings}\n removable={isItemRemovable(item)}\n removeButtonText={removeButtonText}\n removeButtonRefs={removeButtonRefs.current}\n onRemoveButtonClick={onRemoveButtonClick}\n />\n ))}\n </InternalBox>\n <InternalButton\n className={styles['add-button']}\n disabled={disableAddButton}\n onClick={onAddButtonClick}\n formAction=\"none\"\n __nativeAttributes={{ 'aria-describedby': infoAriaDescribedBy }}\n >\n {addButtonText}\n </InternalButton>\n {additionalInfo && <AdditionalInfo id={infoAriaDescribedBy}>{additionalInfo}</AdditionalInfo>}\n </div>\n );\n }\n) as AttributeEditorForwardRefType;\n\nexport default InternalAttributeEditor;\n"]}
|
|
@@ -4,6 +4,7 @@ export interface LiveRegionProps extends ScreenreaderOnlyProps {
|
|
|
4
4
|
assertive?: boolean;
|
|
5
5
|
delay?: number;
|
|
6
6
|
visible?: boolean;
|
|
7
|
+
tagName?: 'span' | 'div';
|
|
7
8
|
children: React.ReactNode;
|
|
8
9
|
}
|
|
9
10
|
/**
|
|
@@ -41,5 +42,5 @@ export interface LiveRegionProps extends ScreenreaderOnlyProps {
|
|
|
41
42
|
*/
|
|
42
43
|
declare const _default: React.MemoExoticComponent<typeof LiveRegion>;
|
|
43
44
|
export default _default;
|
|
44
|
-
declare function LiveRegion({ assertive, delay, visible, children, ...restProps }: LiveRegionProps): JSX.Element;
|
|
45
|
+
declare function LiveRegion({ assertive, delay, visible, tagName: TagName, children, ...restProps }: LiveRegionProps): JSX.Element;
|
|
45
46
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/live-region/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAkC,MAAM,OAAO,CAAC;AACvD,OAAyB,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAG/E,MAAM,WAAW,eAAgB,SAAQ,qBAAqB;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;;AACH,wBAAgC;AAEhC,iBAAS,UAAU,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/internal/components/live-region/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAkC,MAAM,OAAO,CAAC;AACvD,OAAyB,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAG/E,MAAM,WAAW,eAAgB,SAAQ,qBAAqB;IAC5D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;;AACH,wBAAgC;AAEhC,iBAAS,UAAU,CAAC,EAClB,SAAiB,EACjB,KAAU,EACV,OAAe,EACf,OAAO,EAAE,OAAgB,EACzB,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,eAAe,eA0DjB"}
|
|
@@ -41,7 +41,7 @@ import styles from './styles.css.js';
|
|
|
41
41
|
*/
|
|
42
42
|
export default memo(LiveRegion);
|
|
43
43
|
function LiveRegion(_a) {
|
|
44
|
-
var _b = _a.assertive, assertive = _b === void 0 ? false : _b, _c = _a.delay, delay = _c === void 0 ? 10 : _c, _d = _a.visible, visible = _d === void 0 ? false : _d, children = _a.children, restProps = __rest(_a, ["assertive", "delay", "visible", "children"]);
|
|
44
|
+
var _b = _a.assertive, assertive = _b === void 0 ? false : _b, _c = _a.delay, delay = _c === void 0 ? 10 : _c, _d = _a.visible, visible = _d === void 0 ? false : _d, _e = _a.tagName, TagName = _e === void 0 ? 'span' : _e, children = _a.children, restProps = __rest(_a, ["assertive", "delay", "visible", "tagName", "children"]);
|
|
45
45
|
var sourceRef = useRef(null);
|
|
46
46
|
var targetRef = useRef(null);
|
|
47
47
|
/*
|
|
@@ -82,9 +82,9 @@ function LiveRegion(_a) {
|
|
|
82
82
|
};
|
|
83
83
|
});
|
|
84
84
|
return (React.createElement(React.Fragment, null,
|
|
85
|
-
visible && React.createElement(
|
|
85
|
+
visible && React.createElement(TagName, { ref: sourceRef }, children),
|
|
86
86
|
React.createElement(ScreenreaderOnly, __assign({}, restProps, { className: clsx(styles.root, restProps.className) }),
|
|
87
|
-
!visible && (React.createElement(
|
|
87
|
+
!visible && (React.createElement(TagName, { ref: sourceRef, "aria-hidden": "true" }, children)),
|
|
88
88
|
React.createElement("span", { ref: targetRef, "aria-atomic": "true", "aria-live": assertive ? 'assertive' : 'polite' }))));
|
|
89
89
|
}
|
|
90
90
|
// This only extracts text content from the node including all its children which is enough for now.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/live-region/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,0DAA0D;AAE1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,gBAA2C,MAAM,sBAAsB,CAAC;AAC/E,OAAO,MAAM,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/internal/components/live-region/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,0DAA0D;AAE1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,gBAA2C,MAAM,sBAAsB,CAAC;AAC/E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAUrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,eAAe,IAAI,CAAC,UAAU,CAAC,CAAC;AAEhC,SAAS,UAAU,CAAC,EAOF;IANhB,IAAA,iBAAiB,EAAjB,SAAS,mBAAG,KAAK,KAAA,EACjB,aAAU,EAAV,KAAK,mBAAG,EAAE,KAAA,EACV,eAAe,EAAf,OAAO,mBAAG,KAAK,KAAA,EACf,eAAyB,EAAhB,OAAO,mBAAG,MAAM,KAAA,EACzB,QAAQ,cAAA,EACL,SAAS,cANM,wDAOnB,CADa;IAEZ,IAAM,SAAS,GAAG,MAAM,CAAmC,IAAI,CAAC,CAAC;IACjE,IAAM,SAAS,GAAG,MAAM,CAAmC,IAAI,CAAC,CAAC;IAEjE;;;;;;;;;;MAUE;IACF,SAAS,CAAC;QACR,SAAS,gBAAgB;YACvB,IAAI,SAAS,CAAC,OAAO,IAAI,SAAS,CAAC,OAAO,EAAE;gBAC1C,IAAM,aAAa,GAAG,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1D,IAAM,aAAa,GAAG,gBAAgB,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;gBAC1D,IAAI,aAAa,KAAK,aAAa,EAAE;oBACnC,gEAAgE;oBAChE,2DAA2D;oBAC3D,sDAAsD;oBACtD,SAAS,CAAC,OAAO,CAAC,SAAS,GAAG,aAAa,CAAC;iBAC7C;aACF;QACH,CAAC;QAED,IAAI,SAAwB,CAAC;QAC7B,IAAI,KAAK,EAAE;YACT,SAAS,GAAG,UAAU,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC;SACjD;aAAM;YACL,gBAAgB,EAAE,CAAC;SACpB;QAED,OAAO;YACL,IAAI,SAAS,EAAE;gBACb,YAAY,CAAC,SAAS,CAAC,CAAC;aACzB;QACH,CAAC,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,OAAO,CACL;QACG,OAAO,IAAI,oBAAC,OAAO,IAAC,GAAG,EAAE,SAAS,IAAG,QAAQ,CAAW;QAEzD,oBAAC,gBAAgB,eAAK,SAAS,IAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,SAAS,CAAC;YAC/E,CAAC,OAAO,IAAI,CACX,oBAAC,OAAO,IAAC,GAAG,EAAE,SAAS,iBAAc,MAAM,IACxC,QAAQ,CACD,CACX;YAED,8BAAM,GAAG,EAAE,SAAS,iBAAc,MAAM,eAAY,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,GAAS,CAC9E,CAClB,CACJ,CAAC;AACJ,CAAC;AAED,oGAAoG;AACpG,oGAAoG;AACpG,0FAA0F;AAC1F,SAAS,gBAAgB,CAAC,IAAiB;IACzC,OAAO,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;AAC5D,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\n/* eslint-disable @cloudscape-design/prefer-live-region */\n\nimport clsx from 'clsx';\nimport React, { memo, useEffect, useRef } from 'react';\nimport ScreenreaderOnly, { ScreenreaderOnlyProps } from '../screenreader-only';\nimport styles from './styles.css.js';\n\nexport interface LiveRegionProps extends ScreenreaderOnlyProps {\n assertive?: boolean;\n delay?: number;\n visible?: boolean;\n tagName?: 'span' | 'div';\n children: React.ReactNode;\n}\n\n/**\n * The live region is hidden in the layout, but visible for screen readers.\n * It's purpose it to announce changes e.g. when custom navigation logic is used.\n *\n * The way live region works differently in different browsers and screen readers and\n * it is recommended to manually test every new implementation.\n *\n * If you notice there are different words being merged together,\n * check if there are text nodes not being wrapped in elements, like:\n * <LiveRegion>\n * {title}\n * <span><Details /></span>\n * </LiveRegion>\n *\n * To fix, wrap \"title\" in an element:\n * <LiveRegion>\n * <span>{title}</span>\n * <span><Details /></span>\n * </LiveRegion>\n *\n * Or create a single text node if possible:\n * <LiveRegion>\n * {`${title} ${details}`}\n * </LiveRegion>\n *\n * The live region is always atomic, because non-atomic regions can be treated by screen readers\n * differently and produce unexpected results. To imitate non-atomic announcements simply use\n * multiple live regions:\n * <>\n * <LiveRegion>{title}</LiveRegion>\n * <LiveRegion><Details /></LiveRegion>\n * </>\n */\nexport default memo(LiveRegion);\n\nfunction LiveRegion({\n assertive = false,\n delay = 10,\n visible = false,\n tagName: TagName = 'span',\n children,\n ...restProps\n}: LiveRegionProps) {\n const sourceRef = useRef<HTMLSpanElement & HTMLDivElement>(null);\n const targetRef = useRef<HTMLSpanElement & HTMLDivElement>(null);\n\n /*\n When React state changes, React often produces too many DOM updates, causing NVDA to\n issue many announcements for the same logical event (See https://github.com/nvaccess/nvda/issues/7996).\n\n The code below imitates a debouncing, scheduling a callback every time new React state\n update is detected. When a callback resolves, it copies content from a muted element\n to the live region, which is recognized by screen readers as an update.\n\n If the use case requires no announcement to be ignored, use delay = 0, but ensure it\n does not impact the performance. If it does, prefer using a string as children prop.\n */\n useEffect(() => {\n function updateLiveRegion() {\n if (targetRef.current && sourceRef.current) {\n const sourceContent = extractInnerText(sourceRef.current);\n const targetContent = extractInnerText(targetRef.current);\n if (targetContent !== sourceContent) {\n // The aria-atomic does not work properly in Voice Over, causing\n // certain parts of the content to be ignored. To fix that,\n // we assign the source text content as a single node.\n targetRef.current.innerText = sourceContent;\n }\n }\n }\n\n let timeoutId: null | number;\n if (delay) {\n timeoutId = setTimeout(updateLiveRegion, delay);\n } else {\n updateLiveRegion();\n }\n\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n });\n\n return (\n <>\n {visible && <TagName ref={sourceRef}>{children}</TagName>}\n\n <ScreenreaderOnly {...restProps} className={clsx(styles.root, restProps.className)}>\n {!visible && (\n <TagName ref={sourceRef} aria-hidden=\"true\">\n {children}\n </TagName>\n )}\n\n <span ref={targetRef} aria-atomic=\"true\" aria-live={assertive ? 'assertive' : 'polite'}></span>\n </ScreenreaderOnly>\n </>\n );\n}\n\n// This only extracts text content from the node including all its children which is enough for now.\n// To make it more powerful, it is possible to create a more sophisticated extractor with respect to\n// ARIA properties to ignore aria-hidden nodes and read ARIA labels from the live content.\nfunction extractInnerText(node: HTMLElement) {\n return (node.innerText || '').replace(/\\s+/g, ' ').trim();\n}\n"]}
|
package/internal/environment.js
CHANGED
package/internal/manifest.json
CHANGED
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tag-editor/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAgBlG,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAS9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAS1B,QAAA,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/tag-editor/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6E,MAAM,OAAO,CAAC;AAgBlG,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAS9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAS1B,QAAA,MAAM,SAAS,2FAiPd,CAAC;AAGF,eAAe,SAAS,CAAC"}
|
package/tag-editor/index.js
CHANGED
|
@@ -148,7 +148,7 @@ var TagEditor = React.forwardRef(function (_a, ref) {
|
|
|
148
148
|
React.createElement(LiveRegion, { visible: true }, i18nStrings.loading))));
|
|
149
149
|
}
|
|
150
150
|
var baseProps = getBaseProps(restProps);
|
|
151
|
-
return (React.createElement(InternalAttributeEditor, __assign({}, baseProps, baseComponentProps, { ref: attributeEditorRef, className: clsx(styles.root, baseProps.className), items: internalTags, isItemRemovable: isItemRemovable, onAddButtonClick: onAddButtonClick, onRemoveButtonClick: onRemoveButtonClick, addButtonText: i18nStrings.addButton, removeButtonText: i18nStrings.removeButton, disableAddButton: remainingTags <= 0, empty: i18nStrings.emptyTags, additionalInfo:
|
|
151
|
+
return (React.createElement(InternalAttributeEditor, __assign({}, baseProps, baseComponentProps, { ref: attributeEditorRef, className: clsx(styles.root, baseProps.className), items: internalTags, isItemRemovable: isItemRemovable, onAddButtonClick: onAddButtonClick, onRemoveButtonClick: onRemoveButtonClick, addButtonText: i18nStrings.addButton, removeButtonText: i18nStrings.removeButton, disableAddButton: remainingTags <= 0, empty: i18nStrings.emptyTags, additionalInfo: remainingTags < 0 ? (React.createElement(FormFieldError, { errorIconAriaLabel: i18nStrings.errorIconAriaLabel }, (_b = i18nStrings.tagLimitExceeded(tagLimit)) !== null && _b !== void 0 ? _b : '')) : remainingTags === 0 ? ((_c = i18nStrings.tagLimitReached(tagLimit)) !== null && _c !== void 0 ? _c : '') : (i18nStrings.tagLimit(remainingTags, tagLimit)), definition: definition, i18nStrings: i18nStrings })));
|
|
152
152
|
});
|
|
153
153
|
applyDisplayName(TagEditor, 'TagEditor');
|
|
154
154
|
export default TagEditor;
|
package/tag-editor/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tag-editor/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, { useCallback, useImperativeHandle, useLayoutEffect, useMemo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent, NonCancelableCustomEvent } from '../internal/events';\nimport { useStableEventHandler } from '../internal/hooks/use-stable-event-handler';\n\nimport { InputProps } from '../input/interfaces';\nimport { AutosuggestProps } from '../autosuggest/interfaces';\nimport { AttributeEditorProps } from '../attribute-editor/interfaces';\nimport InternalAttributeEditor from '../attribute-editor/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport InternalBox from '../box/internal';\nimport { FormFieldError } from '../form-field/internal';\n\nimport { TagControl, UndoButton } from './internal';\nimport { TagEditorProps } from './interfaces';\nimport { validate, ValidationError } from './validation';\nimport { findIndex, useMemoizedArray } from './utils';\n\nimport styles from './styles.css.js';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport LiveRegion from '../internal/components/live-region';\n\nexport { TagEditorProps };\n\ninterface InternalTag {\n tag: TagEditorProps.Tag;\n error?: ValidationError;\n}\n\nconst isItemRemovable = ({ tag }: InternalTag) => !tag.markedForRemoval;\n\nconst TagEditor = React.forwardRef(\n (\n {\n tags = [],\n i18nStrings,\n loading = false,\n tagLimit = 50,\n allowedCharacterPattern,\n keysRequest,\n valuesRequest,\n onChange,\n ...restProps\n }: TagEditorProps,\n ref: React.Ref<TagEditorProps.Ref>\n ) => {\n const baseComponentProps = useBaseComponent('TagEditor');\n\n const remainingTags = tagLimit - tags.filter(tag => !tag.markedForRemoval).length;\n\n const attributeEditorRef = useRef<AttributeEditorProps.Ref>(null);\n const keyInputRefs = useRef<(InputProps.Ref | undefined | null)[]>([]);\n const valueInputRefs = useRef<(InputProps.Ref | undefined | null)[]>([]);\n const undoButtonRefs = useRef<(HTMLAnchorElement | undefined | null)[]>([]);\n\n const initialKeyOptionsRef = useRef<AutosuggestProps.Options>([]);\n const keyDirtyStateRef = useRef<boolean[]>([]);\n const focusEventRef = useRef<() => void>();\n\n useLayoutEffect(() => {\n focusEventRef.current?.apply(undefined);\n focusEventRef.current = undefined;\n });\n\n const errors = validate(\n tags,\n keyDirtyStateRef.current,\n i18nStrings,\n allowedCharacterPattern ? new RegExp(allowedCharacterPattern) : undefined\n );\n\n const internalTags = useMemoizedArray(\n tags.map((tag, i) => ({ tag, error: errors[i] })),\n (prev, next) => {\n return prev.tag === next.tag && prev.error?.key === next.error?.key && prev.error?.value === next.error?.value;\n }\n );\n\n useImperativeHandle(\n ref,\n () => ({\n focus() {\n const errorIndex = findIndex(internalTags, ({ error }) => error?.key || error?.value);\n if (errorIndex !== -1) {\n const refArray = internalTags[errorIndex].error?.key ? keyInputRefs : valueInputRefs;\n refArray.current[errorIndex]?.focus();\n }\n },\n }),\n [internalTags]\n );\n\n const validateAndFire = useCallback(\n (newTags: ReadonlyArray<TagEditorProps.Tag>) => {\n fireNonCancelableEvent(onChange, {\n tags: newTags,\n valid: !validate(\n newTags,\n keyDirtyStateRef.current,\n i18nStrings,\n allowedCharacterPattern ? new RegExp(allowedCharacterPattern) : undefined\n ).some(error => error),\n });\n },\n [onChange, i18nStrings, allowedCharacterPattern]\n );\n\n const onAddButtonClick = () => {\n validateAndFire([...tags, { key: '', value: '', existing: false }]);\n focusEventRef.current = () => {\n keyInputRefs.current[tags.length]?.focus();\n };\n };\n\n const onRemoveButtonClick = useStableEventHandler(\n ({ detail }: NonCancelableCustomEvent<AttributeEditorProps.RemoveButtonClickDetail>) => {\n const existing = tags[detail.itemIndex].existing;\n validateAndFire([\n ...tags.slice(0, detail.itemIndex),\n ...(existing ? [{ ...tags[detail.itemIndex], markedForRemoval: true }] : []),\n ...tags.slice(detail.itemIndex + 1),\n ]);\n if (existing) {\n focusEventRef.current = () => {\n undoButtonRefs.current[detail.itemIndex]?.focus();\n };\n } else {\n keyDirtyStateRef.current.splice(detail.itemIndex, 1);\n keyInputRefs.current[detail.itemIndex]?.focus();\n }\n }\n );\n\n const onKeyChange = useStableEventHandler((value: string, row: number) => {\n keyDirtyStateRef.current[row] = true;\n validateAndFire([...tags.slice(0, row), { ...tags[row], key: value }, ...tags.slice(row + 1)]);\n });\n\n const onKeyBlur = useStableEventHandler((row: number) => {\n keyDirtyStateRef.current[row] = true;\n // Force re-render by providing a new array reference\n validateAndFire([...tags]);\n });\n\n const onValueChange = useStableEventHandler((value: string, row: number) => {\n validateAndFire([...tags.slice(0, row), { ...tags[row], value }, ...tags.slice(row + 1)]);\n });\n\n const onUndoRemoval = useStableEventHandler((row: number) => {\n validateAndFire([...tags.slice(0, row), { ...tags[row], markedForRemoval: false }, ...tags.slice(row + 1)]);\n focusEventRef.current = () => {\n attributeEditorRef.current?.focusRemoveButton(row);\n };\n });\n\n const definition = useMemo(\n () => [\n {\n label: i18nStrings.keyHeader,\n control: ({ tag }: InternalTag, row: number) => (\n <TagControl\n row={row}\n value={tag.key}\n readOnly={tag.existing}\n limit={200}\n defaultOptions={[]}\n placeholder={i18nStrings.keyPlaceholder}\n errorText={i18nStrings.keysSuggestionError}\n loadingText={i18nStrings.keysSuggestionLoading}\n suggestionText={i18nStrings.keySuggestion}\n tooManySuggestionText={i18nStrings.tooManyKeysSuggestion}\n enteredTextLabel={i18nStrings.enteredKeyLabel}\n onRequest={keysRequest}\n onChange={onKeyChange}\n onBlur={onKeyBlur}\n initialOptionsRef={initialKeyOptionsRef}\n ref={ref => {\n keyInputRefs.current[row] = ref;\n }}\n />\n ),\n errorText: ({ error }: InternalTag) => error?.key,\n },\n {\n label: (\n <>\n {i18nStrings.valueHeader} - <i>{i18nStrings.optional}</i>\n </>\n ),\n control: ({ tag }: InternalTag, row: number) =>\n tag.markedForRemoval ? (\n <div role=\"alert\">\n <InternalBox margin={{ top: 'xxs' }}>\n {i18nStrings.undoPrompt}{' '}\n <UndoButton\n onClick={() => onUndoRemoval(row)}\n ref={elem => {\n undoButtonRefs.current[row] = elem;\n }}\n >\n {i18nStrings.undoButton}\n </UndoButton>\n </InternalBox>\n </div>\n ) : (\n <TagControl\n row={row}\n value={tag.value}\n readOnly={false}\n limit={200}\n defaultOptions={tag.valueSuggestionOptions ?? []}\n placeholder={i18nStrings.valuePlaceholder}\n errorText={i18nStrings.valuesSuggestionError}\n loadingText={i18nStrings.valuesSuggestionLoading}\n suggestionText={i18nStrings.valueSuggestion}\n tooManySuggestionText={i18nStrings.tooManyValuesSuggestion}\n enteredTextLabel={i18nStrings.enteredValueLabel}\n filteringKey={tag.key}\n onRequest={valuesRequest && (value => valuesRequest(tag.key, value))}\n onChange={onValueChange}\n ref={ref => {\n valueInputRefs.current[row] = ref;\n }}\n />\n ),\n errorText: ({ error }: InternalTag) => error?.value,\n },\n ],\n [i18nStrings, keysRequest, onKeyChange, onKeyBlur, valuesRequest, onValueChange, onUndoRemoval]\n );\n\n if (loading) {\n return (\n <div className={styles.root} ref={baseComponentProps.__internalRootRef}>\n <InternalStatusIndicator className={styles.loading} type=\"loading\">\n <LiveRegion visible={true}>{i18nStrings.loading}</LiveRegion>\n </InternalStatusIndicator>\n </div>\n );\n }\n\n const baseProps = getBaseProps(restProps);\n return (\n <InternalAttributeEditor<InternalTag>\n {...baseProps}\n {...baseComponentProps}\n ref={attributeEditorRef}\n className={clsx(styles.root, baseProps.className)}\n items={internalTags}\n isItemRemovable={isItemRemovable}\n onAddButtonClick={onAddButtonClick}\n onRemoveButtonClick={onRemoveButtonClick}\n addButtonText={i18nStrings.addButton}\n removeButtonText={i18nStrings.removeButton}\n disableAddButton={remainingTags <= 0}\n empty={i18nStrings.emptyTags}\n additionalInfo={\n <div aria-live=\"polite\">\n {remainingTags < 0 ? (\n <FormFieldError errorIconAriaLabel={i18nStrings.errorIconAriaLabel}>\n {i18nStrings.tagLimitExceeded(tagLimit) ?? ''}\n </FormFieldError>\n ) : remainingTags === 0 ? (\n i18nStrings.tagLimitReached(tagLimit) ?? ''\n ) : (\n i18nStrings.tagLimit(remainingTags, tagLimit)\n )}\n </div>\n }\n definition={definition}\n i18nStrings={i18nStrings}\n />\n );\n }\n);\n\napplyDisplayName(TagEditor, 'TagEditor');\nexport default TagEditor;\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tag-editor/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, { useCallback, useImperativeHandle, useLayoutEffect, useMemo, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent, NonCancelableCustomEvent } from '../internal/events';\nimport { useStableEventHandler } from '../internal/hooks/use-stable-event-handler';\n\nimport { InputProps } from '../input/interfaces';\nimport { AutosuggestProps } from '../autosuggest/interfaces';\nimport { AttributeEditorProps } from '../attribute-editor/interfaces';\nimport InternalAttributeEditor from '../attribute-editor/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport InternalBox from '../box/internal';\nimport { FormFieldError } from '../form-field/internal';\n\nimport { TagControl, UndoButton } from './internal';\nimport { TagEditorProps } from './interfaces';\nimport { validate, ValidationError } from './validation';\nimport { findIndex, useMemoizedArray } from './utils';\n\nimport styles from './styles.css.js';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport LiveRegion from '../internal/components/live-region';\n\nexport { TagEditorProps };\n\ninterface InternalTag {\n tag: TagEditorProps.Tag;\n error?: ValidationError;\n}\n\nconst isItemRemovable = ({ tag }: InternalTag) => !tag.markedForRemoval;\n\nconst TagEditor = React.forwardRef(\n (\n {\n tags = [],\n i18nStrings,\n loading = false,\n tagLimit = 50,\n allowedCharacterPattern,\n keysRequest,\n valuesRequest,\n onChange,\n ...restProps\n }: TagEditorProps,\n ref: React.Ref<TagEditorProps.Ref>\n ) => {\n const baseComponentProps = useBaseComponent('TagEditor');\n\n const remainingTags = tagLimit - tags.filter(tag => !tag.markedForRemoval).length;\n\n const attributeEditorRef = useRef<AttributeEditorProps.Ref>(null);\n const keyInputRefs = useRef<(InputProps.Ref | undefined | null)[]>([]);\n const valueInputRefs = useRef<(InputProps.Ref | undefined | null)[]>([]);\n const undoButtonRefs = useRef<(HTMLAnchorElement | undefined | null)[]>([]);\n\n const initialKeyOptionsRef = useRef<AutosuggestProps.Options>([]);\n const keyDirtyStateRef = useRef<boolean[]>([]);\n const focusEventRef = useRef<() => void>();\n\n useLayoutEffect(() => {\n focusEventRef.current?.apply(undefined);\n focusEventRef.current = undefined;\n });\n\n const errors = validate(\n tags,\n keyDirtyStateRef.current,\n i18nStrings,\n allowedCharacterPattern ? new RegExp(allowedCharacterPattern) : undefined\n );\n\n const internalTags = useMemoizedArray(\n tags.map((tag, i) => ({ tag, error: errors[i] })),\n (prev, next) => {\n return prev.tag === next.tag && prev.error?.key === next.error?.key && prev.error?.value === next.error?.value;\n }\n );\n\n useImperativeHandle(\n ref,\n () => ({\n focus() {\n const errorIndex = findIndex(internalTags, ({ error }) => error?.key || error?.value);\n if (errorIndex !== -1) {\n const refArray = internalTags[errorIndex].error?.key ? keyInputRefs : valueInputRefs;\n refArray.current[errorIndex]?.focus();\n }\n },\n }),\n [internalTags]\n );\n\n const validateAndFire = useCallback(\n (newTags: ReadonlyArray<TagEditorProps.Tag>) => {\n fireNonCancelableEvent(onChange, {\n tags: newTags,\n valid: !validate(\n newTags,\n keyDirtyStateRef.current,\n i18nStrings,\n allowedCharacterPattern ? new RegExp(allowedCharacterPattern) : undefined\n ).some(error => error),\n });\n },\n [onChange, i18nStrings, allowedCharacterPattern]\n );\n\n const onAddButtonClick = () => {\n validateAndFire([...tags, { key: '', value: '', existing: false }]);\n focusEventRef.current = () => {\n keyInputRefs.current[tags.length]?.focus();\n };\n };\n\n const onRemoveButtonClick = useStableEventHandler(\n ({ detail }: NonCancelableCustomEvent<AttributeEditorProps.RemoveButtonClickDetail>) => {\n const existing = tags[detail.itemIndex].existing;\n validateAndFire([\n ...tags.slice(0, detail.itemIndex),\n ...(existing ? [{ ...tags[detail.itemIndex], markedForRemoval: true }] : []),\n ...tags.slice(detail.itemIndex + 1),\n ]);\n if (existing) {\n focusEventRef.current = () => {\n undoButtonRefs.current[detail.itemIndex]?.focus();\n };\n } else {\n keyDirtyStateRef.current.splice(detail.itemIndex, 1);\n keyInputRefs.current[detail.itemIndex]?.focus();\n }\n }\n );\n\n const onKeyChange = useStableEventHandler((value: string, row: number) => {\n keyDirtyStateRef.current[row] = true;\n validateAndFire([...tags.slice(0, row), { ...tags[row], key: value }, ...tags.slice(row + 1)]);\n });\n\n const onKeyBlur = useStableEventHandler((row: number) => {\n keyDirtyStateRef.current[row] = true;\n // Force re-render by providing a new array reference\n validateAndFire([...tags]);\n });\n\n const onValueChange = useStableEventHandler((value: string, row: number) => {\n validateAndFire([...tags.slice(0, row), { ...tags[row], value }, ...tags.slice(row + 1)]);\n });\n\n const onUndoRemoval = useStableEventHandler((row: number) => {\n validateAndFire([...tags.slice(0, row), { ...tags[row], markedForRemoval: false }, ...tags.slice(row + 1)]);\n focusEventRef.current = () => {\n attributeEditorRef.current?.focusRemoveButton(row);\n };\n });\n\n const definition = useMemo(\n () => [\n {\n label: i18nStrings.keyHeader,\n control: ({ tag }: InternalTag, row: number) => (\n <TagControl\n row={row}\n value={tag.key}\n readOnly={tag.existing}\n limit={200}\n defaultOptions={[]}\n placeholder={i18nStrings.keyPlaceholder}\n errorText={i18nStrings.keysSuggestionError}\n loadingText={i18nStrings.keysSuggestionLoading}\n suggestionText={i18nStrings.keySuggestion}\n tooManySuggestionText={i18nStrings.tooManyKeysSuggestion}\n enteredTextLabel={i18nStrings.enteredKeyLabel}\n onRequest={keysRequest}\n onChange={onKeyChange}\n onBlur={onKeyBlur}\n initialOptionsRef={initialKeyOptionsRef}\n ref={ref => {\n keyInputRefs.current[row] = ref;\n }}\n />\n ),\n errorText: ({ error }: InternalTag) => error?.key,\n },\n {\n label: (\n <>\n {i18nStrings.valueHeader} - <i>{i18nStrings.optional}</i>\n </>\n ),\n control: ({ tag }: InternalTag, row: number) =>\n tag.markedForRemoval ? (\n <div role=\"alert\">\n <InternalBox margin={{ top: 'xxs' }}>\n {i18nStrings.undoPrompt}{' '}\n <UndoButton\n onClick={() => onUndoRemoval(row)}\n ref={elem => {\n undoButtonRefs.current[row] = elem;\n }}\n >\n {i18nStrings.undoButton}\n </UndoButton>\n </InternalBox>\n </div>\n ) : (\n <TagControl\n row={row}\n value={tag.value}\n readOnly={false}\n limit={200}\n defaultOptions={tag.valueSuggestionOptions ?? []}\n placeholder={i18nStrings.valuePlaceholder}\n errorText={i18nStrings.valuesSuggestionError}\n loadingText={i18nStrings.valuesSuggestionLoading}\n suggestionText={i18nStrings.valueSuggestion}\n tooManySuggestionText={i18nStrings.tooManyValuesSuggestion}\n enteredTextLabel={i18nStrings.enteredValueLabel}\n filteringKey={tag.key}\n onRequest={valuesRequest && (value => valuesRequest(tag.key, value))}\n onChange={onValueChange}\n ref={ref => {\n valueInputRefs.current[row] = ref;\n }}\n />\n ),\n errorText: ({ error }: InternalTag) => error?.value,\n },\n ],\n [i18nStrings, keysRequest, onKeyChange, onKeyBlur, valuesRequest, onValueChange, onUndoRemoval]\n );\n\n if (loading) {\n return (\n <div className={styles.root} ref={baseComponentProps.__internalRootRef}>\n <InternalStatusIndicator className={styles.loading} type=\"loading\">\n <LiveRegion visible={true}>{i18nStrings.loading}</LiveRegion>\n </InternalStatusIndicator>\n </div>\n );\n }\n\n const baseProps = getBaseProps(restProps);\n return (\n <InternalAttributeEditor<InternalTag>\n {...baseProps}\n {...baseComponentProps}\n ref={attributeEditorRef}\n className={clsx(styles.root, baseProps.className)}\n items={internalTags}\n isItemRemovable={isItemRemovable}\n onAddButtonClick={onAddButtonClick}\n onRemoveButtonClick={onRemoveButtonClick}\n addButtonText={i18nStrings.addButton}\n removeButtonText={i18nStrings.removeButton}\n disableAddButton={remainingTags <= 0}\n empty={i18nStrings.emptyTags}\n additionalInfo={\n remainingTags < 0 ? (\n <FormFieldError errorIconAriaLabel={i18nStrings.errorIconAriaLabel}>\n {i18nStrings.tagLimitExceeded(tagLimit) ?? ''}\n </FormFieldError>\n ) : remainingTags === 0 ? (\n i18nStrings.tagLimitReached(tagLimit) ?? ''\n ) : (\n i18nStrings.tagLimit(remainingTags, tagLimit)\n )\n }\n definition={definition}\n i18nStrings={i18nStrings}\n />\n );\n }\n);\n\napplyDisplayName(TagEditor, 'TagEditor');\nexport default TagEditor;\n"]}
|