@cloudscape-design/components 3.0.307 → 3.0.309

package/column-layout/interfaces.d.ts

@@ -5,9 +5,7 @@ import { ColumnLayoutBreakpoint } from './internal';
 export interface ColumnLayoutProps extends BaseComponentProps {
     /**
      * Specifies the number of columns in each grid row.
-     * Valid values are any integer between 1 and 4.
-     *
-     * Note that there is no upper limit when used in combination with `minColumnWidth`.
+     * When `minColumnWidth` is not set, only up to 4 columns are supported.
      */
     columns?: number;
     /**

package/column-layout/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["column-layout/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAEpD,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;;;OAIG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,yBAAiB,iBAAiB,CAAC;IACjC,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,CAAC;IAC9C,KAAY,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,KAAK,CAAC;CAClE;AAED,MAAM,WAAW,yBAA0B,SAAQ,iBAAiB,EAAE,0BAA0B;IAC9F,YAAY,CAAC,EAAE,sBAAsB,CAAC;CACvC"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["column-layout/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,sBAAsB,EAAE,MAAM,YAAY,CAAC;AAEpD,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;;;OAIG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC;IAEpC;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;;OAKG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,yBAAiB,iBAAiB,CAAC;IACjC,KAAY,OAAO,GAAG,SAAS,GAAG,WAAW,CAAC;IAC9C,KAAY,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,KAAK,CAAC;CAClE;AAED,MAAM,WAAW,yBAA0B,SAAQ,iBAAiB,EAAE,0BAA0B;IAC9F,YAAY,CAAC,EAAE,sBAAsB,CAAC;CACvC"}

package/column-layout/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["column-layout/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 React from 'react';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { ColumnLayoutBreakpoint } from './internal';\n\nexport interface ColumnLayoutProps extends BaseComponentProps {\n  /**\n   * Specifies the number of columns in each grid row.\n   * Valid values are any integer between 1 and 4.\n   *\n   * Note that there is no upper limit when used in combination with `minColumnWidth`.\n   */\n  columns?: number;\n\n  /**\n   * Specifies the content type. This determines the spacing of the grid.\n   */\n  variant?: ColumnLayoutProps.Variant;\n\n  /**\n   * Controls whether dividers are placed between rows and columns.\n   *\n   * Note: This is not supported when used with `minColumnWidth`.\n   */\n  borders?: ColumnLayoutProps.Borders;\n\n  /**\n   * Determines whether the default gutters between columns are removed.\n   */\n  disableGutters?: boolean;\n\n  /**\n   * Use together with `columns` to specify the desired minimum width for each column in pixels.\n   *\n   * The number of columns is determined by the value of this property, the available space,\n   * and the maximum number of columns as defined by the `columns` property.\n   */\n  minColumnWidth?: number;\n\n  /**\n   * The columns to render.\n   */\n  children?: React.ReactNode;\n}\n\nexport namespace ColumnLayoutProps {\n  export type Variant = 'default' | 'text-grid';\n  export type Borders = 'none' | 'vertical' | 'horizontal' | 'all';\n}\n\nexport interface InternalColumnLayoutProps extends ColumnLayoutProps, InternalBaseComponentProps {\n  __breakpoint?: ColumnLayoutBreakpoint;\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["column-layout/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 React from 'react';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { ColumnLayoutBreakpoint } from './internal';\n\nexport interface ColumnLayoutProps extends BaseComponentProps {\n  /**\n   * Specifies the number of columns in each grid row.\n   * When `minColumnWidth` is not set, only up to 4 columns are supported.\n   */\n  columns?: number;\n\n  /**\n   * Specifies the content type. This determines the spacing of the grid.\n   */\n  variant?: ColumnLayoutProps.Variant;\n\n  /**\n   * Controls whether dividers are placed between rows and columns.\n   *\n   * Note: This is not supported when used with `minColumnWidth`.\n   */\n  borders?: ColumnLayoutProps.Borders;\n\n  /**\n   * Determines whether the default gutters between columns are removed.\n   */\n  disableGutters?: boolean;\n\n  /**\n   * Use together with `columns` to specify the desired minimum width for each column in pixels.\n   *\n   * The number of columns is determined by the value of this property, the available space,\n   * and the maximum number of columns as defined by the `columns` property.\n   */\n  minColumnWidth?: number;\n\n  /**\n   * The columns to render.\n   */\n  children?: React.ReactNode;\n}\n\nexport namespace ColumnLayoutProps {\n  export type Variant = 'default' | 'text-grid';\n  export type Borders = 'none' | 'vertical' | 'horizontal' | 'all';\n}\n\nexport interface InternalColumnLayoutProps extends ColumnLayoutProps, InternalBaseComponentProps {\n  __breakpoint?: ColumnLayoutBreakpoint;\n}\n"]}

