@cloudscape-design/components 3.0.555 → 3.0.557

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.
Files changed (51) hide show
  1. package/alert/index.d.ts.map +1 -1
  2. package/alert/index.js +3 -1
  3. package/alert/index.js.map +1 -1
  4. package/area-chart/index.d.ts.map +1 -1
  5. package/area-chart/index.js +10 -1
  6. package/area-chart/index.js.map +1 -1
  7. package/autosuggest/index.d.ts.map +1 -1
  8. package/autosuggest/index.js +10 -1
  9. package/autosuggest/index.js.map +1 -1
  10. package/badge/index.js +1 -1
  11. package/badge/index.js.map +1 -1
  12. package/bar-chart/index.d.ts.map +1 -1
  13. package/bar-chart/index.js +13 -1
  14. package/bar-chart/index.js.map +1 -1
  15. package/box/index.d.ts.map +1 -1
  16. package/box/index.js +11 -1
  17. package/box/index.js.map +1 -1
  18. package/button/index.d.ts.map +1 -1
  19. package/button/index.js +3 -1
  20. package/button/index.js.map +1 -1
  21. package/button-dropdown/index.d.ts.map +1 -1
  22. package/button-dropdown/index.js +3 -1
  23. package/button-dropdown/index.js.map +1 -1
  24. package/cards/index.d.ts.map +1 -1
  25. package/cards/index.js +3 -1
  26. package/cards/index.js.map +1 -1
  27. package/code-editor/index.js +2 -2
  28. package/code-editor/index.js.map +1 -1
  29. package/column-layout/index.d.ts.map +1 -1
  30. package/column-layout/index.js +3 -1
  31. package/column-layout/index.js.map +1 -1
  32. package/content-layout/index.d.ts.map +1 -1
  33. package/content-layout/index.js +3 -1
  34. package/content-layout/index.js.map +1 -1
  35. package/copy-to-clipboard/index.d.ts.map +1 -1
  36. package/copy-to-clipboard/index.js +3 -1
  37. package/copy-to-clipboard/index.js.map +1 -1
  38. package/internal/environment.js +1 -1
  39. package/internal/environment.json +1 -1
  40. package/internal/manifest.json +1 -1
  41. package/package.json +1 -1
  42. package/tabs/index.d.ts +1 -1
  43. package/tabs/index.d.ts.map +1 -1
  44. package/tabs/index.js +3 -3
  45. package/tabs/index.js.map +1 -1
  46. package/tabs/interfaces.d.ts +5 -0
  47. package/tabs/interfaces.d.ts.map +1 -1
  48. package/tabs/interfaces.js.map +1 -1
  49. package/tabs/styles.css.js +22 -21
  50. package/tabs/styles.scoped.css +57 -39
  51. package/tabs/styles.selectors.js +22 -21
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["column-layout/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,oBAAoB,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAKpE,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAMjB;QANiB,EACnC,OAAO,GAAG,CAAC,EACX,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,MAAM,EAChB,cAAc,GAAG,KAAK,OAEJ,EADf,KAAK,cAL2B,mDAMpC,CADS;IAER,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAC5D,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CACL,oBAAC,oBAAoB,kBACnB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,IAC1B,aAAa,EACb,kBAAkB,EACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalColumnLayout from './internal';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { ColumnLayoutProps } from './interfaces';\n\nexport { ColumnLayoutProps };\n\nexport default function ColumnLayout({\n columns = 1,\n variant = 'default',\n borders = 'none',\n disableGutters = false,\n ...props\n}: ColumnLayoutProps) {\n const baseComponentProps = useBaseComponent('ColumnLayout');\n const externalProps = getExternalProps(props);\n return (\n <InternalColumnLayout\n columns={columns}\n variant={variant}\n borders={borders}\n disableGutters={disableGutters}\n {...externalProps}\n {...baseComponentProps}\n />\n );\n}\n\napplyDisplayName(ColumnLayout, 'ColumnLayout');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["column-layout/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,oBAAoB,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAKpE,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAMjB;QANiB,EACnC,OAAO,GAAG,CAAC,EACX,OAAO,GAAG,SAAS,EACnB,OAAO,GAAG,MAAM,EAChB,cAAc,GAAG,KAAK,OAEJ,EADf,KAAK,cAL2B,mDAMpC,CADS;IAER,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,cAAc,EAAE;QAC1D,KAAK,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE,OAAO,EAAE;KAC3F,CAAC,CAAC;IACH,MAAM,aAAa,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC9C,OAAO,CACL,oBAAC,oBAAoB,kBACnB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,IAC1B,aAAa,EACb,kBAAkB,EACtB,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,YAAY,EAAE,cAAc,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport InternalColumnLayout from './internal';\nimport { getExternalProps } from '../internal/utils/external-props';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { ColumnLayoutProps } from './interfaces';\n\nexport { ColumnLayoutProps };\n\nexport default function ColumnLayout({\n columns = 1,\n variant = 'default',\n borders = 'none',\n disableGutters = false,\n ...props\n}: ColumnLayoutProps) {\n const baseComponentProps = useBaseComponent('ColumnLayout', {\n props: { borders, columns, disableGutters, minColumnWidth: props.minColumnWidth, variant },\n });\n const externalProps = getExternalProps(props);\n return (\n <InternalColumnLayout\n columns={columns}\n variant={variant}\n borders={borders}\n disableGutters={disableGutters}\n {...externalProps}\n {...baseComponentProps}\n />\n );\n}\n\napplyDisplayName(ColumnLayout, 'ColumnLayout');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["content-layout/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAIlD,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAE9B,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,KAAK,EAAE,kBAAkB,eAG9D"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["content-layout/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAIlD,OAAO,EAAE,kBAAkB,EAAE,CAAC;AAE9B,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,KAAK,EAAE,kBAAkB,eAK9D"}
@@ -5,7 +5,9 @@ import { applyDisplayName } from '../internal/utils/apply-display-name';
5
5
  import InternalContentLayout from './internal';
6
6
  import useBaseComponent from '../internal/hooks/use-base-component';
7
7
  export default function ContentLayout(props) {
8
- const baseComponentProps = useBaseComponent('ContentLayout');
8
+ const baseComponentProps = useBaseComponent('ContentLayout', {
9
+ props: { disableOverlap: props.disableOverlap },
10
+ });
9
11
  return React.createElement(InternalContentLayout, Object.assign({}, props, baseComponentProps));
10
12
  }
11
13
  applyDisplayName(ContentLayout, 'ContentLayout');
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["content-layout/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,qBAAqB,MAAM,YAAY,CAAC;AAC/C,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,KAAyB;IAC7D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,eAAe,CAAC,CAAC;IAC7D,OAAO,oBAAC,qBAAqB,oBAAK,KAAK,EAAM,kBAAkB,EAAI,CAAC;AACtE,CAAC;AAED,gBAAgB,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { ContentLayoutProps } from './interfaces';\nimport InternalContentLayout from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { ContentLayoutProps };\n\nexport default function ContentLayout(props: ContentLayoutProps) {\n const baseComponentProps = useBaseComponent('ContentLayout');\n return <InternalContentLayout {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(ContentLayout, 'ContentLayout');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["content-layout/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,qBAAqB,MAAM,YAAY,CAAC;AAC/C,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAIpE,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,KAAyB;IAC7D,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,eAAe,EAAE;QAC3D,KAAK,EAAE,EAAE,cAAc,EAAE,KAAK,CAAC,cAAc,EAAE;KAChD,CAAC,CAAC;IACH,OAAO,oBAAC,qBAAqB,oBAAK,KAAK,EAAM,kBAAkB,EAAI,CAAC;AACtE,CAAC;AAED,gBAAgB,CAAC,aAAa,EAAE,eAAe,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { ContentLayoutProps } from './interfaces';\nimport InternalContentLayout from './internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\n\nexport { ContentLayoutProps };\n\nexport default function ContentLayout(props: ContentLayoutProps) {\n const baseComponentProps = useBaseComponent('ContentLayout', {\n props: { disableOverlap: props.disableOverlap },\n });\n return <InternalContentLayout {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(ContentLayout, 'ContentLayout');\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["copy-to-clipboard/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAUpD,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAEhC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,OAAkB,EAClB,mBAAmB,EACnB,cAAc,EACd,eAAe,EACf,aAAa,EACb,UAAU,EACV,GAAG,SAAS,EACb,EAAE,oBAAoB,eAqEtB"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["copy-to-clipboard/index.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAUpD,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAEhC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,OAAkB,EAClB,mBAAmB,EACnB,cAAc,EACd,eAAe,EACf,aAAa,EACb,UAAU,EACV,GAAG,SAAS,EACb,EAAE,oBAAoB,eAuEtB"}
@@ -13,7 +13,9 @@ import testStyles from './test-classes/styles.css.js';
13
13
  import clsx from 'clsx';
14
14
  export default function CopyToClipboard(_a) {
15
15
  var { variant = 'button', copyButtonAriaLabel, copyButtonText, copySuccessText, copyErrorText, textToCopy } = _a, restProps = __rest(_a, ["variant", "copyButtonAriaLabel", "copyButtonText", "copySuccessText", "copyErrorText", "textToCopy"]);
16
- const { __internalRootRef } = useBaseComponent('CopyToClipboard');
16
+ const { __internalRootRef } = useBaseComponent('CopyToClipboard', {
17
+ props: { variant },
18
+ });
17
19
  const baseProps = getBaseProps(restProps);
18
20
  const copyButtonProps = variant === 'button'
19
21
  ? { children: copyButtonText, ariaLabel: copyButtonAriaLabel }
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["copy-to-clipboard/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, { useState } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { CopyToClipboardProps } from './interfaces';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport InternalButton from '../button/internal';\nimport InternalPopover from '../popover/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\nimport clsx from 'clsx';\n\nexport { CopyToClipboardProps };\n\nexport default function CopyToClipboard({\n variant = 'button',\n copyButtonAriaLabel,\n copyButtonText,\n copySuccessText,\n copyErrorText,\n textToCopy,\n ...restProps\n}: CopyToClipboardProps) {\n const { __internalRootRef } = useBaseComponent('CopyToClipboard');\n const baseProps = getBaseProps(restProps);\n\n const copyButtonProps =\n variant === 'button'\n ? { children: copyButtonText, ariaLabel: copyButtonAriaLabel }\n : { ariaLabel: copyButtonAriaLabel ?? copyButtonText };\n\n const [status, setStatus] = useState<'pending' | 'success' | 'error'>('pending');\n const [statusText, setStatusText] = useState('');\n\n const onClick = () => {\n if (navigator.clipboard) {\n setStatus('pending');\n setStatusText('');\n navigator.clipboard\n .writeText(textToCopy)\n .then(() => {\n setStatus('success');\n setStatusText(copySuccessText);\n })\n .catch(() => {\n setStatus('error');\n setStatusText(copyErrorText);\n });\n }\n };\n\n const triggerVariant = (\n {\n button: 'normal',\n icon: 'icon',\n inline: 'inline-icon',\n } as const\n )[variant];\n\n const trigger = (\n <InternalPopover\n size=\"medium\"\n position=\"top\"\n triggerType=\"custom\"\n dismissButton={false}\n renderWithPortal={true}\n content={<InternalStatusIndicator type={status}>{statusText}</InternalStatusIndicator>}\n >\n <InternalButton\n {...copyButtonProps}\n iconName=\"copy\"\n onClick={onClick}\n variant={triggerVariant}\n wrapText={false}\n formAction=\"none\"\n />\n </InternalPopover>\n );\n\n return (\n <span ref={__internalRootRef} {...baseProps} className={clsx(baseProps.className, styles.root, testStyles.root)}>\n {variant === 'inline' ? (\n <span className={styles['inline-container']}>\n <span className={styles['inline-container-trigger']}>{trigger}</span>\n <span className={testStyles['text-to-copy']}>{textToCopy}</span>\n </span>\n ) : (\n trigger\n )}\n </span>\n );\n}\n\napplyDisplayName(CopyToClipboard, 'CopyToClipboard');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["copy-to-clipboard/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, { useState } from 'react';\nimport { getBaseProps } from '../internal/base-component';\nimport { CopyToClipboardProps } from './interfaces';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport InternalButton from '../button/internal';\nimport InternalPopover from '../popover/internal';\nimport InternalStatusIndicator from '../status-indicator/internal';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\nimport clsx from 'clsx';\n\nexport { CopyToClipboardProps };\n\nexport default function CopyToClipboard({\n variant = 'button',\n copyButtonAriaLabel,\n copyButtonText,\n copySuccessText,\n copyErrorText,\n textToCopy,\n ...restProps\n}: CopyToClipboardProps) {\n const { __internalRootRef } = useBaseComponent('CopyToClipboard', {\n props: { variant },\n });\n const baseProps = getBaseProps(restProps);\n\n const copyButtonProps =\n variant === 'button'\n ? { children: copyButtonText, ariaLabel: copyButtonAriaLabel }\n : { ariaLabel: copyButtonAriaLabel ?? copyButtonText };\n\n const [status, setStatus] = useState<'pending' | 'success' | 'error'>('pending');\n const [statusText, setStatusText] = useState('');\n\n const onClick = () => {\n if (navigator.clipboard) {\n setStatus('pending');\n setStatusText('');\n navigator.clipboard\n .writeText(textToCopy)\n .then(() => {\n setStatus('success');\n setStatusText(copySuccessText);\n })\n .catch(() => {\n setStatus('error');\n setStatusText(copyErrorText);\n });\n }\n };\n\n const triggerVariant = (\n {\n button: 'normal',\n icon: 'icon',\n inline: 'inline-icon',\n } as const\n )[variant];\n\n const trigger = (\n <InternalPopover\n size=\"medium\"\n position=\"top\"\n triggerType=\"custom\"\n dismissButton={false}\n renderWithPortal={true}\n content={<InternalStatusIndicator type={status}>{statusText}</InternalStatusIndicator>}\n >\n <InternalButton\n {...copyButtonProps}\n iconName=\"copy\"\n onClick={onClick}\n variant={triggerVariant}\n wrapText={false}\n formAction=\"none\"\n />\n </InternalPopover>\n );\n\n return (\n <span ref={__internalRootRef} {...baseProps} className={clsx(baseProps.className, styles.root, testStyles.root)}>\n {variant === 'inline' ? (\n <span className={styles['inline-container']}>\n <span className={styles['inline-container-trigger']}>{trigger}</span>\n <span className={testStyles['text-to-copy']}>{textToCopy}</span>\n </span>\n ) : (\n trigger\n )}\n </span>\n );\n}\n\napplyDisplayName(CopyToClipboard, 'CopyToClipboard');\n"]}
@@ -1,4 +1,4 @@
1
1
  export var PACKAGE_SOURCE = "components";
2
- export var PACKAGE_VERSION = "3.0.0 (93756938)";
2
+ export var PACKAGE_VERSION = "3.0.0 (49293d33)";
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 (93756938)",
3
+ "PACKAGE_VERSION": "3.0.0 (49293d33)",
4
4
  "THEME": "default",
5
5
  "ALWAYS_VISUAL_REFRESH": false
6
6
  }
@@ -1,3 +1,3 @@
1
1
  {
2
- "commit": "937569380586b8dc04db99fcab1a59ee4b7c37aa"
2
+ "commit": "49293d337ab741d9a8b3b7295a11f5b908a8ef8b"
3
3
  }
package/package.json CHANGED
@@ -116,7 +116,7 @@
116
116
  "./internal/base-component/index.js",
117
117
  "./internal/base-component/styles.css.js"
118
118
  ],
119
- "version": "3.0.555",
119
+ "version": "3.0.557",
120
120
  "repository": {
121
121
  "type": "git",
122
122
  "url": "https://github.com/cloudscape-design/components.git"
package/tabs/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import { TabsProps } from './interfaces';
3
3
  export { TabsProps };
4
- export default function Tabs({ tabs, variant, onChange, activeTabId: controlledTabId, ariaLabel, ariaLabelledby, disableContentPaddings, i18nStrings, ...rest }: TabsProps): JSX.Element;
4
+ export default function Tabs({ tabs, variant, onChange, activeTabId: controlledTabId, ariaLabel, ariaLabelledby, disableContentPaddings, i18nStrings, fitHeight, ...rest }: TabsProps): JSX.Element;
5
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["tabs/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAUzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAUrB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,IAAI,EACJ,OAAmB,EACnB,QAAQ,EACR,WAAW,EAAE,eAAe,EAC5B,SAAS,EACT,cAAc,EACd,sBAA8B,EAC9B,WAAW,EACX,GAAG,IAAI,EACR,EAAE,SAAS,eA4FX"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"lib/default/","sources":["tabs/index.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAUzC,OAAO,EAAE,SAAS,EAAE,CAAC;AAUrB,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAC3B,IAAI,EACJ,OAAmB,EACnB,QAAQ,EACR,WAAW,EAAE,eAAe,EAC5B,SAAS,EACT,cAAc,EACd,sBAA8B,EAC9B,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACR,EAAE,SAAS,eAiGX"}
package/tabs/index.js CHANGED
@@ -22,7 +22,7 @@ function firstEnabledTab(tabs) {
22
22
  }
23
23
  export default function Tabs(_a) {
24
24
  var _b, _c;
25
- var { tabs, variant = 'default', onChange, activeTabId: controlledTabId, ariaLabel, ariaLabelledby, disableContentPaddings = false, i18nStrings } = _a, rest = __rest(_a, ["tabs", "variant", "onChange", "activeTabId", "ariaLabel", "ariaLabelledby", "disableContentPaddings", "i18nStrings"]);
25
+ var { tabs, variant = 'default', onChange, activeTabId: controlledTabId, ariaLabel, ariaLabelledby, disableContentPaddings = false, i18nStrings, fitHeight } = _a, rest = __rest(_a, ["tabs", "variant", "onChange", "activeTabId", "ariaLabel", "ariaLabelledby", "disableContentPaddings", "i18nStrings", "fitHeight"]);
26
26
  for (const tab of tabs) {
27
27
  checkSafeUrl('Tabs', tab.href);
28
28
  }
@@ -64,9 +64,9 @@ export default function Tabs(_a) {
64
64
  fireNonCancelableEvent(onChange, changeDetail);
65
65
  }, i18nStrings: i18nStrings }));
66
66
  if (variant === 'container' || variant === 'stacked') {
67
- return (React.createElement(InternalContainer, Object.assign({ header: header, disableHeaderPaddings: true }, baseProps, { className: clsx(baseProps.className, styles.root), __internalRootRef: __internalRootRef, disableContentPaddings: true, variant: variant === 'stacked' ? 'stacked' : 'default' }), content()));
67
+ return (React.createElement(InternalContainer, Object.assign({ header: header, disableHeaderPaddings: true }, baseProps, { className: clsx(baseProps.className, styles.root), __internalRootRef: __internalRootRef, disableContentPaddings: true, variant: variant === 'stacked' ? 'stacked' : 'default', fitHeight: fitHeight }), content()));
68
68
  }
69
- return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root, styles.tabs), ref: __internalRootRef }),
69
+ return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root, styles.tabs, { [styles['fit-height']]: fitHeight }), ref: __internalRootRef }),
70
70
  header,
