@cloudscape-design/components 3.0.316 → 3.0.318
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/app-layout/index.d.ts.map +1 -1
- package/app-layout/index.js +19 -2
- package/app-layout/index.js.map +1 -1
- package/app-layout/runtime-api.d.ts +8 -0
- package/app-layout/runtime-api.d.ts.map +1 -0
- package/app-layout/runtime-api.js +32 -0
- package/app-layout/runtime-api.js.map +1 -0
- package/expandable-section/expandable-section-header.d.ts.map +1 -1
- package/expandable-section/expandable-section-header.js +24 -10
- package/expandable-section/expandable-section-header.js.map +1 -1
- package/expandable-section/interfaces.d.ts +1 -1
- package/expandable-section/interfaces.js.map +1 -1
- package/expandable-section/internal.d.ts.map +1 -1
- package/expandable-section/internal.js +2 -1
- package/expandable-section/internal.js.map +1 -1
- package/expandable-section/styles.css.js +31 -27
- package/expandable-section/styles.scoped.css +69 -57
- package/expandable-section/styles.selectors.js +31 -27
- package/expandable-section/utils.d.ts +3 -0
- package/expandable-section/utils.d.ts.map +1 -0
- package/expandable-section/utils.js +4 -0
- package/expandable-section/utils.js.map +1 -0
- package/header/internal.d.ts +5 -1
- package/header/internal.d.ts.map +1 -1
- package/header/internal.js +6 -1
- package/header/internal.js.map +1 -1
- package/internal/environment.js +1 -1
- package/internal/manifest.json +1 -1
- package/internal/plugins/api.d.ts +15 -0
- package/internal/plugins/api.d.ts.map +1 -0
- package/internal/plugins/api.js +50 -0
- package/internal/plugins/api.js.map +1 -0
- package/internal/plugins/drawers-controller.d.ts +17 -0
- package/internal/plugins/drawers-controller.d.ts.map +1 -0
- package/internal/plugins/drawers-controller.js +34 -0
- package/internal/plugins/drawers-controller.js.map +1 -0
- package/internal/plugins/index.d.ts +2 -0
- package/internal/plugins/index.d.ts.map +1 -0
- package/internal/plugins/index.js +4 -0
- package/internal/plugins/index.js.map +1 -0
- package/package.json +1 -1
- package/table/body-cell/td-element.d.ts +1 -1
- package/table/body-cell/td-element.d.ts.map +1 -1
- package/table/body-cell/td-element.js +1 -1
- package/table/body-cell/td-element.js.map +1 -1
- package/table/column-widths-utils.d.ts +3 -0
- package/table/column-widths-utils.d.ts.map +1 -0
- package/table/column-widths-utils.js +16 -0
- package/table/column-widths-utils.js.map +1 -0
- package/table/header-cell/index.d.ts +2 -2
- package/table/header-cell/index.d.ts.map +1 -1
- package/table/header-cell/index.js +1 -1
- package/table/header-cell/index.js.map +1 -1
- package/table/internal.d.ts.map +1 -1
- package/table/internal.js +14 -9
- package/table/internal.js.map +1 -1
- package/table/resizer/index.d.ts.map +1 -1
- package/table/resizer/index.js +2 -2
- package/table/resizer/index.js.map +1 -1
- package/table/thead.d.ts +1 -0
- package/table/thead.d.ts.map +1 -1
- package/table/thead.js +4 -4
- package/table/thead.js.map +1 -1
- package/table/use-column-widths.d.ts +10 -8
- package/table/use-column-widths.d.ts.map +1 -1
- package/table/use-column-widths.js +30 -47
- package/table/use-column-widths.js.map +1 -1
- package/table/use-sticky-columns.d.ts +6 -8
- package/table/use-sticky-columns.d.ts.map +1 -1
- package/table/use-sticky-columns.js +0 -1
- package/table/use-sticky-columns.js.map +1 -1
- package/test-utils/dom/app-layout/index.d.ts +1 -1
- package/test-utils/tsconfig.tsbuildinfo +1 -1
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { DrawersController } from './drawers-controller';
|
|
4
|
+
const storageKey = Symbol.for('awsui-plugin-api');
|
|
5
|
+
function findUpApi(currentWindow) {
|
|
6
|
+
try {
|
|
7
|
+
if (currentWindow === null || currentWindow === void 0 ? void 0 : currentWindow[storageKey]) {
|
|
8
|
+
return currentWindow[storageKey];
|
|
9
|
+
}
|
|
10
|
+
if (!currentWindow || currentWindow.parent === currentWindow) {
|
|
11
|
+
// When the window has no more parents, it references itself
|
|
12
|
+
return undefined;
|
|
13
|
+
}
|
|
14
|
+
return findUpApi(currentWindow.parent);
|
|
15
|
+
}
|
|
16
|
+
catch (ex) {
|
|
17
|
+
// Most likely a cross-origin access error
|
|
18
|
+
return undefined;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
function loadApi() {
|
|
22
|
+
if (typeof window === 'undefined') {
|
|
23
|
+
return createApi();
|
|
24
|
+
}
|
|
25
|
+
const win = window;
|
|
26
|
+
const api = findUpApi(win);
|
|
27
|
+
if (api) {
|
|
28
|
+
return api;
|
|
29
|
+
}
|
|
30
|
+
win[storageKey] = createApi();
|
|
31
|
+
return win[storageKey];
|
|
32
|
+
}
|
|
33
|
+
export const { awsuiPlugins, awsuiPluginsInternal } = loadApi();
|
|
34
|
+
function createApi() {
|
|
35
|
+
const drawers = new DrawersController();
|
|
36
|
+
return {
|
|
37
|
+
awsuiPlugins: {
|
|
38
|
+
appLayout: {
|
|
39
|
+
registerDrawer: drawers.registerDrawer,
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
awsuiPluginsInternal: {
|
|
43
|
+
appLayout: {
|
|
44
|
+
clearRegisteredDrawers: drawers.clearRegisteredDrawers,
|
|
45
|
+
onDrawersRegistered: drawers.onDrawersRegistered,
|
|
46
|
+
},
|
|
47
|
+
},
|
|
48
|
+
};
|
|
49
|
+
}
|
|
50
|
+
//# sourceMappingURL=api.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"api.js","sourceRoot":"lib/default/","sources":["internal/plugins/api.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAgB,iBAAiB,EAA+B,MAAM,sBAAsB,CAAC;AAEpG,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;AAuBlD,SAAS,SAAS,CAAC,aAA4B;IAC7C,IAAI;QACF,IAAI,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,UAAU,CAAC,EAAE;YAC/B,OAAO,aAAa,CAAC,UAAU,CAAC,CAAC;SAClC;QAED,IAAI,CAAC,aAAa,IAAI,aAAa,CAAC,MAAM,KAAK,aAAa,EAAE;YAC5D,4DAA4D;YAC5D,OAAO,SAAS,CAAC;SAClB;QAED,OAAO,SAAS,CAAC,aAAa,CAAC,MAAuB,CAAC,CAAC;KACzD;IAAC,OAAO,EAAE,EAAE;QACX,0CAA0C;QAC1C,OAAO,SAAS,CAAC;KAClB;AACH,CAAC;AAED,SAAS,OAAO;IACd,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,OAAO,SAAS,EAAE,CAAC;KACpB;IACD,MAAM,GAAG,GAAG,MAAkC,CAAC;IAC/C,MAAM,GAAG,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC;IAC3B,IAAI,GAAG,EAAE;QACP,OAAO,GAAG,CAAC;KACZ;IACD,GAAG,CAAC,UAAU,CAAC,GAAG,SAAS,EAAE,CAAC;IAC9B,OAAO,GAAG,CAAC,UAAU,CAAC,CAAC;AACzB,CAAC;AAED,MAAM,CAAC,MAAM,EAAE,YAAY,EAAE,oBAAoB,EAAE,GAAG,OAAO,EAAE,CAAC;AAEhE,SAAS,SAAS;IAChB,MAAM,OAAO,GAAG,IAAI,iBAAiB,EAAE,CAAC;IAExC,OAAO;QACL,YAAY,EAAE;YACZ,SAAS,EAAE;gBACT,cAAc,EAAE,OAAO,CAAC,cAAc;aACvC;SACF;QACD,oBAAoB,EAAE;YACpB,SAAS,EAAE;gBACT,sBAAsB,EAAE,OAAO,CAAC,sBAAsB;gBACtD,mBAAmB,EAAE,OAAO,CAAC,mBAAmB;aACjD;SACF;KACF,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DrawerConfig, DrawersController, DrawersRegistrationListener } from './drawers-controller';\n\nconst storageKey = Symbol.for('awsui-plugin-api');\n\ninterface AwsuiPluginApiPublic {\n appLayout: {\n registerDrawer(config: DrawerConfig): void;\n };\n}\ninterface AwsuiPluginApiInternal {\n appLayout: {\n clearRegisteredDrawers(): void;\n onDrawersRegistered(listener: DrawersRegistrationListener): () => void;\n };\n}\n\ninterface AwsuiApi {\n awsuiPlugins: AwsuiPluginApiPublic;\n awsuiPluginsInternal: AwsuiPluginApiInternal;\n}\n\ninterface WindowWithApi extends Window {\n [storageKey]: AwsuiApi;\n}\n\nfunction findUpApi(currentWindow: WindowWithApi): AwsuiApi | undefined {\n try {\n if (currentWindow?.[storageKey]) {\n return currentWindow[storageKey];\n }\n\n if (!currentWindow || currentWindow.parent === currentWindow) {\n // When the window has no more parents, it references itself\n return undefined;\n }\n\n return findUpApi(currentWindow.parent as WindowWithApi);\n } catch (ex) {\n // Most likely a cross-origin access error\n return undefined;\n }\n}\n\nfunction loadApi() {\n if (typeof window === 'undefined') {\n return createApi();\n }\n const win = window as unknown as WindowWithApi;\n const api = findUpApi(win);\n if (api) {\n return api;\n }\n win[storageKey] = createApi();\n return win[storageKey];\n}\n\nexport const { awsuiPlugins, awsuiPluginsInternal } = loadApi();\n\nfunction createApi(): AwsuiApi {\n const drawers = new DrawersController();\n\n return {\n awsuiPlugins: {\n appLayout: {\n registerDrawer: drawers.registerDrawer,\n },\n },\n awsuiPluginsInternal: {\n appLayout: {\n clearRegisteredDrawers: drawers.clearRegisteredDrawers,\n onDrawersRegistered: drawers.onDrawersRegistered,\n },\n },\n };\n}\n"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { DrawerItem } from '../../app-layout/drawer/interfaces';
|
|
2
|
+
export type DrawerConfig = Omit<DrawerItem, 'content'> & {
|
|
3
|
+
orderPriority?: number;
|
|
4
|
+
mountContent: (container: HTMLElement) => void;
|
|
5
|
+
unmountContent: (container: HTMLElement) => void;
|
|
6
|
+
};
|
|
7
|
+
export type DrawersRegistrationListener = (drawers: Array<DrawerConfig>) => void;
|
|
8
|
+
export declare class DrawersController {
|
|
9
|
+
private drawers;
|
|
10
|
+
private drawersRegistrationListener;
|
|
11
|
+
private updateTimeout;
|
|
12
|
+
private scheduleUpdate;
|
|
13
|
+
registerDrawer: (config: DrawerConfig) => void;
|
|
14
|
+
onDrawersRegistered: (listener: DrawersRegistrationListener) => () => void;
|
|
15
|
+
clearRegisteredDrawers: () => void;
|
|
16
|
+
}
|
|
17
|
+
//# sourceMappingURL=drawers-controller.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"drawers-controller.d.ts","sourceRoot":"lib/default/","sources":["internal/plugins/drawers-controller.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAEhE,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,EAAE,SAAS,CAAC,GAAG;IACvD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,IAAI,CAAC;IAC/C,cAAc,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,IAAI,CAAC;CAClD,CAAC;AACF,MAAM,MAAM,2BAA2B,GAAG,CAAC,OAAO,EAAE,KAAK,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC;AAEjF,qBAAa,iBAAiB;IAC5B,OAAO,CAAC,OAAO,CAA2B;IAC1C,OAAO,CAAC,2BAA2B,CAA4C;IAC/E,OAAO,CAAC,aAAa,CAA8C;IAEnE,OAAO,CAAC,cAAc;IAStB,cAAc,WAAY,YAAY,UAGpC;IAEF,mBAAmB,aAAc,2BAA2B,gBAS1D;IAEF,sBAAsB,aAEpB;CACH"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
export class DrawersController {
|
|
2
|
+
constructor() {
|
|
3
|
+
this.drawers = [];
|
|
4
|
+
this.drawersRegistrationListener = null;
|
|
5
|
+
this.updateTimeout = null;
|
|
6
|
+
this.registerDrawer = (config) => {
|
|
7
|
+
this.drawers = this.drawers.concat(config);
|
|
8
|
+
this.scheduleUpdate();
|
|
9
|
+
};
|
|
10
|
+
this.onDrawersRegistered = (listener) => {
|
|
11
|
+
if (this.drawersRegistrationListener !== null) {
|
|
12
|
+
console.warn('[AwsUi] [runtime plugins] multiple app layout instances detected');
|
|
13
|
+
}
|
|
14
|
+
this.drawersRegistrationListener = listener;
|
|
15
|
+
this.scheduleUpdate();
|
|
16
|
+
return () => {
|
|
17
|
+
this.drawersRegistrationListener = null;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
this.clearRegisteredDrawers = () => {
|
|
21
|
+
this.drawers = [];
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
scheduleUpdate() {
|
|
25
|
+
if (this.updateTimeout) {
|
|
26
|
+
clearTimeout(this.updateTimeout);
|
|
27
|
+
}
|
|
28
|
+
this.updateTimeout = setTimeout(() => {
|
|
29
|
+
var _a;
|
|
30
|
+
(_a = this.drawersRegistrationListener) === null || _a === void 0 ? void 0 : _a.call(this, this.drawers);
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
//# sourceMappingURL=drawers-controller.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"drawers-controller.js","sourceRoot":"lib/default/","sources":["internal/plugins/drawers-controller.ts"],"names":[],"mappings":"AAWA,MAAM,OAAO,iBAAiB;IAA9B;QACU,YAAO,GAAwB,EAAE,CAAC;QAClC,gCAA2B,GAAuC,IAAI,CAAC;QACvE,kBAAa,GAAyC,IAAI,CAAC;QAWnE,mBAAc,GAAG,CAAC,MAAoB,EAAE,EAAE;YACxC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YAC3C,IAAI,CAAC,cAAc,EAAE,CAAC;QACxB,CAAC,CAAC;QAEF,wBAAmB,GAAG,CAAC,QAAqC,EAAE,EAAE;YAC9D,IAAI,IAAI,CAAC,2BAA2B,KAAK,IAAI,EAAE;gBAC7C,OAAO,CAAC,IAAI,CAAC,kEAAkE,CAAC,CAAC;aAClF;YACD,IAAI,CAAC,2BAA2B,GAAG,QAAQ,CAAC;YAC5C,IAAI,CAAC,cAAc,EAAE,CAAC;YACtB,OAAO,GAAG,EAAE;gBACV,IAAI,CAAC,2BAA2B,GAAG,IAAI,CAAC;YAC1C,CAAC,CAAC;QACJ,CAAC,CAAC;QAEF,2BAAsB,GAAG,GAAG,EAAE;YAC5B,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;QACpB,CAAC,CAAC;IACJ,CAAC;IA5BS,cAAc;QACpB,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,YAAY,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;SAClC;QACD,IAAI,CAAC,aAAa,GAAG,UAAU,CAAC,GAAG,EAAE;;YACnC,MAAA,IAAI,CAAC,2BAA2B,qDAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QACnD,CAAC,CAAC,CAAC;IACL,CAAC;CAqBF","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DrawerItem } from '../../app-layout/drawer/interfaces';\n\nexport type DrawerConfig = Omit<DrawerItem, 'content'> & {\n orderPriority?: number;\n mountContent: (container: HTMLElement) => void;\n unmountContent: (container: HTMLElement) => void;\n};\nexport type DrawersRegistrationListener = (drawers: Array<DrawerConfig>) => void;\n\nexport class DrawersController {\n private drawers: Array<DrawerConfig> = [];\n private drawersRegistrationListener: DrawersRegistrationListener | null = null;\n private updateTimeout: ReturnType<typeof setTimeout> | null = null;\n\n private scheduleUpdate() {\n if (this.updateTimeout) {\n clearTimeout(this.updateTimeout);\n }\n this.updateTimeout = setTimeout(() => {\n this.drawersRegistrationListener?.(this.drawers);\n });\n }\n\n registerDrawer = (config: DrawerConfig) => {\n this.drawers = this.drawers.concat(config);\n this.scheduleUpdate();\n };\n\n onDrawersRegistered = (listener: DrawersRegistrationListener) => {\n if (this.drawersRegistrationListener !== null) {\n console.warn('[AwsUi] [runtime plugins] multiple app layout instances detected');\n }\n this.drawersRegistrationListener = listener;\n this.scheduleUpdate();\n return () => {\n this.drawersRegistrationListener = null;\n };\n };\n\n clearRegisteredDrawers = () => {\n this.drawers = [];\n };\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["internal/plugins/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,MAAM,OAAO,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["internal/plugins/index.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,YAAY,IAAI,OAAO,EAAE,MAAM,OAAO,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nexport { awsuiPlugins as default } from './api';\n"]}
|
package/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"td-element.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/td-element.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAuB,MAAM,uBAAuB,CAAC;AAGhF,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,OAAO,CAAC;IACxB,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,IAAI,CACrB,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,GAAG,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,EAC3F,OAAO,GAAG,WAAW,GAAG,SAAS,CAClC,CAAC;IACF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,
|
|
1
|
+
{"version":3,"file":"td-element.d.ts","sourceRoot":"lib/default/","sources":["table/body-cell/td-element.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,kBAAkB,EAAuB,MAAM,uBAAuB,CAAC;AAGhF,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,EAAE,OAAO,CAAC;IACxB,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,IAAI,CACrB,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,GAAG,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,EAC3F,OAAO,GAAG,WAAW,GAAG,SAAS,CAClC,CAAC;IACF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAChC,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,eAAO,MAAM,cAAc,kGA6E1B,CAAC"}
|
|
@@ -4,7 +4,7 @@ import clsx from 'clsx';
|
|
|
4
4
|
import React from 'react';
|
|
5
5
|
import styles from './styles.css.js';
|
|
6
6
|
import { useStickyCellStyles } from '../use-sticky-columns';
|
|
7
|
-
import { getStickyClassNames } from '../utils
|
|
7
|
+
import { getStickyClassNames } from '../utils';
|
|
8
8
|
export const TableTdElement = React.forwardRef(({ className, style, children, wrapLines, isRowHeader, isFirstRow, isLastRow, isSelected, isNextSelected, isPrevSelected, nativeAttributes, onClick, onMouseEnter, onMouseLeave, isEvenRow, stripedRows, isVisualRefresh, hasSelection, hasFooter, columnId, stickyState, }, ref) => {
|
|
9
9
|
let Element = 'td';
|
|
10
10
|
if (isRowHeader) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"td-element.js","sourceRoot":"lib/default/","sources":["table/body-cell/td-element.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAsB,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"td-element.js","sourceRoot":"lib/default/","sources":["table/body-cell/td-element.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAsB,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAChF,OAAO,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AA6B/C,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CAC5C,CACE,EACE,SAAS,EACT,KAAK,EACL,QAAQ,EACR,SAAS,EACT,WAAW,EACX,UAAU,EACV,SAAS,EACT,UAAU,EACV,cAAc,EACd,cAAc,EACd,gBAAgB,EAChB,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,SAAS,EACT,WAAW,EACX,eAAe,EACf,YAAY,EACZ,SAAS,EACT,QAAQ,EACR,WAAW,GACZ,EACD,GAAG,EACH,EAAE;IACF,IAAI,OAAO,GAAgB,IAAI,CAAC;IAChC,IAAI,WAAW,EAAE;QACf,OAAO,GAAG,IAAI,CAAC;QACf,gBAAgB,mCACX,gBAAgB,KACnB,KAAK,EAAE,KAAK,GACb,CAAC;KACH;IAED,MAAM,YAAY,GAAG,mBAAmB,CAAC;QACvC,aAAa,EAAE,WAAW;QAC1B,QAAQ;QACR,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,MAAM,EAAE,KAAK,CAAC;KAC1D,CAAC,CAAC;IACH,OAAO,CACL,oBAAC,OAAO,kBACN,KAAK,kCAAO,KAAK,GAAK,YAAY,CAAC,KAAK,GACxC,SAAS,EAAE,IAAI,CACb,SAAS,EACT,MAAM,CAAC,WAAW,CAAC,EACnB,SAAS,IAAI,MAAM,CAAC,gBAAgB,CAAC,EACrC,UAAU,IAAI,MAAM,CAAC,qBAAqB,CAAC,EAC3C,SAAS,IAAI,MAAM,CAAC,oBAAoB,CAAC,EACzC,UAAU,IAAI,MAAM,CAAC,oBAAoB,CAAC,EAC1C,cAAc,IAAI,MAAM,CAAC,yBAAyB,CAAC,EACnD,cAAc,IAAI,MAAM,CAAC,yBAAyB,CAAC,EACnD,CAAC,SAAS,IAAI,WAAW,IAAI,MAAM,CAAC,kBAAkB,CAAC,EACvD,WAAW,IAAI,MAAM,CAAC,kBAAkB,CAAC,EACzC,eAAe,IAAI,MAAM,CAAC,mBAAmB,CAAC,EAC9C,YAAY,IAAI,MAAM,CAAC,eAAe,CAAC,EACvC,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,EACjC,YAAY,CAAC,SAAS,CACvB,EACD,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,GAAG,EAAE,IAAI,CAAC,EAAE;YACV,IAAI,IAAI,EAAE;gBACR,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;gBACvB,IAAI,GAAG,EAAE;oBACN,GAAoD,CAAC,OAAO,GAAG,IAAI,CAAC;iBACtE;aACF;QACH,CAAC,IACG,gBAAgB,GAEnB,QAAQ,CACD,CACX,CAAC;AACJ,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport styles from './styles.css.js';\nimport { StickyColumnsModel, useStickyCellStyles } from '../use-sticky-columns';\nimport { getStickyClassNames } from '../utils';\n\nexport interface TableTdElementProps {\n className?: string;\n style?: React.CSSProperties;\n wrapLines: boolean | undefined;\n isRowHeader?: boolean;\n isFirstRow: boolean;\n isLastRow: boolean;\n isSelected: boolean;\n isNextSelected: boolean;\n isPrevSelected: boolean;\n nativeAttributes?: Omit<\n React.TdHTMLAttributes<HTMLTableCellElement> | React.ThHTMLAttributes<HTMLTableCellElement>,\n 'style' | 'className' | 'onClick'\n >;\n onClick?: () => void;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n children?: React.ReactNode;\n isEvenRow?: boolean;\n stripedRows?: boolean;\n hasSelection?: boolean;\n hasFooter?: boolean;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n isVisualRefresh?: boolean;\n}\n\nexport const TableTdElement = React.forwardRef<HTMLTableCellElement, TableTdElementProps>(\n (\n {\n className,\n style,\n children,\n wrapLines,\n isRowHeader,\n isFirstRow,\n isLastRow,\n isSelected,\n isNextSelected,\n isPrevSelected,\n nativeAttributes,\n onClick,\n onMouseEnter,\n onMouseLeave,\n isEvenRow,\n stripedRows,\n isVisualRefresh,\n hasSelection,\n hasFooter,\n columnId,\n stickyState,\n },\n ref\n ) => {\n let Element: 'th' | 'td' = 'td';\n if (isRowHeader) {\n Element = 'th';\n nativeAttributes = {\n ...nativeAttributes,\n scope: 'row',\n };\n }\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n return (\n <Element\n style={{ ...style, ...stickyStyles.style }}\n className={clsx(\n className,\n styles['body-cell'],\n wrapLines && styles['body-cell-wrap'],\n isFirstRow && styles['body-cell-first-row'],\n isLastRow && styles['body-cell-last-row'],\n isSelected && styles['body-cell-selected'],\n isNextSelected && styles['body-cell-next-selected'],\n isPrevSelected && styles['body-cell-prev-selected'],\n !isEvenRow && stripedRows && styles['body-cell-shaded'],\n stripedRows && styles['has-striped-rows'],\n isVisualRefresh && styles['is-visual-refresh'],\n hasSelection && styles['has-selection'],\n hasFooter && styles['has-footer'],\n stickyStyles.className\n )}\n onClick={onClick}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n ref={node => {\n if (node) {\n stickyStyles.ref(node);\n if (ref) {\n (ref as React.MutableRefObject<HTMLTableCellElement>).current = node;\n }\n }\n }}\n {...nativeAttributes}\n >\n {children}\n </Element>\n );\n }\n);\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-widths-utils.d.ts","sourceRoot":"lib/default/","sources":["table/column-widths-utils.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,wBAAgB,iBAAiB,CAAC,iBAAiB,EAAE,aAAa,CAAC,UAAU,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,QAKnG"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
|
|
2
|
+
// SPDX-License-Identifier: Apache-2.0
|
|
3
|
+
import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
|
|
4
|
+
export function checkColumnWidths(columnDefinitions) {
|
|
5
|
+
for (const column of columnDefinitions) {
|
|
6
|
+
checkProperty(column, 'minWidth');
|
|
7
|
+
checkProperty(column, 'width');
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
function checkProperty(column, name) {
|
|
11
|
+
const value = column[name];
|
|
12
|
+
if (typeof value !== 'number' && typeof value !== 'undefined') {
|
|
13
|
+
warnOnce('Table', `resizableColumns feature requires ${name} property to be a number, got ${value}. The component may work incorrectly.`);
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
//# sourceMappingURL=column-widths-utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-widths-utils.js","sourceRoot":"lib/default/","sources":["table/column-widths-utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AAGzE,MAAM,UAAU,iBAAiB,CAAC,iBAAkE;IAClG,KAAK,MAAM,MAAM,IAAI,iBAAiB,EAAE;QACtC,aAAa,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QAClC,aAAa,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;KAChC;AACH,CAAC;AAED,SAAS,aAAa,CAAC,MAAwC,EAAE,IAA0B;IACzF,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAC3B,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,WAAW,EAAE;QAC7D,QAAQ,CACN,OAAO,EACP,qCAAqC,IAAI,iCAAiC,KAAK,uCAAuC,CACvH,CAAC;KACH;AACH,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\nimport { TableProps } from './interfaces';\n\nexport function checkColumnWidths(columnDefinitions: ReadonlyArray<TableProps.ColumnDefinition<any>>) {\n for (const column of columnDefinitions) {\n checkProperty(column, 'minWidth');\n checkProperty(column, 'width');\n }\n}\n\nfunction checkProperty(column: TableProps.ColumnDefinition<any>, name: 'width' | 'minWidth') {\n const value = column[name];\n if (typeof value !== 'number' && typeof value !== 'undefined') {\n warnOnce(\n 'Table',\n `resizableColumns feature requires ${name} property to be a number, got ${value}. The component may work incorrectly.`\n );\n }\n}\n"]}
|
|
@@ -15,12 +15,12 @@ interface TableHeaderCellProps<ItemType> {
|
|
|
15
15
|
onClick(detail: TableProps.SortingState<any>): void;
|
|
16
16
|
onResizeFinish: () => void;
|
|
17
17
|
colIndex: number;
|
|
18
|
-
updateColumn: (
|
|
18
|
+
updateColumn: (columnId: PropertyKey, newWidth: number) => void;
|
|
19
19
|
onFocus?: () => void;
|
|
20
20
|
onBlur?: () => void;
|
|
21
21
|
resizableColumns?: boolean;
|
|
22
22
|
isEditable?: boolean;
|
|
23
|
-
columnId:
|
|
23
|
+
columnId: PropertyKey;
|
|
24
24
|
stickyState: StickyColumnsModel;
|
|
25
25
|
focusedComponent?: InteractiveComponent | null;
|
|
26
26
|
onFocusedComponentChange?: (element: InteractiveComponent | null) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["table/header-cell/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAK3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAuB,MAAM,uBAAuB,CAAC;AAIhF,UAAU,oBAAoB,CAAC,QAAQ;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["table/header-cell/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAK3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAuB,MAAM,uBAAuB,CAAC;AAIhF,UAAU,oBAAoB,CAAC,QAAQ;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IAC9C,mBAAmB,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC;IACpD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC;IACtB,WAAW,EAAE,kBAAkB,CAAC;IAEhC,gBAAgB,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC/C,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3E;AAED,wBAAgB,eAAe,CAAC,QAAQ,EAAE,EACxC,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,mBAAmB,EACnB,iBAAiB,EACjB,eAAe,EACf,SAAS,EACT,gBAAgB,EAChB,wBAAwB,EACxB,MAAM,EACN,OAAO,EACP,QAAQ,EACR,YAAY,EACZ,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,QAAQ,EACR,WAAW,GACZ,EAAE,oBAAoB,CAAC,QAAQ,CAAC,eA4GhC"}
|
|
@@ -71,6 +71,6 @@ export function TableHeaderCell({ className, style, tabIndex, column, activeSort
|
|
|
71
71
|
sortingStatus && (React.createElement("span", { className: styles['sorting-icon'] },
|
|
72
72
|
React.createElement(InternalIcon, { name: getSortingIconName(sortingStatus) })))),
|
|
73
73
|
resizableColumns && (React.createElement(React.Fragment, null,
|
|
74
|
-
React.createElement(Resizer, { tabIndex: tabIndex, showFocusRing: (focusedComponent === null || focusedComponent === void 0 ? void 0 : focusedComponent.type) === 'resizer' && focusedComponent.col === colIndex, onDragMove: newWidth => updateColumn(
|
|
74
|
+
React.createElement(Resizer, { tabIndex: tabIndex, showFocusRing: (focusedComponent === null || focusedComponent === void 0 ? void 0 : focusedComponent.type) === 'resizer' && focusedComponent.col === colIndex, onDragMove: newWidth => updateColumn(columnId, newWidth), onFinish: onResizeFinish, ariaLabelledby: headerId, onFocus: () => onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange({ type: 'resizer', col: colIndex }), onBlur: () => onFocusedComponentChange === null || onFocusedComponentChange === void 0 ? void 0 : onFocusedComponentChange(null), minWidth: typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth })))));
|
|
75
75
|
}
|
|
76
76
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/header-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 React from 'react';\nimport InternalIcon from '../../icon/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport { TableProps } from '../interfaces';\nimport { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';\nimport styles from './styles.css.js';\nimport { Resizer } from '../resizer';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { InteractiveComponent } from '../thead';\nimport { StickyColumnsModel, useStickyCellStyles } from '../use-sticky-columns';\nimport { getStickyClassNames } from '../utils';\nimport { useInternalI18n } from '../../internal/i18n/context';\n\ninterface TableHeaderCellProps<ItemType> {\n className?: string;\n style?: React.CSSProperties;\n tabIndex: number;\n column: TableProps.ColumnDefinition<ItemType>;\n activeSortingColumn?: TableProps.SortingColumn<ItemType>;\n sortingDescending?: boolean;\n sortingDisabled?: boolean;\n wrapLines?: boolean;\n hidden?: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (colIndex: number, newWidth: number) => void;\n onFocus?: () => void;\n onBlur?: () => void;\n resizableColumns?: boolean;\n isEditable?: boolean;\n columnId: string;\n stickyState: StickyColumnsModel;\n\n focusedComponent?: InteractiveComponent | null;\n onFocusedComponentChange?: (element: InteractiveComponent | null) => void;\n}\n\nexport function TableHeaderCell<ItemType>({\n className,\n style,\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n focusedComponent,\n onFocusedComponentChange,\n hidden,\n onClick,\n colIndex,\n updateColumn,\n resizableColumns,\n onResizeFinish,\n isEditable,\n columnId,\n stickyState,\n}: TableHeaderCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const sortable = !!column.sortingComparator || !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter || e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n\n return (\n <th\n className={clsx(\n className,\n {\n [styles['header-cell-resizable']]: !!resizableColumns,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' || sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n [styles['header-cell-hidden']]: hidden,\n },\n stickyStyles.className\n )}\n aria-sort={sortingStatus && getAriaSort(sortingStatus)}\n style={{ ...style, ...stickyStyles.style }}\n scope=\"col\"\n ref={stickyStyles.ref}\n >\n <div\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: focusedComponent?.type === 'column' && focusedComponent.col === colIndex,\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingStatus && !sortingDisabled\n ? {\n onKeyPress: handleKeyPress,\n tabIndex: tabIndex,\n role: 'button',\n onClick: handleClick,\n onFocus: () => onFocusedComponentChange?.({ type: 'column', col: colIndex }),\n onBlur: () => onFocusedComponentChange?.(null),\n }\n : {})}\n >\n <div className={clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap'])} id={headerId}>\n {column.header}\n {isEditable ? (\n <span\n className={styles['edit-icon']}\n role=\"img\"\n aria-label={i18n('columnDefinitions.editConfig.editIconAriaLabel', column.editConfig?.editIconAriaLabel)}\n >\n <InternalIcon name=\"edit\" />\n </span>\n ) : null}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns && (\n <>\n <Resizer\n tabIndex={tabIndex}\n showFocusRing={focusedComponent?.type === 'resizer' && focusedComponent.col === colIndex}\n onDragMove={newWidth => updateColumn(colIndex, newWidth)}\n onFinish={onResizeFinish}\n ariaLabelledby={headerId}\n onFocus={() => onFocusedComponentChange?.({ type: 'resizer', col: colIndex })}\n onBlur={() => onFocusedComponentChange?.(null)}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n />\n </>\n )}\n </th>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["table/header-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 React from 'react';\nimport InternalIcon from '../../icon/internal';\nimport { KeyCode } from '../../internal/keycode';\nimport { TableProps } from '../interfaces';\nimport { getAriaSort, getSortingIconName, getSortingStatus, isSorted } from './utils';\nimport styles from './styles.css.js';\nimport { Resizer } from '../resizer';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { InteractiveComponent } from '../thead';\nimport { StickyColumnsModel, useStickyCellStyles } from '../use-sticky-columns';\nimport { getStickyClassNames } from '../utils';\nimport { useInternalI18n } from '../../internal/i18n/context';\n\ninterface TableHeaderCellProps<ItemType> {\n className?: string;\n style?: React.CSSProperties;\n tabIndex: number;\n column: TableProps.ColumnDefinition<ItemType>;\n activeSortingColumn?: TableProps.SortingColumn<ItemType>;\n sortingDescending?: boolean;\n sortingDisabled?: boolean;\n wrapLines?: boolean;\n hidden?: boolean;\n onClick(detail: TableProps.SortingState<any>): void;\n onResizeFinish: () => void;\n colIndex: number;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n onFocus?: () => void;\n onBlur?: () => void;\n resizableColumns?: boolean;\n isEditable?: boolean;\n columnId: PropertyKey;\n stickyState: StickyColumnsModel;\n\n focusedComponent?: InteractiveComponent | null;\n onFocusedComponentChange?: (element: InteractiveComponent | null) => void;\n}\n\nexport function TableHeaderCell<ItemType>({\n className,\n style,\n tabIndex,\n column,\n activeSortingColumn,\n sortingDescending,\n sortingDisabled,\n wrapLines,\n focusedComponent,\n onFocusedComponentChange,\n hidden,\n onClick,\n colIndex,\n updateColumn,\n resizableColumns,\n onResizeFinish,\n isEditable,\n columnId,\n stickyState,\n}: TableHeaderCellProps<ItemType>) {\n const i18n = useInternalI18n('table');\n const sortable = !!column.sortingComparator || !!column.sortingField;\n const sorted = !!activeSortingColumn && isSorted(column, activeSortingColumn);\n const sortingStatus = getSortingStatus(sortable, sorted, !!sortingDescending, !!sortingDisabled);\n const handleClick = () =>\n onClick({\n sortingColumn: column,\n isDescending: sorted ? !sortingDescending : false,\n });\n\n // Elements with role=\"button\" do not have the default behavior of <button>, where pressing\n // Enter or Space will trigger a click event. Therefore we need to add this ourselves.\n // The native <button> element cannot be used due to a misaligned implementation in Firefox:\n // https://bugzilla.mozilla.org/show_bug.cgi?id=843003\n const handleKeyPress = ({ nativeEvent: e }: React.KeyboardEvent) => {\n if (e.keyCode === KeyCode.enter || e.keyCode === KeyCode.space) {\n e.preventDefault();\n handleClick();\n }\n };\n\n const headerId = useUniqueId('table-header-');\n\n const stickyStyles = useStickyCellStyles({\n stickyColumns: stickyState,\n columnId,\n getClassName: props => getStickyClassNames(styles, props),\n });\n\n return (\n <th\n className={clsx(\n className,\n {\n [styles['header-cell-resizable']]: !!resizableColumns,\n [styles['header-cell-sortable']]: sortingStatus,\n [styles['header-cell-sorted']]: sortingStatus === 'ascending' || sortingStatus === 'descending',\n [styles['header-cell-disabled']]: sortingDisabled,\n [styles['header-cell-ascending']]: sortingStatus === 'ascending',\n [styles['header-cell-descending']]: sortingStatus === 'descending',\n [styles['header-cell-hidden']]: hidden,\n },\n stickyStyles.className\n )}\n aria-sort={sortingStatus && getAriaSort(sortingStatus)}\n style={{ ...style, ...stickyStyles.style }}\n scope=\"col\"\n ref={stickyStyles.ref}\n >\n <div\n className={clsx(styles['header-cell-content'], {\n [styles['header-cell-fake-focus']]: focusedComponent?.type === 'column' && focusedComponent.col === colIndex,\n })}\n aria-label={\n column.ariaLabel\n ? column.ariaLabel({\n sorted: sorted,\n descending: sorted && !!sortingDescending,\n disabled: !!sortingDisabled,\n })\n : undefined\n }\n {...(sortingStatus && !sortingDisabled\n ? {\n onKeyPress: handleKeyPress,\n tabIndex: tabIndex,\n role: 'button',\n onClick: handleClick,\n onFocus: () => onFocusedComponentChange?.({ type: 'column', col: colIndex }),\n onBlur: () => onFocusedComponentChange?.(null),\n }\n : {})}\n >\n <div className={clsx(styles['header-cell-text'], wrapLines && styles['header-cell-text-wrap'])} id={headerId}>\n {column.header}\n {isEditable ? (\n <span\n className={styles['edit-icon']}\n role=\"img\"\n aria-label={i18n('columnDefinitions.editConfig.editIconAriaLabel', column.editConfig?.editIconAriaLabel)}\n >\n <InternalIcon name=\"edit\" />\n </span>\n ) : null}\n </div>\n {sortingStatus && (\n <span className={styles['sorting-icon']}>\n <InternalIcon name={getSortingIconName(sortingStatus)} />\n </span>\n )}\n </div>\n {resizableColumns && (\n <>\n <Resizer\n tabIndex={tabIndex}\n showFocusRing={focusedComponent?.type === 'resizer' && focusedComponent.col === colIndex}\n onDragMove={newWidth => updateColumn(columnId, newWidth)}\n onFinish={onResizeFinish}\n ariaLabelledby={headerId}\n onFocus={() => onFocusedComponentChange?.({ type: 'resizer', col: colIndex })}\n onBlur={() => onFocusedComponentChange?.(null)}\n minWidth={typeof column.minWidth === 'string' ? parseInt(column.minWidth) : column.minWidth}\n />\n </>\n )}\n </th>\n );\n}\n"]}
|
package/table/internal.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["table/internal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAc,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["table/internal.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAc,MAAM,cAAc,CAAC;AAwC/D,QAAA,MAAM,aAAa,qBAibK,CAAC;AAEzB,eAAe,aAAa,CAAC"}
|
package/table/internal.js
CHANGED
|
@@ -18,7 +18,7 @@ import { useRowEvents } from './use-row-events';
|
|
|
18
18
|
import { focusMarkers, useFocusMove, useSelection } from './use-selection';
|
|
19
19
|
import { fireCancelableEvent, fireNonCancelableEvent } from '../internal/events';
|
|
20
20
|
import { isDevelopment } from '../internal/is-development';
|
|
21
|
-
import {
|
|
21
|
+
import { ColumnWidthsProvider, DEFAULT_COLUMN_WIDTH } from './use-column-widths';
|
|
22
22
|
import { useScrollSync } from '../internal/hooks/use-scroll-sync';
|
|
23
23
|
import { ResizeTracker } from './resizer';
|
|
24
24
|
import styles from './styles.css.js';
|
|
@@ -31,7 +31,10 @@ import { useDynamicOverlap } from '../internal/hooks/use-dynamic-overlap';
|
|
|
31
31
|
import LiveRegion from '../internal/components/live-region';
|
|
32
32
|
import useTableFocusNavigation from './use-table-focus-navigation';
|
|
33
33
|
import { TableTdElement } from './body-cell/td-element';
|
|
34
|
-
import { useStickyColumns
|
|
34
|
+
import { useStickyColumns } from './use-sticky-columns';
|
|
35
|
+
import { checkColumnWidths } from './column-widths-utils';
|
|
36
|
+
const SELECTION_COLUMN_WIDTH = 54;
|
|
37
|
+
const selectionColumnId = Symbol('selection-column-id');
|
|
35
38
|
const InternalTable = React.forwardRef((_a, ref) => {
|
|
36
39
|
var _b, _c, _d;
|
|
37
40
|
var { header, footer, empty, filter, pagination, preferences, items, columnDefinitions, trackBy, loading, loadingText, selectionType, selectedItems, isItemDisabled, ariaLabels, onSelectionChange, onSortingChange, sortingColumn, sortingDescending, sortingDisabled, visibleColumns, stickyHeader, stickyHeaderVerticalOffset, onRowClick, onRowContextMenu, wrapLines, stripedRows, contentDensity, submitEdit, onEditCancel, resizableColumns, onColumnWidthsChange, variant, __internalRootRef, totalItemsCount, firstIndex, renderAriaLive, stickyColumns, columnDisplay } = _a, rest = __rest(_a, ["header", "footer", "empty", "filter", "pagination", "preferences", "items", "columnDefinitions", "trackBy", "loading", "loadingText", "selectionType", "selectedItems", "isItemDisabled", "ariaLabels", "onSelectionChange", "onSortingChange", "sortingColumn", "sortingDescending", "sortingDisabled", "visibleColumns", "stickyHeader", "stickyHeaderVerticalOffset", "onRowClick", "onRowContextMenu", "wrapLines", "stripedRows", "contentDensity", "submitEdit", "onEditCancel", "resizableColumns", "onColumnWidthsChange", "variant", "__internalRootRef", "totalItemsCount", "firstIndex", "renderAriaLive", "stickyColumns", "columnDisplay"]);
|
|
@@ -91,11 +94,12 @@ const InternalTable = React.forwardRef((_a, ref) => {
|
|
|
91
94
|
const hasSelection = !!selectionType;
|
|
92
95
|
const hasFooter = !!footer;
|
|
93
96
|
const visibleColumnsWithSelection = useMemo(() => {
|
|
94
|
-
const
|
|
95
|
-
return hasSelection ? [selectionColumnId
|
|
97
|
+
const visible = visibleColumnDefinitions.map((column, columnIndex) => (Object.assign(Object.assign({}, column), { id: getColumnKey(column, columnIndex) })));
|
|
98
|
+
return hasSelection ? [{ id: selectionColumnId, width: SELECTION_COLUMN_WIDTH }, ...visible] : visible;
|
|
96
99
|
}, [visibleColumnDefinitions, hasSelection]);
|
|
100
|
+
const visibleColumnIdsWithSelection = useMemo(() => visibleColumnsWithSelection.map(c => c.id), [visibleColumnsWithSelection]);
|
|
97
101
|
const stickyState = useStickyColumns({
|
|
98
|
-
visibleColumns:
|
|
102
|
+
visibleColumns: visibleColumnIdsWithSelection,
|
|
99
103
|
stickyColumnsFirst: ((_b = stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.first) !== null && _b !== void 0 ? _b : 0) + ((stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.first) && hasSelection ? 1 : 0),
|
|
100
104
|
stickyColumnsLast: (stickyColumns === null || stickyColumns === void 0 ? void 0 : stickyColumns.last) || 0,
|
|
101
105
|
});
|
|
@@ -113,7 +117,7 @@ const InternalTable = React.forwardRef((_a, ref) => {
|
|
|
113
117
|
onSortingChange,
|
|
114
118
|
onFocusMove: moveFocus,
|
|
115
119
|
onResizeFinish(newWidth) {
|
|
116
|
-
const widthsDetail = columnDefinitions.map((column, index) => newWidth[getColumnKey(column, index)] || column.width ||
|
|
120
|
+
const widthsDetail = columnDefinitions.map((column, index) => newWidth[getColumnKey(column, index)] || column.width || DEFAULT_COLUMN_WIDTH);
|
|
117
121
|
const widthsChanged = widthsDetail.some((width, index) => columnDefinitions[index].width !== width);
|
|
118
122
|
if (widthsChanged) {
|
|
119
123
|
fireNonCancelableEvent(onColumnWidthsChange, { widths: widthsDetail });
|
|
@@ -122,6 +126,7 @@ const InternalTable = React.forwardRef((_a, ref) => {
|
|
|
122
126
|
singleSelectionHeaderAriaLabel: ariaLabels === null || ariaLabels === void 0 ? void 0 : ariaLabels.selectionGroupLabel,
|
|
123
127
|
stripedRows,
|
|
124
128
|
stickyState,
|
|
129
|
+
selectionColumnId,
|
|
125
130
|
};
|
|
126
131
|
const wrapperRef = useMergeRefs(wrapperMeasureRef, wrapperRefObject, stickyState.refs.wrapper);
|
|
127
132
|
const tableRef = useMergeRefs(tableMeasureRef, tableRefObject, stickyState.refs.table);
|
|
@@ -151,7 +156,7 @@ const InternalTable = React.forwardRef((_a, ref) => {
|
|
|
151
156
|
const toolsHeaderWrapper = useRef(null);
|
|
152
157
|
// If is mobile, we take into consideration the AppLayout's mobile bar and we subtract the tools wrapper height so only the table header is sticky
|
|
153
158
|
const toolsHeaderHeight = (_d = (_c = toolsHeaderWrapper === null || toolsHeaderWrapper === void 0 ? void 0 : toolsHeaderWrapper.current) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().height) !== null && _d !== void 0 ? _d : 0;
|
|
154
|
-
return (React.createElement(ColumnWidthsProvider, { tableRef: tableRefObject,
|
|
159
|
+
return (React.createElement(ColumnWidthsProvider, { tableRef: tableRefObject, visibleColumns: visibleColumnsWithSelection, resizableColumns: resizableColumns },
|
|
155
160
|
React.createElement(InternalContainer, Object.assign({}, baseProps, { __internalRootRef: __internalRootRef, className: clsx(baseProps.className, styles.root), header: React.createElement(React.Fragment, null,
|
|
156
161
|
hasHeader && (React.createElement("div", { ref: overlapElement, className: clsx(hasDynamicHeight && [styles['dark-header'], 'awsui-context-content-header']) },
|
|
157
162
|
React.createElement("div", { ref: toolsHeaderWrapper, className: clsx(styles['header-controls'], styles[`variant-${computedVariant}`]) },
|
|
@@ -190,7 +195,7 @@ const InternalTable = React.forwardRef((_a, ref) => {
|
|
|
190
195
|
(_a = stickyHeaderRef.current) === null || _a === void 0 ? void 0 : _a.scrollToRow(currentTarget);
|
|
191
196
|
}
|
|
192
197
|
} }, focusMarkers.item, { onClick: onRowClickHandler && onRowClickHandler.bind(null, rowIndex, item), onContextMenu: onRowContextMenuHandler && onRowContextMenuHandler.bind(null, rowIndex, item), "aria-rowindex": firstIndex ? firstIndex + rowIndex + 1 : undefined }),
|
|
193
|
-
selectionType !== undefined && (React.createElement(TableTdElement, { className: clsx(styles['selection-control']), isVisualRefresh: isVisualRefresh, isFirstRow: firstVisible, isLastRow: lastVisible, isSelected: isSelected, isNextSelected: isNextSelected, isPrevSelected: isPrevSelected, wrapLines: false, isEvenRow: isEven, stripedRows: stripedRows, hasSelection: hasSelection, hasFooter: hasFooter, stickyState: stickyState, columnId: selectionColumnId
|
|
198
|
+
selectionType !== undefined && (React.createElement(TableTdElement, { className: clsx(styles['selection-control']), isVisualRefresh: isVisualRefresh, isFirstRow: firstVisible, isLastRow: lastVisible, isSelected: isSelected, isNextSelected: isNextSelected, isPrevSelected: isPrevSelected, wrapLines: false, isEvenRow: isEven, stripedRows: stripedRows, hasSelection: hasSelection, hasFooter: hasFooter, stickyState: stickyState, columnId: selectionColumnId },
|
|
194
199
|
React.createElement(SelectionControl, Object.assign({ onFocusDown: moveFocusDown, onFocusUp: moveFocusUp, onShiftToggle: updateShiftToggle }, getItemSelectionProps(item))))),
|
|
195
200
|
visibleColumnDefinitions.map((column, colIndex) => {
|
|
196
201
|
var _a;
|
|
@@ -216,7 +221,7 @@ const InternalTable = React.forwardRef((_a, ref) => {
|
|
|
216
221
|
setLastSuccessfulEditCell([rowIndex, colIndex]);
|
|
217
222
|
}
|
|
218
223
|
}
|
|
219
|
-
}, submitEdit: wrapWithInlineLoadingState(submitEdit), hasFooter: hasFooter, stripedRows: stripedRows, isEvenRow: isEven, columnId: (_a = column.id) !== null && _a !== void 0 ? _a : colIndex
|
|
224
|
+
}, submitEdit: wrapWithInlineLoadingState(submitEdit), hasFooter: hasFooter, stripedRows: stripedRows, isEvenRow: isEven, columnId: (_a = column.id) !== null && _a !== void 0 ? _a : colIndex, stickyState: stickyState, isVisualRefresh: isVisualRefresh }));
|
|
220
225
|
})));
|
|
221
226
|
})))),
|
|
222
227
|
resizableColumns && React.createElement(ResizeTracker, null)),
|