package/expandable-section/expandable-section-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"expandable-section-header.d.ts","sourceRoot":"lib/default/","sources":["expandable-section/expandable-section-header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACtD,OAAc,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUlF,eAAO,MAAM,aAAa,sBAAsB,CAAC;AAEjD,UAAU,4BAA4B;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,oBAAoB,CAAC;IAC9B,SAAS,EAAE,oBAAoB,CAAC;IAChC,OAAO,EAAE,iBAAiB,CAAC;IAC3B,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;IAClB,OAAO,EAAE,sBAAsB,CAAC,OAAO,CAAC;CACzC;AAcD,UAAU,4BAA6B,SAAQ,IAAI,CAAC,4BAA4B,EAAE,UAAU,GAAG,MAAM,CAAC;IACpG,OAAO,EAAE,sBAAsB,CAAC,OAAO,CAAC;IACxC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,kBAAkB,CAAC,EAAE,sBAAsB,CAAC,UAAU,CAAC;IACvD,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAiID,eAAO,MAAM,uBAAuB,qNAkBjC,4BAA4B,gBA4E9B,CAAC"}
+{"version":3,"file":"expandable-section-header.d.ts","sourceRoot":"lib/default/","sources":["expandable-section/expandable-section-header.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AACtD,OAAc,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUlF,eAAO,MAAM,aAAa,sBAAsB,CAAC;AAEjD,UAAU,4BAA4B;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,oBAAoB,CAAC;IAC9B,SAAS,EAAE,oBAAoB,CAAC;IAChC,OAAO,EAAE,iBAAiB,CAAC;IAC3B,IAAI,EAAE,GAAG,CAAC,OAAO,CAAC;IAClB,OAAO,EAAE,sBAAsB,CAAC,OAAO,CAAC;CACzC;AAcD,UAAU,4BAA6B,SAAQ,IAAI,CAAC,4BAA4B,EAAE,UAAU,GAAG,MAAM,CAAC;IACpG,OAAO,EAAE,sBAAsB,CAAC,OAAO,CAAC;IACxC,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iBAAiB,CAAC,EAAE,SAAS,CAAC;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,kBAAkB,CAAC,EAAE,sBAAsB,CAAC,UAAU,CAAC;IACvD,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAwID,eAAO,MAAM,uBAAuB,qNAkBjC,4BAA4B,gBAsE9B,CAAC"}

package/expandable-section/expandable-section-header.js

@@ -9,27 +9,27 @@ import { isDevelopment } from '../internal/is-development';
 import { warnOnce } from '../internal/logging';
 export const componentName = 'ExpandableSection';
 const ExpandableDefaultHeader = ({ id, className, onClick, ariaLabel, ariaControls, expanded, children, icon, onKeyUp, onKeyDown, variant, }) => {
-    return (React.createElement("div", { id: id, role: "button", className: className, tabIndex: 0, onKeyUp: onKeyUp, onKeyDown: onKeyDown, onClick: onClick, "aria-label": ariaLabel, "aria-controls": ariaControls, "aria-expanded": expanded },
+    return (React.createElement("div", { id: id, role: "button", className: clsx(className, styles['expand-button']), tabIndex: 0, onKeyUp: onKeyUp, onKeyDown: onKeyDown, onClick: onClick, "aria-label": ariaLabel, "aria-controls": ariaControls, "aria-expanded": expanded },
         React.createElement("div", { className: clsx(styles['icon-container'], styles[`icon-container-${variant}`]) }, icon),
         children));
 };
 const ExpandableNavigationHeader = ({ id, className, onClick, ariaLabelledBy, ariaLabel, ariaControls, expanded, children, icon, }) => {
     return (React.createElement("div", { id: id, className: className, onClick: onClick },
-        React.createElement("button", { className: styles['icon-container'], "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel, "aria-controls": ariaControls, "aria-expanded": expanded, type: "button" }, icon),
+        React.createElement("button", { className: clsx(styles['icon-container'], styles['expand-button']), "aria-labelledby": ariaLabelledBy, "aria-label": ariaLabel, "aria-controls": ariaControls, "aria-expanded": expanded, type: "button" }, icon),
         children));
 };
 const ExpandableHeaderTextWrapper = ({ id, className, onClick, ariaLabel, ariaControls, expanded, children, icon, headerDescription, headerCounter, headerInfo, headerActions, variant, headingTagOverride, onKeyUp, onKeyDown, }) => {
     const screenreaderContentId = useUniqueId('expandable-section-header-content-');
     const isContainer = variant === 'container';
     const HeadingTag = headingTagOverride || 'div';
-    const hasInteractiveElements = headerInfo || headerActions;
+    const hasInteractiveElements = isContainer && (headerInfo || headerActions);
     const listeners = { onClick, onKeyDown, onKeyUp };
     const wrapperListeners = hasInteractiveElements ? undefined : listeners;
     const headerButtonListeners = hasInteractiveElements ? listeners : undefined;
-    const headerButton = (React.createElement("span", Object.assign({ className: isContainer ? styles['header-container-button'] : styles['header-button'], role: "button", tabIndex: 0, "aria-label": ariaLabel, "aria-labelledby": ariaLabel || !isContainer ? undefined : screenreaderContentId, "aria-controls": ariaControls, "aria-expanded": expanded }, headerButtonListeners),
+    const headerButton = (React.createElement("span", Object.assign({ className: clsx(styles['expand-button'], isContainer ? styles['header-container-button'] : styles['header-button']), role: "button", tabIndex: 0, "aria-label": ariaLabel, "aria-labelledby": ariaLabel || !isContainer ? undefined : screenreaderContentId, "aria-controls": ariaControls, "aria-expanded": expanded }, headerButtonListeners),
         React.createElement("span", { className: clsx(styles['icon-container'], styles[`icon-container-${variant}`]) }, icon),
         React.createElement("span", null, children)));
-    return (React.createElement("div", Object.assign({ id: id, className: className }, wrapperListeners),
+    return (React.createElement("div", Object.assign({ id: id, className: clsx(className, hasInteractiveElements && styles['with-interactive-elements']) }, wrapperListeners),
         isContainer ? (React.createElement(InternalHeader, { variant: "h2", description: headerDescription, counter: headerCounter, info: headerInfo, actions: headerActions, headingTagOverride: headingTagOverride }, headerButton)) : (React.createElement(HeadingTag, { className: styles['header-wrapper'] }, headerButton)),
         isContainer && (React.createElement(ScreenreaderOnly, { id: screenreaderContentId },
             children,
@@ -57,8 +57,7 @@ export const ExpandableSectionHeader = ({ id, className, variant, header, header
         return (React.createElement(ExpandableNavigationHeader, Object.assign({ className: clsx(className, wrapperClassName), ariaLabelledBy: ariaLabelledBy }, defaultHeaderProps), headerText !== null && headerText !== void 0 ? headerText : header));
     }
     if (headerText) {
-        const hasInteractiveElements = headerInfo || headerActions;
-        return (React.createElement(ExpandableHeaderTextWrapper, Object.assign({ className: clsx(className, wrapperClassName, hasInteractiveElements && styles['with-interactive-elements'], expanded && styles.expanded), headerDescription: headerDescription, headerCounter: headerCounter, headerInfo: headerInfo, headerActions: headerActions, headingTagOverride: headingTagOverride, onKeyUp: onKeyUp, onKeyDown: onKeyDown }, defaultHeaderProps), headerText));
+        return (React.createElement(ExpandableHeaderTextWrapper, Object.assign({ className: clsx(className, wrapperClassName, expanded && styles.expanded), headerDescription: headerDescription, headerCounter: headerCounter, headerInfo: headerInfo, headerActions: headerActions, headingTagOverride: headingTagOverride, onKeyUp: onKeyUp, onKeyDown: onKeyDown }, defaultHeaderProps), headerText));
     }
     if (variant === 'container' && header && isDevelopment) {
         warnOnce(componentName, 'Use `headerText` instead of `header` to provide the button within the heading for a11y.');

package/expandable-section/expandable-section-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"expandable-section-header.js","sourceRoot":"lib/default/","sources":["expandable-section/expandable-section-header.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 { ExpandableSectionProps } from './interfaces';\nimport React, { KeyboardEventHandler, MouseEventHandler, ReactNode } from 'react';\nimport InternalIcon from '../icon/internal';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalHeader from '../header/internal';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '../internal/logging';\n\nexport const componentName = 'ExpandableSection';\n\ninterface ExpandableDefaultHeaderProps {\n  id: string;\n  className?: string;\n  children?: ReactNode;\n  expanded: boolean;\n  ariaControls: string;\n  ariaLabel?: string;\n  onKeyUp: KeyboardEventHandler;\n  onKeyDown: KeyboardEventHandler;\n  onClick: MouseEventHandler;\n  icon: JSX.Element;\n  variant: ExpandableSectionProps.Variant;\n}\n\ninterface ExpandableNavigationHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'onKeyUp' | 'onKeyDown'> {\n  ariaLabelledBy?: string;\n}\n\ninterface ExpandableHeaderTextWrapperProps extends ExpandableDefaultHeaderProps {\n  headerDescription?: ReactNode;\n  headerCounter?: string;\n  headerInfo?: ReactNode;\n  headerActions?: ReactNode;\n  headingTagOverride?: ExpandableSectionProps.HeadingTag;\n}\n\ninterface ExpandableSectionHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'children' | 'icon'> {\n  variant: ExpandableSectionProps.Variant;\n  header?: ReactNode;\n  headerText?: ReactNode;\n  headerDescription?: ReactNode;\n  headerCounter?: string;\n  headerInfo?: ReactNode;\n  headerActions?: ReactNode;\n  headingTagOverride?: ExpandableSectionProps.HeadingTag;\n  ariaLabelledBy?: string;\n}\n\nconst ExpandableDefaultHeader = ({\n  id,\n  className,\n  onClick,\n  ariaLabel,\n  ariaControls,\n  expanded,\n  children,\n  icon,\n  onKeyUp,\n  onKeyDown,\n  variant,\n}: ExpandableDefaultHeaderProps) => {\n  return (\n    <div\n      id={id}\n      role=\"button\"\n      className={className}\n      tabIndex={0}\n      onKeyUp={onKeyUp}\n      onKeyDown={onKeyDown}\n      onClick={onClick}\n      aria-label={ariaLabel}\n      aria-controls={ariaControls}\n      aria-expanded={expanded}\n    >\n      <div className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</div>\n      {children}\n    </div>\n  );\n};\n\nconst ExpandableNavigationHeader = ({\n  id,\n  className,\n  onClick,\n  ariaLabelledBy,\n  ariaLabel,\n  ariaControls,\n  expanded,\n  children,\n  icon,\n}: ExpandableNavigationHeaderProps) => {\n  return (\n    <div id={id} className={className} onClick={onClick}>\n      <button\n        className={styles['icon-container']}\n        aria-labelledby={ariaLabelledBy}\n        aria-label={ariaLabel}\n        aria-controls={ariaControls}\n        aria-expanded={expanded}\n        type=\"button\"\n      >\n        {icon}\n      </button>\n      {children}\n    </div>\n  );\n};\n\nconst ExpandableHeaderTextWrapper = ({\n  id,\n  className,\n  onClick,\n  ariaLabel,\n  ariaControls,\n  expanded,\n  children,\n  icon,\n  headerDescription,\n  headerCounter,\n  headerInfo,\n  headerActions,\n  variant,\n  headingTagOverride,\n  onKeyUp,\n  onKeyDown,\n}: ExpandableHeaderTextWrapperProps) => {\n  const screenreaderContentId = useUniqueId('expandable-section-header-content-');\n  const isContainer = variant === 'container';\n  const HeadingTag = headingTagOverride || 'div';\n  const hasInteractiveElements = headerInfo || headerActions;\n  const listeners = { onClick, onKeyDown, onKeyUp };\n  const wrapperListeners = hasInteractiveElements ? undefined : listeners;\n  const headerButtonListeners = hasInteractiveElements ? listeners : undefined;\n  const headerButton = (\n    <span\n      className={isContainer ? styles['header-container-button'] : styles['header-button']}\n      role=\"button\"\n      tabIndex={0}\n      aria-label={ariaLabel}\n      // Do not use aria-labelledby={id} but ScreenreaderOnly because safari+VO does not read headerText in this case.\n      aria-labelledby={ariaLabel || !isContainer ? undefined : screenreaderContentId}\n      aria-controls={ariaControls}\n      aria-expanded={expanded}\n      {...headerButtonListeners}\n    >\n      <span className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</span>\n      <span>{children}</span>\n    </span>\n  );\n\n  return (\n    <div id={id} className={className} {...wrapperListeners}>\n      {isContainer ? (\n        <InternalHeader\n          variant=\"h2\"\n          description={headerDescription}\n          counter={headerCounter}\n          info={headerInfo}\n          actions={headerActions}\n          headingTagOverride={headingTagOverride}\n        >\n          {headerButton}\n        </InternalHeader>\n      ) : (\n        <HeadingTag className={styles['header-wrapper']}>{headerButton}</HeadingTag>\n      )}\n      {isContainer && (\n        <ScreenreaderOnly id={screenreaderContentId}>\n          {children} {headerCounter} {headerDescription}\n        </ScreenreaderOnly>\n      )}\n    </div>\n  );\n};\n\nexport const ExpandableSectionHeader = ({\n  id,\n  className,\n  variant,\n  header,\n  headerText,\n  headerDescription,\n  headerCounter,\n  headerInfo,\n  headerActions,\n  headingTagOverride,\n  expanded,\n  ariaControls,\n  ariaLabel,\n  ariaLabelledBy,\n  onKeyUp,\n  onKeyDown,\n  onClick,\n}: ExpandableSectionHeaderProps) => {\n  const icon = (\n    <InternalIcon\n      size={variant === 'container' ? 'medium' : 'normal'}\n      className={clsx(styles.icon, expanded && styles.expanded)}\n      name=\"caret-down-filled\"\n    />\n  );\n  const defaultHeaderProps = {\n    id: id,\n    icon: icon,\n    expanded: expanded,\n    ariaControls: ariaControls,\n    ariaLabel: ariaLabel,\n    onClick: onClick,\n    variant,\n  };\n\n  if ((headerDescription || headerCounter || headerInfo || headerActions) && variant !== 'container' && isDevelopment) {\n    warnOnce(\n      componentName,\n      'The `headerCounter`, `headerDescription`, `headerInfo` and `headerActions` props are only supported for the \"container\" variant.'\n    );\n  }\n\n  const wrapperClassName = clsx(styles.wrapper, styles[`wrapper-${variant}`], expanded && styles['wrapper-expanded']);\n  if (variant === 'navigation') {\n    return (\n      <ExpandableNavigationHeader\n        className={clsx(className, wrapperClassName)}\n        ariaLabelledBy={ariaLabelledBy}\n        {...defaultHeaderProps}\n      >\n        {headerText ?? header}\n      </ExpandableNavigationHeader>\n    );\n  }\n\n  if (headerText) {\n    const hasInteractiveElements = headerInfo || headerActions;\n    return (\n      <ExpandableHeaderTextWrapper\n        className={clsx(\n          className,\n          wrapperClassName,\n          hasInteractiveElements && styles['with-interactive-elements'],\n          expanded && styles.expanded\n        )}\n        headerDescription={headerDescription}\n        headerCounter={headerCounter}\n        headerInfo={headerInfo}\n        headerActions={headerActions}\n        headingTagOverride={headingTagOverride}\n        onKeyUp={onKeyUp}\n        onKeyDown={onKeyDown}\n        {...defaultHeaderProps}\n      >\n        {headerText}\n      </ExpandableHeaderTextWrapper>\n    );\n  }\n\n  if (variant === 'container' && header && isDevelopment) {\n    warnOnce(componentName, 'Use `headerText` instead of `header` to provide the button within the heading for a11y.');\n  }\n\n  return (\n    <ExpandableDefaultHeader\n      className={clsx(className, wrapperClassName, styles.focusable, expanded && styles.expanded)}\n      onKeyUp={onKeyUp}\n      onKeyDown={onKeyDown}\n      {...defaultHeaderProps}\n    >\n      {header}\n    </ExpandableDefaultHeader>\n  );\n};\n"]}
+{"version":3,"file":"expandable-section-header.js","sourceRoot":"lib/default/","sources":["expandable-section/expandable-section-header.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 { ExpandableSectionProps } from './interfaces';\nimport React, { KeyboardEventHandler, MouseEventHandler, ReactNode } from 'react';\nimport InternalIcon from '../icon/internal';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalHeader from '../header/internal';\nimport ScreenreaderOnly from '../internal/components/screenreader-only';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { isDevelopment } from '../internal/is-development';\nimport { warnOnce } from '../internal/logging';\n\nexport const componentName = 'ExpandableSection';\n\ninterface ExpandableDefaultHeaderProps {\n  id: string;\n  className?: string;\n  children?: ReactNode;\n  expanded: boolean;\n  ariaControls: string;\n  ariaLabel?: string;\n  onKeyUp: KeyboardEventHandler;\n  onKeyDown: KeyboardEventHandler;\n  onClick: MouseEventHandler;\n  icon: JSX.Element;\n  variant: ExpandableSectionProps.Variant;\n}\n\ninterface ExpandableNavigationHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'onKeyUp' | 'onKeyDown'> {\n  ariaLabelledBy?: string;\n}\n\ninterface ExpandableHeaderTextWrapperProps extends ExpandableDefaultHeaderProps {\n  headerDescription?: ReactNode;\n  headerCounter?: string;\n  headerInfo?: ReactNode;\n  headerActions?: ReactNode;\n  headingTagOverride?: ExpandableSectionProps.HeadingTag;\n}\n\ninterface ExpandableSectionHeaderProps extends Omit<ExpandableDefaultHeaderProps, 'children' | 'icon'> {\n  variant: ExpandableSectionProps.Variant;\n  header?: ReactNode;\n  headerText?: ReactNode;\n  headerDescription?: ReactNode;\n  headerCounter?: string;\n  headerInfo?: ReactNode;\n  headerActions?: ReactNode;\n  headingTagOverride?: ExpandableSectionProps.HeadingTag;\n  ariaLabelledBy?: string;\n}\n\nconst ExpandableDefaultHeader = ({\n  id,\n  className,\n  onClick,\n  ariaLabel,\n  ariaControls,\n  expanded,\n  children,\n  icon,\n  onKeyUp,\n  onKeyDown,\n  variant,\n}: ExpandableDefaultHeaderProps) => {\n  return (\n    <div\n      id={id}\n      role=\"button\"\n      className={clsx(className, styles['expand-button'])}\n      tabIndex={0}\n      onKeyUp={onKeyUp}\n      onKeyDown={onKeyDown}\n      onClick={onClick}\n      aria-label={ariaLabel}\n      aria-controls={ariaControls}\n      aria-expanded={expanded}\n    >\n      <div className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</div>\n      {children}\n    </div>\n  );\n};\n\nconst ExpandableNavigationHeader = ({\n  id,\n  className,\n  onClick,\n  ariaLabelledBy,\n  ariaLabel,\n  ariaControls,\n  expanded,\n  children,\n  icon,\n}: ExpandableNavigationHeaderProps) => {\n  return (\n    <div id={id} className={className} onClick={onClick}>\n      <button\n        className={clsx(styles['icon-container'], styles['expand-button'])}\n        aria-labelledby={ariaLabelledBy}\n        aria-label={ariaLabel}\n        aria-controls={ariaControls}\n        aria-expanded={expanded}\n        type=\"button\"\n      >\n        {icon}\n      </button>\n      {children}\n    </div>\n  );\n};\n\nconst ExpandableHeaderTextWrapper = ({\n  id,\n  className,\n  onClick,\n  ariaLabel,\n  ariaControls,\n  expanded,\n  children,\n  icon,\n  headerDescription,\n  headerCounter,\n  headerInfo,\n  headerActions,\n  variant,\n  headingTagOverride,\n  onKeyUp,\n  onKeyDown,\n}: ExpandableHeaderTextWrapperProps) => {\n  const screenreaderContentId = useUniqueId('expandable-section-header-content-');\n  const isContainer = variant === 'container';\n  const HeadingTag = headingTagOverride || 'div';\n  const hasInteractiveElements = isContainer && (headerInfo || headerActions);\n  const listeners = { onClick, onKeyDown, onKeyUp };\n  const wrapperListeners = hasInteractiveElements ? undefined : listeners;\n  const headerButtonListeners = hasInteractiveElements ? listeners : undefined;\n  const headerButton = (\n    <span\n      className={clsx(\n        styles['expand-button'],\n        isContainer ? styles['header-container-button'] : styles['header-button']\n      )}\n      role=\"button\"\n      tabIndex={0}\n      aria-label={ariaLabel}\n      // Do not use aria-labelledby={id} but ScreenreaderOnly because safari+VO does not read headerText in this case.\n      aria-labelledby={ariaLabel || !isContainer ? undefined : screenreaderContentId}\n      aria-controls={ariaControls}\n      aria-expanded={expanded}\n      {...headerButtonListeners}\n    >\n      <span className={clsx(styles['icon-container'], styles[`icon-container-${variant}`])}>{icon}</span>\n      <span>{children}</span>\n    </span>\n  );\n\n  return (\n    <div\n      id={id}\n      className={clsx(className, hasInteractiveElements && styles['with-interactive-elements'])}\n      {...wrapperListeners}\n    >\n      {isContainer ? (\n        <InternalHeader\n          variant=\"h2\"\n          description={headerDescription}\n          counter={headerCounter}\n          info={headerInfo}\n          actions={headerActions}\n          headingTagOverride={headingTagOverride}\n        >\n          {headerButton}\n        </InternalHeader>\n      ) : (\n        <HeadingTag className={styles['header-wrapper']}>{headerButton}</HeadingTag>\n      )}\n      {isContainer && (\n        <ScreenreaderOnly id={screenreaderContentId}>\n          {children} {headerCounter} {headerDescription}\n        </ScreenreaderOnly>\n      )}\n    </div>\n  );\n};\n\nexport const ExpandableSectionHeader = ({\n  id,\n  className,\n  variant,\n  header,\n  headerText,\n  headerDescription,\n  headerCounter,\n  headerInfo,\n  headerActions,\n  headingTagOverride,\n  expanded,\n  ariaControls,\n  ariaLabel,\n  ariaLabelledBy,\n  onKeyUp,\n  onKeyDown,\n  onClick,\n}: ExpandableSectionHeaderProps) => {\n  const icon = (\n    <InternalIcon\n      size={variant === 'container' ? 'medium' : 'normal'}\n      className={clsx(styles.icon, expanded && styles.expanded)}\n      name=\"caret-down-filled\"\n    />\n  );\n  const defaultHeaderProps = {\n    id: id,\n    icon: icon,\n    expanded: expanded,\n    ariaControls: ariaControls,\n    ariaLabel: ariaLabel,\n    onClick: onClick,\n    variant,\n  };\n\n  if ((headerDescription || headerCounter || headerInfo || headerActions) && variant !== 'container' && isDevelopment) {\n    warnOnce(\n      componentName,\n      'The `headerCounter`, `headerDescription`, `headerInfo` and `headerActions` props are only supported for the \"container\" variant.'\n    );\n  }\n\n  const wrapperClassName = clsx(styles.wrapper, styles[`wrapper-${variant}`], expanded && styles['wrapper-expanded']);\n  if (variant === 'navigation') {\n    return (\n      <ExpandableNavigationHeader\n        className={clsx(className, wrapperClassName)}\n        ariaLabelledBy={ariaLabelledBy}\n        {...defaultHeaderProps}\n      >\n        {headerText ?? header}\n      </ExpandableNavigationHeader>\n    );\n  }\n\n  if (headerText) {\n    return (\n      <ExpandableHeaderTextWrapper\n        className={clsx(className, wrapperClassName, expanded && styles.expanded)}\n        headerDescription={headerDescription}\n        headerCounter={headerCounter}\n        headerInfo={headerInfo}\n        headerActions={headerActions}\n        headingTagOverride={headingTagOverride}\n        onKeyUp={onKeyUp}\n        onKeyDown={onKeyDown}\n        {...defaultHeaderProps}\n      >\n        {headerText}\n      </ExpandableHeaderTextWrapper>\n    );\n  }\n\n  if (variant === 'container' && header && isDevelopment) {\n    warnOnce(componentName, 'Use `headerText` instead of `header` to provide the button within the heading for a11y.');\n  }\n\n  return (\n    <ExpandableDefaultHeader\n      className={clsx(className, wrapperClassName, styles.focusable, expanded && styles.expanded)}\n      onKeyUp={onKeyUp}\n      onKeyDown={onKeyDown}\n      {...defaultHeaderProps}\n    >\n      {header}\n    </ExpandableDefaultHeader>\n  );\n};\n"]}

package/expandable-section/styles.css.js

@@ -1,31 +1,32 @@
 
     import './styles.scoped.css';
     export default {
-  "content-enter": "awsui_content-enter_gwq0h_1g95t_97",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_gwq0h_1g95t_1",
-  "trigger-expanded": "awsui_trigger-expanded_gwq0h_1g95t_119",
-  "icon": "awsui_icon_gwq0h_1g95t_133",
-  "root": "awsui_root_gwq0h_1g95t_151",
-  "expanded": "awsui_expanded_gwq0h_1g95t_171",
-  "icon-container": "awsui_icon-container_gwq0h_1g95t_175",
-  "icon-container-container": "awsui_icon-container-container_gwq0h_1g95t_180",
-  "wrapper": "awsui_wrapper_gwq0h_1g95t_184",
-  "wrapper-default": "awsui_wrapper-default_gwq0h_1g95t_192",
-  "wrapper-footer": "awsui_wrapper-footer_gwq0h_1g95t_195",
-  "wrapper-navigation": "awsui_wrapper-navigation_gwq0h_1g95t_201",
-  "wrapper-container": "awsui_wrapper-container_gwq0h_1g95t_215",
-  "wrapper-expanded": "awsui_wrapper-expanded_gwq0h_1g95t_221",
-  "header": "awsui_header_gwq0h_1g95t_225",
-  "header-wrapper": "awsui_header-wrapper_gwq0h_1g95t_228",
-  "header-button": "awsui_header-button_gwq0h_1g95t_235",
-  "header-container-button": "awsui_header-container-button_gwq0h_1g95t_239",
-  "with-interactive-elements": "awsui_with-interactive-elements_gwq0h_1g95t_257",
-  "header-container": "awsui_header-container_gwq0h_1g95t_239",
-  "header-navigation": "awsui_header-navigation_gwq0h_1g95t_269",
-  "content": "awsui_content_gwq0h_1g95t_97",
-  "content-default": "awsui_content-default_gwq0h_1g95t_305",
-  "content-footer": "awsui_content-footer_gwq0h_1g95t_308",
-  "content-expanded": "awsui_content-expanded_gwq0h_1g95t_311",
-  "focusable": "awsui_focusable_gwq0h_1g95t_315"
+  "content-enter": "awsui_content-enter_gwq0h_ohtdp_97",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_gwq0h_ohtdp_1",
+  "trigger-expanded": "awsui_trigger-expanded_gwq0h_ohtdp_119",
+  "icon": "awsui_icon_gwq0h_ohtdp_133",
+  "root": "awsui_root_gwq0h_ohtdp_151",
+  "expand-button": "awsui_expand-button_gwq0h_ohtdp_168",
+  "expanded": "awsui_expanded_gwq0h_ohtdp_175",
+  "icon-container": "awsui_icon-container_gwq0h_ohtdp_179",
+  "icon-container-container": "awsui_icon-container-container_gwq0h_ohtdp_184",
+  "wrapper": "awsui_wrapper_gwq0h_ohtdp_188",
+  "wrapper-default": "awsui_wrapper-default_gwq0h_ohtdp_196",
+  "wrapper-footer": "awsui_wrapper-footer_gwq0h_ohtdp_199",
+  "wrapper-navigation": "awsui_wrapper-navigation_gwq0h_ohtdp_205",
+  "wrapper-container": "awsui_wrapper-container_gwq0h_ohtdp_219",
+  "wrapper-expanded": "awsui_wrapper-expanded_gwq0h_ohtdp_225",
+  "header": "awsui_header_gwq0h_ohtdp_229",
+  "header-wrapper": "awsui_header-wrapper_gwq0h_ohtdp_232",
+  "header-button": "awsui_header-button_gwq0h_ohtdp_239",
+  "header-container-button": "awsui_header-container-button_gwq0h_ohtdp_243",
+  "with-interactive-elements": "awsui_with-interactive-elements_gwq0h_ohtdp_261",
+  "header-container": "awsui_header-container_gwq0h_ohtdp_243",
+  "header-navigation": "awsui_header-navigation_gwq0h_ohtdp_273",
+  "content": "awsui_content_gwq0h_ohtdp_97",
+  "content-default": "awsui_content-default_gwq0h_ohtdp_309",
+  "content-footer": "awsui_content-footer_gwq0h_ohtdp_312",
+  "content-expanded": "awsui_content-expanded_gwq0h_ohtdp_315",
+  "focusable": "awsui_focusable_gwq0h_ohtdp_319"
 };
   

package/expandable-section/styles.scoped.css

@@ -94,10 +94,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_content-enter_gwq0h_1g95t_97:not(#\9) {
-  animation: awsui_awsui-motion-fade-in_gwq0h_1g95t_1 var(--motion-duration-show-paced-uryptc, 180ms) var(--motion-easing-show-paced-tbgeqx, ease-out);
+.awsui_content-enter_gwq0h_ohtdp_97:not(#\9) {
+  animation: awsui_awsui-motion-fade-in_gwq0h_ohtdp_1 var(--motion-duration-show-paced-uryptc, 180ms) var(--motion-easing-show-paced-tbgeqx, ease-out);
 }
-@keyframes awsui_awsui-motion-fade-in_gwq0h_1g95t_1 {
+@keyframes awsui_awsui-motion-fade-in_gwq0h_ohtdp_1 {
   from {
     opacity: 0.2;
   }
@@ -106,40 +106,40 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_content-enter_gwq0h_1g95t_97:not(#\9) {
+  .awsui_content-enter_gwq0h_ohtdp_97:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_content-enter_gwq0h_1g95t_97:not(#\9), .awsui-mode-entering .awsui_content-enter_gwq0h_1g95t_97:not(#\9) {
+.awsui-motion-disabled .awsui_content-enter_gwq0h_ohtdp_97:not(#\9), .awsui-mode-entering .awsui_content-enter_gwq0h_ohtdp_97:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_trigger-expanded_gwq0h_1g95t_119:not(#\9) {
+.awsui_trigger-expanded_gwq0h_ohtdp_119:not(#\9) {
   transition: border-bottom-color var(--motion-duration-show-paced-uryptc, 180ms) var(--motion-easing-show-paced-tbgeqx, ease-out);
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_trigger-expanded_gwq0h_1g95t_119:not(#\9) {
+  .awsui_trigger-expanded_gwq0h_ohtdp_119:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_trigger-expanded_gwq0h_1g95t_119:not(#\9), .awsui-mode-entering .awsui_trigger-expanded_gwq0h_1g95t_119:not(#\9) {
+.awsui-motion-disabled .awsui_trigger-expanded_gwq0h_ohtdp_119:not(#\9), .awsui-mode-entering .awsui_trigger-expanded_gwq0h_ohtdp_119:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_icon_gwq0h_1g95t_133:not(#\9) {
+.awsui_icon_gwq0h_ohtdp_133:not(#\9) {
   transition: transform var(--motion-duration-rotate-90-jfxxiy, 135ms) var(--motion-easing-rotate-90-ax5lt7, cubic-bezier(0.165, 0.84, 0.44, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_icon_gwq0h_1g95t_133:not(#\9) {
+  .awsui_icon_gwq0h_ohtdp_133:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_icon_gwq0h_1g95t_133:not(#\9), .awsui-mode-entering .awsui_icon_gwq0h_1g95t_133:not(#\9) {
+.awsui-motion-disabled .awsui_icon_gwq0h_ohtdp_133:not(#\9), .awsui-mode-entering .awsui_icon_gwq0h_ohtdp_133:not(#\9) {
   animation: none;
   transition: none;
 }
@@ -148,7 +148,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_gwq0h_1g95t_151:not(#\9) {
+.awsui_root_gwq0h_ohtdp_151:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -191,23 +191,27 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   display: block;
 }
 
-.awsui_icon_gwq0h_1g95t_133:not(#\9) {
+.awsui_expand-button_gwq0h_ohtdp_168:not(#\9) {
+  /* used in test-utils */
+}
+
+.awsui_icon_gwq0h_ohtdp_133:not(#\9) {
   transform: rotate(-90deg);
 }
-.awsui_icon_gwq0h_1g95t_133.awsui_expanded_gwq0h_1g95t_171:not(#\9) {
+.awsui_icon_gwq0h_ohtdp_133.awsui_expanded_gwq0h_ohtdp_175:not(#\9) {
   transform: rotate(0deg);
 }
 
-.awsui_icon-container_gwq0h_1g95t_175:not(#\9) {
+.awsui_icon-container_gwq0h_ohtdp_179:not(#\9) {
   position: relative;
   margin-left: calc((var(--font-body-m-line-height-rfgrp9, 22px) - var(--size-icon-normal-jq6jat, 16px)) / -2);
   margin-right: calc(var(--space-xxs-ja5cp8, 4px) + var(--border-divider-list-width-um3zli, 1px));
 }
-.awsui_icon-container-container_gwq0h_1g95t_180:not(#\9) {
+.awsui_icon-container-container_gwq0h_ohtdp_184:not(#\9) {
   margin-right: var(--space-xs-edba2s, 8px);
 }
 
-.awsui_wrapper_gwq0h_1g95t_184:not(#\9) {
+.awsui_wrapper_gwq0h_ohtdp_188:not(#\9) {
   box-sizing: border-box;
   display: flex;
   border: none;
@@ -215,19 +219,19 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   line-height: var(--font-body-m-line-height-rfgrp9, 22px);
   text-align: left;
 }
-.awsui_wrapper-default_gwq0h_1g95t_192:not(#\9) {
+.awsui_wrapper-default_gwq0h_ohtdp_196:not(#\9) {
   padding: var(--space-scaled-xxs-t2t62i, 4px) var(--space-xxs-ja5cp8, 4px);
 }
-.awsui_wrapper-footer_gwq0h_1g95t_195:not(#\9) {
+.awsui_wrapper-footer_gwq0h_ohtdp_199:not(#\9) {
   padding: var(--space-scaled-xxs-t2t62i, 4px) 0;
 }
-.awsui_wrapper-default_gwq0h_1g95t_192:not(#\9), .awsui_wrapper-footer_gwq0h_1g95t_195:not(#\9) {
+.awsui_wrapper-default_gwq0h_ohtdp_196:not(#\9), .awsui_wrapper-footer_gwq0h_ohtdp_199:not(#\9) {
   border: var(--border-divider-section-width-orq175, 2px) solid transparent;
 }
-.awsui_wrapper-navigation_gwq0h_1g95t_201:not(#\9) {
+.awsui_wrapper-navigation_gwq0h_ohtdp_205:not(#\9) {
   border-left: var(--border-divider-section-width-orq175, 2px) solid transparent;
 }
-.awsui_wrapper-default_gwq0h_1g95t_192:not(#\9), .awsui_wrapper-navigation_gwq0h_1g95t_201:not(#\9), .awsui_wrapper-footer_gwq0h_1g95t_195:not(#\9) {
+.awsui_wrapper-default_gwq0h_ohtdp_196:not(#\9), .awsui_wrapper-navigation_gwq0h_ohtdp_205:not(#\9), .awsui_wrapper-footer_gwq0h_ohtdp_199:not(#\9) {
   color: var(--color-text-expandable-section-default-fvf8va, #000716);
   font-weight: var(--font-heading-s-weight-5y5giq, 800);
   -webkit-font-smoothing: var(--font-smoothing-webkit-fyh4as, antialiased);
@@ -235,41 +239,41 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   font-size: var(--font-expandable-heading-size-mkp9vq, 16px);
   letter-spacing: var(--font-heading-s-letter-spacing-j4vcrt, -0.005em);
 }
-.awsui_wrapper-default_gwq0h_1g95t_192:not(#\9):hover, .awsui_wrapper-navigation_gwq0h_1g95t_201:not(#\9):hover, .awsui_wrapper-footer_gwq0h_1g95t_195:not(#\9):hover {
+.awsui_wrapper-default_gwq0h_ohtdp_196:not(#\9):hover, .awsui_wrapper-navigation_gwq0h_ohtdp_205:not(#\9):hover, .awsui_wrapper-footer_gwq0h_ohtdp_199:not(#\9):hover {
   color: var(--color-text-expandable-section-hover-o9ggrx, #0972d3);
 }
-.awsui_wrapper-container_gwq0h_1g95t_215:not(#\9) {
+.awsui_wrapper-container_gwq0h_ohtdp_219:not(#\9) {
   padding: var(--space-container-header-vertical-di96ce, 12px) var(--space-container-horizontal-jxdgil, 20px);
 }
-body[data-awsui-focus-visible=true] .awsui_wrapper-container_gwq0h_1g95t_215:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_wrapper-container_gwq0h_ohtdp_219:not(#\9):focus {
   padding: calc(var(--space-scaled-s-913kwi, 12px) - var(--border-divider-section-width-orq175, 2px)) calc(var(--space-l-f4l5gr, 20px) - var(--border-divider-section-width-orq175, 2px));
 }
-.awsui_wrapper-default_gwq0h_1g95t_192.awsui_wrapper-expanded_gwq0h_1g95t_221:not(#\9) {
+.awsui_wrapper-default_gwq0h_ohtdp_196.awsui_wrapper-expanded_gwq0h_ohtdp_225:not(#\9) {
   border-bottom-color: var(--color-border-divider-default-9o8zql, #e9ebed);
 }
 
-.awsui_header_gwq0h_1g95t_225:not(#\9) {
+.awsui_header_gwq0h_ohtdp_229:not(#\9) {
   display: flex;
 }
-.awsui_header-wrapper_gwq0h_1g95t_228:not(#\9) {
+.awsui_header-wrapper_gwq0h_ohtdp_232:not(#\9) {
   font-weight: inherit;
   font-size: inherit;
   letter-spacing: inherit;
   margin: 0;
   padding: 0;
 }
-.awsui_header-button_gwq0h_1g95t_235:not(#\9) {
+.awsui_header-button_gwq0h_ohtdp_239:not(#\9) {
   box-sizing: border-box;
   display: flex;
 }
-body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_1g95t_235:not(#\9):focus, body[data-awsui-focus-visible=true] .awsui_header-container-button_gwq0h_1g95t_239:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_ohtdp_239:not(#\9):focus, body[data-awsui-focus-visible=true] .awsui_header-container-button_gwq0h_ohtdp_243:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_1g95t_235:not(#\9):focus, body[data-awsui-focus-visible=true] .awsui_header-container-button_gwq0h_1g95t_239:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_ohtdp_239:not(#\9):focus, body[data-awsui-focus-visible=true] .awsui_header-container-button_gwq0h_ohtdp_243:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(0px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_1g95t_235:not(#\9):focus::before, body[data-awsui-focus-visible=true] .awsui_header-container-button_gwq0h_1g95t_239:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_ohtdp_239:not(#\9):focus::before, body[data-awsui-focus-visible=true] .awsui_header-container-button_gwq0h_ohtdp_243:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -280,19 +284,19 @@ body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_1g95t_235:not(#\9
   border-radius: var(--border-radius-control-default-focus-ring-muizvi, 4px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-4t19h5, #0972d3);
 }
-.awsui_header_gwq0h_1g95t_225:not(#\9):not(.awsui_with-interactive-elements_gwq0h_1g95t_257) {
+.awsui_header_gwq0h_ohtdp_229:not(#\9):not(.awsui_with-interactive-elements_gwq0h_ohtdp_261) {
   cursor: pointer;
 }
-.awsui_header-container_gwq0h_1g95t_239:not(#\9) {
+.awsui_header-container_gwq0h_ohtdp_243:not(#\9) {
   width: 100%;
 }
-.awsui_header-container_gwq0h_1g95t_239 > .awsui_icon-container_gwq0h_1g95t_175:not(#\9) {
+.awsui_header-container_gwq0h_ohtdp_243 > .awsui_icon-container_gwq0h_ohtdp_179:not(#\9) {
   margin-top: var(--space-expandable-section-icon-offset-top-qfofw6, 4px);
 }
-.awsui_header-container_gwq0h_1g95t_239.awsui_with-interactive-elements_gwq0h_1g95t_257 .awsui_header-container-button_gwq0h_1g95t_239:not(#\9) {
+.awsui_header-container_gwq0h_ohtdp_243.awsui_with-interactive-elements_gwq0h_ohtdp_261 .awsui_header-container-button_gwq0h_ohtdp_243:not(#\9) {
   cursor: pointer;
 }
-.awsui_header-navigation_gwq0h_1g95t_269 > .awsui_icon-container_gwq0h_1g95t_175:not(#\9) {
+.awsui_header-navigation_gwq0h_ohtdp_273 > .awsui_icon-container_gwq0h_ohtdp_179:not(#\9) {
   display: inline-flex;
   cursor: pointer;
   color: var(--color-text-expandable-section-navigation-icon-default-lzmj1u, #414d5c);
@@ -303,17 +307,17 @@ body[data-awsui-focus-visible=true] .awsui_header-button_gwq0h_1g95t_235:not(#\9
   text-decoration: none;
   flex-direction: column;
 }
-.awsui_header-navigation_gwq0h_1g95t_269 > .awsui_icon-container_gwq0h_1g95t_175:not(#\9):hover {
+.awsui_header-navigation_gwq0h_ohtdp_273 > .awsui_icon-container_gwq0h_ohtdp_179:not(#\9):hover {
   color: var(--color-text-expandable-section-hover-o9ggrx, #0972d3);
 }
-body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_1g95t_269 > .awsui_icon-container_gwq0h_1g95t_175:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_ohtdp_273 > .awsui_icon-container_gwq0h_ohtdp_179:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_1g95t_269 > .awsui_icon-container_gwq0h_1g95t_175:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_ohtdp_273 > .awsui_icon-container_gwq0h_ohtdp_179:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(2px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_1g95t_269 > .awsui_icon-container_gwq0h_1g95t_175:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_ohtdp_273 > .awsui_icon-container_gwq0h_ohtdp_179:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -325,24 +329,24 @@ body[data-awsui-focus-visible=true] .awsui_header-navigation_gwq0h_1g95t_269 > .
   box-shadow: 0 0 0 2px var(--color-border-item-focused-4t19h5, #0972d3);
 }
 
-.awsui_content_gwq0h_1g95t_97:not(#\9) {
+.awsui_content_gwq0h_ohtdp_97:not(#\9) {
   display: none;
 }
-.awsui_content-default_gwq0h_1g95t_305:not(#\9) {
+.awsui_content-default_gwq0h_ohtdp_309:not(#\9) {
   padding: var(--space-scaled-xs-wbfgrv, 8px) 0;
 }
-.awsui_content-footer_gwq0h_1g95t_308:not(#\9) {
+.awsui_content-footer_gwq0h_ohtdp_312:not(#\9) {
   padding: var(--space-xs-edba2s, 8px) 0;
 }
-.awsui_content-expanded_gwq0h_1g95t_311:not(#\9) {
+.awsui_content-expanded_gwq0h_ohtdp_315:not(#\9) {
   display: block;
 }
 
-.awsui_focusable_gwq0h_1g95t_315:not(#\9):focus {
+.awsui_focusable_gwq0h_ohtdp_319:not(#\9):focus {
   outline: none;
   text-decoration: none;
 }
-body[data-awsui-focus-visible=true] .awsui_focusable_gwq0h_1g95t_315:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_focusable_gwq0h_ohtdp_319:not(#\9):focus {
   outline: 2px dotted transparent;
   border: var(--border-field-width-riro62, 2px) solid var(--color-border-item-focused-4t19h5, #0972d3);
   border-radius: var(--border-radius-control-default-focus-ring-muizvi, 4px);

package/expandable-section/styles.selectors.js

@@ -2,31 +2,32 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "content-enter": "awsui_content-enter_gwq0h_1g95t_97",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_gwq0h_1g95t_1",
-  "trigger-expanded": "awsui_trigger-expanded_gwq0h_1g95t_119",
-  "icon": "awsui_icon_gwq0h_1g95t_133",
-  "root": "awsui_root_gwq0h_1g95t_151",
-  "expanded": "awsui_expanded_gwq0h_1g95t_171",
-  "icon-container": "awsui_icon-container_gwq0h_1g95t_175",
-  "icon-container-container": "awsui_icon-container-container_gwq0h_1g95t_180",
-  "wrapper": "awsui_wrapper_gwq0h_1g95t_184",
-  "wrapper-default": "awsui_wrapper-default_gwq0h_1g95t_192",
-  "wrapper-footer": "awsui_wrapper-footer_gwq0h_1g95t_195",
-  "wrapper-navigation": "awsui_wrapper-navigation_gwq0h_1g95t_201",
-  "wrapper-container": "awsui_wrapper-container_gwq0h_1g95t_215",
-  "wrapper-expanded": "awsui_wrapper-expanded_gwq0h_1g95t_221",
-  "header": "awsui_header_gwq0h_1g95t_225",
-  "header-wrapper": "awsui_header-wrapper_gwq0h_1g95t_228",
-  "header-button": "awsui_header-button_gwq0h_1g95t_235",
-  "header-container-button": "awsui_header-container-button_gwq0h_1g95t_239",
-  "with-interactive-elements": "awsui_with-interactive-elements_gwq0h_1g95t_257",
-  "header-container": "awsui_header-container_gwq0h_1g95t_239",
-  "header-navigation": "awsui_header-navigation_gwq0h_1g95t_269",
-  "content": "awsui_content_gwq0h_1g95t_97",
-  "content-default": "awsui_content-default_gwq0h_1g95t_305",
-  "content-footer": "awsui_content-footer_gwq0h_1g95t_308",
-  "content-expanded": "awsui_content-expanded_gwq0h_1g95t_311",
-  "focusable": "awsui_focusable_gwq0h_1g95t_315"
+  "content-enter": "awsui_content-enter_gwq0h_ohtdp_97",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_gwq0h_ohtdp_1",
+  "trigger-expanded": "awsui_trigger-expanded_gwq0h_ohtdp_119",
+  "icon": "awsui_icon_gwq0h_ohtdp_133",
+  "root": "awsui_root_gwq0h_ohtdp_151",
+  "expand-button": "awsui_expand-button_gwq0h_ohtdp_168",
+  "expanded": "awsui_expanded_gwq0h_ohtdp_175",
+  "icon-container": "awsui_icon-container_gwq0h_ohtdp_179",
+  "icon-container-container": "awsui_icon-container-container_gwq0h_ohtdp_184",
+  "wrapper": "awsui_wrapper_gwq0h_ohtdp_188",
+  "wrapper-default": "awsui_wrapper-default_gwq0h_ohtdp_196",
+  "wrapper-footer": "awsui_wrapper-footer_gwq0h_ohtdp_199",
+  "wrapper-navigation": "awsui_wrapper-navigation_gwq0h_ohtdp_205",
+  "wrapper-container": "awsui_wrapper-container_gwq0h_ohtdp_219",
+  "wrapper-expanded": "awsui_wrapper-expanded_gwq0h_ohtdp_225",
+  "header": "awsui_header_gwq0h_ohtdp_229",
+  "header-wrapper": "awsui_header-wrapper_gwq0h_ohtdp_232",
+  "header-button": "awsui_header-button_gwq0h_ohtdp_239",
+  "header-container-button": "awsui_header-container-button_gwq0h_ohtdp_243",
+  "with-interactive-elements": "awsui_with-interactive-elements_gwq0h_ohtdp_261",
+  "header-container": "awsui_header-container_gwq0h_ohtdp_243",
+  "header-navigation": "awsui_header-navigation_gwq0h_ohtdp_273",
+  "content": "awsui_content_gwq0h_ohtdp_97",
+  "content-default": "awsui_content-default_gwq0h_ohtdp_309",
+  "content-footer": "awsui_content-footer_gwq0h_ohtdp_312",
+  "content-expanded": "awsui_content-expanded_gwq0h_ohtdp_315",
+  "focusable": "awsui_focusable_gwq0h_ohtdp_319"
 };
   

package/form-field/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAazC,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAatD,UAAU,mBAAmB;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,kBAAkB,EAAE,EAAE,mBAAmB,eAiBvF;AAED,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EACF,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,eAMA;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,SAAS,EACT,OAAe,EACf,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,SAAS,EACT,WAAW,EACX,iBAAwB,EACxB,gBAAwB,EACxB,GAAG,IAAI,EACR,EAAE,sBAAsB,eA4GxB"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"lib/default/","sources":["form-field/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAazC,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AActD,UAAU,mBAAmB;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,wBAAgB,cAAc,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,kBAAkB,EAAE,EAAE,mBAAmB,eAiBvF;AAED,wBAAgB,cAAc,CAAC,EAC7B,EAAE,EACF,QAAQ,EACR,QAAQ,GACT,EAAE;IACD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,eAMA;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,SAAS,EACT,OAAe,EACf,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,SAAS,EACT,WAAW,EACX,iBAAwB,EACxB,gBAAwB,EACxB,GAAG,IAAI,EACR,EAAE,sBAAsB,eA8GxB"}

package/form-field/internal.js

@@ -13,6 +13,7 @@ import { getAriaDescribedBy, getGridDefinition, getSlotIds } from './util';
 import styles from './styles.css.js';
 import { joinStrings } from '../internal/utils/strings';
 import { useInternalI18n } from '../internal/i18n/context';
+import { InfoLinkLabelContext } from '../internal/context/info-link-label-context';
 import { FunnelMetrics } from '../internal/analytics';
 import { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';
 import { DATA_ATTR_FIELD_ERROR, DATA_ATTR_FIELD_LABEL, getFieldSlotSeletor, getSubStepAllSelector, } from '../internal/analytics/selectors';
@@ -67,7 +68,7 @@ export default function InternalFormField(_a) {
     return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.root), ref: __internalRootRef }, analyticsAttributes),
         React.createElement("div", { className: clsx(__hideLabel && styles['visually-hidden']) },
             label && (React.createElement("label", { className: styles.label, id: slotIds.label, htmlFor: generatedControlId }, label)),
-            !__hideLabel && info && React.createElement("span", { className: styles.info }, info)),
+            React.createElement(InfoLinkLabelContext.Provider, { value: slotIds.label }, !__hideLabel && info && React.createElement("span", { className: styles.info }, info))),
         description && (React.createElement("div", { className: styles.description, id: slotIds.description }, description)),
         React.createElement("div", { className: clsx(styles.controls, __hideLabel && styles['label-hidden']) },
             React.createElement(InternalGrid, { gridDefinition: gridDefinition, disableGutters: __disableGutters },