71
71
  content()));
72
72
  }
package/tabs/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["tabs/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';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport InternalContainer from '../container/internal';\nimport { TabsProps } from './interfaces';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { getTabElementId, TabHeaderBar } from './tab-header-bar';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nexport { TabsProps };\n\nfunction firstEnabledTab(tabs: ReadonlyArray<TabsProps.Tab>) {\n const enabledTabs = tabs.filter(tab => !tab.disabled);\n if (enabledTabs.length > 0) {\n return enabledTabs[0];\n }\n return null;\n}\n\nexport default function Tabs({\n tabs,\n variant = 'default',\n onChange,\n activeTabId: controlledTabId,\n ariaLabel,\n ariaLabelledby,\n disableContentPaddings = false,\n i18nStrings,\n ...rest\n}: TabsProps) {\n for (const tab of tabs) {\n checkSafeUrl('Tabs', tab.href);\n }\n const { __internalRootRef } = useBaseComponent('Tabs');\n const idNamespace = useUniqueId('awsui-tabs-');\n\n const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, firstEnabledTab(tabs)?.id ?? '', {\n componentName: 'Tabs',\n controlledProp: 'activeTabId',\n changeHandler: 'onChange',\n });\n\n const baseProps = getBaseProps(rest);\n\n const content = () => {\n const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];\n const renderContent = (tab: TabsProps.Tab) => {\n const isTabSelected = tab === selectedTab;\n\n const classes = clsx({\n [styles['tabs-content']]: true,\n [styles['tabs-content-active']]: isTabSelected,\n });\n\n const contentAttributes: JSX.IntrinsicElements['div'] = {\n className: classes,\n role: 'tabpanel',\n id: `${idNamespace}-${tab.id}-panel`,\n key: `${idNamespace}-${tab.id}-panel`,\n tabIndex: 0,\n 'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n };\n\n const isContentShown = isTabSelected && !selectedTab.disabled;\n return <div {...contentAttributes}>{isContentShown && selectedTab.content}</div>;\n };\n\n return (\n <div\n className={clsx(\n variant === 'container' || variant === 'stacked'\n ? styles['tabs-container-content-wrapper']\n : styles['tabs-content-wrapper'],\n {\n [styles['with-paddings']]: !disableContentPaddings,\n }\n )}\n >\n {tabs.map(renderContent)}\n </div>\n );\n };\n\n const header = (\n <TabHeaderBar\n activeTabId={activeTabId}\n variant={variant}\n idNamespace={idNamespace}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n tabs={tabs}\n onChange={changeDetail => {\n setActiveTabId(changeDetail.activeTabId);\n fireNonCancelableEvent(onChange, changeDetail);\n }}\n i18nStrings={i18nStrings}\n />\n );\n\n if (variant === 'container' || variant === 'stacked') {\n return (\n <InternalContainer\n header={header}\n disableHeaderPaddings={true}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n __internalRootRef={__internalRootRef}\n disableContentPaddings={true}\n variant={variant === 'stacked' ? 'stacked' : 'default'}\n >\n {content()}\n </InternalContainer>\n );\n }\n\n return (\n <div {...baseProps} className={clsx(baseProps.className, styles.root, styles.tabs)} ref={__internalRootRef}>\n {header}\n {content()}\n </div>\n );\n}\n\napplyDisplayName(Tabs, 'Tabs');\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"lib/default/","sources":["tabs/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';\nimport { getBaseProps } from '../internal/base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport InternalContainer from '../container/internal';\nimport { TabsProps } from './interfaces';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport { getTabElementId, TabHeaderBar } from './tab-header-bar';\nimport { useControllable } from '../internal/hooks/use-controllable';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { checkSafeUrl } from '../internal/utils/check-safe-url';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nexport { TabsProps };\n\nfunction firstEnabledTab(tabs: ReadonlyArray<TabsProps.Tab>) {\n const enabledTabs = tabs.filter(tab => !tab.disabled);\n if (enabledTabs.length > 0) {\n return enabledTabs[0];\n }\n return null;\n}\n\nexport default function Tabs({\n tabs,\n variant = 'default',\n onChange,\n activeTabId: controlledTabId,\n ariaLabel,\n ariaLabelledby,\n disableContentPaddings = false,\n i18nStrings,\n fitHeight,\n ...rest\n}: TabsProps) {\n for (const tab of tabs) {\n checkSafeUrl('Tabs', tab.href);\n }\n const { __internalRootRef } = useBaseComponent('Tabs');\n const idNamespace = useUniqueId('awsui-tabs-');\n\n const [activeTabId, setActiveTabId] = useControllable(controlledTabId, onChange, firstEnabledTab(tabs)?.id ?? '', {\n componentName: 'Tabs',\n controlledProp: 'activeTabId',\n changeHandler: 'onChange',\n });\n\n const baseProps = getBaseProps(rest);\n\n const content = () => {\n const selectedTab = tabs.filter(tab => tab.id === activeTabId)[0];\n const renderContent = (tab: TabsProps.Tab) => {\n const isTabSelected = tab === selectedTab;\n\n const classes = clsx({\n [styles['tabs-content']]: true,\n [styles['tabs-content-active']]: isTabSelected,\n });\n\n const contentAttributes: JSX.IntrinsicElements['div'] = {\n className: classes,\n role: 'tabpanel',\n id: `${idNamespace}-${tab.id}-panel`,\n key: `${idNamespace}-${tab.id}-panel`,\n tabIndex: 0,\n 'aria-labelledby': getTabElementId({ namespace: idNamespace, tabId: tab.id }),\n };\n\n const isContentShown = isTabSelected && !selectedTab.disabled;\n return <div {...contentAttributes}>{isContentShown && selectedTab.content}</div>;\n };\n\n return (\n <div\n className={clsx(\n variant === 'container' || variant === 'stacked'\n ? styles['tabs-container-content-wrapper']\n : styles['tabs-content-wrapper'],\n {\n [styles['with-paddings']]: !disableContentPaddings,\n }\n )}\n >\n {tabs.map(renderContent)}\n </div>\n );\n };\n\n const header = (\n <TabHeaderBar\n activeTabId={activeTabId}\n variant={variant}\n idNamespace={idNamespace}\n ariaLabel={ariaLabel}\n ariaLabelledby={ariaLabelledby}\n tabs={tabs}\n onChange={changeDetail => {\n setActiveTabId(changeDetail.activeTabId);\n fireNonCancelableEvent(onChange, changeDetail);\n }}\n i18nStrings={i18nStrings}\n />\n );\n\n if (variant === 'container' || variant === 'stacked') {\n return (\n <InternalContainer\n header={header}\n disableHeaderPaddings={true}\n {...baseProps}\n className={clsx(baseProps.className, styles.root)}\n __internalRootRef={__internalRootRef}\n disableContentPaddings={true}\n variant={variant === 'stacked' ? 'stacked' : 'default'}\n fitHeight={fitHeight}\n >\n {content()}\n </InternalContainer>\n );\n }\n\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root, styles.tabs, { [styles['fit-height']]: fitHeight })}\n ref={__internalRootRef}\n >\n {header}\n {content()}\n </div>\n );\n}\n\napplyDisplayName(Tabs, 'Tabs');\n"]}
@@ -55,6 +55,11 @@ export interface TabsProps extends BaseComponentProps {
55
55
  * @i18n
56
56
  */
57
57
  i18nStrings?: TabsProps.I18nStrings;
58
+ /**
59
+ * Enabling this property makes the tab content fit to the available height.
60
+ * If the tab content is too short, it will stretch. If the tab content is too long, a vertical scrollbar will be shown.
61
+ */
62
+ fitHeight?: boolean;
58
63
  }
