@cloudscape-design/components 3.0.532 → 3.0.534
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/date-range-picker/index.d.ts.map +1 -1
- package/date-range-picker/index.js +21 -5
- package/date-range-picker/index.js.map +1 -1
- package/date-range-picker/interfaces.d.ts +16 -0
- package/date-range-picker/interfaces.d.ts.map +1 -1
- package/date-range-picker/interfaces.js.map +1 -1
- package/date-range-picker/styles.css.js +39 -38
- package/date-range-picker/styles.scoped.css +51 -46
- package/date-range-picker/styles.selectors.js +39 -38
- package/date-range-picker/time-offset.js +3 -3
- package/date-range-picker/time-offset.js.map +1 -1
- package/internal/context/single-tab-stop-navigation-context.js +1 -1
- package/internal/context/single-tab-stop-navigation-context.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/environment.json +1 -1
- package/internal/manifest.json +1 -1
- package/internal/utils/date-time/format-date-iso.d.ts +7 -0
- package/internal/utils/date-time/format-date-iso.d.ts.map +1 -0
- package/internal/utils/date-time/format-date-iso.js +8 -0
- package/internal/utils/date-time/format-date-iso.js.map +1 -0
- package/internal/utils/date-time/format-date-localized.d.ts +8 -0
- package/internal/utils/date-time/format-date-localized.d.ts.map +1 -0
- package/internal/utils/date-time/format-date-localized.js +32 -0
- package/internal/utils/date-time/format-date-localized.js.map +1 -0
- package/internal/utils/date-time/format-date-range.d.ts +11 -3
- package/internal/utils/date-time/format-date-range.d.ts.map +1 -1
- package/internal/utils/date-time/format-date-range.js +30 -5
- package/internal/utils/date-time/format-date-range.js.map +1 -1
- package/internal/utils/date-time/format-time-offset.d.ts +3 -0
- package/internal/utils/date-time/format-time-offset.d.ts.map +1 -0
- package/internal/utils/date-time/format-time-offset.js +31 -0
- package/internal/utils/date-time/format-time-offset.js.map +1 -0
- package/internal/utils/date-time/index.d.ts +1 -1
- package/internal/utils/date-time/index.d.ts.map +1 -1
- package/internal/utils/date-time/index.js +1 -1
- package/internal/utils/date-time/index.js.map +1 -1
- package/internal/utils/scrollable-containers.d.ts +1 -1
- package/internal/utils/scrollable-containers.js +1 -1
- package/internal/utils/scrollable-containers.js.map +1 -1
- package/package.json +1 -1
- package/table/body-cell/disabled-inline-editor.d.ts.map +1 -1
- package/table/body-cell/disabled-inline-editor.js +3 -1
- package/table/body-cell/disabled-inline-editor.js.map +1 -1
- package/table/body-cell/index.d.ts.map +1 -1
- package/table/body-cell/index.js +3 -1
- package/table/body-cell/index.js.map +1 -1
- package/table/body-cell/styles.css.js +30 -30
- package/table/body-cell/styles.scoped.css +101 -77
- package/table/body-cell/styles.selectors.js +30 -30
- package/table/body-cell/td-element.d.ts.map +1 -1
- package/table/body-cell/td-element.js +6 -3
- package/table/body-cell/td-element.js.map +1 -1
- package/table/header-cell/index.d.ts.map +1 -1
- package/table/header-cell/index.js +7 -4
- package/table/header-cell/index.js.map +1 -1
- package/table/header-cell/styles.css.js +24 -24
- package/table/header-cell/styles.scoped.css +80 -38
- package/table/header-cell/styles.selectors.js +24 -24
- package/table/header-cell/th-element.d.ts +2 -1
- package/table/header-cell/th-element.d.ts.map +1 -1
- package/table/header-cell/th-element.js +9 -5
- package/table/header-cell/th-element.js.map +1 -1
- package/table/interfaces.d.ts +5 -0
- package/table/interfaces.d.ts.map +1 -1
- package/table/interfaces.js.map +1 -1
- package/table/internal.d.ts.map +1 -1
- package/table/internal.js +53 -45
- package/table/internal.js.map +1 -1
- package/table/no-data-cell.js +1 -1
- package/table/no-data-cell.js.map +1 -1
- package/table/resizer/index.d.ts.map +1 -1
- package/table/resizer/index.js +4 -2
- package/table/resizer/index.js.map +1 -1
- package/table/selection/selection-control.d.ts +3 -1
- package/table/selection/selection-control.d.ts.map +1 -1
- package/table/selection/selection-control.js +2 -2
- package/table/selection/selection-control.js.map +1 -1
- package/table/table-role/grid-navigation.d.ts.map +1 -1
- package/table/table-role/grid-navigation.js +38 -24
- package/table/table-role/grid-navigation.js.map +1 -1
- package/table/table-role/table-role-helper.d.ts.map +1 -1
- package/table/table-role/table-role-helper.js +0 -2
- package/table/table-role/table-role-helper.js.map +1 -1
- package/table/table-role/utils.d.ts +1 -0
- package/table/table-role/utils.d.ts.map +1 -1
- package/table/table-role/utils.js +7 -2
- package/table/table-role/utils.js.map +1 -1
- package/table/thead.d.ts.map +1 -1
- package/table/thead.js +2 -2
- package/table/thead.js.map +1 -1
- package/table/use-table-focus-navigation.d.ts +9 -1
- package/table/use-table-focus-navigation.d.ts.map +1 -1
- package/table/use-table-focus-navigation.js +3 -3
- package/table/use-table-focus-navigation.js.map +1 -1
- package/internal/utils/date-time/format-timezone-offset.d.ts +0 -2
- package/internal/utils/date-time/format-timezone-offset.d.ts.map +0 -1
- package/internal/utils/date-time/format-timezone-offset.js +0 -12
- package/internal/utils/date-time/format-timezone-offset.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"format-time-offset.d.ts","sourceRoot":"lib/default/","sources":["internal/utils/date-time/format-time-offset.ts"],"names":[],"mappings":"AAKA,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,MAAM,EAAE,eAAe,CAAC,EAAE,MAAM,UAQ5E;AAED,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,MAAM,EAAE,eAAe,CAAC,EAAE,MAAM,UAYlF"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { padLeftZeros } from '../strings';
|
|
4
|
+
export function formatTimeOffsetISO(isoDate, offsetInMinutes) {
|
|
5
|
+
offsetInMinutes = defaultToLocal(isoDate, offsetInMinutes);
|
|
6
|
+
const { hours, minutes } = getMinutesAndHours(offsetInMinutes);
|
|
7
|
+
const sign = offsetInMinutes < 0 ? '-' : '+';
|
|
8
|
+
const formattedOffset = `${sign}${formatISO2Digits(hours)}:${formatISO2Digits(minutes)}`;
|
|
9
|
+
return formattedOffset;
|
|
10
|
+
}
|
|
11
|
+
export function formatTimeOffsetLocalized(isoDate, offsetInMinutes) {
|
|
12
|
+
offsetInMinutes = defaultToLocal(isoDate, offsetInMinutes);
|
|
13
|
+
if (offsetInMinutes === 0) {
|
|
14
|
+
return '(UTC)';
|
|
15
|
+
}
|
|
16
|
+
const { hours, minutes } = getMinutesAndHours(offsetInMinutes);
|
|
17
|
+
const sign = offsetInMinutes < 0 ? '-' : '+';
|
|
18
|
+
const formattedMinutes = minutes === 0 ? '' : `:${minutes}`;
|
|
19
|
+
const formattedOffset = `(UTC${sign}${hours}${formattedMinutes})`;
|
|
20
|
+
return formattedOffset;
|
|
21
|
+
}
|
|
22
|
+
function defaultToLocal(isoDate, offsetInMinutes) {
|
|
23
|
+
return offsetInMinutes !== null && offsetInMinutes !== void 0 ? offsetInMinutes : 0 - new Date(isoDate).getTimezoneOffset();
|
|
24
|
+
}
|
|
25
|
+
function getMinutesAndHours(minutes) {
|
|
26
|
+
return { hours: Math.floor(Math.abs(minutes) / 60), minutes: Math.abs(minutes % 60) };
|
|
27
|
+
}
|
|
28
|
+
function formatISO2Digits(n) {
|
|
29
|
+
return padLeftZeros(n.toFixed(0), 2);
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=format-time-offset.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"format-time-offset.js","sourceRoot":"lib/default/","sources":["internal/utils/date-time/format-time-offset.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,MAAM,UAAU,mBAAmB,CAAC,OAAe,EAAE,eAAwB;IAC3E,eAAe,GAAG,cAAc,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAC3D,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,kBAAkB,CAAC,eAAe,CAAC,CAAC;IAE/D,MAAM,IAAI,GAAG,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;IAC7C,MAAM,eAAe,GAAG,GAAG,IAAI,GAAG,gBAAgB,CAAC,KAAK,CAAC,IAAI,gBAAgB,CAAC,OAAO,CAAC,EAAE,CAAC;IAEzF,OAAO,eAAe,CAAC;AACzB,CAAC;AAED,MAAM,UAAU,yBAAyB,CAAC,OAAe,EAAE,eAAwB;IACjF,eAAe,GAAG,cAAc,CAAC,OAAO,EAAE,eAAe,CAAC,CAAC;IAC3D,IAAI,eAAe,KAAK,CAAC,EAAE;QACzB,OAAO,OAAO,CAAC;KAChB;IACD,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,kBAAkB,CAAC,eAAe,CAAC,CAAC;IAE/D,MAAM,IAAI,GAAG,eAAe,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;IAC7C,MAAM,gBAAgB,GAAG,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,OAAO,EAAE,CAAC;IAC5D,MAAM,eAAe,GAAG,OAAO,IAAI,GAAG,KAAK,GAAG,gBAAgB,GAAG,CAAC;IAElE,OAAO,eAAe,CAAC;AACzB,CAAC;AAED,SAAS,cAAc,CAAC,OAAe,EAAE,eAAwB;IAC/D,OAAO,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,CAAC,GAAG,IAAI,IAAI,CAAC,OAAO,CAAC,CAAC,iBAAiB,EAAE,CAAC;AACtE,CAAC;AAED,SAAS,kBAAkB,CAAC,OAAe;IACzC,OAAO,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,GAAG,CAAC,OAAO,GAAG,EAAE,CAAC,EAAE,CAAC;AACxF,CAAC;AAED,SAAS,gBAAgB,CAAC,CAAS;IACjC,OAAO,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AACvC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { padLeftZeros } from '../strings';\n\nexport function formatTimeOffsetISO(isoDate: string, offsetInMinutes?: number) {\n offsetInMinutes = defaultToLocal(isoDate, offsetInMinutes);\n const { hours, minutes } = getMinutesAndHours(offsetInMinutes);\n\n const sign = offsetInMinutes < 0 ? '-' : '+';\n const formattedOffset = `${sign}${formatISO2Digits(hours)}:${formatISO2Digits(minutes)}`;\n\n return formattedOffset;\n}\n\nexport function formatTimeOffsetLocalized(isoDate: string, offsetInMinutes?: number) {\n offsetInMinutes = defaultToLocal(isoDate, offsetInMinutes);\n if (offsetInMinutes === 0) {\n return '(UTC)';\n }\n const { hours, minutes } = getMinutesAndHours(offsetInMinutes);\n\n const sign = offsetInMinutes < 0 ? '-' : '+';\n const formattedMinutes = minutes === 0 ? '' : `:${minutes}`;\n const formattedOffset = `(UTC${sign}${hours}${formattedMinutes})`;\n\n return formattedOffset;\n}\n\nfunction defaultToLocal(isoDate: string, offsetInMinutes?: number) {\n return offsetInMinutes ?? 0 - new Date(isoDate).getTimezoneOffset();\n}\n\nfunction getMinutesAndHours(minutes: number) {\n return { hours: Math.floor(Math.abs(minutes) / 60), minutes: Math.abs(minutes % 60) };\n}\n\nfunction formatISO2Digits(n: number) {\n return padLeftZeros(n.toFixed(0), 2);\n}\n"]}
|
|
@@ -3,7 +3,7 @@ export { formatDateRange } from './format-date-range';
|
|
|
3
3
|
export { formatDate } from './format-date';
|
|
4
4
|
export { formatTime } from './format-time';
|
|
5
5
|
export { formatDateTime } from './format-date-time';
|
|
6
|
-
export {
|
|
6
|
+
export { formatTimeOffsetISO } from './format-time-offset';
|
|
7
7
|
export { isIsoDateOnly } from './is-iso-date-only';
|
|
8
8
|
export { joinDateTime, splitDateTime } from './join-date-time';
|
|
9
9
|
export { parseDate } from './parse-date';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/utils/date-time/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/utils/date-time/index.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC"}
|
|
@@ -5,7 +5,7 @@ export { formatDateRange } from './format-date-range';
|
|
|
5
5
|
export { formatDate } from './format-date';
|
|
6
6
|
export { formatTime } from './format-time';
|
|
7
7
|
export { formatDateTime } from './format-date-time';
|
|
8
|
-
export {
|
|
8
|
+
export { formatTimeOffsetISO } from './format-time-offset';
|
|
9
9
|
export { isIsoDateOnly } from './is-iso-date-only';
|
|
10
10
|
export { joinDateTime, splitDateTime } from './join-date-time';
|
|
11
11
|
export { parseDate } from './parse-date';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/utils/date-time/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/utils/date-time/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nexport { isoToDisplay, displayToIso } from './display-format';\nexport { formatDateRange } from './format-date-range';\nexport { formatDate } from './format-date';\nexport { formatTime } from './format-time';\nexport { formatDateTime } from './format-date-time';\nexport { formatTimeOffsetISO } from './format-time-offset';\nexport { isIsoDateOnly } from './is-iso-date-only';\nexport { joinDateTime, splitDateTime } from './join-date-time';\nexport { parseDate } from './parse-date';\nexport { parseTimezoneOffset } from './parse-timezone-offset';\nexport { shiftTimezoneOffset } from './shift-timezone-offset';\n"]}
|
|
@@ -14,7 +14,7 @@ export declare const getOverflowParentDimensions: ({ element, excludeClosestPare
|
|
|
14
14
|
type ScrollIntoViewOptions = Parameters<HTMLElement['scrollIntoView']>[0];
|
|
15
15
|
/**
|
|
16
16
|
* Calls `scrollIntoView` on the provided element with sensible defaults. If
|
|
17
|
-
* the element does not
|
|
17
|
+
* the element does not exist or does not support the `scrollIntoView`
|
|
18
18
|
* method, it will do nothing. This wrapper is created to support environments
|
|
19
19
|
* where the native function is not available like JSDom (feature request:
|
|
20
20
|
* https://github.com/jsdom/jsdom/issues/1422).
|
|
@@ -47,7 +47,7 @@ export const getOverflowParentDimensions = ({ element, excludeClosestParent = fa
|
|
|
47
47
|
};
|
|
48
48
|
/**
|
|
49
49
|
* Calls `scrollIntoView` on the provided element with sensible defaults. If
|
|
50
|
-
* the element does not
|
|
50
|
+
* the element does not exist or does not support the `scrollIntoView`
|
|
51
51
|
* method, it will do nothing. This wrapper is created to support environments
|
|
52
52
|
* where the native function is not available like JSDom (feature request:
|
|
53
53
|
* https://github.com/jsdom/jsdom/issues/1422).
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scrollable-containers.js","sourceRoot":"lib/default/","sources":["internal/utils/scrollable-containers.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAQpC,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,OAAoB,EAAiB,EAAE;IACxE,MAAM,OAAO,GAAG,EAAE,CAAC;IACnB,IAAI,IAAI,GAAuB,OAAO,CAAC;IAEvC,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,IAAI,KAAK,QAAQ,CAAC,IAAI,EAAE;QAC5D,gBAAgB,CAAC,IAAI,CAAC,CAAC,QAAQ,KAAK,SAAS,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACrE;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,2BAA2B,GAAG,CAAC,EAC1C,OAAO,EACP,oBAAoB,GAAG,KAAK,EAC5B,gBAAgB,GAAG,KAAK,EACxB,wBAAwB,GAAG,KAAK,GAMjC,EAAiB,EAAE;IAClB,MAAM,OAAO,GAAG,gBAAgB;QAC9B,CAAC,CAAC,EAAE;QACJ,CAAC,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE;YACnC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAC;YAChE,OAAO;gBACL,0DAA0D;gBAC1D,gDAAgD;gBAChD,MAAM,EAAE,wBAAwB,CAAC,CAAC,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM;gBAC3D,KAAK;gBACL,GAAG;gBACH,IAAI;aACL,CAAC;QACJ,CAAC,CAAC,CAAC;IAEP,IAAI,wBAAwB,IAAI,CAAC,gBAAgB,EAAE;QACjD,MAAM,kBAAkB,GAAG,QAAQ,CAAC,eAAe,CAAC,qBAAqB,EAAE,CAAC;QAC5E,OAAO,CAAC,IAAI,CAAC;YACX,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,kBAAkB,CAAC,KAAK,EAAE,QAAQ,CAAC,eAAe,CAAC,WAAW,CAAC;YAC/E,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,kBAAkB,CAAC,MAAM,EAAE,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC;YAClF,GAAG,EAAE,kBAAkB,CAAC,GAAG;YAC3B,IAAI,EAAE,kBAAkB,CAAC,IAAI;SAC9B,CAAC,CAAC;KACJ;SAAM;QACL,OAAO,CAAC,IAAI,CAAC;YACX,MAAM,EAAE,MAAM,CAAC,WAAW;YAC1B,KAAK,EAAE,MAAM,CAAC,UAAU;YACxB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;SACR,CAAC,CAAC;KACJ;IAED,IAAI,oBAAoB,IAAI,CAAC,gBAAgB,EAAE;QAC7C,OAAO,CAAC,KAAK,EAAE,CAAC;KACjB;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAIF;;;;;;;;;GASG;AACH,MAAM,UAAU,qBAAqB,CACnC,OAAgC,EAChC,UAAiC,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE;;IAExE,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,cAAc,wDAAG,OAAO,CAAC,CAAC;AACrC,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,EAAE,GAAG,EAAE,MAAM,EAAe;IAC1D,IAAI,GAAG,GAAG,CAAC,EAAE;QACX,OAAO,GAAG,CAAC;KACZ;SAAM,IAAI,GAAG,GAAG,MAAM,GAAG,MAAM,CAAC,WAAW,EAAE;QAC5C,IAAI,MAAM,GAAG,MAAM,CAAC,WAAW,EAAE;YAC/B,OAAO,GAAG,CAAC;SACZ;aAAM;YACL,OAAO,GAAG,GAAG,MAAM,GAAG,MAAM,CAAC,WAAW,CAAC;SAC1C;KACF;IACD,OAAO,CAAC,CAAC;AACX,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,uBAAuB,CAAC,GAAgB,EAAE,gBAA8B;IACtF,MAAM,YAAY,GAAG,eAAe,CAAC,GAAG,CAAC,CAAC;IAC1C,IAAI,YAAY,EAAE;QAChB,CAAC,gBAAgB,IAAI,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,YAAY,CAAC,CAAC;KACxD;AACH,CAAC;AAED,MAAM,UAAU,wBAAwB,CAAC,OAAoB;IAC3D,OAAO,CACL,WAAW,CAAC,OAAO,EAAE,EAAE,CAAC,EAAE;QACxB,MAAM,SAAS,GAAG,EAAE,CAAC,YAAY,GAAG,EAAE,CAAC,YAAY,CAAC;QACpD,OAAO,SAAS,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,QAAQ,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC;IAClF,CAAC,CAAC,IAAI,SAAS,CAChB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { findUpUntil } from './dom';\nexport interface BoundingBox {\n height: number;\n width: number;\n top: number;\n left: number;\n}\n\nexport const getOverflowParents = (element: HTMLElement): HTMLElement[] => {\n const parents = [];\n let node: HTMLElement | null = element;\n\n while ((node = node.parentElement) && node !== document.body) {\n getComputedStyle(node).overflow !== 'visible' && parents.push(node);\n }\n return parents;\n};\n\nexport const getOverflowParentDimensions = ({\n element,\n excludeClosestParent = false,\n expandToViewport = false,\n canExpandOutsideViewport = false,\n}: {\n element: HTMLElement;\n excludeClosestParent: boolean;\n expandToViewport: boolean;\n canExpandOutsideViewport: boolean;\n}): BoundingBox[] => {\n const parents = expandToViewport\n ? []\n : getOverflowParents(element).map(el => {\n const { height, width, top, left } = el.getBoundingClientRect();\n return {\n // Treat the whole scrollable area as the available height\n // if we're allowed to expand past the viewport.\n height: canExpandOutsideViewport ? el.scrollHeight : height,\n width,\n top,\n left,\n };\n });\n\n if (canExpandOutsideViewport && !expandToViewport) {\n const documentDimensions = document.documentElement.getBoundingClientRect();\n parents.push({\n width: Math.max(documentDimensions.width, document.documentElement.clientWidth),\n height: Math.max(documentDimensions.height, document.documentElement.clientHeight),\n top: documentDimensions.top,\n left: documentDimensions.left,\n });\n } else {\n parents.push({\n height: window.innerHeight,\n width: window.innerWidth,\n top: 0,\n left: 0,\n });\n }\n\n if (excludeClosestParent && !expandToViewport) {\n parents.shift();\n }\n\n return parents;\n};\n\ntype ScrollIntoViewOptions = Parameters<HTMLElement['scrollIntoView']>[0];\n\n/**\n * Calls `scrollIntoView` on the provided element with sensible defaults. If\n * the element does not
|
|
1
|
+
{"version":3,"file":"scrollable-containers.js","sourceRoot":"lib/default/","sources":["internal/utils/scrollable-containers.ts"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { findUpUntil } from './dom';\nexport interface BoundingBox {\n height: number;\n width: number;\n top: number;\n left: number;\n}\n\nexport const getOverflowParents = (element: HTMLElement): HTMLElement[] => {\n const parents = [];\n let node: HTMLElement | null = element;\n\n while ((node = node.parentElement) && node !== document.body) {\n getComputedStyle(node).overflow !== 'visible' && parents.push(node);\n }\n return parents;\n};\n\nexport const getOverflowParentDimensions = ({\n element,\n excludeClosestParent = false,\n expandToViewport = false,\n canExpandOutsideViewport = false,\n}: {\n element: HTMLElement;\n excludeClosestParent: boolean;\n expandToViewport: boolean;\n canExpandOutsideViewport: boolean;\n}): BoundingBox[] => {\n const parents = expandToViewport\n ? []\n : getOverflowParents(element).map(el => {\n const { height, width, top, left } = el.getBoundingClientRect();\n return {\n // Treat the whole scrollable area as the available height\n // if we're allowed to expand past the viewport.\n height: canExpandOutsideViewport ? el.scrollHeight : height,\n width,\n top,\n left,\n };\n });\n\n if (canExpandOutsideViewport && !expandToViewport) {\n const documentDimensions = document.documentElement.getBoundingClientRect();\n parents.push({\n width: Math.max(documentDimensions.width, document.documentElement.clientWidth),\n height: Math.max(documentDimensions.height, document.documentElement.clientHeight),\n top: documentDimensions.top,\n left: documentDimensions.left,\n });\n } else {\n parents.push({\n height: window.innerHeight,\n width: window.innerWidth,\n top: 0,\n left: 0,\n });\n }\n\n if (excludeClosestParent && !expandToViewport) {\n parents.shift();\n }\n\n return parents;\n};\n\ntype ScrollIntoViewOptions = Parameters<HTMLElement['scrollIntoView']>[0];\n\n/**\n * Calls `scrollIntoView` on the provided element with sensible defaults. If\n * the element does not exist or does not support the `scrollIntoView`\n * method, it will do nothing. This wrapper is created to support environments\n * where the native function is not available like JSDom (feature request:\n * https://github.com/jsdom/jsdom/issues/1422).\n *\n * @param element to be scrolled into view\n * @param options native options for `scrollIntoView`\n */\nexport function scrollElementIntoView(\n element: HTMLElement | undefined,\n options: ScrollIntoViewOptions = { block: 'nearest', inline: 'nearest' }\n) {\n element?.scrollIntoView?.(options);\n}\n\nexport function calculateScroll({ top, height }: BoundingBox) {\n if (top < 0) {\n return top;\n } else if (top + height > window.innerHeight) {\n if (height > window.innerHeight) {\n return top;\n } else {\n return top + height - window.innerHeight;\n }\n }\n return 0;\n}\n\n/**\n * For elements with fixed position, the browser's native scrollIntoView API doesn't work,\n * so we need to manually scroll to the element's position.\n * Supports only vertical scrolling.\n */\nexport function scrollRectangleIntoView(box: BoundingBox, scrollableParent?: HTMLElement) {\n const scrollAmount = calculateScroll(box);\n if (scrollAmount) {\n (scrollableParent || window).scrollBy(0, scrollAmount);\n }\n}\n\nexport function getFirstScrollableParent(element: HTMLElement): HTMLElement | undefined {\n return (\n findUpUntil(element, el => {\n const overflows = el.scrollHeight > el.clientHeight;\n return overflows && ['scroll', 'auto'].includes(getComputedStyle(el).overflowY);\n }) || undefined\n );\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"disabled-inline-editor.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/disabled-inline-editor.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"disabled-inline-editor.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/disabled-inline-editor.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAI7C,UAAU,yBAAyB,CAAC,QAAQ,CAAE,SAAQ,kBAAkB,CAAC,QAAQ,CAAC;IAChF,kBAAkB,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,oBAAoB,CAAC,QAAQ,EAAE,EAC7C,SAAS,EACT,IAAI,EACJ,MAAM,EACN,UAAU,EACV,SAAS,EACT,WAAW,EACX,SAAS,EACT,kBAAkB,EAClB,eAAe,EACf,GAAG,IAAI,EACR,EAAE,yBAAyB,CAAC,QAAQ,CAAC,eA+FrC"}
|
|
@@ -13,6 +13,7 @@ import Arrow from '../../popover/arrow';
|
|
|
13
13
|
import { useClickAway } from './click-away';
|
|
14
14
|
import { TableTdElement } from './td-element';
|
|
15
15
|
import styles from './styles.css.js';
|
|
16
|
+
import { useSingleTabStopNavigation } from '../../internal/context/single-tab-stop-navigation-context';
|
|
16
17
|
export function DisabledInlineEditor(_a) {
|
|
17
18
|
var _b;
|
|
18
19
|
var { className, item, column, ariaLabels, isEditing, onEditStart, onEditEnd, editDisabledReason, isVisualRefresh } = _a, rest = __rest(_a, ["className", "item", "column", "ariaLabels", "isEditing", "onEditStart", "onEditEnd", "editDisabledReason", "isVisualRefresh"]);
|
|
@@ -39,9 +40,10 @@ export function DisabledInlineEditor(_a) {
|
|
|
39
40
|
};
|
|
40
41
|
const { targetProps, descriptionEl } = useHiddenDescription(editDisabledReason);
|
|
41
42
|
const portalClasses = usePortalModeClasses(portalRef);
|
|
43
|
+
const { tabIndex } = useSingleTabStopNavigation(buttonRef);
|
|
42
44
|
return (React.createElement(TableTdElement, Object.assign({}, rest, { nativeAttributes: { 'data-inline-editing-active': isEditing.toString() }, className: clsx(className, styles['body-cell-editable'], styles['body-cell-disabled-edit'], isEditing && styles['body-cell-edit-disabled-popover'], isVisualRefresh && styles['is-visual-refresh']), onClick: !isEditing ? onClick : undefined, onMouseEnter: () => setHasHover(true), onMouseLeave: () => setHasHover(false), ref: clickAwayRef }),
|
|
43
45
|
column.cell(item),
|
|
44
|
-
React.createElement("button", Object.assign({ ref: buttonRef, tabIndex:
|
|
46
|
+
React.createElement("button", Object.assign({ ref: buttonRef, tabIndex: tabIndex, className: styles['body-cell-editor'], "aria-label": (_b = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.activateEditLabel) === null || _b === void 0 ? void 0 : _b.call(ariaLabels, column, item), "aria-haspopup": "dialog", "aria-disabled": "true", onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false), onKeyDown: handleEscape }, targetProps),
|
|
45
47
|
showIcon && React.createElement(Icon, { name: "lock-private", variant: "normal", __internalRootRef: iconRef }),
|
|
46
48
|
descriptionEl),
|
|
47
49
|
isEditing && (React.createElement("span", { ref: portalRef },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"disabled-inline-editor.js","sourceRoot":"lib/default/","sources":["table/body-cell/disabled-inline-editor.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,oBAAoB,MAAM,oDAAoD,CAAC;AACtF,OAAO,IAAI,MAAM,qBAAqB,CAAC;AACvC,OAAO,gBAAgB,MAAM,yBAAyB,CAAC;AACvD,OAAO,WAAW,MAAM,oBAAoB,CAAC;AAC7C,OAAO,MAAM,MAAM,kCAAkC,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AACpF,OAAO,KAAK,MAAM,qBAAqB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAuB,MAAM,cAAc,CAAC;AAEnE,OAAO,MAAM,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"disabled-inline-editor.js","sourceRoot":"lib/default/","sources":["table/body-cell/disabled-inline-editor.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, { useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport useHiddenDescription from '../../button-dropdown/utils/use-hidden-description';\nimport Icon from '../../icon/internal';\nimport PopoverContainer from '../../popover/container';\nimport PopoverBody from '../../popover/body';\nimport Portal from '../../internal/components/portal';\nimport { usePortalModeClasses } from '../../internal/hooks/use-portal-mode-classes';\nimport Arrow from '../../popover/arrow';\nimport { useClickAway } from './click-away';\nimport { TableTdElement, TableTdElementProps } from './td-element';\nimport { TableBodyCellProps } from './index';\nimport styles from './styles.css.js';\nimport { useSingleTabStopNavigation } from '../../internal/context/single-tab-stop-navigation-context';\n\ninterface DisabledInlineEditorProps<ItemType> extends TableBodyCellProps<ItemType> {\n editDisabledReason: string;\n}\n\nexport function DisabledInlineEditor<ItemType>({\n className,\n item,\n column,\n ariaLabels,\n isEditing,\n onEditStart,\n onEditEnd,\n editDisabledReason,\n isVisualRefresh,\n ...rest\n}: DisabledInlineEditorProps<ItemType>) {\n const clickAwayRef = useClickAway(() => {\n if (isEditing) {\n onEditEnd(true);\n }\n });\n\n const [hasHover, setHasHover] = useState(false);\n const [hasFocus, setHasFocus] = useState(false);\n const showIcon = hasHover || hasFocus || isEditing;\n\n const iconRef = useRef(null);\n const buttonRef = useRef<HTMLButtonElement>(null);\n const portalRef = useRef<HTMLSpanElement>(null);\n\n function handleEscape(event: React.KeyboardEvent): void {\n if (event.key === 'Escape') {\n onEditEnd(true);\n }\n }\n\n const onClick = () => {\n onEditStart();\n buttonRef.current?.focus();\n };\n\n const { targetProps, descriptionEl } = useHiddenDescription(editDisabledReason);\n const portalClasses = usePortalModeClasses(portalRef);\n\n const { tabIndex } = useSingleTabStopNavigation(buttonRef);\n\n return (\n <TableTdElement\n {...rest}\n nativeAttributes={\n { 'data-inline-editing-active': isEditing.toString() } as TableTdElementProps['nativeAttributes']\n }\n className={clsx(\n className,\n styles['body-cell-editable'],\n styles['body-cell-disabled-edit'],\n isEditing && styles['body-cell-edit-disabled-popover'],\n isVisualRefresh && styles['is-visual-refresh']\n )}\n onClick={!isEditing ? onClick : undefined}\n onMouseEnter={() => setHasHover(true)}\n onMouseLeave={() => setHasHover(false)}\n ref={clickAwayRef}\n >\n {column.cell(item)}\n\n <button\n ref={buttonRef}\n tabIndex={tabIndex}\n className={styles['body-cell-editor']}\n aria-label={ariaLabels?.activateEditLabel?.(column, item)}\n aria-haspopup=\"dialog\"\n aria-disabled=\"true\"\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n onKeyDown={handleEscape}\n {...targetProps}\n >\n {showIcon && <Icon name=\"lock-private\" variant=\"normal\" __internalRootRef={iconRef} />}\n {descriptionEl}\n </button>\n {isEditing && (\n <span ref={portalRef}>\n <Portal>\n <span className={portalClasses}>\n <PopoverContainer\n size=\"medium\"\n fixedWidth={false}\n position=\"top\"\n trackRef={iconRef}\n arrow={position => <Arrow position={position} />}\n renderWithPortal={true}\n zIndex={2000}\n >\n <PopoverBody\n dismissButton={false}\n dismissAriaLabel={undefined}\n header={null}\n onDismiss={() => {}}\n overflowVisible=\"both\"\n >\n <span aria-live=\"polite\">{editDisabledReason}</span>\n </PopoverBody>\n </PopoverContainer>\n </span>\n </Portal>\n </span>\n )}\n </TableTdElement>\n );\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAkB,mBAAmB,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAkB,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAYnE,MAAM,WAAW,kBAAkB,CAAC,QAAQ,CAAE,SAAQ,mBAAmB;IACvE,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,IAAI,EAAE,QAAQ,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,SAAS,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC,kBAAkB,CAAC,QAAQ,CAAC,CAAC;IACrD,UAAU,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC;CACtC;AAmHD,wBAAgB,aAAa,CAAC,QAAQ,EAAE,EACtC,UAAU,EACV,GAAG,IAAI,EACR,EAAE,kBAAkB,CAAC,QAAQ,CAAC,GAAG;IAAE,UAAU,EAAE,OAAO,CAAA;CAAE,eAYxD"}
|
package/table/body-cell/index.js
CHANGED
|
@@ -10,6 +10,7 @@ import { InlineEditor } from './inline-editor';
|
|
|
10
10
|
import LiveRegion from '../../internal/components/live-region/index.js';
|
|
11
11
|
import { useInternalI18n } from '../../i18n/context';
|
|
12
12
|
import { usePrevious } from '../../internal/hooks/use-previous';
|
|
13
|
+
import { useSingleTabStopNavigation } from '../../internal/context/single-tab-stop-navigation-context.js';
|
|
13
14
|
import { DisabledInlineEditor } from './disabled-inline-editor';
|
|
14
15
|
const submitHandlerFallback = () => {
|
|
15
16
|
throw new Error('The function `handleSubmit` is required for editable columns');
|
|
@@ -46,6 +47,7 @@ function TableCellEditable(_a) {
|
|
|
46
47
|
setShowSuccessIcon(true);
|
|
47
48
|
}
|
|
48
49
|
}, [hasFocus, successfulEdit, prevHasFocus, prevSuccessfulEdit]);
|
|
50
|
+
const { tabIndex: editActivateTabIndex } = useSingleTabStopNavigation(editActivateRef);
|
|
49
51
|
return (React.createElement(TableTdElement, Object.assign({}, rest, { nativeAttributes: tdNativeAttributes, className: clsx(className, styles['body-cell-editable'], isEditing && styles['body-cell-edit-active'], showSuccessIcon && showIcon && styles['body-cell-has-success'], isVisualRefresh && styles['is-visual-refresh']), onClick: !isEditing ? onEditStart : undefined, onMouseEnter: () => setHasHover(true), onMouseLeave: () => setHasHover(false) }), isEditing ? (React.createElement(InlineEditor, { ariaLabels: ariaLabels, column: column, item: item, onEditEnd: options => {
|
|
50
52
|
setShowSuccessIcon(false);
|
|
51
53
|
isFocusMoveNeededRef.current = options.refocusCell;
|
|
@@ -60,7 +62,7 @@ function TableCellEditable(_a) {
|
|
|
60
62
|
} },
|
|
61
63
|
React.createElement(Icon, { name: "status-positive", variant: "success" })),
|
|
62
64
|
React.createElement(LiveRegion, null, i18n('ariaLabels.successfulEditLabel', (_c = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.successfulEditLabel) === null || _c === void 0 ? void 0 : _c.call(ariaLabels, column))))),
|
|
63
|
-
React.createElement("button", { className: styles['body-cell-editor'], "aria-label": (_d = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.activateEditLabel) === null || _d === void 0 ? void 0 : _d.call(ariaLabels, column, item), ref: editActivateRef, onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false) }, showIcon && React.createElement(Icon, { name: "edit" }))))));
|
|
65
|
+
React.createElement("button", { className: styles['body-cell-editor'], "aria-label": (_d = ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.activateEditLabel) === null || _d === void 0 ? void 0 : _d.call(ariaLabels, column, item), ref: editActivateRef, onFocus: () => setHasFocus(true), onBlur: () => setHasFocus(false), tabIndex: editActivateTabIndex }, showIcon && React.createElement(Icon, { name: "edit" }))))));
|
|
64
66
|
}
|
|
65
67
|
export function TableBodyCell(_a) {
|
|
66
68
|
var _b, _c;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/body-cell/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,IAAI,MAAM,qBAAqB,CAAC;AAEvC,OAAO,EAAE,cAAc,EAAuB,MAAM,cAAc,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,UAAU,MAAM,gDAAgD,CAAC;AACxE,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAEhE,MAAM,qBAAqB,GAAG,GAAG,EAAE;IACjC,MAAM,IAAI,KAAK,CAAC,8DAA8D,CAAC,CAAC;AAClF,CAAC,CAAC;AAaF,SAAS,iBAAiB,CAAW,EAYN;;QAZM,EACnC,SAAS,EACT,IAAI,EACJ,MAAM,EACN,SAAS,EACT,WAAW,EACX,SAAS,EACT,UAAU,EACV,UAAU,EACV,eAAe,EACf,cAAc,GAAG,KAAK,OAEO,EAD1B,IAAI,cAX4B,yIAYpC,CADQ;IAEP,MAAM,IAAI,GAAG,eAAe,CAAC,OAAO,CAAC,CAAC;IACtC,MAAM,eAAe,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACxD,MAAM,kBAAkB,GAAG;QACzB,4BAA4B,EAAE,SAAS,CAAC,QAAQ,EAAE;KACnD,CAAC;IACF,MAAM,oBAAoB,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE3C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,eAAe,CAAC,OAAO,IAAI,oBAAoB,CAAC,OAAO,EAAE;YACzE,oBAAoB,CAAC,OAAO,GAAG,KAAK,CAAC;YACrC,eAAe,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SACjC;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAChB,4FAA4F;IAC5F,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,MAAM,QAAQ,GAAG,QAAQ,IAAI,QAAQ,CAAC;IAEtC,MAAM,kBAAkB,GAAG,WAAW,CAAC,cAAc,CAAC,CAAC;IACvD,MAAM,YAAY,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;IAC3C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9D,SAAS,CAAC,GAAG,EAAE;QACb,wEAAwE;QACxE,IAAI,cAAc,IAAI,kBAAkB,IAAI,CAAC,QAAQ,IAAI,YAAY,EAAE;YACrE,kBAAkB,CAAC,KAAK,CAAC,CAAC;SAC3B;QACD,2FAA2F;QAC3F,IAAI,cAAc,IAAI,CAAC,kBAAkB,EAAE;YACzC,kBAAkB,CAAC,IAAI,CAAC,CAAC;SAC1B;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,YAAY,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAEjE,OAAO,CACL,oBAAC,cAAc,oBACT,IAAI,IACR,gBAAgB,EAAE,kBAA6D,EAC/E,SAAS,EAAE,IAAI,CACb,SAAS,EACT,MAAM,CAAC,oBAAoB,CAAC,EAC5B,SAAS,IAAI,MAAM,CAAC,uBAAuB,CAAC,EAC5C,eAAe,IAAI,QAAQ,IAAI,MAAM,CAAC,uBAAuB,CAAC,EAC9D,eAAe,IAAI,MAAM,CAAC,mBAAmB,CAAC,CAC/C,EACD,OAAO,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,EAC7C,YAAY,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EACrC,YAAY,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,KAErC,SAAS,CAAC,CAAC,CAAC,CACX,oBAAC,YAAY,IACX,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,OAAO,CAAC,EAAE;YACnB,kBAAkB,CAAC,KAAK,CAAC,CAAC;YAC1B,oBAAoB,CAAC,OAAO,GAAG,OAAO,CAAC,WAAW,CAAC;YACnD,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QAC/B,CAAC,EACD,UAAU,EAAE,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,qBAAqB,GAC/C,CACH,CAAC,CAAC,CAAC,CACF;QACG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;QACjB,eAAe,IAAI,QAAQ,IAAI,CAC9B;YACE,8BACE,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,gBAC1B,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,2DAAG,MAAM,CAAC,EACrD,IAAI,EAAC,KAAK,EACV,WAAW,EAAE,CAAC,CAAC,EAAE;oBACf,qFAAqF;oBACrF,qHAAqH;oBACrH,CAAC,CAAC,cAAc,EAAE,CAAC;gBACrB,CAAC;gBAED,oBAAC,IAAI,IAAC,IAAI,EAAC,iBAAiB,EAAC,OAAO,EAAC,SAAS,GAAG,CAC5C;YACP,oBAAC,UAAU,QACR,IAAI,CAAC,gCAAgC,EAAE,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,mBAAmB,2DAAG,MAAM,CAAC,CAAC,CACvE,CACZ,CACJ;QACD,gCACE,SAAS,EAAE,MAAM,CAAC,kBAAkB,CAAC,gBACzB,MAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,iBAAiB,2DAAG,MAAM,EAAE,IAAI,CAAC,EACzD,GAAG,EAAE,eAAe,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,EAChC,MAAM,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,IAE/B,QAAQ,IAAI,oBAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,CAC1B,CACR,CACJ,CACc,CAClB,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,aAAa,CAAW,EAGiB;;QAHjB,EACtC,UAAU,OAE6C,EADpD,IAAI,cAF+B,cAGvC,CADQ;IAEP,MAAM,kBAAkB,GAAG,MAAA,MAAA,IAAI,CAAC,MAAM,CAAC,UAAU,0CAAE,cAAc,mDAAG,IAAI,CAAC,IAAI,CAAC,CAAC;IAE/E,IAAI,kBAAkB,EAAE;QACtB,OAAO,oBAAC,oBAAoB,kBAAC,kBAAkB,EAAE,kBAAkB,IAAM,IAAI,EAAI,CAAC;KACnF;IAED,IAAI,UAAU,IAAI,IAAI,CAAC,SAAS,EAAE;QAChC,OAAO,oBAAC,iBAAiB,oBAAK,IAAI,EAAI,CAAC;KACxC;IACD,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAC9B,OAAO,oBAAC,cAAc,oBAAK,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAkB,CAAC;AACxE,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport React, { useEffect, useRef, useState } from 'react';\nimport Icon from '../../icon/internal';\nimport { TableProps } from '../interfaces';\nimport { TableTdElement, TableTdElementProps } from './td-element';\nimport { InlineEditor } from './inline-editor';\nimport LiveRegion from '../../internal/components/live-region/index.js';\nimport { useInternalI18n } from '../../i18n/context';\nimport { usePrevious } from '../../internal/hooks/use-previous';\nimport { DisabledInlineEditor } from './disabled-inline-editor';\n\nconst submitHandlerFallback = () => {\n throw new Error('The function `handleSubmit` is required for editable columns');\n};\n\nexport interface TableBodyCellProps<ItemType> extends TableTdElementProps {\n column: TableProps.ColumnDefinition<ItemType>;\n item: ItemType;\n isEditing: boolean;\n successfulEdit?: boolean;\n onEditStart: () => void;\n onEditEnd: (cancelled: boolean) => void;\n submitEdit?: TableProps.SubmitEditFunction<ItemType>;\n ariaLabels: TableProps['ariaLabels'];\n}\n\nfunction TableCellEditable<ItemType>({\n className,\n item,\n column,\n isEditing,\n onEditStart,\n onEditEnd,\n submitEdit,\n ariaLabels,\n isVisualRefresh,\n successfulEdit = false,\n ...rest\n}: TableBodyCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const editActivateRef = useRef<HTMLButtonElement>(null);\n const tdNativeAttributes = {\n 'data-inline-editing-active': isEditing.toString(),\n };\n const isFocusMoveNeededRef = useRef(false);\n\n useEffect(() => {\n if (!isEditing && editActivateRef.current && isFocusMoveNeededRef.current) {\n isFocusMoveNeededRef.current = false;\n editActivateRef.current.focus();\n }\n }, [isEditing]);\n // To improve the initial page render performance we only show the edit icon when necessary.\n const [hasHover, setHasHover] = useState(false);\n const [hasFocus, setHasFocus] = useState(false);\n const showIcon = hasHover || hasFocus;\n\n const prevSuccessfulEdit = usePrevious(successfulEdit);\n const prevHasFocus = usePrevious(hasFocus);\n const [showSuccessIcon, setShowSuccessIcon] = useState(false);\n\n useEffect(() => {\n // Hide the success icon after a successful edit, when cell loses focus.\n if (successfulEdit && prevSuccessfulEdit && !hasFocus && prevHasFocus) {\n setShowSuccessIcon(false);\n }\n // Show success icon right after a successful edit, when `successfulEdit` switches to true.\n if (successfulEdit && !prevSuccessfulEdit) {\n setShowSuccessIcon(true);\n }\n }, [hasFocus, successfulEdit, prevHasFocus, prevSuccessfulEdit]);\n\n return (\n <TableTdElement\n {...rest}\n nativeAttributes={tdNativeAttributes as TableTdElementProps['nativeAttributes']}\n className={clsx(\n className,\n styles['body-cell-editable'],\n isEditing && styles['body-cell-edit-active'],\n showSuccessIcon && showIcon && styles['body-cell-has-success'],\n isVisualRefresh && styles['is-visual-refresh']\n )}\n onClick={!isEditing ? onEditStart : undefined}\n onMouseEnter={() => setHasHover(true)}\n onMouseLeave={() => setHasHover(false)}\n >\n {isEditing ? (\n <InlineEditor\n ariaLabels={ariaLabels}\n column={column}\n item={item}\n onEditEnd={options => {\n setShowSuccessIcon(false);\n isFocusMoveNeededRef.current = options.refocusCell;\n onEditEnd(options.cancelled);\n }}\n submitEdit={submitEdit ?? submitHandlerFallback}\n />\n ) : (\n <>\n {column.cell(item)}\n {showSuccessIcon && showIcon && (\n <>\n <span\n className={styles['body-cell-success']}\n aria-label={ariaLabels?.successfulEditLabel?.(column)}\n role=\"img\"\n onMouseDown={e => {\n // Prevent the editor's Button blur event to be fired when clicking the success icon.\n // This prevents unfocusing the button and triggers the `TableTdElement` onClick event which initiates the edit mode.\n e.preventDefault();\n }}\n >\n <Icon name=\"status-positive\" variant=\"success\" />\n </span>\n <LiveRegion>\n {i18n('ariaLabels.successfulEditLabel', ariaLabels?.successfulEditLabel?.(column))}\n </LiveRegion>\n </>\n )}\n <button\n className={styles['body-cell-editor']}\n aria-label={ariaLabels?.activateEditLabel?.(column, item)}\n ref={editActivateRef}\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n >\n {showIcon && <Icon name=\"edit\" />}\n </button>\n </>\n )}\n </TableTdElement>\n );\n}\n\nexport function TableBodyCell<ItemType>({\n isEditable,\n ...rest\n}: TableBodyCellProps<ItemType> & { isEditable: boolean }) {\n const editDisabledReason = rest.column.editConfig?.disabledReason?.(rest.item);\n\n if (editDisabledReason) {\n return <DisabledInlineEditor editDisabledReason={editDisabledReason} {...rest} />;\n }\n\n if (isEditable || rest.isEditing) {\n return <TableCellEditable {...rest} />;\n }\n const { column, item } = rest;\n return <TableTdElement {...rest}>{column.cell(item)}</TableTdElement>;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/body-cell/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 clsx from 'clsx';\nimport styles from './styles.css.js';\nimport React, { useEffect, useRef, useState } from 'react';\nimport Icon from '../../icon/internal';\nimport { TableProps } from '../interfaces';\nimport { TableTdElement, TableTdElementProps } from './td-element';\nimport { InlineEditor } from './inline-editor';\nimport LiveRegion from '../../internal/components/live-region/index.js';\nimport { useInternalI18n } from '../../i18n/context';\nimport { usePrevious } from '../../internal/hooks/use-previous';\nimport { useSingleTabStopNavigation } from '../../internal/context/single-tab-stop-navigation-context.js';\nimport { DisabledInlineEditor } from './disabled-inline-editor';\n\nconst submitHandlerFallback = () => {\n throw new Error('The function `handleSubmit` is required for editable columns');\n};\n\nexport interface TableBodyCellProps<ItemType> extends TableTdElementProps {\n column: TableProps.ColumnDefinition<ItemType>;\n item: ItemType;\n isEditing: boolean;\n successfulEdit?: boolean;\n onEditStart: () => void;\n onEditEnd: (cancelled: boolean) => void;\n submitEdit?: TableProps.SubmitEditFunction<ItemType>;\n ariaLabels: TableProps['ariaLabels'];\n}\n\nfunction TableCellEditable<ItemType>({\n className,\n item,\n column,\n isEditing,\n onEditStart,\n onEditEnd,\n submitEdit,\n ariaLabels,\n isVisualRefresh,\n successfulEdit = false,\n ...rest\n}: TableBodyCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const editActivateRef = useRef<HTMLButtonElement>(null);\n const tdNativeAttributes = {\n 'data-inline-editing-active': isEditing.toString(),\n };\n const isFocusMoveNeededRef = useRef(false);\n\n useEffect(() => {\n if (!isEditing && editActivateRef.current && isFocusMoveNeededRef.current) {\n isFocusMoveNeededRef.current = false;\n editActivateRef.current.focus();\n }\n }, [isEditing]);\n // To improve the initial page render performance we only show the edit icon when necessary.\n const [hasHover, setHasHover] = useState(false);\n const [hasFocus, setHasFocus] = useState(false);\n const showIcon = hasHover || hasFocus;\n\n const prevSuccessfulEdit = usePrevious(successfulEdit);\n const prevHasFocus = usePrevious(hasFocus);\n const [showSuccessIcon, setShowSuccessIcon] = useState(false);\n\n useEffect(() => {\n // Hide the success icon after a successful edit, when cell loses focus.\n if (successfulEdit && prevSuccessfulEdit && !hasFocus && prevHasFocus) {\n setShowSuccessIcon(false);\n }\n // Show success icon right after a successful edit, when `successfulEdit` switches to true.\n if (successfulEdit && !prevSuccessfulEdit) {\n setShowSuccessIcon(true);\n }\n }, [hasFocus, successfulEdit, prevHasFocus, prevSuccessfulEdit]);\n\n const { tabIndex: editActivateTabIndex } = useSingleTabStopNavigation(editActivateRef);\n\n return (\n <TableTdElement\n {...rest}\n nativeAttributes={tdNativeAttributes as TableTdElementProps['nativeAttributes']}\n className={clsx(\n className,\n styles['body-cell-editable'],\n isEditing && styles['body-cell-edit-active'],\n showSuccessIcon && showIcon && styles['body-cell-has-success'],\n isVisualRefresh && styles['is-visual-refresh']\n )}\n onClick={!isEditing ? onEditStart : undefined}\n onMouseEnter={() => setHasHover(true)}\n onMouseLeave={() => setHasHover(false)}\n >\n {isEditing ? (\n <InlineEditor\n ariaLabels={ariaLabels}\n column={column}\n item={item}\n onEditEnd={options => {\n setShowSuccessIcon(false);\n isFocusMoveNeededRef.current = options.refocusCell;\n onEditEnd(options.cancelled);\n }}\n submitEdit={submitEdit ?? submitHandlerFallback}\n />\n ) : (\n <>\n {column.cell(item)}\n {showSuccessIcon && showIcon && (\n <>\n <span\n className={styles['body-cell-success']}\n aria-label={ariaLabels?.successfulEditLabel?.(column)}\n role=\"img\"\n onMouseDown={e => {\n // Prevent the editor's Button blur event to be fired when clicking the success icon.\n // This prevents unfocusing the button and triggers the `TableTdElement` onClick event which initiates the edit mode.\n e.preventDefault();\n }}\n >\n <Icon name=\"status-positive\" variant=\"success\" />\n </span>\n <LiveRegion>\n {i18n('ariaLabels.successfulEditLabel', ariaLabels?.successfulEditLabel?.(column))}\n </LiveRegion>\n </>\n )}\n <button\n className={styles['body-cell-editor']}\n aria-label={ariaLabels?.activateEditLabel?.(column, item)}\n ref={editActivateRef}\n onFocus={() => setHasFocus(true)}\n onBlur={() => setHasFocus(false)}\n tabIndex={editActivateTabIndex}\n >\n {showIcon && <Icon name=\"edit\" />}\n </button>\n </>\n )}\n </TableTdElement>\n );\n}\n\nexport function TableBodyCell<ItemType>({\n isEditable,\n ...rest\n}: TableBodyCellProps<ItemType> & { isEditable: boolean }) {\n const editDisabledReason = rest.column.editConfig?.disabledReason?.(rest.item);\n\n if (editDisabledReason) {\n return <DisabledInlineEditor editDisabledReason={editDisabledReason} {...rest} />;\n }\n\n if (isEditable || rest.isEditing) {\n return <TableCellEditable {...rest} />;\n }\n const { column, item } = rest;\n return <TableTdElement {...rest}>{column.cell(item)}</TableTdElement>;\n}\n"]}
|
|
@@ -1,35 +1,35 @@
|
|
|
1
1
|
|
|
2
2
|
import './styles.scoped.css';
|
|
3
3
|
export default {
|
|
4
|
-
"body-cell": "awsui_body-
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
-
"body-cell-
|
|
10
|
-
"
|
|
11
|
-
"has-
|
|
12
|
-
"
|
|
13
|
-
"body-cell-
|
|
14
|
-
"body-cell-
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"sticky-cell-pad-left": "awsui_sticky-cell-pad-
|
|
19
|
-
"sticky-cell-last-right": "awsui_sticky-cell-last-
|
|
20
|
-
"sticky-cell-last-left": "awsui_sticky-cell-last-
|
|
21
|
-
"body-cell-next-selected": "awsui_body-cell-next-
|
|
22
|
-
"body-cell-prev-selected": "awsui_body-cell-prev-
|
|
23
|
-
"body-cell-editor": "awsui_body-cell-
|
|
24
|
-
"body-cell-success": "awsui_body-cell-
|
|
25
|
-
"body-cell-success-form": "awsui_body-cell-success-
|
|
26
|
-
"body-cell-editor-form": "awsui_body-cell-editor-
|
|
27
|
-
"body-cell-success-row": "awsui_body-cell-success-
|
|
28
|
-
"body-cell-editor-row": "awsui_body-cell-editor-
|
|
29
|
-
"body-cell-success-controls": "awsui_body-cell-success-
|
|
30
|
-
"body-cell-editor-controls": "awsui_body-cell-editor-
|
|
31
|
-
"body-cell-disabled-edit": "awsui_body-cell-disabled-
|
|
32
|
-
"body-cell-edit-disabled-popover": "awsui_body-cell-edit-disabled-
|
|
33
|
-
"body-cell-has-success": "awsui_body-cell-has-
|
|
4
|
+
"body-cell": "awsui_body-cell_c6tup_dct23_93",
|
|
5
|
+
"sticky-cell": "awsui_sticky-cell_c6tup_dct23_127",
|
|
6
|
+
"body-cell-wrap": "awsui_body-cell-wrap_c6tup_dct23_130",
|
|
7
|
+
"is-visual-refresh": "awsui_is-visual-refresh_c6tup_dct23_142",
|
|
8
|
+
"has-striped-rows": "awsui_has-striped-rows_c6tup_dct23_154",
|
|
9
|
+
"body-cell-edit-active": "awsui_body-cell-edit-active_c6tup_dct23_157",
|
|
10
|
+
"body-cell-editable": "awsui_body-cell-editable_c6tup_dct23_157",
|
|
11
|
+
"has-striped-rows-sticky-cell-pad-left": "awsui_has-striped-rows-sticky-cell-pad-left_c6tup_dct23_163",
|
|
12
|
+
"has-selection": "awsui_has-selection_c6tup_dct23_166",
|
|
13
|
+
"body-cell-first-row": "awsui_body-cell-first-row_c6tup_dct23_172",
|
|
14
|
+
"body-cell-last-row": "awsui_body-cell-last-row_c6tup_dct23_175",
|
|
15
|
+
"body-cell-selected": "awsui_body-cell-selected_c6tup_dct23_175",
|
|
16
|
+
"has-footer": "awsui_has-footer_c6tup_dct23_175",
|
|
17
|
+
"body-cell-shaded": "awsui_body-cell-shaded_c6tup_dct23_185",
|
|
18
|
+
"sticky-cell-pad-left": "awsui_sticky-cell-pad-left_c6tup_dct23_219",
|
|
19
|
+
"sticky-cell-last-right": "awsui_sticky-cell-last-right_c6tup_dct23_236",
|
|
20
|
+
"sticky-cell-last-left": "awsui_sticky-cell-last-left_c6tup_dct23_240",
|
|
21
|
+
"body-cell-next-selected": "awsui_body-cell-next-selected_c6tup_dct23_263",
|
|
22
|
+
"body-cell-prev-selected": "awsui_body-cell-prev-selected_c6tup_dct23_267",
|
|
23
|
+
"body-cell-editor": "awsui_body-cell-editor_c6tup_dct23_291",
|
|
24
|
+
"body-cell-success": "awsui_body-cell-success_c6tup_dct23_298",
|
|
25
|
+
"body-cell-success-form": "awsui_body-cell-success-form_c6tup_dct23_325",
|
|
26
|
+
"body-cell-editor-form": "awsui_body-cell-editor-form_c6tup_dct23_325",
|
|
27
|
+
"body-cell-success-row": "awsui_body-cell-success-row_c6tup_dct23_335",
|
|
28
|
+
"body-cell-editor-row": "awsui_body-cell-editor-row_c6tup_dct23_335",
|
|
29
|
+
"body-cell-success-controls": "awsui_body-cell-success-controls_c6tup_dct23_345",
|
|
30
|
+
"body-cell-editor-controls": "awsui_body-cell-editor-controls_c6tup_dct23_345",
|
|
31
|
+
"body-cell-disabled-edit": "awsui_body-cell-disabled-edit_c6tup_dct23_348",
|
|
32
|
+
"body-cell-edit-disabled-popover": "awsui_body-cell-edit-disabled-popover_c6tup_dct23_388",
|
|
33
|
+
"body-cell-has-success": "awsui_body-cell-has-success_c6tup_dct23_392"
|
|
34
34
|
};
|
|
35
35
|
|