@cloudscape-design/components 3.0.722 → 3.0.723

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.
@@ -1,17 +1,18 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "universal-toolbar": "awsui_universal-toolbar_1kzri_1v9zp_141",
5
- "disable-body-scroll": "awsui_disable-body-scroll_1kzri_1v9zp_162",
6
- "toolbar-hidden": "awsui_toolbar-hidden_1kzri_1v9zp_165",
7
- "toolbar-container": "awsui_toolbar-container_1kzri_1v9zp_168",
8
- "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_1v9zp_177",
9
- "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_1v9zp_181",
10
- "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_1v9zp_186",
11
- "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_1v9zp_193",
12
- "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_1v9zp_237",
13
- "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_1v9zp_244",
14
- "has-open-drawer": "awsui_has-open-drawer_1kzri_1v9zp_244",
15
- "drawers-trigger": "awsui_drawers-trigger_1kzri_1v9zp_237"
4
+ "universal-toolbar": "awsui_universal-toolbar_1kzri_9v5ww_141",
5
+ "disable-body-scroll": "awsui_disable-body-scroll_1kzri_9v5ww_163",
6
+ "toolbar-hidden": "awsui_toolbar-hidden_1kzri_9v5ww_166",
7
+ "toolbar-container": "awsui_toolbar-container_1kzri_9v5ww_169",
8
+ "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_9v5ww_178",
9
+ "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_9v5ww_182",
10
+ "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_9v5ww_187",
11
+ "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_9v5ww_195",
12
+ "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_9v5ww_196",
13
+ "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_9v5ww_242",
14
+ "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_9v5ww_250",
15
+ "has-open-drawer": "awsui_has-open-drawer_1kzri_9v5ww_250",
16
+ "drawers-trigger": "awsui_drawers-trigger_1kzri_9v5ww_242"
16
17
  };
17
18
 
@@ -138,34 +138,35 @@
138
138
  */