59
64
  export declare namespace TabsProps {
60
65
  type Variant = 'default' | 'container' | 'stacked';
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["tabs/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,SAAU,SAAQ,kBAAkB;IACnD;;;;;;;;;;;;OAYG;IACH,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IAEnC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IAE7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;CACrC;AACD,yBAAiB,SAAS,CAAC;IACzB,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC;IAE1D,UAAiB,GAAG;QAClB;;WAEG;QACH,EAAE,EAAE,MAAM,CAAC;QACX;;WAEG;QACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB;;WAEG;QACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B;;WAEG;QACH,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB;;;;;;WAMG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,YAAY;QAC3B;;WAEG;QACH,WAAW,EAAE,MAAM,CAAC;QACpB;;WAEG;QACH,aAAa,CAAC,EAAE,MAAM,CAAC;KACxB;IAED,UAAiB,WAAW;QAC1B;;WAEG;QACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B;;WAEG;QACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;KAC/B;CACF"}
1
+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["tabs/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,SAAU,SAAQ,kBAAkB;IACnD;;;;;;;;;;;;OAYG;IACH,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IAEnC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC;IAE5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,SAAS,CAAC,YAAY,CAAC,CAAC;IAE7D;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,WAAW,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AACD,yBAAiB,SAAS,CAAC;IACzB,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC;IAE1D,UAAiB,GAAG;QAClB;;WAEG;QACH,EAAE,EAAE,MAAM,CAAC;QACX;;WAEG;QACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;QACvB;;WAEG;QACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B;;WAEG;QACH,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB;;;;;;WAMG;QACH,IAAI,CAAC,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,YAAY;QAC3B;;WAEG;QACH,WAAW,EAAE,MAAM,CAAC;QACpB;;WAEG;QACH,aAAa,CAAC,EAAE,MAAM,CAAC;KACxB;IAED,UAAiB,WAAW;QAC1B;;WAEG;QACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B;;WAEG;QACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;KAC/B;CACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["tabs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface TabsProps extends BaseComponentProps {\n /**\n * Specifies the tabs to display. Each tab object has the following properties:\n *\n * - `id` (string) - The tab identifier. This value needs to be passed to the Tabs component as `activeTabId` to select this tab.\n * - `label` (ReactNode) - Tab label shown in the UI.\n * - `content` (ReactNode) - (Optional) Tab content to render in the container.\n * - `disabled` (boolean) - (Optional) Specifies if this tab is disabled.\n * - `href` (string) - (Optional) You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (that is, CTRL,\n * ALT, SHIFT, META). This enables the user to open new browser tabs with an initially selected component tab,\n * if your application routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n tabs: ReadonlyArray<TabsProps.Tab>;\n\n /**\n * The possible visual variants of tabs are the following:\n * * `default` - Use in any context.\n * * `container` - Use this variant to have the tabs displayed within a container header.\n * * `stacked` - Use this variant directly adjacent to other stacked containers (such as a container, table).\n * @visualrefresh `stacked` variant\n */\n variant?: TabsProps.Variant;\n\n /**\n * Called whenever the user selects a different tab.\n * The event's `detail` contains the new `activeTabId`.\n */\n onChange?: NonCancelableEventHandler<TabsProps.ChangeDetail>;\n\n /**\n * The `id` of the currently active tab.\n * * If you don't set this property, the component activates the first tab and switches tabs automatically when a tab header is clicked (that is, uncontrolled behavior).\n * * If you explicitly set this property, you must set define an `onChange` handler to update the property when a tab header is clicked (that is, controlled behavior).\n */\n activeTabId?: string;\n\n /**\n * Provides an `aria-label` to the tab container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n\n /**\n * Sets the `aria-labelledby` property on the tab container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Determines whether the tab content has padding. If `true`, removes the default padding from the tab content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n * @i18n\n */\n i18nStrings?: TabsProps.I18nStrings;\n}\nexport namespace TabsProps {\n export type Variant = 'default' | 'container' | 'stacked';\n\n export interface Tab {\n /**\n * The tab id. This value will be need to be passed to the Tabs component as `activeTabId` to select this tab.\n */\n id: string;\n /**\n * Tab label shown in the UI.\n */\n label: React.ReactNode;\n /**\n * Tab content to render in the container.\n */\n content?: React.ReactNode;\n /**\n * Whether this tab is disabled.\n */\n disabled?: boolean;\n /**\n * You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (CTRL,\n * ALT, SHIFT, META). This allows to open new browser tabs with an initially selected component tab,\n * when the routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n href?: string;\n }\n\n export interface ChangeDetail {\n /**\n * The ID of the clicked tab.\n */\n activeTabId: string;\n /**\n * The `href` attribute of the clicked tab, if defined.\n */\n activeTabHref?: string;\n }\n\n export interface I18nStrings {\n /**\n * ARIA label for the scroll left button that appears when the tab header is wider than the container.\n */\n scrollLeftAriaLabel?: string;\n /**\n * ARIA label for the scroll right button that appears when the tab header is wider than the container.\n */\n scrollRightAriaLabel?: string;\n }\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["tabs/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface TabsProps extends BaseComponentProps {\n /**\n * Specifies the tabs to display. Each tab object has the following properties:\n *\n * - `id` (string) - The tab identifier. This value needs to be passed to the Tabs component as `activeTabId` to select this tab.\n * - `label` (ReactNode) - Tab label shown in the UI.\n * - `content` (ReactNode) - (Optional) Tab content to render in the container.\n * - `disabled` (boolean) - (Optional) Specifies if this tab is disabled.\n * - `href` (string) - (Optional) You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (that is, CTRL,\n * ALT, SHIFT, META). This enables the user to open new browser tabs with an initially selected component tab,\n * if your application routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n tabs: ReadonlyArray<TabsProps.Tab>;\n\n /**\n * The possible visual variants of tabs are the following:\n * * `default` - Use in any context.\n * * `container` - Use this variant to have the tabs displayed within a container header.\n * * `stacked` - Use this variant directly adjacent to other stacked containers (such as a container, table).\n * @visualrefresh `stacked` variant\n */\n variant?: TabsProps.Variant;\n\n /**\n * Called whenever the user selects a different tab.\n * The event's `detail` contains the new `activeTabId`.\n */\n onChange?: NonCancelableEventHandler<TabsProps.ChangeDetail>;\n\n /**\n * The `id` of the currently active tab.\n * * If you don't set this property, the component activates the first tab and switches tabs automatically when a tab header is clicked (that is, uncontrolled behavior).\n * * If you explicitly set this property, you must set define an `onChange` handler to update the property when a tab header is clicked (that is, controlled behavior).\n */\n activeTabId?: string;\n\n /**\n * Provides an `aria-label` to the tab container.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabel?: string;\n\n /**\n * Sets the `aria-labelledby` property on the tab container.\n * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n */\n ariaLabelledby?: string;\n\n /**\n * Determines whether the tab content has padding. If `true`, removes the default padding from the tab content area.\n */\n disableContentPaddings?: boolean;\n\n /**\n * An object containing all the necessary localized strings required by the component.\n * @i18n\n */\n i18nStrings?: TabsProps.I18nStrings;\n /**\n * Enabling this property makes the tab content fit to the available height.\n * If the tab content is too short, it will stretch. If the tab content is too long, a vertical scrollbar will be shown.\n */\n fitHeight?: boolean;\n}\nexport namespace TabsProps {\n export type Variant = 'default' | 'container' | 'stacked';\n\n export interface Tab {\n /**\n * The tab id. This value will be need to be passed to the Tabs component as `activeTabId` to select this tab.\n */\n id: string;\n /**\n * Tab label shown in the UI.\n */\n label: React.ReactNode;\n /**\n * Tab content to render in the container.\n */\n content?: React.ReactNode;\n /**\n * Whether this tab is disabled.\n */\n disabled?: boolean;\n /**\n * You can use this parameter to change the default `href` of the internal tab anchor. The\n * `click` event default behavior is prevented, unless the user clicks the tab with a key modifier (CTRL,\n * ALT, SHIFT, META). This allows to open new browser tabs with an initially selected component tab,\n * when the routing can handle such deep links. You can manually update routing on the current page\n * using the `activeTabHref` property of the `change` event's detail.\n */\n href?: string;\n }\n\n export interface ChangeDetail {\n /**\n * The ID of the clicked tab.\n */\n activeTabId: string;\n /**\n * The `href` attribute of the clicked tab, if defined.\n */\n activeTabHref?: string;\n }\n\n export interface I18nStrings {\n /**\n * ARIA label for the scroll left button that appears when the tab header is wider than the container.\n */\n scrollLeftAriaLabel?: string;\n /**\n * ARIA label for the scroll right button that appears when the tab header is wider than the container.\n */\n scrollRightAriaLabel?: string;\n }\n}\n"]}
@@ -1,26 +1,27 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "tabs-header": "awsui_tabs-header_14rmt_13jmh_198",
5
- "tabs-header-list": "awsui_tabs-header-list_14rmt_13jmh_206",
6
- "pagination-button": "awsui_pagination-button_14rmt_13jmh_223",
7
- "pagination-button-left": "awsui_pagination-button-left_14rmt_13jmh_230",
8
- "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_13jmh_233",
9
- "pagination-button-right": "awsui_pagination-button-right_14rmt_13jmh_237",
10
- "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_13jmh_240",
11
- "tabs-tab": "awsui_tabs-tab_14rmt_13jmh_245",
12
- "tabs-tab-label": "awsui_tabs-tab-label_14rmt_13jmh_257",
13
- "tabs-tab-link": "awsui_tabs-tab-link_14rmt_13jmh_273",
14
- "refresh": "awsui_refresh_14rmt_13jmh_292",
15
- "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_13jmh_343",
16
- "tabs-tab-active": "awsui_tabs-tab-active_14rmt_13jmh_378",
17
- "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_13jmh_385",
18
- "root": "awsui_root_14rmt_13jmh_389",
19
- "tabs": "awsui_tabs_14rmt_13jmh_198",
20
- "tabs-content": "awsui_tabs-content_14rmt_13jmh_430",
21
- "tabs-content-active": "awsui_tabs-content-active_14rmt_13jmh_434",
22
- "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_13jmh_447",
23
- "with-paddings": "awsui_with-paddings_14rmt_13jmh_447",
24
- "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_13jmh_452"
4
+ "tabs-header": "awsui_tabs-header_14rmt_n8497_198",
5
+ "tabs-header-list": "awsui_tabs-header-list_14rmt_n8497_206",
6
+ "pagination-button": "awsui_pagination-button_14rmt_n8497_223",
7
+ "pagination-button-left": "awsui_pagination-button-left_14rmt_n8497_230",
8
+ "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_n8497_233",
9
+ "pagination-button-right": "awsui_pagination-button-right_14rmt_n8497_237",
10
+ "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_n8497_240",
11
+ "tabs-tab": "awsui_tabs-tab_14rmt_n8497_245",
12
+ "tabs-tab-label": "awsui_tabs-tab-label_14rmt_n8497_257",
13
+ "tabs-tab-link": "awsui_tabs-tab-link_14rmt_n8497_273",
14
+ "refresh": "awsui_refresh_14rmt_n8497_292",
15
+ "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_n8497_343",
16
+ "tabs-tab-active": "awsui_tabs-tab-active_14rmt_n8497_378",
17
+ "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_n8497_385",
18
+ "root": "awsui_root_14rmt_n8497_389",
19
+ "tabs": "awsui_tabs_14rmt_n8497_198",
20
+ "tabs-content": "awsui_tabs-content_14rmt_n8497_430",
21
+ "fit-height": "awsui_fit-height_14rmt_n8497_434",
22
+ "tabs-content-active": "awsui_tabs-content-active_14rmt_n8497_440",
23
+ "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_n8497_454",
24
+ "with-paddings": "awsui_with-paddings_14rmt_n8497_454",
25
+ "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_n8497_465"
25
26
  };
26
27
 
@@ -195,7 +195,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
195
195
  SPDX-License-Identifier: Apache-2.0
196
196
  */
197
197
  /* stylelint-disable selector-max-type */
198
- .awsui_tabs-header_14rmt_13jmh_198:not(#\9) {
198
+ .awsui_tabs-header_14rmt_n8497_198:not(#\9) {
199
199
  margin-block: 0;
200
200
  margin-inline: 0;
201
201
  padding-block: 0;
@@ -203,7 +203,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
203
203
  display: flex;
204
204
  }
205
205
 
206
- .awsui_tabs-header-list_14rmt_13jmh_206:not(#\9) {
206
+ .awsui_tabs-header-list_14rmt_n8497_206:not(#\9) {
207
207
  margin-block: 0;
208
208
  margin-inline: 0;
209
209
  padding-block: 0;
@@ -216,33 +216,33 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
216
216
  -ms-overflow-style: none; /* Internet Explorer 10+ */
217
217
  scrollbar-width: none; /* Firefox */
218
218
  }
219
- .awsui_tabs-header-list_14rmt_13jmh_206:not(#\9)::-webkit-scrollbar {
219
+ .awsui_tabs-header-list_14rmt_n8497_206:not(#\9)::-webkit-scrollbar {
220
220
  display: none; /* Safari and Chrome */
221
221
  }
222
222
 
223
- .awsui_pagination-button_14rmt_13jmh_223:not(#\9) {
223
+ .awsui_pagination-button_14rmt_n8497_223:not(#\9) {
224
224
  margin-block: var(--space-scaled-s-aqzyko, 12px);
225
225
  margin-inline: 0;
226
226
  padding-block: 0;
227
227
  padding-inline: var(--space-xxs-p8yyaw, 4px);
228
228
  display: flex;
229
229
  }
230
- .awsui_pagination-button-left_14rmt_13jmh_230:not(#\9) {
230
+ .awsui_pagination-button-left_14rmt_n8497_230:not(#\9) {
231
231
  border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-control-disabled-bv2kkn, #d1d5db);
232
232
  }
233
- .awsui_pagination-button-left-scrollable_14rmt_13jmh_233:not(#\9) {
233
+ .awsui_pagination-button-left-scrollable_14rmt_n8497_233:not(#\9) {
234
234
  z-index: 1;
235
235
  box-shadow: 5px 0px 4px -3px var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12)), 1px 0px 0px 0px var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12));
236
236
  }
237
- .awsui_pagination-button-right_14rmt_13jmh_237:not(#\9) {
237
+ .awsui_pagination-button-right_14rmt_n8497_237:not(#\9) {
238
238
  border-inline-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-control-disabled-bv2kkn, #d1d5db);
239
239
  }
240
- .awsui_pagination-button-right-scrollable_14rmt_13jmh_240:not(#\9) {
240
+ .awsui_pagination-button-right-scrollable_14rmt_n8497_240:not(#\9) {
241
241
  z-index: 1;
242
242
  box-shadow: -5px 0px 4px -3px var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12)), -1px 0px 0px 0 var(--color-border-tabs-shadow-w5xpb4, rgba(0, 7, 22, 0.12));
243
243
  }
244
244
 
245
- .awsui_tabs-tab_14rmt_13jmh_245:not(#\9) {
245
+ .awsui_tabs-tab_14rmt_n8497_245:not(#\9) {
246
246
  list-style: none;
247
247
  padding-block: 0;
248
248
  padding-inline: 0;
@@ -250,11 +250,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
250
250
  display: flex;
251
251
  max-inline-size: calc(90% - var(--space-l-t419sm, 20px));
252
252
  }
253
- .awsui_tabs-tab_14rmt_13jmh_245 > button:not(#\9) {
253
+ .awsui_tabs-tab_14rmt_n8497_245 > button:not(#\9) {
254
254
  background-color: transparent;
255
255
  }
256
256
 
257
- .awsui_tabs-tab-label_14rmt_13jmh_257:not(#\9) {
257
+ .awsui_tabs-tab-label_14rmt_n8497_257:not(#\9) {
258
258
  display: flex;
259
259
  align-items: center;
260
260
  padding-block: var(--space-scaled-2x-xxs-7v8ivz, 4px);
@@ -265,12 +265,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
265
265
  word-break: break-word;
266
266
  }
267
267
 
268
- .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_13jmh_257, .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_13jmh_257 {
268
+ .awsui_tabs-tab_14rmt_n8497_245:not(#\9):not(:last-child) > a > .awsui_tabs-tab-label_14rmt_n8497_257, .awsui_tabs-tab_14rmt_n8497_245:not(#\9):not(:last-child) > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
269
269
  margin-inline-end: calc(-1 * var(--border-divider-section-width-1061zr, 1px));
270
270
  border-inline-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-tabs-divider-6vpso4, #b6bec9);
271
271
  }
272
272
 
273
- .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9) {
273
+ .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9) {
274
274
  position: relative;
275
275
  display: flex;
276
276
  align-items: stretch;
@@ -289,26 +289,26 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
289
289
  -webkit-font-smoothing: var(--font-smoothing-webkit-m8nc84, antialiased);
290
290
  -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-foywby, grayscale);
291
291
  }
292
- .awsui_tabs-tab-link_14rmt_13jmh_273.awsui_refresh_14rmt_13jmh_292:not(#\9) {
292
+ .awsui_tabs-tab-link_14rmt_n8497_273.awsui_refresh_14rmt_n8497_292:not(#\9) {
293
293
  padding-block-start: calc(var(--space-static-xs-7sfb63, 8px) - 1px);
294
294
  padding-block-end: var(--space-static-xs-7sfb63, 8px);
295
295
  padding-inline: 0;
296
296
  }
297
- .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):hover {
297
+ .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):hover {
298
298
  color: var(--color-text-accent-n2acxv, #0972d3);
299
299
  }
300
- .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):focus {
300
+ .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus {
301
301
  outline: none;
302
302
  }
303
- body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):focus {
303
+ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus {
304
304
  z-index: 1;
305
305
  position: relative;
306
306
  }
307
- body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):focus {
307
+ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus {
308
308
  outline: 2px dotted transparent;
309
309
  outline-offset: calc(var(--space-tabs-focus-outline-gutter-xm37ly, -8px) - 1px);
310
310
  }
311
- body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):focus::before {
311
+ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus::before {
312
312
  content: " ";
313
313
  display: block;
314
314
  position: absolute;
@@ -322,32 +322,32 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9
322
322
  border-end-end-radius: var(--border-radius-control-default-focus-ring-u8zbsz, 4px);
323
323
  box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
324
324
  }
325
- body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_13jmh_257, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_13jmh_257 {
325
+ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus > a > .awsui_tabs-tab-label_14rmt_n8497_257, body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):focus > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
326
326
  border-inline-end-color: transparent;
327
327
  }
328
328
 
329
- .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):first-child {
329
+ .awsui_tabs-tab_14rmt_n8497_245:not(#\9):first-child {
330
330
  margin-inline-start: 1px;
331
331
  }
332
- .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_13jmh_257, .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_13jmh_257 {
332
+ .awsui_tabs-tab_14rmt_n8497_245:not(#\9):first-child > a > .awsui_tabs-tab-label_14rmt_n8497_257, .awsui_tabs-tab_14rmt_n8497_245:not(#\9):first-child > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
333
333
  padding-inline-start: calc(var(--space-l-t419sm, 20px) - 1px);
334
334
  }
335
335
 
336
- .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):last-child {
336
+ .awsui_tabs-tab_14rmt_n8497_245:not(#\9):last-child {
337
337
  margin-inline-end: 1px;
338
338
  }
339
- .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_13jmh_257, .awsui_tabs-tab_14rmt_13jmh_245:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_13jmh_257 {
339
+ .awsui_tabs-tab_14rmt_n8497_245:not(#\9):last-child > a > .awsui_tabs-tab-label_14rmt_n8497_257, .awsui_tabs-tab_14rmt_n8497_245:not(#\9):last-child > button > .awsui_tabs-tab-label_14rmt_n8497_257 {
340
340
  padding-inline-end: calc(var(--space-l-t419sm, 20px) - 1px);
341
341
  }
342
342
 
343
- .awsui_tabs-tab-disabled_14rmt_13jmh_343:not(#\9), .awsui_tabs-tab-disabled_14rmt_13jmh_343:not(#\9):hover {
343
+ .awsui_tabs-tab-disabled_14rmt_n8497_343:not(#\9), .awsui_tabs-tab-disabled_14rmt_n8497_343:not(#\9):hover {
344
344
  pointer-events: none;
345
345
  cursor: default;
346
346
  color: var(--color-text-interactive-disabled-z7a3t4, #9ba7b6);
347
347
  font-weight: var(--font-tabs-disabled-weight-1xcs5l, 700);
348
348
  }
349
349
 
350
- .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343):after {
350
+ .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343):after {
351
351
  content: "";
352
352
  position: absolute;
353
353
  inset-inline-start: 0;
@@ -361,36 +361,36 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9
361
361
  background: var(--color-border-tabs-underline-f1qo5r, #0972d3);
362
362
  opacity: 0;
363
363
  }
364
- .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343).awsui_refresh_14rmt_13jmh_292:after {
364
+ .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after {
365
365
  transition: opacity var(--motion-duration-refresh-only-medium-nf6485, 165ms) var(--motion-easing-refresh-only-c-vg1m9h, cubic-bezier(0.84, 0, 0.16, 1));
366
366
  }
367
367
  @media (prefers-reduced-motion: reduce) {
368
- .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343).awsui_refresh_14rmt_13jmh_292:after {
368
+ .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after {
369
369
  animation: none;
370
370
  transition: none;
371
371
  }
372
372
  }
373
- .awsui-motion-disabled .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343).awsui_refresh_14rmt_13jmh_292:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343).awsui_refresh_14rmt_13jmh_292:after {
373
+ .awsui-motion-disabled .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after, .awsui-mode-entering .awsui_tabs-tab-link_14rmt_n8497_273:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343).awsui_refresh_14rmt_n8497_292:after {
374
374
  animation: none;
375
375
  transition: none;
376
376
  }
377
377
 
378
- .awsui_tabs-tab-active_14rmt_13jmh_378:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343) {
378
+ .awsui_tabs-tab-active_14rmt_n8497_378:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343) {
379
379
  color: var(--color-text-accent-n2acxv, #0972d3);
380
380
  }
381
- .awsui_tabs-tab-active_14rmt_13jmh_378:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_13jmh_343):after {
381
+ .awsui_tabs-tab-active_14rmt_n8497_378:not(#\9):not(.awsui_tabs-tab-disabled_14rmt_n8497_343):after {
382
382
  opacity: 1;
383
383
  }
384
384
 
385
- .awsui_tabs-header-with-divider_14rmt_13jmh_385:not(#\9) {
385
+ .awsui_tabs-header-with-divider_14rmt_n8497_385:not(#\9) {
386
386
  border-block-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-tabs-divider-6vpso4, #b6bec9);
387
387
  }
388
388
 
389
- .awsui_root_14rmt_13jmh_389:not(#\9) {
389
+ .awsui_root_14rmt_n8497_389:not(#\9) {
390
390
  /* used in test-utils or tests */
391
391
  }
392
392
 
393
- .awsui_tabs_14rmt_13jmh_198:not(#\9) {
393
+ .awsui_tabs_14rmt_n8497_198:not(#\9) {
394
394
  border-collapse: separate;
395
395
  border-spacing: 0;
396
396
  box-sizing: border-box;
@@ -428,14 +428,21 @@ body[data-awsui-focus-visible=true] .awsui_tabs-tab-link_14rmt_13jmh_273:not(#\9
428
428
  inline-size: 100%;
429
429
  }
430
430
 
431
- .awsui_tabs-content_14rmt_13jmh_430:not(#\9) {
431
+ .awsui_tabs-content_14rmt_n8497_430:not(#\9) {
432
432
  display: none;
433
433
  }
434
434
 
435
- .awsui_tabs-content-active_14rmt_13jmh_434:not(#\9) {
435
+ .awsui_fit-height_14rmt_n8497_434:not(#\9) {
436
+ display: flex;
437
+ flex-direction: column;
438
+ block-size: 100%;
439
+ }
440
+
441
+ .awsui_tabs-content-active_14rmt_n8497_440:not(#\9) {
436
442
  display: block;
443
+ flex: 1;
437
444
  }
438
- body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_13jmh_434:not(#\9):focus {
445
+ body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_n8497_440:not(#\9):focus {
439
446
  outline: 2px dotted transparent;
440
447
  outline-offset: 2px;
441
448
  border-start-start-radius: var(--border-radius-container-wqv1zi, 16px);
@@ -445,12 +452,23 @@ body[data-awsui-focus-visible=true] .awsui_tabs-content-active_14rmt_13jmh_434:n
445
452
  box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
446
453
  }
447
454
 
448
- .awsui_tabs-content-wrapper_14rmt_13jmh_447.awsui_with-paddings_14rmt_13jmh_447 > .awsui_tabs-content_14rmt_13jmh_430:not(#\9) {
455
+ .awsui_tabs-content-wrapper_14rmt_n8497_454.awsui_with-paddings_14rmt_n8497_454 > .awsui_tabs-content_14rmt_n8497_430:not(#\9) {
449
456
  padding-block: var(--space-scaled-m-mo5yse, 16px);
450
457
  padding-inline: 0;
451
458
  }
459
+ .awsui_fit-height_14rmt_n8497_434 > .awsui_tabs-content-wrapper_14rmt_n8497_454:not(#\9) {
460
+ flex: 1;
461
+ display: flex;
462
+ flex-direction: column;
463
+ overflow: auto;
464
+ }
452
465
 
453
- .awsui_tabs-container-content-wrapper_14rmt_13jmh_452.awsui_with-paddings_14rmt_13jmh_447 > .awsui_tabs-content_14rmt_13jmh_430:not(#\9) {
466
+ .awsui_fit-height_14rmt_n8497_434 > .awsui_tabs-content-wrapper_14rmt_n8497_454 > .awsui_tabs-container-content-wrapper_14rmt_n8497_465:not(#\9) {
467
+ block-size: 100%;
468
+ display: flex;
469
+ flex-direction: column;
470
+ }
471
+ .awsui_tabs-container-content-wrapper_14rmt_n8497_465.awsui_with-paddings_14rmt_n8497_454 > .awsui_tabs-content_14rmt_n8497_430:not(#\9) {
454
472
  padding-block-start: var(--space-tabs-content-top-dedu0k, 12px);
455
473
  padding-block-end: var(--space-scaled-l-0hpmd7, 20px);
456
474
  padding-inline: var(--space-container-horizontal-wfukh3, 20px);
@@ -2,26 +2,27 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "tabs-header": "awsui_tabs-header_14rmt_13jmh_198",
6
- "tabs-header-list": "awsui_tabs-header-list_14rmt_13jmh_206",
7
- "pagination-button": "awsui_pagination-button_14rmt_13jmh_223",
8
- "pagination-button-left": "awsui_pagination-button-left_14rmt_13jmh_230",
9
- "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_13jmh_233",
10
- "pagination-button-right": "awsui_pagination-button-right_14rmt_13jmh_237",
11
- "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_13jmh_240",
12
- "tabs-tab": "awsui_tabs-tab_14rmt_13jmh_245",
13
- "tabs-tab-label": "awsui_tabs-tab-label_14rmt_13jmh_257",
14
- "tabs-tab-link": "awsui_tabs-tab-link_14rmt_13jmh_273",
15
- "refresh": "awsui_refresh_14rmt_13jmh_292",
16
- "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_13jmh_343",
17
- "tabs-tab-active": "awsui_tabs-tab-active_14rmt_13jmh_378",
18
- "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_13jmh_385",
19
- "root": "awsui_root_14rmt_13jmh_389",
20
- "tabs": "awsui_tabs_14rmt_13jmh_198",
21
- "tabs-content": "awsui_tabs-content_14rmt_13jmh_430",
22
- "tabs-content-active": "awsui_tabs-content-active_14rmt_13jmh_434",
23
- "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_13jmh_447",
24
- "with-paddings": "awsui_with-paddings_14rmt_13jmh_447",
25
- "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_13jmh_452"
5
+ "tabs-header": "awsui_tabs-header_14rmt_n8497_198",
6
+ "tabs-header-list": "awsui_tabs-header-list_14rmt_n8497_206",
7
+ "pagination-button": "awsui_pagination-button_14rmt_n8497_223",
8
+ "pagination-button-left": "awsui_pagination-button-left_14rmt_n8497_230",
9
+ "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_n8497_233",
10
+ "pagination-button-right": "awsui_pagination-button-right_14rmt_n8497_237",
11
+ "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_n8497_240",
12
+ "tabs-tab": "awsui_tabs-tab_14rmt_n8497_245",
13
+ "tabs-tab-label": "awsui_tabs-tab-label_14rmt_n8497_257",
14
+ "tabs-tab-link": "awsui_tabs-tab-link_14rmt_n8497_273",
15
+ "refresh": "awsui_refresh_14rmt_n8497_292",
16
+ "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_n8497_343",
17
+ "tabs-tab-active": "awsui_tabs-tab-active_14rmt_n8497_378",
18
+ "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_n8497_385",
19
+ "root": "awsui_root_14rmt_n8497_389",
20
+ "tabs": "awsui_tabs_14rmt_n8497_198",
21
+ "tabs-content": "awsui_tabs-content_14rmt_n8497_430",
22
+ "fit-height": "awsui_fit-height_14rmt_n8497_434",
23
+ "tabs-content-active": "awsui_tabs-content-active_14rmt_n8497_440",
24
+ "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_n8497_454",
25
+ "with-paddings": "awsui_with-paddings_14rmt_n8497_454",
26
+ "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_n8497_465"
26
27
  };
27
28