@cloudscape-design/components-themeable 3.0.910 → 3.0.912

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "e389b284f1fe752821fc03b28893b5b7911fc677"
+  "commit": "187f672a76980015129e552f6d2e2412218f1452"
 }

package/lib/internal/scss/container/styles.scss

@@ -59,6 +59,11 @@
       inset-block-start: calc(-1 * #{awsui.$border-divider-section-width});
     }
   }
+
+  &.with-stuck-sticky-header-at-bottom {
+    border-end-end-radius: 0;
+    border-end-start-radius: 0;
+  }
 }
 
 .with-side-media {

package/lib/internal/template/container/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAKtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAKlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAO9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,UAAkB,EAClB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,eA+GxB"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAKtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAI1E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAKlF,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAO9C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,EAAE,0BAA0B;IACzG,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC9C,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,GAAG,UAAU,GAAG,WAAW,GAAG,OAAO,CAAC;IAEzE,oBAAoB,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,oBAAoB,CAAC,CAAC;IACjF,YAAY,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,sBAAsB,eAWvE;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAmB,EACnB,qBAA6B,EAC7B,sBAA8B,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAsB,EACtB,iBAAwB,EACxB,sBAA8B,EAC9B,uBAA+B,EAC/B,eAAuB,EACvB,WAAW,EACX,UAAkB,EAClB,qBAA4B,EAC5B,oBAAoB,EACpB,YAAY,EACZ,GAAG,SAAS,EACb,EAAE,sBAAsB,eAgHxB"}

package/lib/internal/template/container/internal.js