139
139
  /* Style used for links in slots/components that are text heavy, to help links stand out among
140
140
  surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
141
- .awsui_universal-toolbar_1kzri_1v9zp_141:not(#\9) {
141
+ .awsui_universal-toolbar_1kzri_9v5ww_141:not(#\9) {
142
142
  background-color: var(--color-background-layout-panel-content-t82vgh, #ffffff);
143
143
  border-block-end: 1px solid var(--color-border-divider-panel-bottom-dwyqvg, #b6bec9);
144
144
  box-sizing: border-box;
145
145
  padding-block: 0;
146
146
  padding-inline: var(--space-m-udix3p, 16px);
147
+ padding-inline-end: 0;
147
148
  position: sticky;
148
149
  z-index: 840;
149
150
  transition: ease var(--motion-duration-refresh-only-slow-zbvbxt, 250ms);
150
151
  transition-property: inset-block-start, opacity;
151
152
  }
152
153
  @media (prefers-reduced-motion: reduce) {
153
- .awsui_universal-toolbar_1kzri_1v9zp_141:not(#\9) {
154
+ .awsui_universal-toolbar_1kzri_9v5ww_141:not(#\9) {
154
155
  animation: none;
155
156
  transition: none;
156
157
  }
157
158
  }
158
- .awsui-motion-disabled .awsui_universal-toolbar_1kzri_1v9zp_141:not(#\9), .awsui-mode-entering .awsui_universal-toolbar_1kzri_1v9zp_141:not(#\9) {
159
+ .awsui-motion-disabled .awsui_universal-toolbar_1kzri_9v5ww_141:not(#\9), .awsui-mode-entering .awsui_universal-toolbar_1kzri_9v5ww_141:not(#\9) {
159
160
  animation: none;
160
161
  transition: none;
161
162
  }
162
- .awsui_universal-toolbar_1kzri_1v9zp_141.awsui_disable-body-scroll_1kzri_1v9zp_162:not(#\9) {
163
+ .awsui_universal-toolbar_1kzri_9v5ww_141.awsui_disable-body-scroll_1kzri_9v5ww_163:not(#\9) {
163
164
  inset-block-start: 0px;
164
165
  }
165
- .awsui_universal-toolbar_1kzri_1v9zp_141.awsui_toolbar-hidden_1kzri_1v9zp_165:not(#\9) {
166
+ .awsui_universal-toolbar_1kzri_9v5ww_141.awsui_toolbar-hidden_1kzri_9v5ww_166:not(#\9) {
166
167
  opacity: 0;
167
168
  }
168
- .awsui_universal-toolbar_1kzri_1v9zp_141 > .awsui_toolbar-container_1kzri_1v9zp_168:not(#\9) {
169
+ .awsui_universal-toolbar_1kzri_9v5ww_141 > .awsui_toolbar-container_1kzri_9v5ww_169:not(#\9) {
169
170
  block-size: 48px;
170
171
  align-items: center;
171
172
  display: grid;
@@ -174,23 +175,25 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
174
175
  grid-template-columns: min-content auto minmax(140px, 1fr);
175
176
  grid-template-rows: 1fr;
176
177
  }
177
- .awsui_universal-toolbar_1kzri_1v9zp_141 > .awsui_toolbar-container_1kzri_1v9zp_168 > .awsui_universal-toolbar-nav_1kzri_1v9zp_177:not(#\9) {
178
+ .awsui_universal-toolbar_1kzri_9v5ww_141 > .awsui_toolbar-container_1kzri_9v5ww_169 > .awsui_universal-toolbar-nav_1kzri_9v5ww_178:not(#\9) {
178
179
  grid-column: 1;
179
180
  padding-inline-end: var(--space-static-xxs-82cdfi, 4px);
180
181
  }
181
- .awsui_universal-toolbar_1kzri_1v9zp_141 > .awsui_toolbar-container_1kzri_1v9zp_168 > .awsui_universal-toolbar-breadcrumbs_1kzri_1v9zp_181:not(#\9) {
182
+ .awsui_universal-toolbar_1kzri_9v5ww_141 > .awsui_toolbar-container_1kzri_9v5ww_169 > .awsui_universal-toolbar-breadcrumbs_1kzri_9v5ww_182:not(#\9) {
182
183
  grid-column: 2;
183
184
  background-color: transparent;
184
185
  flex: 1 0;
185
186
  }
186
- .awsui_universal-toolbar_1kzri_1v9zp_141 > .awsui_toolbar-container_1kzri_1v9zp_168 > .awsui_universal-toolbar-drawers_1kzri_1v9zp_186:not(#\9) {
187
+ .awsui_universal-toolbar_1kzri_9v5ww_141 > .awsui_toolbar-container_1kzri_9v5ww_169 > .awsui_universal-toolbar-drawers_1kzri_9v5ww_187:not(#\9) {
187
188
  grid-column: 3;
188
189
  column-gap: var(--space-static-xs-7sfb63, 8px);
189
190
  display: flex;
190
191
  justify-content: flex-end;
192
+ block-size: 100%;
191
193
  }
192
194
 
193
- .awsui_drawers-desktop-triggers-container_1kzri_1v9zp_193:not(#\9) {
195
+ .awsui_drawers-desktop-triggers-container_1kzri_9v5ww_195:not(#\9),
196
+ .awsui_drawers-mobile-triggers-container_1kzri_9v5ww_196:not(#\9) {
194
197
  border-collapse: separate;
195
198
  border-spacing: 0;
196
199
  box-sizing: border-box;
@@ -225,6 +228,8 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
225
228
  -webkit-font-smoothing: auto;
226
229
  -moz-osx-font-smoothing: auto;
227
230
  background-color: transparent;
231
+ padding-inline: 0;
232
+ padding-inline-end: var(--space-m-udix3p, 16px);
228
233
  box-sizing: border-box;
229
234
  overflow-y: hidden;
230
235
  overflow-x: hidden;
@@ -235,22 +240,23 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
235
240
  inline-size: 100%;
236
241
  }
237
242
 
238
- .awsui_drawers-trigger-content_1kzri_1v9zp_237:not(#\9) {
243
+ .awsui_drawers-trigger-content_1kzri_9v5ww_242:not(#\9) {
244
+ block-size: 100%;
239
245
  align-items: center;
240
246
  display: flex;
241
247
  flex-direction: row;
242
248
  gap: var(--space-xs-zb16t3, 8px);
243
249
  justify-content: flex-end;
244
250
  }
245
- .awsui_drawers-trigger-content_1kzri_1v9zp_237:not(#\9):not(.awsui_has-multiple-triggers_1kzri_1v9zp_244).awsui_has-open-drawer_1kzri_1v9zp_244 {
251
+ .awsui_drawers-trigger-content_1kzri_9v5ww_242:not(#\9):not(.awsui_has-multiple-triggers_1kzri_9v5ww_250).awsui_has-open-drawer_1kzri_9v5ww_250 {
246
252
  opacity: 0;
247
253
  }
248
- .awsui_drawers-trigger-content_1kzri_1v9zp_237:not(#\9):not(.awsui_has-multiple-triggers_1kzri_1v9zp_244):not(.awsui_has-open-drawer_1kzri_1v9zp_244) {
254
+ .awsui_drawers-trigger-content_1kzri_9v5ww_242:not(#\9):not(.awsui_has-multiple-triggers_1kzri_9v5ww_250):not(.awsui_has-open-drawer_1kzri_9v5ww_250) {
249
255
  opacity: 1;
250
256
  }
251
257
 
252
258
  @media (max-width: 688px) {
253
- .awsui_drawers-trigger_1kzri_1v9zp_237:not(#\9) {
259
+ .awsui_drawers-trigger_1kzri_9v5ww_242:not(#\9) {
254
260
  display: flex;
255
261
  justify-content: center;
256
262
  align-items: center;
@@ -2,17 +2,18 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "universal-toolbar": "awsui_universal-toolbar_1kzri_1v9zp_141",
6
- "disable-body-scroll": "awsui_disable-body-scroll_1kzri_1v9zp_162",
7
- "toolbar-hidden": "awsui_toolbar-hidden_1kzri_1v9zp_165",
8
- "toolbar-container": "awsui_toolbar-container_1kzri_1v9zp_168",
9
- "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_1v9zp_177",
10
- "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_1v9zp_181",
11
- "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_1v9zp_186",
12
- "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_1v9zp_193",
13
- "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_1v9zp_237",
14
- "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_1v9zp_244",
15
- "has-open-drawer": "awsui_has-open-drawer_1kzri_1v9zp_244",
16
- "drawers-trigger": "awsui_drawers-trigger_1kzri_1v9zp_237"
5
+ "universal-toolbar": "awsui_universal-toolbar_1kzri_9v5ww_141",
6
+ "disable-body-scroll": "awsui_disable-body-scroll_1kzri_9v5ww_163",
7
+ "toolbar-hidden": "awsui_toolbar-hidden_1kzri_9v5ww_166",
8
+ "toolbar-container": "awsui_toolbar-container_1kzri_9v5ww_169",
9
+ "universal-toolbar-nav": "awsui_universal-toolbar-nav_1kzri_9v5ww_178",
10
+ "universal-toolbar-breadcrumbs": "awsui_universal-toolbar-breadcrumbs_1kzri_9v5ww_182",
11
+ "universal-toolbar-drawers": "awsui_universal-toolbar-drawers_1kzri_9v5ww_187",
12
+ "drawers-desktop-triggers-container": "awsui_drawers-desktop-triggers-container_1kzri_9v5ww_195",
13
+ "drawers-mobile-triggers-container": "awsui_drawers-mobile-triggers-container_1kzri_9v5ww_196",
14
+ "drawers-trigger-content": "awsui_drawers-trigger-content_1kzri_9v5ww_242",
15
+ "has-multiple-triggers": "awsui_has-multiple-triggers_1kzri_9v5ww_250",
16
+ "has-open-drawer": "awsui_has-open-drawer_1kzri_9v5ww_250",
17
+ "drawers-trigger": "awsui_drawers-trigger_1kzri_9v5ww_242"
17
18
  };
18
19
 
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":";AAmBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAgB1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EAEvB,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,eAAe,EACf,GAAG,IAAI,EACR,EAAE,0BAA0B,eAyK5B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":";AAoBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,cAAc,CAAC;AAgB1D,OAAO,EAAE,0BAA0B,EAAE,CAAC;AAItC,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAAC,EAC5C,KAAK,EACL,YAAY,EACZ,WAAW,EACX,QAAgB,EAChB,SAAS,EACT,QAAQ,EACR,wBAAwB,EACxB,wBAAwB,EACxB,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,wBAAwB,EACxB,uBAAuB,EAEvB,WAAW,EACX,gBAAgB,EAChB,YAAY,EACZ,eAAe,EACf,GAAG,IAAI,EACR,EAAE,0BAA0B,eAoL5B"}
@@ -1,13 +1,14 @@
1
1
  import { __rest } from "tslib";
2
2
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
3
3
  // SPDX-License-Identifier: Apache-2.0
4
- import React, { useEffect, useRef, useState } from 'react';
4
+ import React, { useContext, useEffect, useRef, useState } from 'react';
5
5
  import clsx from 'clsx';
6
6
  import { warnOnce } from '@cloudscape-design/component-toolkit/internal';
7
7
  import InternalBox from '../box/internal';
8
8
  import { InternalButton } from '../button/internal';
9
9
  import { useInternalI18n } from '../i18n/context';
10
10
  import { getBaseProps } from '../internal/base-component';
11
+ import { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';
11
12
  import { fireNonCancelableEvent } from '../internal/events';
12
13
  import checkControlled from '../internal/hooks/check-controlled';
13
14
  import useBaseComponent from '../internal/hooks/use-base-component';
@@ -21,7 +22,11 @@ import styles from './styles.css.js';
21
22
  const componentName = 'CollectionPreferences';
22
23
  export default function CollectionPreferences(_a) {
23
24
  var { title, confirmLabel, cancelLabel, disabled = false, onConfirm, onCancel, visibleContentPreference, contentDisplayPreference, pageSizePreference, wrapLinesPreference, stripedRowsPreference, contentDensityPreference, stickyColumnsPreference, preferences, customPreference, getModalRoot, removeModalRoot } = _a, rest = __rest(_a, ["title", "confirmLabel", "cancelLabel", "disabled", "onConfirm", "onCancel", "visibleContentPreference", "contentDisplayPreference", "pageSizePreference", "wrapLinesPreference", "stripedRowsPreference", "contentDensityPreference", "stickyColumnsPreference", "preferences", "customPreference", "getModalRoot", "removeModalRoot"]);
24
- const { __internalRootRef } = useBaseComponent('CollectionPreferences');
25
+ const parentMetadata = useContext(CollectionPreferencesMetadata);
26
+ const { __internalRootRef } = useBaseComponent('CollectionPreferences', {
27
+ props: {},
28
+ metadata: Object.assign(Object.assign({}, parentMetadata), { hasStripedRowsPreference: !!stripedRowsPreference, hasVisibleContentPreference: !!visibleContentPreference, hasContentDisplayPreference: !!contentDisplayPreference, hasContentDensityPreference: !!contentDensityPreference, hasStickyColumnsPreference: !!stickyColumnsPreference }),
29
+ });
25
30
  checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);
26
31
  const i18n = useInternalI18n('collection-preferences');
27
32
  const baseProps = getBaseProps(rest);
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalModal from '../modal/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport ContentDisplayPreference from './content-display';\nimport { CollectionPreferencesProps } from './interfaces';\nimport {\n ContentDensityPreference,\n copyPreferences,\n CustomPreference,\n mergePreferences,\n ModalContentLayout,\n PageSizePreference,\n StickyColumnsPreference,\n StripedRowsPreference,\n WrapLinesPreference,\n} from './utils';\nimport VisibleContentPreference from './visible-content';\n\nimport styles from './styles.css.js';\n\nexport { CollectionPreferencesProps };\n\nconst componentName = 'CollectionPreferences';\n\nexport default function CollectionPreferences({\n title,\n confirmLabel,\n cancelLabel,\n disabled = false,\n onConfirm,\n onCancel,\n visibleContentPreference,\n contentDisplayPreference,\n pageSizePreference,\n wrapLinesPreference,\n stripedRowsPreference,\n contentDensityPreference,\n stickyColumnsPreference,\n\n preferences,\n customPreference,\n getModalRoot,\n removeModalRoot,\n ...rest\n}: CollectionPreferencesProps) {\n const { __internalRootRef } = useBaseComponent('CollectionPreferences');\n checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);\n\n const i18n = useInternalI18n('collection-preferences');\n const baseProps = getBaseProps(rest);\n const [modalVisible, setModalVisible] = useState(false);\n const [temporaryPreferences, setTemporaryPreferences] = useState(copyPreferences(preferences || {}));\n const triggerRef = useRef<ButtonProps.Ref>(null);\n const dialogPreviouslyOpen = useRef(false);\n\n useEffect(() => {\n if (!modalVisible) {\n dialogPreviouslyOpen.current && triggerRef.current && triggerRef.current.focus();\n } else {\n dialogPreviouslyOpen.current = true;\n }\n }, [modalVisible]);\n\n const onConfirmListener = () => {\n setModalVisible(false);\n fireNonCancelableEvent(onConfirm, temporaryPreferences);\n };\n\n const onCancelListener = () => {\n fireNonCancelableEvent(onCancel, {});\n setModalVisible(false);\n setTemporaryPreferences(copyPreferences(preferences || {}));\n };\n\n const hasContentOnTheLeft = !!(\n pageSizePreference ||\n wrapLinesPreference ||\n stripedRowsPreference ||\n contentDensityPreference ||\n stickyColumnsPreference ||\n customPreference\n );\n const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);\n\n const onChange = (changedPreferences: CollectionPreferencesProps.Preferences) =>\n setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));\n\n if (visibleContentPreference && contentDisplayPreference) {\n warnOnce(\n componentName,\n 'You provided both `visibleContentPreference` and `contentDisplayPreference` props. `visibleContentPreference` will be ignored and only `contentDisplayPreference` will be rendered.'\n );\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n <InternalButton\n ref={triggerRef}\n className={styles['trigger-button']}\n disabled={disabled}\n ariaLabel={i18n('title', title)}\n onClick={() => {\n setTemporaryPreferences(copyPreferences(preferences || {}));\n setModalVisible(true);\n }}\n variant=\"icon\"\n iconName=\"settings\"\n formAction=\"none\"\n />\n {!disabled && modalVisible && (\n <InternalModal\n className={styles['modal-root']}\n visible={true}\n getModalRoot={getModalRoot}\n removeModalRoot={removeModalRoot}\n header={i18n('title', title)}\n footer={\n <InternalBox float=\"right\">\n <InternalSpaceBetween direction=\"horizontal\" size=\"xs\">\n <InternalButton\n className={styles['cancel-button']}\n variant=\"link\"\n formAction=\"none\"\n onClick={onCancelListener}\n >\n {i18n('cancelLabel', cancelLabel)}\n </InternalButton>\n <InternalButton\n className={styles['confirm-button']}\n variant=\"primary\"\n formAction=\"none\"\n onClick={onConfirmListener}\n >\n {i18n('confirmLabel', confirmLabel)}\n </InternalButton>\n </InternalSpaceBetween>\n </InternalBox>\n }\n closeAriaLabel={cancelLabel}\n size={hasContentOnTheLeft && hasContentOnTheRight ? 'large' : 'medium'}\n onDismiss={onCancelListener}\n >\n <ModalContentLayout\n left={\n hasContentOnTheLeft && (\n <InternalSpaceBetween size=\"l\">\n {pageSizePreference && (\n <PageSizePreference\n value={temporaryPreferences.pageSize}\n {...pageSizePreference}\n onChange={pageSize => onChange({ pageSize })}\n />\n )}\n {wrapLinesPreference && (\n <WrapLinesPreference\n value={temporaryPreferences.wrapLines}\n {...wrapLinesPreference}\n onChange={wrapLines => onChange({ wrapLines })}\n />\n )}\n {stripedRowsPreference && (\n <StripedRowsPreference\n value={temporaryPreferences.stripedRows}\n {...stripedRowsPreference}\n onChange={stripedRows => onChange({ stripedRows })}\n />\n )}\n {contentDensityPreference && (\n <ContentDensityPreference\n value={temporaryPreferences.contentDensity}\n {...contentDensityPreference}\n onChange={contentDensity => onChange({ contentDensity })}\n />\n )}\n {stickyColumnsPreference && (\n <StickyColumnsPreference\n value={temporaryPreferences.stickyColumns}\n {...stickyColumnsPreference}\n onChange={stickyColumns => onChange({ stickyColumns })}\n />\n )}\n {customPreference && (\n <CustomPreference\n value={temporaryPreferences.custom}\n customPreference={customPreference}\n onChange={custom => onChange({ custom })}\n />\n )}\n </InternalSpaceBetween>\n )\n }\n right={\n contentDisplayPreference ? (\n <ContentDisplayPreference\n {...contentDisplayPreference}\n value={temporaryPreferences.contentDisplay}\n onChange={contentDisplay => onChange({ contentDisplay })}\n />\n ) : (\n visibleContentPreference && (\n <VisibleContentPreference\n value={temporaryPreferences.visibleContent}\n {...visibleContentPreference}\n onChange={visibleItems => onChange({ visibleContent: visibleItems })}\n />\n )\n )\n }\n />\n </InternalModal>\n )}\n </div>\n );\n}\n\napplyDisplayName(CollectionPreferences, componentName);\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/collection-preferences/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext, useEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { warnOnce } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalBox from '../box/internal';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalModal from '../modal/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport ContentDisplayPreference from './content-display';\nimport { CollectionPreferencesProps } from './interfaces';\nimport {\n ContentDensityPreference,\n copyPreferences,\n CustomPreference,\n mergePreferences,\n ModalContentLayout,\n PageSizePreference,\n StickyColumnsPreference,\n StripedRowsPreference,\n WrapLinesPreference,\n} from './utils';\nimport VisibleContentPreference from './visible-content';\n\nimport styles from './styles.css.js';\n\nexport { CollectionPreferencesProps };\n\nconst componentName = 'CollectionPreferences';\n\nexport default function CollectionPreferences({\n title,\n confirmLabel,\n cancelLabel,\n disabled = false,\n onConfirm,\n onCancel,\n visibleContentPreference,\n contentDisplayPreference,\n pageSizePreference,\n wrapLinesPreference,\n stripedRowsPreference,\n contentDensityPreference,\n stickyColumnsPreference,\n\n preferences,\n customPreference,\n getModalRoot,\n removeModalRoot,\n ...rest\n}: CollectionPreferencesProps) {\n const parentMetadata = useContext(CollectionPreferencesMetadata);\n const { __internalRootRef } = useBaseComponent('CollectionPreferences', {\n props: {},\n metadata: {\n ...parentMetadata,\n hasStripedRowsPreference: !!stripedRowsPreference,\n hasVisibleContentPreference: !!visibleContentPreference,\n hasContentDisplayPreference: !!contentDisplayPreference,\n hasContentDensityPreference: !!contentDensityPreference,\n hasStickyColumnsPreference: !!stickyColumnsPreference,\n },\n });\n checkControlled('CollectionPreferences', 'preferences', preferences, 'onConfirm', onConfirm);\n\n const i18n = useInternalI18n('collection-preferences');\n const baseProps = getBaseProps(rest);\n const [modalVisible, setModalVisible] = useState(false);\n const [temporaryPreferences, setTemporaryPreferences] = useState(copyPreferences(preferences || {}));\n const triggerRef = useRef<ButtonProps.Ref>(null);\n const dialogPreviouslyOpen = useRef(false);\n\n useEffect(() => {\n if (!modalVisible) {\n dialogPreviouslyOpen.current && triggerRef.current && triggerRef.current.focus();\n } else {\n dialogPreviouslyOpen.current = true;\n }\n }, [modalVisible]);\n\n const onConfirmListener = () => {\n setModalVisible(false);\n fireNonCancelableEvent(onConfirm, temporaryPreferences);\n };\n\n const onCancelListener = () => {\n fireNonCancelableEvent(onCancel, {});\n setModalVisible(false);\n setTemporaryPreferences(copyPreferences(preferences || {}));\n };\n\n const hasContentOnTheLeft = !!(\n pageSizePreference ||\n wrapLinesPreference ||\n stripedRowsPreference ||\n contentDensityPreference ||\n stickyColumnsPreference ||\n customPreference\n );\n const hasContentOnTheRight = !!(visibleContentPreference || contentDisplayPreference);\n\n const onChange = (changedPreferences: CollectionPreferencesProps.Preferences) =>\n setTemporaryPreferences(mergePreferences(changedPreferences, temporaryPreferences));\n\n if (visibleContentPreference && contentDisplayPreference) {\n warnOnce(\n componentName,\n 'You provided both `visibleContentPreference` and `contentDisplayPreference` props. `visibleContentPreference` will be ignored and only `contentDisplayPreference` will be rendered.'\n );\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root)} ref={__internalRootRef}>\n <InternalButton\n ref={triggerRef}\n className={styles['trigger-button']}\n disabled={disabled}\n ariaLabel={i18n('title', title)}\n onClick={() => {\n setTemporaryPreferences(copyPreferences(preferences || {}));\n setModalVisible(true);\n }}\n variant=\"icon\"\n iconName=\"settings\"\n formAction=\"none\"\n />\n {!disabled && modalVisible && (\n <InternalModal\n className={styles['modal-root']}\n visible={true}\n getModalRoot={getModalRoot}\n removeModalRoot={removeModalRoot}\n header={i18n('title', title)}\n footer={\n <InternalBox float=\"right\">\n <InternalSpaceBetween direction=\"horizontal\" size=\"xs\">\n <InternalButton\n className={styles['cancel-button']}\n variant=\"link\"\n formAction=\"none\"\n onClick={onCancelListener}\n >\n {i18n('cancelLabel', cancelLabel)}\n </InternalButton>\n <InternalButton\n className={styles['confirm-button']}\n variant=\"primary\"\n formAction=\"none\"\n onClick={onConfirmListener}\n >\n {i18n('confirmLabel', confirmLabel)}\n </InternalButton>\n </InternalSpaceBetween>\n </InternalBox>\n }\n closeAriaLabel={cancelLabel}\n size={hasContentOnTheLeft && hasContentOnTheRight ? 'large' : 'medium'}\n onDismiss={onCancelListener}\n >\n <ModalContentLayout\n left={\n hasContentOnTheLeft && (\n <InternalSpaceBetween size=\"l\">\n {pageSizePreference && (\n <PageSizePreference\n value={temporaryPreferences.pageSize}\n {...pageSizePreference}\n onChange={pageSize => onChange({ pageSize })}\n />\n )}\n {wrapLinesPreference && (\n <WrapLinesPreference\n value={temporaryPreferences.wrapLines}\n {...wrapLinesPreference}\n onChange={wrapLines => onChange({ wrapLines })}\n />\n )}\n {stripedRowsPreference && (\n <StripedRowsPreference\n value={temporaryPreferences.stripedRows}\n {...stripedRowsPreference}\n onChange={stripedRows => onChange({ stripedRows })}\n />\n )}\n {contentDensityPreference && (\n <ContentDensityPreference\n value={temporaryPreferences.contentDensity}\n {...contentDensityPreference}\n onChange={contentDensity => onChange({ contentDensity })}\n />\n )}\n {stickyColumnsPreference && (\n <StickyColumnsPreference\n value={temporaryPreferences.stickyColumns}\n {...stickyColumnsPreference}\n onChange={stickyColumns => onChange({ stickyColumns })}\n />\n )}\n {customPreference && (\n <CustomPreference\n value={temporaryPreferences.custom}\n customPreference={customPreference}\n onChange={custom => onChange({ custom })}\n />\n )}\n </InternalSpaceBetween>\n )\n }\n right={\n contentDisplayPreference ? (\n <ContentDisplayPreference\n {...contentDisplayPreference}\n value={temporaryPreferences.contentDisplay}\n onChange={contentDisplay => onChange({ contentDisplay })}\n />\n ) : (\n visibleContentPreference && (\n <VisibleContentPreference\n value={temporaryPreferences.visibleContent}\n {...visibleContentPreference}\n onChange={visibleItems => onChange({ visibleContent: visibleItems })}\n />\n )\n )\n }\n />\n </InternalModal>\n )}\n </div>\n );\n}\n\napplyDisplayName(CollectionPreferences, componentName);\n"]}
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ interface CollectionPreferencesMetadataInterface {
3
+ tableHasStripedRows?: boolean;
4
+ tableHasHiddenColumns?: boolean;
5
+ tableHasStickyColumns?: boolean;
6
+ tableContentDensity?: string;
7
+ }
8
+ export declare const CollectionPreferencesMetadata: import("react").Context<CollectionPreferencesMetadataInterface>;
9
+ export {};
10
+ //# sourceMappingURL=collection-preferences-metadata-context.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"collection-preferences-metadata-context.d.ts","sourceRoot":"","sources":["../../../../src/internal/context/collection-preferences-metadata-context.ts"],"names":[],"mappings":";AAIA,UAAU,sCAAsC;IAC9C,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B;AAED,eAAO,MAAM,6BAA6B,iEAA4D,CAAC"}
@@ -0,0 +1,5 @@
1
+ // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
+ // SPDX-License-Identifier: Apache-2.0
3
+ import { createContext } from 'react';
4
+ export const CollectionPreferencesMetadata = createContext({});
5
+ //# sourceMappingURL=collection-preferences-metadata-context.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"collection-preferences-metadata-context.js","sourceRoot":"","sources":["../../../../src/internal/context/collection-preferences-metadata-context.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAStC,MAAM,CAAC,MAAM,6BAA6B,GAAG,aAAa,CAAyC,EAAE,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { createContext } from 'react';\n\ninterface CollectionPreferencesMetadataInterface {\n tableHasStripedRows?: boolean;\n tableHasHiddenColumns?: boolean;\n tableHasStickyColumns?: boolean;\n tableContentDensity?: string;\n}\n\nexport const CollectionPreferencesMetadata = createContext<CollectionPreferencesMetadataInterface>({});\n"]}
@@ -1,4 +1,4 @@
1
1
  export var PACKAGE_SOURCE = "components";
2
- export var PACKAGE_VERSION = "3.0.0 (b99e6ee1)";
2
+ export var PACKAGE_VERSION = "3.0.0 (4ab91792)";
3
3
  export var THEME = "open-source-visual-refresh";
4
4
  export var ALWAYS_VISUAL_REFRESH = true;
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "PACKAGE_SOURCE": "components",
3
- "PACKAGE_VERSION": "3.0.0 (b99e6ee1)",
3
+ "PACKAGE_VERSION": "3.0.0 (4ab91792)",
4
4
  "THEME": "default",
5
5
  "ALWAYS_VISUAL_REFRESH": false
6
6
  }
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "b99e6ee1bafb94d1edc073cf73d54e7ce54a3fed"
2
+ "commit": "4ab91792f59d740644dd868d4678fe9ea1ee1bfb"
3
3
  }
package/package.json CHANGED
@@ -126,7 +126,7 @@
126
126
  "./internal/base-component/index.js",
127
127
  "./internal/base-component/styles.css.js"
128
128
  ],
129
- "version": "3.0.722",
129
+ "version": "3.0.723",
130
130
  "repository": {
131
131
  "type": "git",
132
132
  "url": "https://github.com/cloudscape-design/components.git"
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/table/index.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG/D,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,QAAA,MAAM,KAAK,qBAsEa,CAAC;AAGzB,eAAe,KAAK,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/table/index.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAG/D,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,QAAA,MAAM,KAAK,qBA8Fa,CAAC;AAGzB,eAAe,KAAK,CAAC"}
package/table/index.js CHANGED
@@ -4,12 +4,17 @@ import { __rest } from "tslib";
4
4
  import React from 'react';
5
5
  import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
6
6
  import { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';
7
+ import { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';
7
8
  import useBaseComponent from '../internal/hooks/use-base-component';
8
9
  import { applyDisplayName } from '../internal/utils/apply-display-name';
9
10
  import { getSortingColumnId } from './header-cell/utils';
10
11
  import InternalTable, { InternalTableAsSubstep } from './internal';
11
12
  const Table = React.forwardRef((_a, ref) => {
13
+ var _b, _c, _d;
12
14
  var { items = [], selectedItems = [], variant = 'container', contentDensity = 'comfortable', firstIndex = 1 } = _a, props = __rest(_a, ["items", "selectedItems", "variant", "contentDensity", "firstIndex"]);
15
+ const hasHiddenColumns = (props.visibleColumns && props.visibleColumns.length < props.columnDefinitions.length) ||
16
+ ((_b = props.columnDisplay) === null || _b === void 0 ? void 0 : _b.some(col => !col.visible));
17
+ const hasStickyColumns = !!((_c = props.stickyColumns) === null || _c === void 0 ? void 0 : _c.first) || !!((_d = props.stickyColumns) === null || _d === void 0 ? void 0 : _d.last);
13
18
  const baseComponentProps = useBaseComponent('Table', {
14
19
  props: {
15
20
  contentDensity,
@@ -20,12 +25,19 @@ const Table = React.forwardRef((_a, ref) => {
20
25
  variant,
21
26
  wrapLines: props.wrapLines,
22
27
  enableKeyboardNavigation: props.enableKeyboardNavigation,
28
+ totalItemsCount: props.totalItemsCount,
23
29
  },
24
30
  metadata: {
25
31
  expandableRows: !!props.expandableRows,
26
32
  progressiveLoading: !!props.getLoadingStatus,
27
33
  inlineEdit: props.columnDefinitions.some(def => !!def.editConfig),
28
34
  disabledInlineEdit: props.columnDefinitions.some(def => { var _a; return !!((_a = def.editConfig) === null || _a === void 0 ? void 0 : _a.disabledReason); }),
35
+ hasSortableColumns: props.columnDefinitions.some(def => def.sortingField || def.sortingComparator),
36
+ hasHiddenColumns,
37
+ hasStickyColumns,
38
+ hasFilterSlot: !!props.filter,
39
+ hasPaginationSlot: !!props.pagination,
40
+ itemsCount: items.length,
29
41
  },
30
42
  });
31
43
  const analyticsComponentMetadata = {
@@ -48,11 +60,19 @@ const Table = React.forwardRef((_a, ref) => {
48
60
  variant,
49
61
  contentDensity,
50
62
  firstIndex }, props), baseComponentProps), { ref }), getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }));
63
+ const collectionPreferencesMetadata = {
64
+ tableContentDensity: contentDensity,
65
+ tableHasStripedRows: !!props.stripedRows,
66
+ tableHasHiddenColumns: hasHiddenColumns,
67
+ tableHasStickyColumns: hasStickyColumns,
68
+ };
51
69
  if (variant === 'borderless' || variant === 'embedded') {
52
- return React.createElement(InternalTable, Object.assign({}, tableProps));
70
+ return (React.createElement(CollectionPreferencesMetadata.Provider, { value: collectionPreferencesMetadata },
71
+ React.createElement(InternalTable, Object.assign({}, tableProps))));
53
72
  }
54
- return (React.createElement(AnalyticsFunnelSubStep, null,
55
- React.createElement(InternalTableAsSubstep, Object.assign({}, tableProps))));
73
+ return (React.createElement(CollectionPreferencesMetadata.Provider, { value: collectionPreferencesMetadata },
74
+ React.createElement(AnalyticsFunnelSubStep, null,
75
+ React.createElement(InternalTableAsSubstep, Object.assign({}, tableProps)))));
56
76
  });
57
77
  applyDisplayName(Table, 'Table');
58
78
  export default Table;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/table/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,sBAAsB,EAAE,MAAM,mDAAmD,CAAC;AAC3F,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAEzD,OAAO,aAAa,EAAE,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAGnE,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAC5B,CACE,EAOgB,EAChB,GAA8B,EAC9B,EAAE;QATF,EACE,KAAK,GAAG,EAAE,EACV,aAAa,GAAG,EAAE,EAClB,OAAO,GAAG,WAAW,EACrB,cAAc,GAAG,aAAa,EAC9B,UAAU,GAAG,CAAC,OAEA,EADX,KAAK,cANV,qEAOC,CADS;IAIV,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,OAAO,EAAE;QACnD,KAAK,EAAE;YACL,cAAc;YACd,gBAAgB,EAAE,KAAK,CAAC,gBAAgB;YACxC,aAAa,EAAE,KAAK,CAAC,aAAa;YAClC,YAAY,EAAE,KAAK,CAAC,YAAY;YAChC,WAAW,EAAE,KAAK,CAAC,WAAW;YAC9B,OAAO;YACP,SAAS,EAAE,KAAK,CAAC,SAAS;YAC1B,wBAAwB,EAAE,KAAK,CAAC,wBAAwB;SACzD;QACD,QAAQ,EAAE;YACR,cAAc,EAAE,CAAC,CAAC,KAAK,CAAC,cAAc;YACtC,kBAAkB,EAAE,CAAC,CAAC,KAAK,CAAC,gBAAgB;YAC5C,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC;YACjE,kBAAkB,EAAE,KAAK,CAAC,iBAAiB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,WAAC,OAAA,CAAC,CAAC,CAAA,MAAA,GAAG,CAAC,UAAU,0CAAE,cAAc,CAAA,CAAA,EAAA,CAAC;SAC1F;KACF,CAAC,CAAC;IAEH,MAAM,0BAA0B,GAA6C;QAC3E,IAAI,EAAE,aAAa;QACnB,KAAK,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE;QACvB,UAAU,EAAE;YACV,aAAa,EAAE,KAAK,CAAC,aAAa,IAAI,MAAM;YAC5C,UAAU,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE;YAC7B,kBAAkB,EAAE,GAAG,aAAa,CAAC,MAAM,EAAE;YAC7C,OAAO;SACR;KACF,CAAC;IAEF,MAAM,eAAe,GAAG,kBAAkB,CAAC,KAAK,CAAC,iBAAiB,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC;IACzF,IAAI,eAAe,EAAE;QACnB,0BAA0B,CAAC,UAAU,CAAC,eAAe,GAAG,eAAe,CAAC;QACxE,0BAA0B,CAAC,UAAU,CAAC,iBAAiB,GAAG,GAAG,KAAK,CAAC,iBAAiB,IAAI,KAAK,EAAE,CAAC;KACjG;IAED,MAAM,UAAU,6DACd,KAAK;QACL,aAAa;QACb,OAAO;QACP,cAAc;QACd,UAAU,IACP,KAAK,GACL,kBAAkB,KACrB,GAAG,KACA,6BAA6B,CAAC,EAAE,SAAS,EAAE,0BAA0B,EAAE,CAAC,CAC5E,CAAC;IAEF,IAAI,OAAO,KAAK,YAAY,IAAI,OAAO,KAAK,UAAU,EAAE;QACtD,OAAO,oBAAC,aAAa,oBAAK,UAAU,EAAI,CAAC;KAC1C;IAED,OAAO,CACL,oBAAC,sBAAsB;QACrB,oBAAC,sBAAsB,oBAAK,UAAU,EAAI,CACnB,CAC1B,CAAC;AACJ,CAAC,CACqB,CAAC;AAEzB,gBAAgB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;AACjC,eAAe,KAAK,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataTableComponent } from './analytics-metadata/interfaces';\nimport { getSortingColumnId } from './header-cell/utils';\nimport { TableForwardRefType, TableProps } from './interfaces';\nimport InternalTable, { InternalTableAsSubstep } from './internal';\n\nexport { TableProps };\nconst Table = React.forwardRef(\n <T,>(\n {\n items = [],\n selectedItems = [],\n variant = 'container',\n contentDensity = 'comfortable',\n firstIndex = 1,\n ...props\n }: TableProps<T>,\n ref: React.Ref<TableProps.Ref>\n ) => {\n const baseComponentProps = useBaseComponent('Table', {\n props: {\n contentDensity,\n resizableColumns: props.resizableColumns,\n selectionType: props.selectionType,\n stickyHeader: props.stickyHeader,\n stripedRows: props.stripedRows,\n variant,\n wrapLines: props.wrapLines,\n enableKeyboardNavigation: props.enableKeyboardNavigation,\n },\n metadata: {\n expandableRows: !!props.expandableRows,\n progressiveLoading: !!props.getLoadingStatus,\n inlineEdit: props.columnDefinitions.some(def => !!def.editConfig),\n disabledInlineEdit: props.columnDefinitions.some(def => !!def.editConfig?.disabledReason),\n },\n });\n\n const analyticsComponentMetadata: GeneratedAnalyticsMetadataTableComponent = {\n name: 'awsui.Table',\n label: { root: 'self' },\n properties: {\n selectionType: props.selectionType || 'none',\n itemsCount: `${items.length}`,\n selectedItemsCount: `${selectedItems.length}`,\n variant,\n },\n };\n\n const sortingColumnId = getSortingColumnId(props.columnDefinitions, props.sortingColumn);\n if (sortingColumnId) {\n analyticsComponentMetadata.properties.sortingColumnId = sortingColumnId;\n analyticsComponentMetadata.properties.sortingDescending = `${props.sortingDescending || false}`;\n }\n\n const tableProps: Parameters<typeof InternalTable<T>>[0] = {\n items,\n selectedItems,\n variant,\n contentDensity,\n firstIndex,\n ...props,\n ...baseComponentProps,\n ref,\n ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }),\n };\n\n if (variant === 'borderless' || variant === 'embedded') {\n return <InternalTable {...tableProps} />;\n }\n\n return (\n <AnalyticsFunnelSubStep>\n <InternalTableAsSubstep {...tableProps} />\n </AnalyticsFunnelSubStep>\n );\n }\n) as TableForwardRefType;\n\napplyDisplayName(Table, 'Table');\nexport default Table;\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/table/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { AnalyticsFunnelSubStep } from '../internal/analytics/components/analytics-funnel';\nimport { CollectionPreferencesMetadata } from '../internal/context/collection-preferences-metadata-context';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { GeneratedAnalyticsMetadataTableComponent } from './analytics-metadata/interfaces';\nimport { getSortingColumnId } from './header-cell/utils';\nimport { TableForwardRefType, TableProps } from './interfaces';\nimport InternalTable, { InternalTableAsSubstep } from './internal';\n\nexport { TableProps };\nconst Table = React.forwardRef(\n <T,>(\n {\n items = [],\n selectedItems = [],\n variant = 'container',\n contentDensity = 'comfortable',\n firstIndex = 1,\n ...props\n }: TableProps<T>,\n ref: React.Ref<TableProps.Ref>\n ) => {\n const hasHiddenColumns =\n (props.visibleColumns && props.visibleColumns.length < props.columnDefinitions.length) ||\n props.columnDisplay?.some(col => !col.visible);\n const hasStickyColumns = !!props.stickyColumns?.first || !!props.stickyColumns?.last;\n const baseComponentProps = useBaseComponent('Table', {\n props: {\n contentDensity,\n resizableColumns: props.resizableColumns,\n selectionType: props.selectionType,\n stickyHeader: props.stickyHeader,\n stripedRows: props.stripedRows,\n variant,\n wrapLines: props.wrapLines,\n enableKeyboardNavigation: props.enableKeyboardNavigation,\n totalItemsCount: props.totalItemsCount,\n },\n metadata: {\n expandableRows: !!props.expandableRows,\n progressiveLoading: !!props.getLoadingStatus,\n inlineEdit: props.columnDefinitions.some(def => !!def.editConfig),\n disabledInlineEdit: props.columnDefinitions.some(def => !!def.editConfig?.disabledReason),\n hasSortableColumns: props.columnDefinitions.some(def => def.sortingField || def.sortingComparator),\n hasHiddenColumns,\n hasStickyColumns,\n hasFilterSlot: !!props.filter,\n hasPaginationSlot: !!props.pagination,\n itemsCount: items.length,\n },\n });\n\n const analyticsComponentMetadata: GeneratedAnalyticsMetadataTableComponent = {\n name: 'awsui.Table',\n label: { root: 'self' },\n properties: {\n selectionType: props.selectionType || 'none',\n itemsCount: `${items.length}`,\n selectedItemsCount: `${selectedItems.length}`,\n variant,\n },\n };\n\n const sortingColumnId = getSortingColumnId(props.columnDefinitions, props.sortingColumn);\n if (sortingColumnId) {\n analyticsComponentMetadata.properties.sortingColumnId = sortingColumnId;\n analyticsComponentMetadata.properties.sortingDescending = `${props.sortingDescending || false}`;\n }\n\n const tableProps: Parameters<typeof InternalTable<T>>[0] = {\n items,\n selectedItems,\n variant,\n contentDensity,\n firstIndex,\n ...props,\n ...baseComponentProps,\n ref,\n ...getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata }),\n };\n\n const collectionPreferencesMetadata = {\n tableContentDensity: contentDensity,\n tableHasStripedRows: !!props.stripedRows,\n tableHasHiddenColumns: hasHiddenColumns,\n tableHasStickyColumns: hasStickyColumns,\n };\n\n if (variant === 'borderless' || variant === 'embedded') {\n return (\n <CollectionPreferencesMetadata.Provider value={collectionPreferencesMetadata}>\n <InternalTable {...tableProps} />\n </CollectionPreferencesMetadata.Provider>\n );\n }\n\n return (\n <CollectionPreferencesMetadata.Provider value={collectionPreferencesMetadata}>\n <AnalyticsFunnelSubStep>\n <InternalTableAsSubstep {...tableProps} />\n </AnalyticsFunnelSubStep>\n </CollectionPreferencesMetadata.Provider>\n );\n }\n) as TableForwardRefType;\n\napplyDisplayName(Table, 'Table');\nexport default Table;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"use-column-widths.d.ts","sourceRoot":"","sources":["../../../src/table/use-column-widths.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAOtF,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAwCD,UAAU,aAAa;IACrB,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC;IAC7E,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IACvC,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,GAAG,WAAW,KAAK,IAAI,CAAC;CACrF;AAED,QAAA,MAAM,aAAa,8BAKjB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,cAAc,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACjD,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eAoHpH;AAED,wBAAgB,eAAe,kBAE9B"}
1
+ {"version":3,"file":"use-column-widths.d.ts","sourceRoot":"","sources":["../../../src/table/use-column-widths.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAOtF,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,WAAW,CAAC;IAChB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAwCD,UAAU,aAAa;IACrB,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC;IAC7E,YAAY,EAAE,GAAG,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IACvC,YAAY,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,GAAG,WAAW,KAAK,IAAI,CAAC;CACrF;AAED,QAAA,MAAM,aAAa,8BAKjB,CAAC;AAEH,UAAU,kBAAkB;IAC1B,cAAc,EAAE,SAAS,qBAAqB,EAAE,CAAC;IACjD,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAC;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,wBAAgB,oBAAoB,CAAC,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,kBAAkB,eAwHpH;AAED,wBAAgB,eAAe,kBAE9B"}
@@ -61,7 +61,10 @@ export function ColumnWidthsProvider({ visibleColumns, resizableColumns, contain
61
61
  return {};
62
62
  }
63
63
  if (sticky) {
64
- return { width: ((_a = cellsRef.current.get(column.id)) === null || _a === void 0 ? void 0 : _a.offsetWidth) || ((_b = columnWidths === null || columnWidths === void 0 ? void 0 : columnWidths.get(column.id)) !== null && _b !== void 0 ? _b : column.width) };
64
+ return {
65
+ width: ((_a = cellsRef.current.get(column.id)) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) ||
66
+ ((_b = columnWidths === null || columnWidths === void 0 ? void 0 : columnWidths.get(column.id)) !== null && _b !== void 0 ? _b : column.width),
67
+ };
65
68
  }
66
69
  if (resizableColumns && columnWidths) {
67
70
  const isLastColumn = column.id === ((_c = visibleColumns[visibleColumns.length - 1]) === null || _c === void 0 ? void 0 : _c.id);
@@ -99,7 +102,7 @@ export function ColumnWidthsProvider({ visibleColumns, resizableColumns, contain
99
102
  // Observes container size and requests an update to the last cell width as it depends on the container's width.
100
103
  useResizeObserver(containerRef, ({ contentBoxWidth: containerWidth }) => {
101
104
  containerWidthRef.current = containerWidth;
102
- updateColumnWidths();
105
+ requestAnimationFrame(() => updateColumnWidths());
103
106
  });
104
107
  // The widths of the dynamically added columns (after the first render) if not set explicitly
105
108
  // will default to the DEFAULT_COLUMN_WIDTH.
@@ -1 +1 @@
1
- {"version":3,"file":"use-column-widths.js","sourceRoot":"","sources":["../../../src/table/use-column-widths.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, { createContext, useContext, useEffect, useRef, useState } from 'react';\n\nimport { useResizeObserver, useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { getLogicalBoundingClientRect } from '@cloudscape-design/component-toolkit/internal';\n\nimport { setElementWidths } from './column-widths-utils';\n\nexport const DEFAULT_COLUMN_WIDTH = 120;\n\nexport interface ColumnWidthDefinition {\n id: PropertyKey;\n minWidth?: string | number;\n maxWidth?: string | number;\n width?: string | number;\n}\n\nfunction readWidths(\n getCell: (columnId: PropertyKey) => null | HTMLElement,\n visibleColumns: readonly ColumnWidthDefinition[]\n) {\n const result = new Map<PropertyKey, number>();\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n let width = (column.width as number) || 0;\n const minWidth = (column.minWidth as number) || width || DEFAULT_COLUMN_WIDTH;\n if (\n !width && // read width from the DOM if it is missing in the config\n index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container\n ) {\n const colEl = getCell(column.id);\n width = colEl ? getLogicalBoundingClientRect(colEl).inlineSize : DEFAULT_COLUMN_WIDTH;\n }\n result.set(column.id, Math.max(width, minWidth));\n }\n return result;\n}\n\nfunction updateWidths(\n visibleColumns: readonly ColumnWidthDefinition[],\n oldWidths: Map<PropertyKey, number>,\n newWidth: number,\n columnId: PropertyKey\n) {\n const column = visibleColumns.find(column => column.id === columnId);\n const minWidth = typeof column?.minWidth === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;\n newWidth = Math.max(newWidth, minWidth);\n if (oldWidths.get(columnId) === newWidth) {\n return oldWidths;\n }\n const newWidths = new Map(oldWidths);\n newWidths.set(columnId, newWidth);\n return newWidths;\n}\n\ninterface WidthsContext {\n getColumnStyles(sticky: boolean, columnId: PropertyKey): React.CSSProperties;\n columnWidths: Map<PropertyKey, number>;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n setCell: (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => void;\n}\n\nconst WidthsContext = createContext<WidthsContext>({\n getColumnStyles: () => ({}),\n columnWidths: new Map(),\n updateColumn: () => {},\n setCell: () => {},\n});\n\ninterface WidthProviderProps {\n visibleColumns: readonly ColumnWidthDefinition[];\n resizableColumns: boolean | undefined;\n containerRef: React.RefObject<HTMLElement>;\n children: React.ReactNode;\n}\n\nexport function ColumnWidthsProvider({ visibleColumns, resizableColumns, containerRef, children }: WidthProviderProps) {\n const visibleColumnsRef = useRef<PropertyKey[] | null>(null);\n const containerWidthRef = useRef(0);\n const [columnWidths, setColumnWidths] = useState<null | Map<PropertyKey, number>>(null);\n\n const cellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n const stickyCellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n const getCell = (columnId: PropertyKey): null | HTMLElement => cellsRef.current.get(columnId) ?? null;\n const setCell = (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => {\n const ref = sticky ? stickyCellsRef : cellsRef;\n if (node) {\n ref.current.set(columnId, node);\n } else {\n ref.current.delete(columnId);\n }\n };\n\n const getColumnStyles = (sticky: boolean, columnId: PropertyKey): React.CSSProperties => {\n const column = visibleColumns.find(column => column.id === columnId);\n if (!column) {\n return {};\n }\n\n if (sticky) {\n return { width: cellsRef.current.get(column.id)?.offsetWidth || (columnWidths?.get(column.id) ?? column.width) };\n }\n\n if (resizableColumns && columnWidths) {\n const isLastColumn = column.id === visibleColumns[visibleColumns.length - 1]?.id;\n const totalWidth = visibleColumns.reduce(\n (sum, { id }) => sum + (columnWidths.get(id) || DEFAULT_COLUMN_WIDTH),\n 0\n );\n if (isLastColumn && containerWidthRef.current > totalWidth) {\n return { width: 'auto', minWidth: column?.minWidth };\n } else {\n return { width: columnWidths.get(column.id), minWidth: column?.minWidth };\n }\n }\n return {\n width: column.width,\n minWidth: column.minWidth,\n maxWidth: !resizableColumns ? column.maxWidth : undefined,\n };\n };\n\n // Imperatively sets width style for a cell avoiding React state.\n // This allows setting the style as soon container's size change is observed.\n const updateColumnWidths = useStableCallback(() => {\n for (const { id } of visibleColumns) {\n const element = cellsRef.current.get(id);\n if (element) {\n setElementWidths(element, getColumnStyles(false, id));\n }\n }\n // Sticky column widths must be synchronized once all real column widths are assigned.\n for (const { id } of visibleColumns) {\n const element = stickyCellsRef.current.get(id);\n if (element) {\n setElementWidths(element, getColumnStyles(true, id));\n }\n }\n });\n\n // Observes container size and requests an update to the last cell width as it depends on the container's width.\n useResizeObserver(containerRef, ({ contentBoxWidth: containerWidth }) => {\n containerWidthRef.current = containerWidth;\n updateColumnWidths();\n });\n\n // The widths of the dynamically added columns (after the first render) if not set explicitly\n // will default to the DEFAULT_COLUMN_WIDTH.\n useEffect(() => {\n updateColumnWidths();\n\n if (!resizableColumns) {\n return;\n }\n let updated = false;\n const newColumnWidths = new Map(columnWidths);\n const lastVisible = visibleColumnsRef.current;\n if (lastVisible) {\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n if (!columnWidths?.get(column.id) && lastVisible.indexOf(column.id) === -1) {\n updated = true;\n newColumnWidths.set(column.id, (column.width as number) || DEFAULT_COLUMN_WIDTH);\n }\n }\n if (updated) {\n setColumnWidths(newColumnWidths);\n }\n }\n visibleColumnsRef.current = visibleColumns.map(column => column.id);\n }, [columnWidths, resizableColumns, visibleColumns, updateColumnWidths]);\n\n // Read the actual column widths after the first render to employ the browser defaults for\n // those columns without explicit width.\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n setColumnWidths(() => readWidths(getCell, visibleColumns));\n // This code is intended to run only at the first render and should not re-run when table props change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n function updateColumn(columnId: PropertyKey, newWidth: number) {\n setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths ?? new Map(), newWidth, columnId));\n }\n\n return (\n <WidthsContext.Provider value={{ getColumnStyles, columnWidths: columnWidths ?? new Map(), updateColumn, setCell }}>\n {children}\n </WidthsContext.Provider>\n );\n}\n\nexport function useColumnWidths() {\n return useContext(WidthsContext);\n}\n"]}
1
+ {"version":3,"file":"use-column-widths.js","sourceRoot":"","sources":["../../../src/table/use-column-widths.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, { createContext, useContext, useEffect, useRef, useState } from 'react';\n\nimport { useResizeObserver, useStableCallback } from '@cloudscape-design/component-toolkit/internal';\nimport { getLogicalBoundingClientRect } from '@cloudscape-design/component-toolkit/internal';\n\nimport { setElementWidths } from './column-widths-utils';\n\nexport const DEFAULT_COLUMN_WIDTH = 120;\n\nexport interface ColumnWidthDefinition {\n id: PropertyKey;\n minWidth?: string | number;\n maxWidth?: string | number;\n width?: string | number;\n}\n\nfunction readWidths(\n getCell: (columnId: PropertyKey) => null | HTMLElement,\n visibleColumns: readonly ColumnWidthDefinition[]\n) {\n const result = new Map<PropertyKey, number>();\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n let width = (column.width as number) || 0;\n const minWidth = (column.minWidth as number) || width || DEFAULT_COLUMN_WIDTH;\n if (\n !width && // read width from the DOM if it is missing in the config\n index !== visibleColumns.length - 1 // skip reading for the last column, because it expands to fully fit the container\n ) {\n const colEl = getCell(column.id);\n width = colEl ? getLogicalBoundingClientRect(colEl).inlineSize : DEFAULT_COLUMN_WIDTH;\n }\n result.set(column.id, Math.max(width, minWidth));\n }\n return result;\n}\n\nfunction updateWidths(\n visibleColumns: readonly ColumnWidthDefinition[],\n oldWidths: Map<PropertyKey, number>,\n newWidth: number,\n columnId: PropertyKey\n) {\n const column = visibleColumns.find(column => column.id === columnId);\n const minWidth = typeof column?.minWidth === 'number' ? column.minWidth : DEFAULT_COLUMN_WIDTH;\n newWidth = Math.max(newWidth, minWidth);\n if (oldWidths.get(columnId) === newWidth) {\n return oldWidths;\n }\n const newWidths = new Map(oldWidths);\n newWidths.set(columnId, newWidth);\n return newWidths;\n}\n\ninterface WidthsContext {\n getColumnStyles(sticky: boolean, columnId: PropertyKey): React.CSSProperties;\n columnWidths: Map<PropertyKey, number>;\n updateColumn: (columnId: PropertyKey, newWidth: number) => void;\n setCell: (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => void;\n}\n\nconst WidthsContext = createContext<WidthsContext>({\n getColumnStyles: () => ({}),\n columnWidths: new Map(),\n updateColumn: () => {},\n setCell: () => {},\n});\n\ninterface WidthProviderProps {\n visibleColumns: readonly ColumnWidthDefinition[];\n resizableColumns: boolean | undefined;\n containerRef: React.RefObject<HTMLElement>;\n children: React.ReactNode;\n}\n\nexport function ColumnWidthsProvider({ visibleColumns, resizableColumns, containerRef, children }: WidthProviderProps) {\n const visibleColumnsRef = useRef<PropertyKey[] | null>(null);\n const containerWidthRef = useRef(0);\n const [columnWidths, setColumnWidths] = useState<null | Map<PropertyKey, number>>(null);\n\n const cellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n const stickyCellsRef = useRef(new Map<PropertyKey, HTMLElement>());\n const getCell = (columnId: PropertyKey): null | HTMLElement => cellsRef.current.get(columnId) ?? null;\n const setCell = (sticky: boolean, columnId: PropertyKey, node: null | HTMLElement) => {\n const ref = sticky ? stickyCellsRef : cellsRef;\n if (node) {\n ref.current.set(columnId, node);\n } else {\n ref.current.delete(columnId);\n }\n };\n\n const getColumnStyles = (sticky: boolean, columnId: PropertyKey): React.CSSProperties => {\n const column = visibleColumns.find(column => column.id === columnId);\n if (!column) {\n return {};\n }\n\n if (sticky) {\n return {\n width:\n cellsRef.current.get(column.id)?.getBoundingClientRect().width ||\n (columnWidths?.get(column.id) ?? column.width),\n };\n }\n\n if (resizableColumns && columnWidths) {\n const isLastColumn = column.id === visibleColumns[visibleColumns.length - 1]?.id;\n const totalWidth = visibleColumns.reduce(\n (sum, { id }) => sum + (columnWidths.get(id) || DEFAULT_COLUMN_WIDTH),\n 0\n );\n if (isLastColumn && containerWidthRef.current > totalWidth) {\n return { width: 'auto', minWidth: column?.minWidth };\n } else {\n return { width: columnWidths.get(column.id), minWidth: column?.minWidth };\n }\n }\n return {\n width: column.width,\n minWidth: column.minWidth,\n maxWidth: !resizableColumns ? column.maxWidth : undefined,\n };\n };\n\n // Imperatively sets width style for a cell avoiding React state.\n // This allows setting the style as soon container's size change is observed.\n const updateColumnWidths = useStableCallback(() => {\n for (const { id } of visibleColumns) {\n const element = cellsRef.current.get(id);\n if (element) {\n setElementWidths(element, getColumnStyles(false, id));\n }\n }\n // Sticky column widths must be synchronized once all real column widths are assigned.\n for (const { id } of visibleColumns) {\n const element = stickyCellsRef.current.get(id);\n if (element) {\n setElementWidths(element, getColumnStyles(true, id));\n }\n }\n });\n\n // Observes container size and requests an update to the last cell width as it depends on the container's width.\n useResizeObserver(containerRef, ({ contentBoxWidth: containerWidth }) => {\n containerWidthRef.current = containerWidth;\n requestAnimationFrame(() => updateColumnWidths());\n });\n\n // The widths of the dynamically added columns (after the first render) if not set explicitly\n // will default to the DEFAULT_COLUMN_WIDTH.\n useEffect(() => {\n updateColumnWidths();\n\n if (!resizableColumns) {\n return;\n }\n let updated = false;\n const newColumnWidths = new Map(columnWidths);\n const lastVisible = visibleColumnsRef.current;\n if (lastVisible) {\n for (let index = 0; index < visibleColumns.length; index++) {\n const column = visibleColumns[index];\n if (!columnWidths?.get(column.id) && lastVisible.indexOf(column.id) === -1) {\n updated = true;\n newColumnWidths.set(column.id, (column.width as number) || DEFAULT_COLUMN_WIDTH);\n }\n }\n if (updated) {\n setColumnWidths(newColumnWidths);\n }\n }\n visibleColumnsRef.current = visibleColumns.map(column => column.id);\n }, [columnWidths, resizableColumns, visibleColumns, updateColumnWidths]);\n\n // Read the actual column widths after the first render to employ the browser defaults for\n // those columns without explicit width.\n useEffect(() => {\n if (!resizableColumns) {\n return;\n }\n setColumnWidths(() => readWidths(getCell, visibleColumns));\n // This code is intended to run only at the first render and should not re-run when table props change\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n function updateColumn(columnId: PropertyKey, newWidth: number) {\n setColumnWidths(columnWidths => updateWidths(visibleColumns, columnWidths ?? new Map(), newWidth, columnId));\n }\n\n return (\n <WidthsContext.Provider value={{ getColumnStyles, columnWidths: columnWidths ?? new Map(), updateColumn, setCell }}>\n {children}\n </WidthsContext.Provider>\n );\n}\n\nexport function useColumnWidths() {\n return useContext(WidthsContext);\n}\n"]}
@@ -13,11 +13,11 @@ export const useStickyHeader = (tableRef, theadRef, secondaryTheadRef, secondary
13
13
  secondaryTheadRef.current &&
14
14
  secondaryTableRef.current &&
15
15
  tableWrapperRef.current) {
16
- // Using the tableRef offsetWidth instead of the theadRef because in VR
16
+ // Using the tableRef getBoundingClientRect().width instead of the theadRef because in VR
17
17
  // the tableRef adds extra padding to the table and by default the theadRef will have a width
18
18
  // without the padding and will make the sticky header width incorrect.
19
- secondaryTableRef.current.style.inlineSize = `${tableRef.current.offsetWidth}px`;
20
- tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.offsetHeight}px`;
19
+ secondaryTableRef.current.style.inlineSize = `${tableRef.current.getBoundingClientRect().width}px`;
20
+ tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.getBoundingClientRect().height}px`;
21
21
  }
22
22
  }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);
23
23
  useLayoutEffect(() => {
@@ -1 +1 @@
1
- {"version":3,"file":"use-sticky-header.js","sourceRoot":"","sources":["../../../src/table/use-sticky-header.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAa,WAAW,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,eAAe,EAAE,EAAE,wBAAwB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE3F,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,QAAgC,EAChC,QAAgC,EAChC,iBAAyC,EACzC,iBAAyC,EACzC,eAAuC,EACvC,EAAE;IACF,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,qFAAqF;IACrF,MAAM,sBAAsB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9C,IACE,QAAQ,CAAC,OAAO;YAChB,QAAQ,CAAC,OAAO;YAChB,iBAAiB,CAAC,OAAO;YACzB,iBAAiB,CAAC,OAAO;YACzB,eAAe,CAAC,OAAO,EACvB;YACA,uEAAuE;YACvE,6FAA6F;YAC7F,uEAAuE;YACvE,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,WAAW,IAAI,CAAC;YAEjF,eAAe,CAAC,OAAO,CAAC,KAAK,CAAC,gBAAgB,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,YAAY,IAAI,CAAC;SACxF;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;IAChF,eAAe,CAAC,GAAG,EAAE;QACnB,sBAAsB,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;IACH,iBAAiB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;IACpD,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,IAAI,eAAe,CAAC,OAAO,EAAE;YACzF,MAAM,UAAU,GAAG,wBAAwB,CAAC,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;YACzF,IAAI,UAAU,GAAG,CAAC,EAAE;gBAClB,UAAU,CAAC,UAAU,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;aACjD;SACF;IACH,CAAC,CAAC;IACF,MAAM,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC;IAC7E,MAAM,WAAW,GAAG,CAAC,QAA4B,EAAE,EAAE;QACnD,IAAI,CAAC,QAAQ,EAAE;YACb,YAAY,CAAC,QAAQ,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IACF,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC;AACtC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { RefObject, useCallback, useLayoutEffect } from 'react';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';\n\nexport const useStickyHeader = (\n tableRef: RefObject<HTMLElement>,\n theadRef: RefObject<HTMLElement>,\n secondaryTheadRef: RefObject<HTMLElement>,\n secondaryTableRef: RefObject<HTMLElement>,\n tableWrapperRef: RefObject<HTMLElement>\n) => {\n const isMobile = useMobile();\n // Sync the sizes of the column header copies in the sticky header with the originals\n const syncColumnHeaderWidths = useCallback(() => {\n if (\n tableRef.current &&\n theadRef.current &&\n secondaryTheadRef.current &&\n secondaryTableRef.current &&\n tableWrapperRef.current\n ) {\n // Using the tableRef offsetWidth instead of the theadRef because in VR\n // the tableRef adds extra padding to the table and by default the theadRef will have a width\n // without the padding and will make the sticky header width incorrect.\n secondaryTableRef.current.style.inlineSize = `${tableRef.current.offsetWidth}px`;\n\n tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.offsetHeight}px`;\n }\n }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);\n useLayoutEffect(() => {\n syncColumnHeaderWidths();\n });\n useResizeObserver(theadRef, syncColumnHeaderWidths);\n const scrollToTop = () => {\n if (!isMobile && theadRef.current && secondaryTheadRef.current && tableWrapperRef.current) {\n const scrollDist = calculateScrollingOffset(theadRef.current, secondaryTheadRef.current);\n if (scrollDist > 0) {\n scrollUpBy(scrollDist, tableWrapperRef.current);\n }\n }\n };\n const { scrollToItem } = stickyScrolling(tableWrapperRef, secondaryTheadRef);\n const scrollToRow = (itemNode: HTMLElement | null) => {\n if (!isMobile) {\n scrollToItem(itemNode);\n }\n };\n return { scrollToRow, scrollToTop };\n};\n"]}
1
+ {"version":3,"file":"use-sticky-header.js","sourceRoot":"","sources":["../../../src/table/use-sticky-header.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAa,WAAW,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,EAAE,iBAAiB,EAAE,MAAM,+CAA+C,CAAC;AAElF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,eAAe,EAAE,EAAE,wBAAwB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAE3F,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,QAAgC,EAChC,QAAgC,EAChC,iBAAyC,EACzC,iBAAyC,EACzC,eAAuC,EACvC,EAAE;IACF,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,qFAAqF;IACrF,MAAM,sBAAsB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC9C,IACE,QAAQ,CAAC,OAAO;YAChB,QAAQ,CAAC,OAAO;YAChB,iBAAiB,CAAC,OAAO;YACzB,iBAAiB,CAAC,OAAO;YACzB,eAAe,CAAC,OAAO,EACvB;YACA,yFAAyF;YACzF,6FAA6F;YAC7F,uEAAuE;YACvE,iBAAiB,CAAC,OAAO,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,KAAK,IAAI,CAAC;YAEnG,eAAe,CAAC,OAAO,CAAC,KAAK,CAAC,gBAAgB,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC;SAC1G;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC;IAChF,eAAe,CAAC,GAAG,EAAE;QACnB,sBAAsB,EAAE,CAAC;IAC3B,CAAC,CAAC,CAAC;IACH,iBAAiB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;IACpD,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,IAAI,CAAC,QAAQ,IAAI,QAAQ,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,IAAI,eAAe,CAAC,OAAO,EAAE;YACzF,MAAM,UAAU,GAAG,wBAAwB,CAAC,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;YACzF,IAAI,UAAU,GAAG,CAAC,EAAE;gBAClB,UAAU,CAAC,UAAU,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;aACjD;SACF;IACH,CAAC,CAAC;IACF,MAAM,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC;IAC7E,MAAM,WAAW,GAAG,CAAC,QAA4B,EAAE,EAAE;QACnD,IAAI,CAAC,QAAQ,EAAE;YACb,YAAY,CAAC,QAAQ,CAAC,CAAC;SACxB;IACH,CAAC,CAAC;IACF,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC;AACtC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { RefObject, useCallback, useLayoutEffect } from 'react';\n\nimport { useResizeObserver } from '@cloudscape-design/component-toolkit/internal';\n\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport stickyScrolling, { calculateScrollingOffset, scrollUpBy } from './sticky-scrolling';\n\nexport const useStickyHeader = (\n tableRef: RefObject<HTMLElement>,\n theadRef: RefObject<HTMLElement>,\n secondaryTheadRef: RefObject<HTMLElement>,\n secondaryTableRef: RefObject<HTMLElement>,\n tableWrapperRef: RefObject<HTMLElement>\n) => {\n const isMobile = useMobile();\n // Sync the sizes of the column header copies in the sticky header with the originals\n const syncColumnHeaderWidths = useCallback(() => {\n if (\n tableRef.current &&\n theadRef.current &&\n secondaryTheadRef.current &&\n secondaryTableRef.current &&\n tableWrapperRef.current\n ) {\n // Using the tableRef getBoundingClientRect().width instead of the theadRef because in VR\n // the tableRef adds extra padding to the table and by default the theadRef will have a width\n // without the padding and will make the sticky header width incorrect.\n secondaryTableRef.current.style.inlineSize = `${tableRef.current.getBoundingClientRect().width}px`;\n\n tableWrapperRef.current.style.marginBlockStart = `-${theadRef.current.getBoundingClientRect().height}px`;\n }\n }, [theadRef, secondaryTheadRef, secondaryTableRef, tableWrapperRef, tableRef]);\n useLayoutEffect(() => {\n syncColumnHeaderWidths();\n });\n useResizeObserver(theadRef, syncColumnHeaderWidths);\n const scrollToTop = () => {\n if (!isMobile && theadRef.current && secondaryTheadRef.current && tableWrapperRef.current) {\n const scrollDist = calculateScrollingOffset(theadRef.current, secondaryTheadRef.current);\n if (scrollDist > 0) {\n scrollUpBy(scrollDist, tableWrapperRef.current);\n }\n }\n };\n const { scrollToItem } = stickyScrolling(tableWrapperRef, secondaryTheadRef);\n const scrollToRow = (itemNode: HTMLElement | null) => {\n if (!isMobile) {\n scrollToItem(itemNode);\n }\n };\n return { scrollToRow, scrollToTop };\n};\n"]}