@cloudscape-design/components 3.0.842 → 3.0.843
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/load-more-controller.d.ts.map +1 -1
- package/autosuggest/load-more-controller.js +1 -1
- package/autosuggest/load-more-controller.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/key-value-pairs/index.d.ts +1 -1
- package/key-value-pairs/index.d.ts.map +1 -1
- package/key-value-pairs/index.js +2 -2
- package/key-value-pairs/index.js.map +1 -1
- package/key-value-pairs/interfaces.d.ts +8 -0
- package/key-value-pairs/interfaces.d.ts.map +1 -1
- package/key-value-pairs/interfaces.js.map +1 -1
- package/key-value-pairs/internal.d.ts.map +1 -1
- package/key-value-pairs/internal.js +2 -2
- package/key-value-pairs/internal.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-more-controller.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/load-more-controller.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,sBAAsB,EAAE,MAAM,4CAA4C,CAAC;AACpF,OAAO,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAEhD,UAAU,2BAA2B;IACnC,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC;IACnC,UAAU,EAAE,mBAAmB,CAAC,UAAU,CAAC;IAC3C,WAAW,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CACvD;AAED,UAAU,2BAA2B;IACnC,oBAAoB,IAAI,IAAI,CAAC;IAC7B,2BAA2B,IAAI,IAAI,CAAC;IACpC,wBAAwB,IAAI,IAAI,CAAC;IACjC,yBAAyB,CAAC,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;CACxD;AAED,eAAO,MAAM,sBAAsB,0CAIhC,2BAA2B,KAAG,
|
|
1
|
+
{"version":3,"file":"load-more-controller.d.ts","sourceRoot":"","sources":["../../../src/autosuggest/load-more-controller.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,sBAAsB,EAAE,MAAM,4CAA4C,CAAC;AACpF,OAAO,EAAE,mBAAmB,EAAE,MAAM,mDAAmD,CAAC;AACxF,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAEhD,UAAU,2BAA2B;IACnC,OAAO,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC;IACnC,UAAU,EAAE,mBAAmB,CAAC,UAAU,CAAC;IAC3C,WAAW,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CACvD;AAED,UAAU,2BAA2B;IACnC,oBAAoB,IAAI,IAAI,CAAC;IAC7B,2BAA2B,IAAI,IAAI,CAAC;IACpC,wBAAwB,IAAI,IAAI,CAAC;IACjC,yBAAyB,CAAC,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;CACxD;AAED,eAAO,MAAM,sBAAsB,0CAIhC,2BAA2B,KAAG,2BAiChC,CAAC"}
|
|
@@ -16,7 +16,7 @@ export const useAutosuggestLoadMore = ({ options = [], statusType, onLoadItems,
|
|
|
16
16
|
options.length > 0 && statusType === 'pending' && fireLoadMore({ firstPage: false, samePage: false });
|
|
17
17
|
};
|
|
18
18
|
const fireLoadMoreOnRecoveryClick = () => fireLoadMore({ firstPage: false, samePage: true });
|
|
19
|
-
const fireLoadMoreOnInputFocus = () => fireLoadMore({ firstPage: true, samePage: false, filteringText: '' });
|
|
19
|
+
const fireLoadMoreOnInputFocus = () => { var _a; return fireLoadMore({ firstPage: true, samePage: false, filteringText: (_a = lastFilteringText.current) !== null && _a !== void 0 ? _a : '' }); };
|
|
20
20
|
const fireLoadMoreOnInputChange = (filteringText) => fireLoadMore({ firstPage: true, samePage: false, filteringText });
|
|
21
21
|
return { fireLoadMoreOnScroll, fireLoadMoreOnRecoveryClick, fireLoadMoreOnInputFocus, fireLoadMoreOnInputChange };
|
|
22
22
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"load-more-controller.js","sourceRoot":"","sources":["../../../src/autosuggest/load-more-controller.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAmB/B,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EACrC,OAAO,GAAG,EAAE,EACZ,UAAU,EACV,WAAW,GACiB,EAA+B,EAAE;IAC7D,MAAM,iBAAiB,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAC;IAEtD,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,aAAa,GAKd,EAAE,EAAE;;QACH,IAAI,aAAa,KAAK,SAAS,IAAI,iBAAiB,CAAC,OAAO,KAAK,aAAa,EAAE;YAC9E,IAAI,aAAa,KAAK,SAAS,EAAE;gBAC/B,iBAAiB,CAAC,OAAO,GAAG,aAAa,CAAC;aAC3C;YACD,WAAW,CAAC,EAAE,aAAa,EAAE,MAAA,iBAAiB,CAAC,OAAO,mCAAI,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;SACtF;IACH,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,UAAU,KAAK,SAAS,IAAI,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;IACxG,CAAC,CAAC;IAEF,MAAM,2BAA2B,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAE7F,MAAM,wBAAwB,GAAG,GAAG,EAAE,
|
|
1
|
+
{"version":3,"file":"load-more-controller.js","sourceRoot":"","sources":["../../../src/autosuggest/load-more-controller.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAmB/B,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EACrC,OAAO,GAAG,EAAE,EACZ,UAAU,EACV,WAAW,GACiB,EAA+B,EAAE;IAC7D,MAAM,iBAAiB,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAC;IAEtD,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,QAAQ,EACR,aAAa,GAKd,EAAE,EAAE;;QACH,IAAI,aAAa,KAAK,SAAS,IAAI,iBAAiB,CAAC,OAAO,KAAK,aAAa,EAAE;YAC9E,IAAI,aAAa,KAAK,SAAS,EAAE;gBAC/B,iBAAiB,CAAC,OAAO,GAAG,aAAa,CAAC;aAC3C;YACD,WAAW,CAAC,EAAE,aAAa,EAAE,MAAA,iBAAiB,CAAC,OAAO,mCAAI,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC,CAAC;SACtF;IACH,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,GAAG,EAAE;QAChC,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,UAAU,KAAK,SAAS,IAAI,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC;IACxG,CAAC,CAAC;IAEF,MAAM,2BAA2B,GAAG,GAAG,EAAE,CAAC,YAAY,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC;IAE7F,MAAM,wBAAwB,GAAG,GAAG,EAAE,WACpC,OAAA,YAAY,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,MAAA,iBAAiB,CAAC,OAAO,mCAAI,EAAE,EAAE,CAAC,CAAA,EAAA,CAAC;IAErG,MAAM,yBAAyB,GAAG,CAAC,aAAqB,EAAE,EAAE,CAC1D,YAAY,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,CAAC,CAAC;IAEpE,OAAO,EAAE,oBAAoB,EAAE,2BAA2B,EAAE,wBAAwB,EAAE,yBAAyB,EAAE,CAAC;AACpH,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { useRef } from 'react';\n\nimport { OptionsLoadItemsDetail } from '../internal/components/dropdown/interfaces';\nimport { DropdownStatusProps } from '../internal/components/dropdown-status/interfaces';\nimport { AutosuggestProps } from './interfaces';\n\ninterface UseAutosuggestLoadMoreProps {\n options?: AutosuggestProps.Options;\n statusType: DropdownStatusProps.StatusType;\n onLoadItems: (detail: OptionsLoadItemsDetail) => void;\n}\n\ninterface AutosuggestLoadMoreHandlers {\n fireLoadMoreOnScroll(): void;\n fireLoadMoreOnRecoveryClick(): void;\n fireLoadMoreOnInputFocus(): void;\n fireLoadMoreOnInputChange(filteringText: string): void;\n}\n\nexport const useAutosuggestLoadMore = ({\n options = [],\n statusType,\n onLoadItems,\n}: UseAutosuggestLoadMoreProps): AutosuggestLoadMoreHandlers => {\n const lastFilteringText = useRef<string | null>(null);\n\n const fireLoadMore = ({\n firstPage,\n samePage,\n filteringText,\n }: {\n firstPage: boolean;\n samePage: boolean;\n filteringText?: string;\n }) => {\n if (filteringText === undefined || lastFilteringText.current !== filteringText) {\n if (filteringText !== undefined) {\n lastFilteringText.current = filteringText;\n }\n onLoadItems({ filteringText: lastFilteringText.current ?? '', firstPage, samePage });\n }\n };\n\n const fireLoadMoreOnScroll = () => {\n options.length > 0 && statusType === 'pending' && fireLoadMore({ firstPage: false, samePage: false });\n };\n\n const fireLoadMoreOnRecoveryClick = () => fireLoadMore({ firstPage: false, samePage: true });\n\n const fireLoadMoreOnInputFocus = () =>\n fireLoadMore({ firstPage: true, samePage: false, filteringText: lastFilteringText.current ?? '' });\n\n const fireLoadMoreOnInputChange = (filteringText: string) =>\n fireLoadMore({ firstPage: true, samePage: false, filteringText });\n\n return { fireLoadMoreOnScroll, fireLoadMoreOnRecoveryClick, fireLoadMoreOnInputFocus, fireLoadMoreOnInputChange };\n};\n"]}
|
package/internal/environment.js
CHANGED
package/internal/manifest.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { KeyValuePairsProps } from './interfaces';
|
|
3
3
|
export { KeyValuePairsProps };
|
|
4
|
-
export default function KeyValuePairs({ columns, items, ariaLabel, ariaLabelledby, ...rest }: KeyValuePairsProps): JSX.Element;
|
|
4
|
+
export default function KeyValuePairs({ columns, items, ariaLabel, ariaLabelledby, minColumnWidth, ...rest }: KeyValuePairsProps): JSX.Element;
|
|
5
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAE9B,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAGlD,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAE9B,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,OAAW,EACX,KAAK,EACL,SAAS,EACT,cAAc,EACd,cAAoB,EACpB,GAAG,IAAI,EACR,EAAE,kBAAkB,eAiBpB"}
|
package/key-value-pairs/index.js
CHANGED
|
@@ -7,12 +7,12 @@ import useBaseComponent from '../internal/hooks/use-base-component';
|
|
|
7
7
|
import { applyDisplayName } from '../internal/utils/apply-display-name';
|
|
8
8
|
import InternalKeyValuePairs from './internal';
|
|
9
9
|
export default function KeyValuePairs(_a) {
|
|
10
|
-
var { columns = 1, items, ariaLabel, ariaLabelledby } = _a, rest = __rest(_a, ["columns", "items", "ariaLabel", "ariaLabelledby"]);
|
|
10
|
+
var { columns = 1, items, ariaLabel, ariaLabelledby, minColumnWidth = 150 } = _a, rest = __rest(_a, ["columns", "items", "ariaLabel", "ariaLabelledby", "minColumnWidth"]);
|
|
11
11
|
const { __internalRootRef } = useBaseComponent('KeyValuePairs', {
|
|
12
12
|
props: { columns },
|
|
13
13
|
});
|
|
14
14
|
const baseProps = getBaseProps(rest);
|
|
15
|
-
return (React.createElement(InternalKeyValuePairs, Object.assign({ columns: columns, items: items, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby }, baseProps, { ref: __internalRootRef })));
|
|
15
|
+
return (React.createElement(InternalKeyValuePairs, Object.assign({ columns: columns, items: items, ariaLabel: ariaLabel, ariaLabelledby: ariaLabelledby, minColumnWidth: minColumnWidth }, baseProps, { ref: __internalRootRef })));
|
|
16
16
|
}
|
|
17
17
|
applyDisplayName(KeyValuePairs, 'KeyValuePairs');
|
|
18
18
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/key-value-pairs/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,qBAAqB,MAAM,YAAY,CAAC;AAI/C,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/key-value-pairs/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,qBAAqB,MAAM,YAAY,CAAC;AAI/C,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAOjB;QAPiB,EACpC,OAAO,GAAG,CAAC,EACX,KAAK,EACL,SAAS,EACT,cAAc,EACd,cAAc,GAAG,GAAG,OAED,EADhB,IAAI,cAN6B,qEAOrC,CADQ;IAEP,MAAM,EAAE,iBAAiB,EAAE,GAAG,gBAAgB,CAAC,eAAe,EAAE;QAC9D,KAAK,EAAE,EAAE,OAAO,EAAE;KACnB,CAAC,CAAC;IACH,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAErC,OAAO,CACL,oBAAC,qBAAqB,kBACpB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,cAAc,EAC9B,cAAc,EAAE,cAAc,IAC1B,SAAS,IACb,GAAG,EAAE,iBAAiB,IACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,aAAa,EAAE,eAAe,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 { getBaseProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { KeyValuePairsProps } from './interfaces';\nimport InternalKeyValuePairs from './internal';\n\nexport { KeyValuePairsProps };\n\nexport default function KeyValuePairs({\n columns = 1,\n items,\n ariaLabel,\n ariaLabelledby,\n minColumnWidth = 150,\n ...rest\n}: KeyValuePairsProps) {\n const { __internalRootRef } = useBaseComponent('KeyValuePairs', {\n props: { columns },\n });\n const baseProps = getBaseProps(rest);\n\n return (\n <InternalKeyValuePairs\n columns={columns}\n items={items}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n minColumnWidth={minColumnWidth}\n {...baseProps}\n ref={__internalRootRef}\n />\n );\n}\n\napplyDisplayName(KeyValuePairs, 'KeyValuePairs');\n"]}
|
|
@@ -35,6 +35,14 @@ export interface KeyValuePairsProps extends BaseComponentProps {
|
|
|
35
35
|
* Don't use `ariaLabel` and `ariaLabelledby` at the same time.
|
|
36
36
|
*/
|
|
37
37
|
ariaLabelledby?: string;
|
|
38
|
+
/**
|
|
39
|
+
* Use to specify the desired minimum width for each column in pixels.
|
|
40
|
+
*
|
|
41
|
+
* The number of columns is determined by the value of this property, the available space,
|
|
42
|
+
* and the maximum number of columns as defined by the `columns` property.
|
|
43
|
+
* If not set, defaults to 150.
|
|
44
|
+
*/
|
|
45
|
+
minColumnWidth?: number;
|
|
38
46
|
}
|
|
39
47
|
export declare namespace KeyValuePairsProps {
|
|
40
48
|
type Item = Group | Pair;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC9C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,yBAAiB,kBAAkB,CAAC;IAClC,KAAY,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IAEhC,UAAiB,KAAK;QACpB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;KAC5B;IAED,UAAiB,IAAK,SAAQ,kBAAkB;QAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB;CACF"}
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAEhE,MAAM,WAAW,kBAAmB,SAAQ,kBAAkB;IAC5D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;;;;;;;OAgBG;IACH,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC;IAC9C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,yBAAiB,kBAAkB,CAAC;IAClC,KAAY,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IAEhC,UAAiB,KAAK;QACpB,IAAI,EAAE,OAAO,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;KAC5B;IAED,UAAiB,IAAK,SAAQ,kBAAkB;QAC9C,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface KeyValuePairsProps extends BaseComponentProps {\n /**\n * Specifies the number of columns in each grid row.\n * Valid values are any integer between 1 and 4. It defaults to 1.\n */\n columns?: number;\n /**\n * An array of either key-value pairs individual items or groups.\n * They could be combined.\n * Each item has `type` prop, which might be either `group` or `pair`. Defaults to `pair` if not specified.\n *\n * Each key-value pair definition has the following properties:\n * * `type` (string) - (Optional) Item type (pair).\n * * `label` (string) - The key label.\n * * `info` (React.ReactNode) - (Optional) Area next to the key to display an info link.\n * * `value` (React.ReactNode) - The corresponding value for the key.\n *\n * Each group definition has the following properties:\n * * `type` (string) - Item type (group).\n * * `title` (string) - (Optional) An optional title for this column.\n * * `items` (ReadonlyArray<KeyValuePairProps.KeyValuePair>) - An array of\n * key-value pair items.\n */\n items: ReadonlyArray<KeyValuePairsProps.Item>;\n /**\n * Provides an `aria-label` to the Key-value pairs container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n /**\n * Sets the `aria-labelledby` property on the Key-value pairs container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n}\n\nexport namespace KeyValuePairsProps {\n export type Item = Group | Pair;\n\n export interface Group {\n type: 'group';\n title?: string;\n items: ReadonlyArray<Pair>;\n }\n\n export interface Pair extends BaseComponentProps {\n type?: 'pair';\n label: string;\n value: React.ReactNode;\n info?: React.ReactNode;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/key-value-pairs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { BaseComponentProps } from '../internal/base-component';\n\nexport interface KeyValuePairsProps extends BaseComponentProps {\n /**\n * Specifies the number of columns in each grid row.\n * Valid values are any integer between 1 and 4. It defaults to 1.\n */\n columns?: number;\n /**\n * An array of either key-value pairs individual items or groups.\n * They could be combined.\n * Each item has `type` prop, which might be either `group` or `pair`. Defaults to `pair` if not specified.\n *\n * Each key-value pair definition has the following properties:\n * * `type` (string) - (Optional) Item type (pair).\n * * `label` (string) - The key label.\n * * `info` (React.ReactNode) - (Optional) Area next to the key to display an info link.\n * * `value` (React.ReactNode) - The corresponding value for the key.\n *\n * Each group definition has the following properties:\n * * `type` (string) - Item type (group).\n * * `title` (string) - (Optional) An optional title for this column.\n * * `items` (ReadonlyArray<KeyValuePairProps.KeyValuePair>) - An array of\n * key-value pair items.\n */\n items: ReadonlyArray<KeyValuePairsProps.Item>;\n /**\n * Provides an `aria-label` to the Key-value pairs container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n /**\n * Sets the `aria-labelledby` property on the Key-value pairs container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Use to specify the desired minimum width for each column in pixels.\n *\n * The number of columns is determined by the value of this property, the available space,\n * and the maximum number of columns as defined by the `columns` property.\n * If not set, defaults to 150.\n */\n minColumnWidth?: number;\n}\n\nexport namespace KeyValuePairsProps {\n export type Item = Group | Pair;\n\n export interface Group {\n type: 'group';\n title?: string;\n items: ReadonlyArray<Pair>;\n }\n\n export interface Pair extends BaseComponentProps {\n type?: 'pair';\n label: string;\n value: React.ReactNode;\n info?: React.ReactNode;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AA6BlD,QAAA,MAAM,qBAAqB,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/key-value-pairs/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AA6BlD,QAAA,MAAM,qBAAqB,2IAoE1B,CAAC;AAEF,eAAe,qBAAqB,CAAC"}
|
|
@@ -21,10 +21,10 @@ const InternalKeyValuePairGroup = ({ label, value }) => (React.createElement(Rea
|
|
|
21
21
|
label && React.createElement("dt", { className: styles['group-title'] }, label),
|
|
22
22
|
React.createElement("dd", { className: styles.detail }, value)));
|
|
23
23
|
const InternalKeyValuePairs = React.forwardRef((_a, ref) => {
|
|
24
|
-
var { columns, items, className, ariaLabel, ariaLabelledby } = _a, rest = __rest(_a, ["columns", "items", "className", "ariaLabel", "ariaLabelledby"]);
|
|
24
|
+
var { columns, items, className, ariaLabel, ariaLabelledby, minColumnWidth } = _a, rest = __rest(_a, ["columns", "items", "className", "ariaLabel", "ariaLabelledby", "minColumnWidth"]);
|
|
25
25
|
return (React.createElement(LinkDefaultVariantContext.Provider, { value: { defaultVariant: 'primary' } },
|
|
26
26
|
React.createElement("div", Object.assign({}, rest, { className: clsx(styles['key-value-pairs'], className), "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ref: ref }),
|
|
27
|
-
React.createElement(ColumnLayout, { __tagOverride: "dl", columns: Math.min(columns, 4), variant: "text-grid", minColumnWidth:
|
|
27
|
+
React.createElement(ColumnLayout, { __tagOverride: "dl", columns: Math.min(columns, 4), variant: "text-grid", minColumnWidth: minColumnWidth }, items.map((pair, index) => {
|
|
28
28
|
if (pair.type === 'group') {
|
|
29
29
|
return (
|
|
30
30
|
/* InternalKeyValuePairGroup tells react to treat the dt-dd pair as an individual layout item.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/key-value-pairs/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,GAAG,MAAM,iBAAiB,CAAC;AAClC,OAAO,YAAY,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6CAA6C,CAAC;AACnF,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAC7F,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAG9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,oBAAoB,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,EAA2B,EAAE,EAAE;IACnF,MAAM,QAAQ,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;IAEzC,OAAO,CACL;QACE,4BAAI,SAAS,EAAE,MAAM,CAAC,IAAI;YACxB,+BAAO,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,EAAE,EAAE,EAAE,EAAE,IAAI,QAAQ,IACtD,KAAK,CACA;YACR,oBAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,QAAQ,IACjD,IAAI,IAAI,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,IAAI,CAAQ,CACtB,CAC7B;QACL,4BAAI,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,KAAK,CAAM,CACzC,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,yBAAyB,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAuD,EAAE,EAAE,CAAC,CAC3G;IACG,KAAK,IAAI,4BAAI,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,IAAG,KAAK,CAAM;IAC5D,4BAAI,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,KAAK,CAAM,CACzC,CACJ,CAAC;AAEF,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CAC5C,CACE,
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/key-value-pairs/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 from 'react';\nimport clsx from 'clsx';\n\nimport Box from '../box/internal';\nimport ColumnLayout from '../column-layout/internal';\nimport { InfoLinkLabelContext } from '../internal/context/info-link-label-context';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { KeyValuePairsProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nconst InternalKeyValuePair = ({ label, info, value, id }: KeyValuePairsProps.Pair) => {\n const kvPairId = useUniqueId('kv-pair-');\n\n return (\n <>\n <dt className={styles.term}>\n <label className={styles['key-label']} id={id || kvPairId}>\n {label}\n </label>\n <InfoLinkLabelContext.Provider value={id || kvPairId}>\n {info && <span className={styles.info}>{info}</span>}\n </InfoLinkLabelContext.Provider>\n </dt>\n <dd className={styles.detail}>{value}</dd>\n </>\n );\n};\n\nconst InternalKeyValuePairGroup = ({ label, value }: { label?: React.ReactNode; value: React.ReactNode }) => (\n <>\n {label && <dt className={styles['group-title']}>{label}</dt>}\n <dd className={styles.detail}>{value}</dd>\n </>\n);\n\nconst InternalKeyValuePairs = React.forwardRef(\n (\n {\n columns,\n items,\n className,\n ariaLabel,\n ariaLabelledby,\n minColumnWidth,\n ...rest\n }: KeyValuePairsProps & Required<Pick<KeyValuePairsProps, 'columns'>>,\n ref: React.Ref<HTMLDivElement>\n ) => {\n return (\n <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n <div\n {...rest}\n className={clsx(styles['key-value-pairs'], className)}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby}\n ref={ref}\n >\n {/*\n minColumnWidth={150} is set to use FlexibleColumnLayout which has only 1 nested div wrapper for column items,\n otherwise GridColumnLayout will be used, which has 2 nested div, therefore it is not a11y compatible for dl -> dt/dd relationship\n */}\n <ColumnLayout\n __tagOverride=\"dl\"\n columns={Math.min(columns, 4)}\n variant=\"text-grid\"\n minColumnWidth={minColumnWidth}\n >\n {items.map((pair, index) => {\n if (pair.type === 'group') {\n return (\n /* InternalKeyValuePairGroup tells react to treat the dt-dd pair as an individual layout item.\n * Otherwise, without this component, they will be rendered as a list, which ruins the html structure.\n * InternalKeyValuePairGroup is not wrapped by div tag, because it ruins a11y compatibility for dl -> dt/dd\n * */\n <InternalKeyValuePairGroup\n key={index}\n label={\n pair.title && (\n <Box variant=\"h3\" padding=\"n\">\n {pair.title}\n </Box>\n )\n }\n value={\n <dl className={styles['group-list']}>\n {pair.items.map((item, itemIndex) => (\n <div key={itemIndex} className={styles['group-list-item']}>\n <InternalKeyValuePair {...item} />\n </div>\n ))}\n </dl>\n }\n />\n );\n }\n\n return <InternalKeyValuePair key={index} {...pair} />;\n })}\n </ColumnLayout>\n </div>\n </LinkDefaultVariantContext.Provider>\n );\n }\n);\n\nexport default InternalKeyValuePairs;\n"]}
|
package/package.json
CHANGED