@@ -29,7 +29,7 @@ export default function InternalContainer(_a) {
     const baseProps = getBaseProps(restProps);
     const rootRef = useRef(null);
     const headerRef = useRef(null);
-    const { isSticky, isStuck, stickyStyles } = useStickyHeader(rootRef, headerRef, __stickyHeader, __stickyOffset, __mobileStickyOffset, __disableStickyMobile, __fullPage && isRefresh && !isMobile);
+    const { isSticky, isStuck, isStuckAtBottom, stickyStyles } = useStickyHeader(rootRef, headerRef, __stickyHeader, __stickyOffset, __mobileStickyOffset, __disableStickyMobile, __fullPage && isRefresh && !isMobile);
     const contentId = useUniqueId();
     const hasDynamicHeight = isRefresh && variant === 'full-page';
     const mergedRef = useMergeRefs(rootRef, __internalRootRef);
@@ -39,11 +39,11 @@ export default function InternalContainer(_a) {
     const shouldHaveStickyStyles = isSticky && !isMobile;
     const hasMedia = !!(media === null || media === void 0 ? void 0 : media.content);
     const mediaPosition = (_b = media === null || media === void 0 ? void 0 : media.position) !== null && _b !== void 0 ? _b : 'top';
-    return (React.createElement("div", Object.assign({}, baseProps, __funnelSubStepProps, { className: clsx(baseProps.className, styles.root, styles[`variant-${variant}`], fitHeight && styles['fit-height'], hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']), shouldHaveStickyStyles && [styles['sticky-enabled']], isRefresh && styles.refresh), ref: mergedRef }, getAnalyticsLabelAttribute(`.${analyticsSelectors.header} h1, .${analyticsSelectors.header} h2, .${analyticsSelectors.header} h3`)),
+    return (React.createElement("div", Object.assign({}, baseProps, __funnelSubStepProps, { className: clsx(baseProps.className, styles.root, styles[`variant-${variant}`], fitHeight && styles['fit-height'], hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']), shouldHaveStickyStyles && [styles['sticky-enabled']], shouldHaveStickyStyles && isStuck && isStuckAtBottom && [styles['with-stuck-sticky-header-at-bottom']], isRefresh && styles.refresh), ref: mergedRef }, getAnalyticsLabelAttribute(`.${analyticsSelectors.header} h1, .${analyticsSelectors.header} h2, .${analyticsSelectors.header} h3`)),
         hasMedia && (React.createElement("div", { className: clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media), style: mediaPosition === 'top' ? { height: (media === null || media === void 0 ? void 0 : media.height) || '' } : { width: (media === null || media === void 0 ? void 0 : media.width) || '' } }, media.content)),
         React.createElement("div", { id: contentId, ref: __subStepRef, className: clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height']) },
             header && (React.createElement(ContainerHeaderContextProvider, null,
-                React.createElement(StickyHeaderContext.Provider, { value: { isStuck } },
+                React.createElement(StickyHeaderContext.Provider, { value: { isStuck, isStuckAtBottom } },
                     React.createElement("div", Object.assign({ className: clsx(isRefresh && styles.refresh, styles.header, analyticsSelectors.header, styles[`header-variant-${variant}`], {
                             [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,
                             [styles['header-sticky-enabled']]: isSticky,

package/lib/internal/template/container/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsLabelAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport { ContainerHeaderContextProvider } from '../internal/context/container-header';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { ContainerProps } from './interfaces';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n  __stickyHeader?: boolean;\n  __stickyOffset?: number;\n  __mobileStickyOffset?: number;\n  __disableFooterDivider?: boolean;\n  __disableFooterPaddings?: boolean;\n  __hiddenContent?: boolean;\n  __headerRef?: React.RefObject<HTMLDivElement>;\n  __fullPage?: boolean;\n  __disableStickyMobile?: boolean;\n  /**\n   * Additional internal variant:\n   * * `embedded` - Use this variant within a parent container (such as a modal,\n   *                expandable section, container or split panel).\n   * * `full-page` – Only for internal use in table, cards and other components\n   */\n  variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n\n  __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n  __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n  const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n  const modalContext = useModalContext();\n\n  return (\n    <InternalContainer\n      {...props}\n      __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n      __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n    />\n  );\n}\n\nexport default function InternalContainer({\n  header,\n  footer,\n  children,\n  variant = 'default',\n  disableHeaderPaddings = false,\n  disableContentPaddings = false,\n  fitHeight,\n  media,\n  __stickyOffset,\n  __mobileStickyOffset,\n  __stickyHeader = false,\n  __internalRootRef = null,\n  __disableFooterDivider = false,\n  __disableFooterPaddings = false,\n  __hiddenContent = false,\n  __headerRef,\n  __fullPage = false,\n  __disableStickyMobile = true,\n  __funnelSubStepProps,\n  __subStepRef,\n  ...restProps\n}: InternalContainerProps) {\n  const isMobile = useMobile();\n  const isRefresh = useVisualRefresh();\n  const baseProps = getBaseProps(restProps);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const headerRef = useRef<HTMLDivElement>(null);\n  const { isSticky, isStuck, stickyStyles } = useStickyHeader(\n    rootRef,\n    headerRef,\n    __stickyHeader,\n    __stickyOffset,\n    __mobileStickyOffset,\n    __disableStickyMobile,\n    __fullPage && isRefresh && !isMobile\n  );\n  const contentId = useUniqueId();\n\n  const hasDynamicHeight = isRefresh && variant === 'full-page';\n\n  const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n  const headerMergedRef = useMergeRefs(headerRef, __headerRef);\n\n  // The container is only sticky on mobile if it is the header for the table.\n  // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n  const shouldHaveStickyStyles = isSticky && !isMobile;\n\n  const hasMedia = !!media?.content;\n  const mediaPosition = media?.position ?? 'top';\n  return (\n    <div\n      {...baseProps}\n      {...__funnelSubStepProps}\n      className={clsx(\n        baseProps.className,\n        styles.root,\n        styles[`variant-${variant}`],\n        fitHeight && styles['fit-height'],\n        hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n        shouldHaveStickyStyles && [styles['sticky-enabled']],\n        isRefresh && styles.refresh\n      )}\n      ref={mergedRef}\n      {...getAnalyticsLabelAttribute(\n        `.${analyticsSelectors.header} h1, .${analyticsSelectors.header} h2, .${analyticsSelectors.header} h3`\n      )}\n    >\n      {hasMedia && (\n        <div\n          className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n          style={mediaPosition === 'top' ? { height: media?.height || '' } : { width: media?.width || '' }}\n        >\n          {media.content}\n        </div>\n      )}\n      <div\n        id={contentId}\n        ref={__subStepRef}\n        className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n      >\n        {header && (\n          <ContainerHeaderContextProvider>\n            <StickyHeaderContext.Provider value={{ isStuck }}>\n              <div\n                className={clsx(\n                  isRefresh && styles.refresh,\n                  styles.header,\n                  analyticsSelectors.header,\n                  styles[`header-variant-${variant}`],\n                  {\n                    [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n                    [styles['header-sticky-enabled']]: isSticky,\n                    [styles['header-dynamic-height']]: hasDynamicHeight,\n                    [styles['header-stuck']]: isStuck,\n                    [styles['with-paddings']]: !disableHeaderPaddings,\n                    [styles['with-hidden-content']]: !children || __hiddenContent,\n                    [styles['header-with-media']]: hasMedia,\n                    [styles['header-full-page']]: __fullPage && isRefresh,\n                  }\n                )}\n                {...stickyStyles}\n                ref={headerMergedRef}\n              >\n                {isStuck && !isMobile && isRefresh && __fullPage && <div className={styles['header-cover']}></div>}\n                {header}\n              </div>\n            </StickyHeaderContext.Provider>\n          </ContainerHeaderContextProvider>\n        )}\n        <div className={clsx(styles.content, fitHeight && styles['content-fit-height'])}>\n          <div\n            className={clsx(styles['content-inner'], testStyles['content-inner'], {\n              [styles['with-paddings']]: !disableContentPaddings,\n              [styles['with-header']]: !!header,\n            })}\n          >\n            {children}\n          </div>\n        </div>\n        {footer && (\n          <div\n            className={clsx(styles.footer, {\n              [styles['with-divider']]: !__disableFooterDivider,\n              [styles['with-paddings']]: !__disableFooterPaddings,\n            })}\n          >\n            {footer}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/container/internal.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,0BAA0B,EAAE,MAAM,kEAAkE,CAAC;AAE9G,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,EAAE,8BAA8B,EAAE,MAAM,sCAAsC,CAAC;AACtF,OAAO,EAAE,eAAe,EAAE,MAAM,mCAAmC,CAAC;AAEpE,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAErE,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAE3E,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,UAAU,MAAM,8BAA8B,CAAC;AAwBtD,MAAM,UAAU,0BAA0B,CAAC,KAA6B;IACtE,MAAM,EAAE,UAAU,EAAE,kBAAkB,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAC9D,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,OAAO,CACL,oBAAC,iBAAiB,oBACZ,KAAK,IACT,YAAY,EAAE,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,EAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,UAAU,EACtE,oBAAoB,EAAE,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,EAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,kBAAkB,IACvE,CACH,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EAsBjB;;QAtBiB,EACxC,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,qBAAqB,GAAG,KAAK,EAC7B,sBAAsB,GAAG,KAAK,EAC9B,SAAS,EACT,KAAK,EACL,cAAc,EACd,oBAAoB,EACpB,cAAc,GAAG,KAAK,EACtB,iBAAiB,GAAG,IAAI,EACxB,sBAAsB,GAAG,KAAK,EAC9B,uBAAuB,GAAG,KAAK,EAC/B,eAAe,GAAG,KAAK,EACvB,WAAW,EACX,UAAU,GAAG,KAAK,EAClB,qBAAqB,GAAG,IAAI,EAC5B,oBAAoB,EACpB,YAAY,OAEW,EADpB,SAAS,cArB4B,2WAsBzC,CADa;IAEZ,MAAM,QAAQ,GAAG,SAAS,EAAE,CAAC;IAC7B,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,eAAe,CAC1E,OAAO,EACP,SAAS,EACT,cAAc,EACd,cAAc,EACd,oBAAoB,EACpB,qBAAqB,EACrB,UAAU,IAAI,SAAS,IAAI,CAAC,QAAQ,CACrC,CAAC;IACF,MAAM,SAAS,GAAG,WAAW,EAAE,CAAC;IAEhC,MAAM,gBAAgB,GAAG,SAAS,IAAI,OAAO,KAAK,WAAW,CAAC;IAE9D,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;IAC3D,MAAM,eAAe,GAAG,YAAY,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;IAE7D,4EAA4E;IAC5E,6HAA6H;IAC7H,MAAM,sBAAsB,GAAG,QAAQ,IAAI,CAAC,QAAQ,CAAC;IAErD,MAAM,QAAQ,GAAG,CAAC,CAAC,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,OAAO,CAAA,CAAC;IAClC,MAAM,aAAa,GAAG,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,mCAAI,KAAK,CAAC;IAC/C,OAAO,CACL,6CACM,SAAS,EACT,oBAAoB,IACxB,SAAS,EAAE,IAAI,CACb,SAAS,CAAC,SAAS,EACnB,MAAM,CAAC,IAAI,EACX,MAAM,CAAC,WAAW,OAAO,EAAE,CAAC,EAC5B,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,EACjC,QAAQ,IAAI,CAAC,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAC7F,sBAAsB,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EACpD,sBAAsB,IAAI,OAAO,IAAI,eAAe,IAAI,CAAC,MAAM,CAAC,oCAAoC,CAAC,CAAC,EACtG,SAAS,IAAI,MAAM,CAAC,OAAO,CAC5B,EACD,GAAG,EAAE,SAAS,IACV,0BAA0B,CAC5B,IAAI,kBAAkB,CAAC,MAAM,SAAS,kBAAkB,CAAC,MAAM,SAAS,kBAAkB,CAAC,MAAM,KAAK,CACvG;QAEA,QAAQ,IAAI,CACX,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,aAAa,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,EAC3F,KAAK,EAAE,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,KAAI,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,KAAI,EAAE,EAAE,IAE/F,KAAK,CAAC,OAAO,CACV,CACP;QACD,6BACE,EAAE,EAAE,SAAS,EACb,GAAG,EAAE,YAAY,EACjB,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,iBAAiB,CAAC,EAAE,SAAS,IAAI,MAAM,CAAC,4BAA4B,CAAC,CAAC;YAE5F,MAAM,IAAI,CACT,oBAAC,8BAA8B;gBAC7B,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,eAAe,EAAE;oBAC/D,2CACE,SAAS,EAAE,IAAI,CACb,SAAS,IAAI,MAAM,CAAC,OAAO,EAC3B,MAAM,CAAC,MAAM,EACb,kBAAkB,CAAC,MAAM,EACzB,MAAM,CAAC,kBAAkB,OAAO,EAAE,CAAC,EACnC;4BACE,CAAC,MAAM,CAAC,wBAAwB,CAAC,CAAC,EAAE,cAAc,IAAI,CAAC,QAAQ;4BAC/D,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,QAAQ;4BAC3C,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,gBAAgB;4BACnD,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,OAAO;4BACjC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,qBAAqB;4BACjD,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,EAAE,CAAC,QAAQ,IAAI,eAAe;4BAC7D,CAAC,MAAM,CAAC,mBAAmB,CAAC,CAAC,EAAE,QAAQ;4BACvC,CAAC,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAAE,UAAU,IAAI,SAAS;yBACtD,CACF,IACG,YAAY,IAChB,GAAG,EAAE,eAAe;wBAEnB,OAAO,IAAI,CAAC,QAAQ,IAAI,SAAS,IAAI,UAAU,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,GAAQ;wBACjG,MAAM,CACH,CACuB,CACA,CAClC;YACD,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,IAAI,MAAM,CAAC,oBAAoB,CAAC,CAAC;gBAC7E,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC,eAAe,CAAC,EAAE;wBACpE,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,sBAAsB;wBAClD,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM;qBAClC,CAAC,IAED,QAAQ,CACL,CACF;YACL,MAAM,IAAI,CACT,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE;oBAC7B,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,CAAC,sBAAsB;oBACjD,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,uBAAuB;iBACpD,CAAC,IAED,MAAM,CACH,CACP,CACG,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsLabelAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport { ContainerHeaderContextProvider } from '../internal/context/container-header';\nimport { useModalContext } from '../internal/context/modal-context';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { ContainerProps } from './interfaces';\nimport { StickyHeaderContext, useStickyHeader } from './use-sticky-header';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\nimport testStyles from './test-classes/styles.css.js';\n\nexport interface InternalContainerProps extends Omit<ContainerProps, 'variant'>, InternalBaseComponentProps {\n  __stickyHeader?: boolean;\n  __stickyOffset?: number;\n  __mobileStickyOffset?: number;\n  __disableFooterDivider?: boolean;\n  __disableFooterPaddings?: boolean;\n  __hiddenContent?: boolean;\n  __headerRef?: React.RefObject<HTMLDivElement>;\n  __fullPage?: boolean;\n  __disableStickyMobile?: boolean;\n  /**\n   * Additional internal variant:\n   * * `embedded` - Use this variant within a parent container (such as a modal,\n   *                expandable section, container or split panel).\n   * * `full-page` – Only for internal use in table, cards and other components\n   */\n  variant?: ContainerProps['variant'] | 'embedded' | 'full-page' | 'cards';\n\n  __funnelSubStepProps?: ReturnType<typeof useFunnelSubStep>['funnelSubStepProps'];\n  __subStepRef?: ReturnType<typeof useFunnelSubStep>['subStepRef'];\n}\n\nexport function InternalContainerAsSubstep(props: InternalContainerProps) {\n  const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n  const modalContext = useModalContext();\n\n  return (\n    <InternalContainer\n      {...props}\n      __subStepRef={modalContext?.isInModal ? { current: null } : subStepRef}\n      __funnelSubStepProps={modalContext?.isInModal ? {} : funnelSubStepProps}\n    />\n  );\n}\n\nexport default function InternalContainer({\n  header,\n  footer,\n  children,\n  variant = 'default',\n  disableHeaderPaddings = false,\n  disableContentPaddings = false,\n  fitHeight,\n  media,\n  __stickyOffset,\n  __mobileStickyOffset,\n  __stickyHeader = false,\n  __internalRootRef = null,\n  __disableFooterDivider = false,\n  __disableFooterPaddings = false,\n  __hiddenContent = false,\n  __headerRef,\n  __fullPage = false,\n  __disableStickyMobile = true,\n  __funnelSubStepProps,\n  __subStepRef,\n  ...restProps\n}: InternalContainerProps) {\n  const isMobile = useMobile();\n  const isRefresh = useVisualRefresh();\n  const baseProps = getBaseProps(restProps);\n  const rootRef = useRef<HTMLDivElement>(null);\n  const headerRef = useRef<HTMLDivElement>(null);\n  const { isSticky, isStuck, isStuckAtBottom, stickyStyles } = useStickyHeader(\n    rootRef,\n    headerRef,\n    __stickyHeader,\n    __stickyOffset,\n    __mobileStickyOffset,\n    __disableStickyMobile,\n    __fullPage && isRefresh && !isMobile\n  );\n  const contentId = useUniqueId();\n\n  const hasDynamicHeight = isRefresh && variant === 'full-page';\n\n  const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n  const headerMergedRef = useMergeRefs(headerRef, __headerRef);\n\n  // The container is only sticky on mobile if it is the header for the table.\n  // In this case we don't want the container to have sticky styles, as only the table header row will show as stuck on scroll.\n  const shouldHaveStickyStyles = isSticky && !isMobile;\n\n  const hasMedia = !!media?.content;\n  const mediaPosition = media?.position ?? 'top';\n  return (\n    <div\n      {...baseProps}\n      {...__funnelSubStepProps}\n      className={clsx(\n        baseProps.className,\n        styles.root,\n        styles[`variant-${variant}`],\n        fitHeight && styles['fit-height'],\n        hasMedia && (mediaPosition === 'side' ? styles['with-side-media'] : styles['with-top-media']),\n        shouldHaveStickyStyles && [styles['sticky-enabled']],\n        shouldHaveStickyStyles && isStuck && isStuckAtBottom && [styles['with-stuck-sticky-header-at-bottom']],\n        isRefresh && styles.refresh\n      )}\n      ref={mergedRef}\n      {...getAnalyticsLabelAttribute(\n        `.${analyticsSelectors.header} h1, .${analyticsSelectors.header} h2, .${analyticsSelectors.header} h3`\n      )}\n    >\n      {hasMedia && (\n        <div\n          className={clsx(styles[`media-${mediaPosition === 'side' ? 'side' : 'top'}`], styles.media)}\n          style={mediaPosition === 'top' ? { height: media?.height || '' } : { width: media?.width || '' }}\n        >\n          {media.content}\n        </div>\n      )}\n      <div\n        id={contentId}\n        ref={__subStepRef}\n        className={clsx(styles['content-wrapper'], fitHeight && styles['content-wrapper-fit-height'])}\n      >\n        {header && (\n          <ContainerHeaderContextProvider>\n            <StickyHeaderContext.Provider value={{ isStuck, isStuckAtBottom }}>\n              <div\n                className={clsx(\n                  isRefresh && styles.refresh,\n                  styles.header,\n                  analyticsSelectors.header,\n                  styles[`header-variant-${variant}`],\n                  {\n                    [styles['header-sticky-disabled']]: __stickyHeader && !isSticky,\n                    [styles['header-sticky-enabled']]: isSticky,\n                    [styles['header-dynamic-height']]: hasDynamicHeight,\n                    [styles['header-stuck']]: isStuck,\n                    [styles['with-paddings']]: !disableHeaderPaddings,\n                    [styles['with-hidden-content']]: !children || __hiddenContent,\n                    [styles['header-with-media']]: hasMedia,\n                    [styles['header-full-page']]: __fullPage && isRefresh,\n                  }\n                )}\n                {...stickyStyles}\n                ref={headerMergedRef}\n              >\n                {isStuck && !isMobile && isRefresh && __fullPage && <div className={styles['header-cover']}></div>}\n                {header}\n              </div>\n            </StickyHeaderContext.Provider>\n          </ContainerHeaderContextProvider>\n        )}\n        <div className={clsx(styles.content, fitHeight && styles['content-fit-height'])}>\n          <div\n            className={clsx(styles['content-inner'], testStyles['content-inner'], {\n              [styles['with-paddings']]: !disableContentPaddings,\n              [styles['with-header']]: !!header,\n            })}\n          >\n            {children}\n          </div>\n        </div>\n        {footer && (\n          <div\n            className={clsx(styles.footer, {\n              [styles['with-divider']]: !__disableFooterDivider,\n              [styles['with-paddings']]: !__disableFooterPaddings,\n            })}\n          >\n            {footer}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n"]}

package/lib/internal/template/container/styles.css.js

@@ -1,37 +1,38 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_14iqq_1yot8_189",
-  "fit-height": "awsui_fit-height_14iqq_1yot8_222",
-  "with-side-media": "awsui_with-side-media_14iqq_1yot8_227",
-  "variant-default": "awsui_variant-default_14iqq_1yot8_230",
-  "variant-stacked": "awsui_variant-stacked_14iqq_1yot8_230",
-  "refresh": "awsui_refresh_14iqq_1yot8_238",
-  "sticky-enabled": "awsui_sticky-enabled_14iqq_1yot8_288",
-  "with-top-media": "awsui_with-top-media_14iqq_1yot8_300",
-  "content-wrapper": "awsui_content-wrapper_14iqq_1yot8_305",
-  "content-wrapper-fit-height": "awsui_content-wrapper-fit-height_14iqq_1yot8_310",
-  "media": "awsui_media_14iqq_1yot8_317",
-  "media-top": "awsui_media-top_14iqq_1yot8_335",
-  "media-side": "awsui_media-side_14iqq_1yot8_340",
-  "header": "awsui_header_14iqq_1yot8_346",
-  "header-full-page": "awsui_header-full-page_14iqq_1yot8_351",
-  "header-variant-embedded": "awsui_header-variant-embedded_14iqq_1yot8_354",
-  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1yot8_354",
-  "header-with-media": "awsui_header-with-media_14iqq_1yot8_357",
-  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1yot8_363",
-  "header-stuck": "awsui_header-stuck_14iqq_1yot8_373",
-  "header-variant-cards": "awsui_header-variant-cards_14iqq_1yot8_383",
-  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1yot8_386",
-  "with-paddings": "awsui_with-paddings_14iqq_1yot8_392",
-  "with-hidden-content": "awsui_with-hidden-content_14iqq_1yot8_401",
-  "header-variant-full-page": "awsui_header-variant-full-page_14iqq_1yot8_459",
-  "header-cover": "awsui_header-cover_14iqq_1yot8_462",
-  "content": "awsui_content_14iqq_1yot8_305",
-  "content-fit-height": "awsui_content-fit-height_14iqq_1yot8_490",
-  "content-inner": "awsui_content-inner_14iqq_1yot8_496",
-  "with-header": "awsui_with-header_14iqq_1yot8_503",
-  "footer": "awsui_footer_14iqq_1yot8_507",
-  "with-divider": "awsui_with-divider_14iqq_1yot8_511"
+  "root": "awsui_root_14iqq_1kkdz_189",
+  "fit-height": "awsui_fit-height_14iqq_1kkdz_222",
+  "with-side-media": "awsui_with-side-media_14iqq_1kkdz_227",
+  "variant-default": "awsui_variant-default_14iqq_1kkdz_230",
+  "variant-stacked": "awsui_variant-stacked_14iqq_1kkdz_230",
+  "refresh": "awsui_refresh_14iqq_1kkdz_238",
+  "sticky-enabled": "awsui_sticky-enabled_14iqq_1kkdz_288",
+  "with-stuck-sticky-header-at-bottom": "awsui_with-stuck-sticky-header-at-bottom_14iqq_1kkdz_294",
+  "with-top-media": "awsui_with-top-media_14iqq_1kkdz_304",
+  "content-wrapper": "awsui_content-wrapper_14iqq_1kkdz_309",
+  "content-wrapper-fit-height": "awsui_content-wrapper-fit-height_14iqq_1kkdz_314",
+  "media": "awsui_media_14iqq_1kkdz_321",
+  "media-top": "awsui_media-top_14iqq_1kkdz_339",
+  "media-side": "awsui_media-side_14iqq_1kkdz_344",
+  "header": "awsui_header_14iqq_1kkdz_350",
+  "header-full-page": "awsui_header-full-page_14iqq_1kkdz_355",
+  "header-variant-embedded": "awsui_header-variant-embedded_14iqq_1kkdz_358",
+  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1kkdz_358",
+  "header-with-media": "awsui_header-with-media_14iqq_1kkdz_361",
+  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1kkdz_367",
+  "header-stuck": "awsui_header-stuck_14iqq_1kkdz_377",
+  "header-variant-cards": "awsui_header-variant-cards_14iqq_1kkdz_387",
+  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1kkdz_390",
+  "with-paddings": "awsui_with-paddings_14iqq_1kkdz_396",
+  "with-hidden-content": "awsui_with-hidden-content_14iqq_1kkdz_405",
+  "header-variant-full-page": "awsui_header-variant-full-page_14iqq_1kkdz_463",
+  "header-cover": "awsui_header-cover_14iqq_1kkdz_466",
+  "content": "awsui_content_14iqq_1kkdz_309",
+  "content-fit-height": "awsui_content-fit-height_14iqq_1kkdz_494",
+  "content-inner": "awsui_content-inner_14iqq_1kkdz_500",
+  "with-header": "awsui_with-header_14iqq_1kkdz_507",
+  "footer": "awsui_footer_14iqq_1kkdz_511",
+  "with-divider": "awsui_with-divider_14iqq_1kkdz_515"
 };
   

package/lib/internal/template/container/styles.scoped.css

@@ -186,7 +186,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_14iqq_1yot8_189:not(#\9) {
+.awsui_root_14iqq_1kkdz_189:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -220,15 +220,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   word-wrap: break-word;
   position: relative;
 }
-.awsui_root_14iqq_1yot8_189.awsui_fit-height_14iqq_1yot8_222:not(#\9) {
+.awsui_root_14iqq_1kkdz_189.awsui_fit-height_14iqq_1kkdz_222:not(#\9) {
   display: flex;
   flex-direction: column;
   block-size: 100%;
 }
-.awsui_root_14iqq_1yot8_189.awsui_fit-height_14iqq_1yot8_222.awsui_with-side-media_14iqq_1yot8_227:not(#\9) {
+.awsui_root_14iqq_1kkdz_189.awsui_fit-height_14iqq_1kkdz_222.awsui_with-side-media_14iqq_1kkdz_227:not(#\9) {
   flex-direction: row;
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-default_14iqq_1yot8_230:not(#\9), .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9) {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-default_14iqq_1kkdz_230:not(#\9), .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9) {
   background-color: var(--color-background-container-content-myy7cn, #ffffff);
   border-start-start-radius: var(--border-radius-container-3o3ats, 0px);
   border-start-end-radius: var(--border-radius-container-3o3ats, 0px);
@@ -236,11 +236,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
   box-sizing: border-box;
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-default_14iqq_1yot8_230.awsui_refresh_14iqq_1yot8_238:not(#\9), .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230.awsui_refresh_14iqq_1yot8_238:not(#\9) {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-default_14iqq_1kkdz_230.awsui_refresh_14iqq_1kkdz_238:not(#\9), .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230.awsui_refresh_14iqq_1kkdz_238:not(#\9) {
   border-block: solid var(--border-divider-section-width-iueskx, 1px) var(--color-border-divider-default-u5ytia, #eaeded);
   border-inline: solid var(--border-divider-section-width-iueskx, 1px) var(--color-border-divider-default-u5ytia, #eaeded);
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-default_14iqq_1yot8_230:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::before, .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::before {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-default_14iqq_1kkdz_230:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::before, .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::before {
   content: "";
   position: absolute;
   inset-inline-start: 0px;
@@ -258,7 +258,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
   z-index: 1;
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-default_14iqq_1yot8_230:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::after, .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::after {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-default_14iqq_1kkdz_230:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::after, .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::after {
   content: "";
   position: absolute;
   inset-inline-start: 0px;
@@ -274,147 +274,151 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
   box-shadow: var(--shadow-container-8g76zh, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9):not(:last-child), .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9):not(:last-child)::before, .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9):not(:last-child)::after {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9):not(:last-child), .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9):not(:last-child)::before, .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9):not(:last-child)::after {
   border-end-end-radius: 0;
   border-end-start-radius: 0;
   border-block-end-width: 0;
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230 + .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9), .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230 + .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9)::before, .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230 + .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9)::after {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230 + .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9), .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230 + .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9)::before, .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230 + .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9)::after {
   border-start-start-radius: 0;
   border-start-end-radius: 0;
 }
-.awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230 + .awsui_root_14iqq_1yot8_189.awsui_variant-stacked_14iqq_1yot8_230:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::before {
+.awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230 + .awsui_root_14iqq_1kkdz_189.awsui_variant-stacked_14iqq_1kkdz_230:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::before {
   border-block-start: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-divider-default-u5ytia, #eaeded);
 }
-.awsui_root_14iqq_1yot8_189.awsui_sticky-enabled_14iqq_1yot8_288:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::before {
+.awsui_root_14iqq_1kkdz_189.awsui_sticky-enabled_14iqq_1kkdz_288:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::before {
   inset-block-start: calc(-1 * var(--border-container-top-width-197qfn, 1px));
 }
-.awsui_root_14iqq_1yot8_189.awsui_sticky-enabled_14iqq_1yot8_288:not(#\9):not(.awsui_refresh_14iqq_1yot8_238).awsui_variant-stacked_14iqq_1yot8_230::before {
+.awsui_root_14iqq_1kkdz_189.awsui_sticky-enabled_14iqq_1kkdz_288:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238).awsui_variant-stacked_14iqq_1kkdz_230::before {
   inset-block-start: calc(-1 * var(--border-divider-section-width-iueskx, 1px));
 }
+.awsui_root_14iqq_1kkdz_189.awsui_with-stuck-sticky-header-at-bottom_14iqq_1kkdz_294:not(#\9) {
+  border-end-end-radius: 0;
+  border-end-start-radius: 0;
+}
 
-.awsui_with-side-media_14iqq_1yot8_227:not(#\9) {
+.awsui_with-side-media_14iqq_1kkdz_227:not(#\9) {
   display: flex;
   flex-direction: row;
 }
 
-.awsui_with-top-media_14iqq_1yot8_300:not(#\9) {
+.awsui_with-top-media_14iqq_1kkdz_304:not(#\9) {
   display: flex;
   flex-direction: column;
 }
 
-.awsui_content-wrapper_14iqq_1yot8_305:not(#\9) {
+.awsui_content-wrapper_14iqq_1kkdz_309:not(#\9) {
   display: flex;
   flex-direction: column;
   inline-size: 100%;
 }
-.awsui_content-wrapper-fit-height_14iqq_1yot8_310:not(#\9) {
+.awsui_content-wrapper-fit-height_14iqq_1kkdz_314:not(#\9) {
   block-size: 100%;
   overflow: hidden;
   border-end-start-radius: var(--border-radius-container-3o3ats, 0px);
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
 }
 
-.awsui_media_14iqq_1yot8_317:not(#\9) {
+.awsui_media_14iqq_1kkdz_321:not(#\9) {
   overflow: hidden;
   flex-shrink: 0;
 }
-.awsui_media_14iqq_1yot8_317 img:not(#\9),
-.awsui_media_14iqq_1yot8_317 video:not(#\9),
-.awsui_media_14iqq_1yot8_317 picture:not(#\9) {
+.awsui_media_14iqq_1kkdz_321 img:not(#\9),
+.awsui_media_14iqq_1kkdz_321 video:not(#\9),
+.awsui_media_14iqq_1kkdz_321 picture:not(#\9) {
   inline-size: 100%;
   block-size: 100%;
   object-fit: cover;
   object-position: center;
 }
-.awsui_media_14iqq_1yot8_317 iframe:not(#\9) {
+.awsui_media_14iqq_1kkdz_321 iframe:not(#\9) {
   inline-size: 100%;
   block-size: 100%;
   border-block: 0;
   border-inline: 0;
 }
-.awsui_media-top_14iqq_1yot8_335:not(#\9) {
+.awsui_media-top_14iqq_1kkdz_339:not(#\9) {
   max-block-size: 66%;
   border-start-start-radius: calc(var(--border-radius-container-3o3ats, 0px) - 1px);
   border-start-end-radius: calc(var(--border-radius-container-3o3ats, 0px) - 1px);
 }
-.awsui_media-side_14iqq_1yot8_340:not(#\9) {
+.awsui_media-side_14iqq_1kkdz_344:not(#\9) {
   max-inline-size: 66%;
   border-start-start-radius: calc(var(--border-radius-container-3o3ats, 0px) - 1px);
   border-end-start-radius: calc(var(--border-radius-container-3o3ats, 0px) - 1px);
 }
 
-.awsui_header_14iqq_1yot8_346:not(#\9) {
+.awsui_header_14iqq_1kkdz_350:not(#\9) {
   background-color: var(--color-background-container-header-9jxtzb, #fafafa);
   border-start-start-radius: var(--border-radius-container-3o3ats, 0px);
   border-start-end-radius: var(--border-radius-container-3o3ats, 0px);
 }
-.awsui_header_14iqq_1yot8_346.awsui_header-full-page_14iqq_1yot8_351:not(#\9) {
+.awsui_header_14iqq_1kkdz_350.awsui_header-full-page_14iqq_1kkdz_355:not(#\9) {
   background-color: var(--color-background-layout-main-f96353, #f2f3f3);
 }
-.awsui_header-variant-embedded_14iqq_1yot8_354.awsui_refresh_14iqq_1yot8_238:not(#\9):not(.awsui_header-sticky-enabled_14iqq_1yot8_354) {
+.awsui_header-variant-embedded_14iqq_1kkdz_358.awsui_refresh_14iqq_1kkdz_238:not(#\9):not(.awsui_header-sticky-enabled_14iqq_1kkdz_358) {
   background-color: transparent;
 }
-.awsui_header_14iqq_1yot8_346.awsui_header-with-media_14iqq_1yot8_357:not(#\9) {
+.awsui_header_14iqq_1kkdz_350.awsui_header-with-media_14iqq_1kkdz_361:not(#\9) {
   background: none;
 }
-.awsui_header_14iqq_1yot8_346.awsui_header-with-media_14iqq_1yot8_357:not(#\9):not(:empty) {
+.awsui_header_14iqq_1kkdz_350.awsui_header-with-media_14iqq_1kkdz_361:not(#\9):not(:empty) {
   border-block-end: none;
 }
-.awsui_header-sticky-disabled_14iqq_1yot8_363:not(#\9) {
+.awsui_header-sticky-disabled_14iqq_1kkdz_367:not(#\9) {
   position: relative;
   z-index: 1;
 }
-.awsui_header-sticky-enabled_14iqq_1yot8_354:not(#\9) {
+.awsui_header-sticky-enabled_14iqq_1kkdz_358:not(#\9) {
   inset-block-start: 0;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   position: sticky;
   z-index: 800;
 }
-.awsui_header-stuck_14iqq_1yot8_373:not(#\9) {
+.awsui_header-stuck_14iqq_1kkdz_377:not(#\9) {
   border-start-start-radius: 0;
   border-start-end-radius: 0;
   border-end-start-radius: 0;
   border-end-end-radius: 0;
 }
-.awsui_header-stuck_14iqq_1yot8_373:not(#\9)::before {
+.awsui_header-stuck_14iqq_1kkdz_377:not(#\9)::before {
   border-block: 0;
   border-inline: 0;
 }
-.awsui_header-stuck_14iqq_1yot8_373:not(#\9):not(.awsui_header-variant-cards_14iqq_1yot8_383) {
+.awsui_header-stuck_14iqq_1kkdz_377:not(#\9):not(.awsui_header-variant-cards_14iqq_1kkdz_387) {
   box-shadow: var(--shadow-sticky-embedded-bxmsxm, 0px 1px 4px -2px rgba(0, 28, 36, 0.5));
 }
-.awsui_header-dynamic-height_14iqq_1yot8_386.awsui_header-stuck_14iqq_1yot8_373:not(#\9) {
+.awsui_header-dynamic-height_14iqq_1kkdz_390.awsui_header-stuck_14iqq_1kkdz_377:not(#\9) {
   margin-block-end: calc(var(--line-height-heading-xl-66u22x, 36px) - var(--line-height-heading-l-643aq3, 22px));
 }
-.awsui_header_14iqq_1yot8_346:not(#\9):not(:empty) {
+.awsui_header_14iqq_1kkdz_350:not(#\9):not(:empty) {
   border-block-end: var(--border-container-sticky-width-lhedby, 1px) solid var(--color-border-container-divider-xr1vlc, #eaeded);
 }
-.awsui_header_14iqq_1yot8_346.awsui_with-paddings_14iqq_1yot8_392:not(#\9) {
+.awsui_header_14iqq_1kkdz_350.awsui_with-paddings_14iqq_1kkdz_396:not(#\9) {
   padding-block-start: var(--space-container-header-top-2yfg3x, 12px);
   padding-block-end: var(--space-container-header-bottom-p6av5y, 12px);
   padding-inline: var(--space-container-horizontal-v3575u, 20px);
 }
-.awsui_header_14iqq_1yot8_346.awsui_with-paddings_14iqq_1yot8_392.awsui_header-variant-cards_14iqq_1yot8_383:not(#\9) {
+.awsui_header_14iqq_1kkdz_350.awsui_with-paddings_14iqq_1kkdz_396.awsui_header-variant-cards_14iqq_1kkdz_387:not(#\9) {
   padding-block: var(--space-container-header-top-2yfg3x, 12px);
   padding-inline: var(--space-container-horizontal-v3575u, 20px);
 }
-.awsui_header_14iqq_1yot8_346.awsui_with-hidden-content_14iqq_1yot8_401:not(#\9) {
+.awsui_header_14iqq_1kkdz_350.awsui_with-hidden-content_14iqq_1kkdz_405:not(#\9) {
   border-end-start-radius: var(--border-radius-container-3o3ats, 0px);
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
 }
-.awsui_header-variant-cards_14iqq_1yot8_383:not(#\9) {
+.awsui_header-variant-cards_14iqq_1kkdz_387:not(#\9) {
   border-start-start-radius: var(--border-radius-container-3o3ats, 0px);
   border-start-end-radius: var(--border-radius-container-3o3ats, 0px);
   border-end-start-radius: var(--border-radius-container-3o3ats, 0px);
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
   box-sizing: border-box;
 }
-.awsui_header-variant-cards_14iqq_1yot8_383.awsui_refresh_14iqq_1yot8_238:not(#\9) {
+.awsui_header-variant-cards_14iqq_1kkdz_387.awsui_refresh_14iqq_1kkdz_238:not(#\9) {
   border-block: solid var(--border-divider-section-width-iueskx, 1px) var(--color-border-divider-default-u5ytia, #eaeded);
   border-inline: solid var(--border-divider-section-width-iueskx, 1px) var(--color-border-divider-default-u5ytia, #eaeded);
 }
-.awsui_header-variant-cards_14iqq_1yot8_383:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::before {
+.awsui_header-variant-cards_14iqq_1kkdz_387:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::before {
   content: "";
   position: absolute;
   inset-inline-start: 0px;
@@ -432,7 +436,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
   z-index: 1;
 }
-.awsui_header-variant-cards_14iqq_1yot8_383:not(#\9):not(.awsui_refresh_14iqq_1yot8_238)::after {
+.awsui_header-variant-cards_14iqq_1kkdz_387:not(#\9):not(.awsui_refresh_14iqq_1kkdz_238)::after {
   content: "";
   position: absolute;
   inset-inline-start: 0px;
@@ -448,26 +452,26 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-end-end-radius: var(--border-radius-container-3o3ats, 0px);
   box-shadow: var(--shadow-container-8g76zh, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
 }
-.awsui_header-variant-cards_14iqq_1yot8_383:not(#\9):not(.awsui_header-sticky-enabled_14iqq_1yot8_354) {
+.awsui_header-variant-cards_14iqq_1kkdz_387:not(#\9):not(.awsui_header-sticky-enabled_14iqq_1kkdz_358) {
   position: relative;
 }
-.awsui_header-variant-cards_14iqq_1yot8_383.awsui_header-stuck_14iqq_1yot8_373:not(#\9)::after, .awsui_header-variant-cards_14iqq_1yot8_383.awsui_header-stuck_14iqq_1yot8_373:not(#\9)::before {
+.awsui_header-variant-cards_14iqq_1kkdz_387.awsui_header-stuck_14iqq_1kkdz_377:not(#\9)::after, .awsui_header-variant-cards_14iqq_1kkdz_387.awsui_header-stuck_14iqq_1kkdz_377:not(#\9)::before {
   border-block: 0;
   border-inline: 0;
   border-start-start-radius: 0;
   border-start-end-radius: 0;
 }
-.awsui_header-variant-full-page_14iqq_1yot8_459.awsui_header-stuck_14iqq_1yot8_373:not(#\9) {
+.awsui_header-variant-full-page_14iqq_1kkdz_463.awsui_header-stuck_14iqq_1kkdz_377:not(#\9) {
   box-shadow: none;
 }
-.awsui_header-variant-full-page_14iqq_1yot8_459.awsui_header-stuck_14iqq_1yot8_373 > .awsui_header-cover_14iqq_1yot8_462:not(#\9) {
+.awsui_header-variant-full-page_14iqq_1kkdz_463.awsui_header-stuck_14iqq_1kkdz_377 > .awsui_header-cover_14iqq_1kkdz_466:not(#\9) {
   background-color: var(--color-background-layout-main-f96353, #f2f3f3);
   inline-size: 100%;
   position: absolute;
   block-size: var(--space-scaled-s-8j7izy, 12px);
   inset-block-start: calc(-1 * var(--space-scaled-s-8j7izy, 12px));
 }
-.awsui_header-variant-full-page_14iqq_1yot8_459.awsui_header-stuck_14iqq_1yot8_373:not(#\9)::before {
+.awsui_header-variant-full-page_14iqq_1kkdz_463.awsui_header-stuck_14iqq_1kkdz_377:not(#\9)::before {
   content: "";
   position: absolute;
   pointer-events: none;
@@ -477,7 +481,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inset-block-start: 0;
   border-block-end: solid var(--border-divider-section-width-iueskx, 1px) var(--color-border-divider-default-u5ytia, #eaeded);
 }
-.awsui_header-variant-full-page_14iqq_1yot8_459.awsui_header-stuck_14iqq_1yot8_373:not(#\9)::after {
+.awsui_header-variant-full-page_14iqq_1kkdz_463.awsui_header-stuck_14iqq_1kkdz_377:not(#\9)::after {
   content: "";
   position: absolute;
   inset: 0;
@@ -485,30 +489,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   clip-path: polygon(-999% 100%, 999% 100%, 999% 999%, -999% 999%);
 }
 
-.awsui_content_14iqq_1yot8_305:not(#\9) {
+.awsui_content_14iqq_1kkdz_309:not(#\9) {
   flex: 1;
 }
-.awsui_content-fit-height_14iqq_1yot8_490:not(#\9) {
+.awsui_content-fit-height_14iqq_1kkdz_494:not(#\9) {
   overflow: auto;
   display: flex;
   flex-direction: column;
 }
 
-.awsui_content-inner_14iqq_1yot8_496:not(#\9) {
+.awsui_content-inner_14iqq_1kkdz_500:not(#\9) {
   flex: 1;
 }
-.awsui_content-inner_14iqq_1yot8_496.awsui_with-paddings_14iqq_1yot8_392:not(#\9) {
+.awsui_content-inner_14iqq_1kkdz_500.awsui_with-paddings_14iqq_1kkdz_396:not(#\9) {
   padding-block: var(--space-scaled-l-7e51pg, 20px);
   padding-inline: var(--space-container-horizontal-v3575u, 20px);
 }
-.awsui_content-inner_14iqq_1yot8_496.awsui_with-paddings_14iqq_1yot8_392.awsui_with-header_14iqq_1yot8_503:not(#\9) {
+.awsui_content-inner_14iqq_1kkdz_500.awsui_with-paddings_14iqq_1kkdz_396.awsui_with-header_14iqq_1kkdz_507:not(#\9) {
   padding-block-start: var(--space-container-content-top-pvv221, 16px);
 }
 
-.awsui_footer_14iqq_1yot8_507.awsui_with-paddings_14iqq_1yot8_392:not(#\9) {
+.awsui_footer_14iqq_1kkdz_511.awsui_with-paddings_14iqq_1kkdz_396:not(#\9) {
   padding-block: var(--space-scaled-s-8j7izy, 12px);
   padding-inline: var(--space-container-horizontal-v3575u, 20px);
 }
-.awsui_footer_14iqq_1yot8_507.awsui_with-divider_14iqq_1yot8_511:not(#\9) {
+.awsui_footer_14iqq_1kkdz_511.awsui_with-divider_14iqq_1kkdz_515:not(#\9) {
   border-block-start: var(--border-divider-section-width-iueskx, 1px) solid var(--color-border-divider-default-u5ytia, #eaeded);
 }

package/lib/internal/template/container/styles.selectors.js

@@ -2,37 +2,38 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_14iqq_1yot8_189",
-  "fit-height": "awsui_fit-height_14iqq_1yot8_222",
-  "with-side-media": "awsui_with-side-media_14iqq_1yot8_227",
-  "variant-default": "awsui_variant-default_14iqq_1yot8_230",
-  "variant-stacked": "awsui_variant-stacked_14iqq_1yot8_230",
-  "refresh": "awsui_refresh_14iqq_1yot8_238",
-  "sticky-enabled": "awsui_sticky-enabled_14iqq_1yot8_288",
-  "with-top-media": "awsui_with-top-media_14iqq_1yot8_300",
-  "content-wrapper": "awsui_content-wrapper_14iqq_1yot8_305",
-  "content-wrapper-fit-height": "awsui_content-wrapper-fit-height_14iqq_1yot8_310",
-  "media": "awsui_media_14iqq_1yot8_317",
-  "media-top": "awsui_media-top_14iqq_1yot8_335",
-  "media-side": "awsui_media-side_14iqq_1yot8_340",
-  "header": "awsui_header_14iqq_1yot8_346",
-  "header-full-page": "awsui_header-full-page_14iqq_1yot8_351",
-  "header-variant-embedded": "awsui_header-variant-embedded_14iqq_1yot8_354",
-  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1yot8_354",
-  "header-with-media": "awsui_header-with-media_14iqq_1yot8_357",
-  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1yot8_363",
-  "header-stuck": "awsui_header-stuck_14iqq_1yot8_373",
-  "header-variant-cards": "awsui_header-variant-cards_14iqq_1yot8_383",
-  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1yot8_386",
-  "with-paddings": "awsui_with-paddings_14iqq_1yot8_392",
-  "with-hidden-content": "awsui_with-hidden-content_14iqq_1yot8_401",
-  "header-variant-full-page": "awsui_header-variant-full-page_14iqq_1yot8_459",
-  "header-cover": "awsui_header-cover_14iqq_1yot8_462",
-  "content": "awsui_content_14iqq_1yot8_305",
-  "content-fit-height": "awsui_content-fit-height_14iqq_1yot8_490",
-  "content-inner": "awsui_content-inner_14iqq_1yot8_496",
-  "with-header": "awsui_with-header_14iqq_1yot8_503",
-  "footer": "awsui_footer_14iqq_1yot8_507",
-  "with-divider": "awsui_with-divider_14iqq_1yot8_511"
+  "root": "awsui_root_14iqq_1kkdz_189",
+  "fit-height": "awsui_fit-height_14iqq_1kkdz_222",
+  "with-side-media": "awsui_with-side-media_14iqq_1kkdz_227",
+  "variant-default": "awsui_variant-default_14iqq_1kkdz_230",
+  "variant-stacked": "awsui_variant-stacked_14iqq_1kkdz_230",
+  "refresh": "awsui_refresh_14iqq_1kkdz_238",
+  "sticky-enabled": "awsui_sticky-enabled_14iqq_1kkdz_288",
+  "with-stuck-sticky-header-at-bottom": "awsui_with-stuck-sticky-header-at-bottom_14iqq_1kkdz_294",
+  "with-top-media": "awsui_with-top-media_14iqq_1kkdz_304",
+  "content-wrapper": "awsui_content-wrapper_14iqq_1kkdz_309",
+  "content-wrapper-fit-height": "awsui_content-wrapper-fit-height_14iqq_1kkdz_314",
+  "media": "awsui_media_14iqq_1kkdz_321",
+  "media-top": "awsui_media-top_14iqq_1kkdz_339",
+  "media-side": "awsui_media-side_14iqq_1kkdz_344",
+  "header": "awsui_header_14iqq_1kkdz_350",
+  "header-full-page": "awsui_header-full-page_14iqq_1kkdz_355",
+  "header-variant-embedded": "awsui_header-variant-embedded_14iqq_1kkdz_358",
+  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1kkdz_358",
+  "header-with-media": "awsui_header-with-media_14iqq_1kkdz_361",
+  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1kkdz_367",
+  "header-stuck": "awsui_header-stuck_14iqq_1kkdz_377",
+  "header-variant-cards": "awsui_header-variant-cards_14iqq_1kkdz_387",
+  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1kkdz_390",
+  "with-paddings": "awsui_with-paddings_14iqq_1kkdz_396",
+  "with-hidden-content": "awsui_with-hidden-content_14iqq_1kkdz_405",
+  "header-variant-full-page": "awsui_header-variant-full-page_14iqq_1kkdz_463",
+  "header-cover": "awsui_header-cover_14iqq_1kkdz_466",
+  "content": "awsui_content_14iqq_1kkdz_309",
+  "content-fit-height": "awsui_content-fit-height_14iqq_1kkdz_494",
+  "content-inner": "awsui_content-inner_14iqq_1kkdz_500",
+  "with-header": "awsui_with-header_14iqq_1kkdz_507",
+  "footer": "awsui_footer_14iqq_1kkdz_511",
+  "with-divider": "awsui_with-divider_14iqq_1kkdz_515"
 };
   

package/lib/internal/template/container/use-sticky-header.d.ts

@@ -1,6 +1,7 @@
 import { RefObject } from 'react';
 interface StickyHeaderContextProps {
     isStuck: boolean;
+    isStuckAtBottom: boolean;
 }
 interface ComputeOffsetProps {
     isMobile: boolean;
@@ -14,6 +15,7 @@ export declare const StickyHeaderContext: import("react").Context<StickyHeaderCo
 export declare const useStickyHeader: (rootRef: RefObject<HTMLDivElement>, headerRef: RefObject<HTMLDivElement>, __stickyHeader?: boolean, __stickyOffset?: number, __mobileStickyOffset?: number, __disableMobile?: boolean, __additionalOffset?: boolean) => {
     isSticky: boolean;
     isStuck: boolean;
+    isStuckAtBottom: boolean;
     stickyStyles: {
         style: {
             top: string;

package/lib/internal/template/container/use-sticky-header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-sticky-header.d.ts","sourceRoot":"","sources":["../../../src/container/use-sticky-header.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAAqD,MAAM,OAAO,CAAC;AASpG,UAAU,wBAAwB;IAChC,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,uBAAuB,EAAE,OAAO,CAAC;IACjC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,cAAc,EACd,oBAAoB,EACpB,uBAAuB,EACvB,kBAAkB,GACnB,EAAE,kBAAkB,GAAG,MAAM,CAQ7B;AAED,eAAO,MAAM,mBAAmB,mDAE9B,CAAC;AAEH,eAAO,MAAM,eAAe,YACjB,UAAU,cAAc,CAAC,aACvB,UAAU,cAAc,CAAC,mBACnB,OAAO,mBACP,MAAM,yBACA,MAAM,oBACX,OAAO;;;;;;;;;;CA8E1B,CAAC"}
+{"version":3,"file":"use-sticky-header.d.ts","sourceRoot":"","sources":["../../../src/container/use-sticky-header.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAAqD,MAAM,OAAO,CAAC;AASpG,UAAU,wBAAwB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,uBAAuB,EAAE,OAAO,CAAC;IACjC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,cAAc,EACd,oBAAoB,EACpB,uBAAuB,EACvB,kBAAkB,GACnB,EAAE,kBAAkB,GAAG,MAAM,CAQ7B;AAED,eAAO,MAAM,mBAAmB,mDAG9B,CAAC;AAEH,eAAO,MAAM,eAAe,YACjB,UAAU,cAAc,CAAC,aACvB,UAAU,cAAc,CAAC,mBACnB,OAAO,mBACP,MAAM,yBACA,MAAM,oBACX,OAAO;;;;;;;;;;;CAyF1B,CAAC"}