@cloudscape-design/components 3.0.637 → 3.0.639

package/annotation-context/annotation/styles.css.js

@@ -1,29 +1,29 @@
 
     import './styles.scoped.css';
     export default {
-  "arrow": "awsui_arrow_1hpp3_nnrhj_99",
-  "arrow-outer": "awsui_arrow-outer_1hpp3_nnrhj_103",
-  "arrow-inner": "awsui_arrow-inner_1hpp3_nnrhj_103",
-  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_nnrhj_144",
-  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_nnrhj_144",
-  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_nnrhj_147",
-  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_nnrhj_147",
-  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_nnrhj_150",
-  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_nnrhj_150",
-  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_nnrhj_153",
-  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_nnrhj_153",
-  "annotation": "awsui_annotation_1hpp3_nnrhj_161",
-  "next-button": "awsui_next-button_1hpp3_nnrhj_162",
-  "previous-button": "awsui_previous-button_1hpp3_nnrhj_163",
-  "finish-button": "awsui_finish-button_1hpp3_nnrhj_164",
-  "header": "awsui_header_1hpp3_nnrhj_165",
-  "step-counter-content": "awsui_step-counter-content_1hpp3_nnrhj_166",
-  "content": "awsui_content_1hpp3_nnrhj_167",
-  "description": "awsui_description_1hpp3_nnrhj_171",
-  "actionBar": "awsui_actionBar_1hpp3_nnrhj_176",
-  "stepCounter": "awsui_stepCounter_1hpp3_nnrhj_183",
-  "divider": "awsui_divider_1hpp3_nnrhj_187",
-  "hotspot": "awsui_hotspot_1hpp3_nnrhj_191",
-  "icon": "awsui_icon_1hpp3_nnrhj_258"
+  "arrow": "awsui_arrow_1hpp3_1q1bo_99",
+  "arrow-outer": "awsui_arrow-outer_1hpp3_1q1bo_103",
+  "arrow-inner": "awsui_arrow-inner_1hpp3_1q1bo_103",
+  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_1q1bo_144",
+  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_1q1bo_144",
+  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_1q1bo_147",
+  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_1q1bo_147",
+  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_1q1bo_150",
+  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_1q1bo_150",
+  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_1q1bo_153",
+  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_1q1bo_153",
+  "annotation": "awsui_annotation_1hpp3_1q1bo_161",
+  "next-button": "awsui_next-button_1hpp3_1q1bo_162",
+  "previous-button": "awsui_previous-button_1hpp3_1q1bo_163",
+  "finish-button": "awsui_finish-button_1hpp3_1q1bo_164",
+  "header": "awsui_header_1hpp3_1q1bo_165",
+  "step-counter-content": "awsui_step-counter-content_1hpp3_1q1bo_166",
+  "content": "awsui_content_1hpp3_1q1bo_167",
+  "description": "awsui_description_1hpp3_1q1bo_171",
+  "actionBar": "awsui_actionBar_1hpp3_1q1bo_176",
+  "stepCounter": "awsui_stepCounter_1hpp3_1q1bo_183",
+  "divider": "awsui_divider_1hpp3_1q1bo_187",
+  "hotspot": "awsui_hotspot_1hpp3_1q1bo_191",
+  "icon": "awsui_icon_1hpp3_1q1bo_258"
 };
   

package/annotation-context/annotation/styles.scoped.css

@@ -96,11 +96,11 @@ 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_arrow_1hpp3_nnrhj_99:not(#\9) {
+.awsui_arrow_1hpp3_1q1bo_99:not(#\9) {
   inline-size: 20px;
   block-size: 10px;
 }
-.awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9), .awsui_arrow-inner_1hpp3_nnrhj_103:not(#\9) {
+.awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9), .awsui_arrow-inner_1hpp3_1q1bo_103:not(#\9) {
   position: absolute;
   overflow: hidden;
   inline-size: 20px;
@@ -108,7 +108,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   inset-block-start: 0;
   inset-inline-start: 0;
 }
-.awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after, .awsui_arrow-inner_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after, .awsui_arrow-inner_1hpp3_1q1bo_103:not(#\9)::after {
   content: "";
   box-sizing: border-box;
   display: inline-block;
@@ -124,33 +124,33 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   transform: rotate(45deg);
   transform-origin: 0 100%;
 }
-.awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9):dir(rtl)::after, .awsui_arrow-inner_1hpp3_nnrhj_103:not(#\9):dir(rtl)::after {
+.awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9):dir(rtl)::after, .awsui_arrow-inner_1hpp3_1q1bo_103:not(#\9):dir(rtl)::after {
   transform: rotate(-45deg);
   transform-origin: 100% 100%;
 }
-.awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after {
   background-color: var(--color-border-status-info-8upc6f, #0972d3);
 }
-.awsui_arrow-inner_1hpp3_nnrhj_103:not(#\9) {
+.awsui_arrow-inner_1hpp3_1q1bo_103:not(#\9) {
   inset-block-start: 2px;
 }
-.awsui_arrow-inner_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-inner_1hpp3_1q1bo_103:not(#\9)::after {
   border-start-start-radius: 1px;
   border-start-end-radius: 0;
   border-end-start-radius: 0;
   border-end-end-radius: 0;
   background-color: var(--color-background-status-info-mvnbre, #f2f8fd);
 }
-.awsui_arrow-position-right-top_1hpp3_nnrhj_144 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after, .awsui_arrow-position-right-bottom_1hpp3_nnrhj_144 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-position-right-top_1hpp3_1q1bo_144 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after, .awsui_arrow-position-right-bottom_1hpp3_1q1bo_144 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after {
   box-shadow: -0.71px 0.71px 4px -2px var(--color-shadow-default-8jp634, rgba(0, 7, 22, 0.12));
 }
-.awsui_arrow-position-left-top_1hpp3_nnrhj_147 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after, .awsui_arrow-position-left-bottom_1hpp3_nnrhj_147 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-position-left-top_1hpp3_1q1bo_147 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after, .awsui_arrow-position-left-bottom_1hpp3_1q1bo_147 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after {
   box-shadow: 0.71px -0.71px 4px -2px var(--color-shadow-default-8jp634, rgba(0, 7, 22, 0.12));
 }
-.awsui_arrow-position-top-center_1hpp3_nnrhj_150 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after, .awsui_arrow-position-top-responsive_1hpp3_nnrhj_150 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-position-top-center_1hpp3_1q1bo_150 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after, .awsui_arrow-position-top-responsive_1hpp3_1q1bo_150 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after {
   box-shadow: -0.71px -0.71px 4px -2px var(--color-shadow-default-8jp634, rgba(0, 7, 22, 0.12));
 }
-.awsui_arrow-position-bottom-center_1hpp3_nnrhj_153 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after, .awsui_arrow-position-bottom-responsive_1hpp3_nnrhj_153 > .awsui_arrow-outer_1hpp3_nnrhj_103:not(#\9)::after {
+.awsui_arrow-position-bottom-center_1hpp3_1q1bo_153 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after, .awsui_arrow-position-bottom-responsive_1hpp3_1q1bo_153 > .awsui_arrow-outer_1hpp3_1q1bo_103:not(#\9)::after {
   box-shadow: 0.71px 0.71px 4px -2px var(--color-shadow-default-8jp634, rgba(0, 7, 22, 0.12));
 }
 
@@ -158,37 +158,37 @@ 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_annotation_1hpp3_nnrhj_161:not(#\9),
-.awsui_next-button_1hpp3_nnrhj_162:not(#\9),
-.awsui_previous-button_1hpp3_nnrhj_163:not(#\9),
-.awsui_finish-button_1hpp3_nnrhj_164:not(#\9),
-.awsui_header_1hpp3_nnrhj_165:not(#\9),
-.awsui_step-counter-content_1hpp3_nnrhj_166:not(#\9),
-.awsui_content_1hpp3_nnrhj_167:not(#\9) {
+.awsui_annotation_1hpp3_1q1bo_161:not(#\9),
+.awsui_next-button_1hpp3_1q1bo_162:not(#\9),
+.awsui_previous-button_1hpp3_1q1bo_163:not(#\9),
+.awsui_finish-button_1hpp3_1q1bo_164:not(#\9),
+.awsui_header_1hpp3_1q1bo_165:not(#\9),
+.awsui_step-counter-content_1hpp3_1q1bo_166:not(#\9),
+.awsui_content_1hpp3_1q1bo_167:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_description_1hpp3_nnrhj_171:not(#\9) {
+.awsui_description_1hpp3_1q1bo_171:not(#\9) {
   overflow: hidden;
   margin-block-start: var(--space-xxs-p8yyaw, 4px);
 }
 
-.awsui_actionBar_1hpp3_nnrhj_176:not(#\9) {
+.awsui_actionBar_1hpp3_1q1bo_176:not(#\9) {
   display: flex;
   justify-content: space-between;
   align-items: center;
   position: relative;
 }
 
-.awsui_stepCounter_1hpp3_nnrhj_183:not(#\9) {
+.awsui_stepCounter_1hpp3_1q1bo_183:not(#\9) {
   margin-inline-end: 20px;
 }
 
-.awsui_divider_1hpp3_nnrhj_187:not(#\9) {
+.awsui_divider_1hpp3_1q1bo_187:not(#\9) {
   border-block-end: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-default-j74lyz, #b6bec9);
 }
 
-.awsui_hotspot_1hpp3_nnrhj_191:not(#\9) {
+.awsui_hotspot_1hpp3_1q1bo_191:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -228,21 +228,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-block: 0;
   padding-inline: 0;
   cursor: pointer;
-  scroll-margin: var(--awsui-content-scroll-margin-tkr9yl, 40px 0 0 0);
+  scroll-margin: var(--awsui-content-scroll-margin-7t5ed6, 40px 0 0 0);
   inline-size: 16px;
   block-size: 16px;
 }
-.awsui_hotspot_1hpp3_nnrhj_191:not(#\9):focus {
+.awsui_hotspot_1hpp3_1q1bo_191:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_nnrhj_191:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_1q1bo_191:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_nnrhj_191:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_1q1bo_191:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(2px - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_nnrhj_191:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_1q1bo_191:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -256,13 +256,13 @@ body[data-awsui-focus-visible=true] .awsui_hotspot_1hpp3_nnrhj_191:not(#\9):focu
   border-end-end-radius: var(--border-radius-control-circular-focus-ring-w07mub, 4px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-b2ntyl, #0972d3);
 }
-.awsui_hotspot_1hpp3_nnrhj_191 > .awsui_icon_1hpp3_nnrhj_258:not(#\9) {
+.awsui_hotspot_1hpp3_1q1bo_191 > .awsui_icon_1hpp3_1q1bo_258:not(#\9) {
   position: relative;
   stroke: var(--color-text-link-default-latg1a, #0972d3);
 }
-.awsui_hotspot_1hpp3_nnrhj_191:not(#\9):hover > .awsui_icon_1hpp3_nnrhj_258 {
+.awsui_hotspot_1hpp3_1q1bo_191:not(#\9):hover > .awsui_icon_1hpp3_1q1bo_258 {
   stroke: var(--color-text-link-hover-8j6p14, #033160);
 }
-.awsui_hotspot_1hpp3_nnrhj_191:not(#\9):active > .awsui_icon_1hpp3_nnrhj_258 {
+.awsui_hotspot_1hpp3_1q1bo_191:not(#\9):active > .awsui_icon_1hpp3_1q1bo_258 {
   stroke: var(--color-text-link-default-latg1a, #0972d3);
 }

package/annotation-context/annotation/styles.selectors.js

@@ -2,29 +2,29 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "arrow": "awsui_arrow_1hpp3_nnrhj_99",
-  "arrow-outer": "awsui_arrow-outer_1hpp3_nnrhj_103",
-  "arrow-inner": "awsui_arrow-inner_1hpp3_nnrhj_103",
-  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_nnrhj_144",
-  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_nnrhj_144",
-  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_nnrhj_147",
-  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_nnrhj_147",
-  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_nnrhj_150",
-  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_nnrhj_150",
-  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_nnrhj_153",
-  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_nnrhj_153",
-  "annotation": "awsui_annotation_1hpp3_nnrhj_161",
-  "next-button": "awsui_next-button_1hpp3_nnrhj_162",
-  "previous-button": "awsui_previous-button_1hpp3_nnrhj_163",
-  "finish-button": "awsui_finish-button_1hpp3_nnrhj_164",
-  "header": "awsui_header_1hpp3_nnrhj_165",
-  "step-counter-content": "awsui_step-counter-content_1hpp3_nnrhj_166",
-  "content": "awsui_content_1hpp3_nnrhj_167",
-  "description": "awsui_description_1hpp3_nnrhj_171",
-  "actionBar": "awsui_actionBar_1hpp3_nnrhj_176",
-  "stepCounter": "awsui_stepCounter_1hpp3_nnrhj_183",
-  "divider": "awsui_divider_1hpp3_nnrhj_187",
-  "hotspot": "awsui_hotspot_1hpp3_nnrhj_191",
-  "icon": "awsui_icon_1hpp3_nnrhj_258"
+  "arrow": "awsui_arrow_1hpp3_1q1bo_99",
+  "arrow-outer": "awsui_arrow-outer_1hpp3_1q1bo_103",
+  "arrow-inner": "awsui_arrow-inner_1hpp3_1q1bo_103",
+  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_1q1bo_144",
+  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_1q1bo_144",
+  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_1q1bo_147",
+  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_1q1bo_147",
+  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_1q1bo_150",
+  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_1q1bo_150",
+  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_1q1bo_153",
+  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_1q1bo_153",
+  "annotation": "awsui_annotation_1hpp3_1q1bo_161",
+  "next-button": "awsui_next-button_1hpp3_1q1bo_162",
+  "previous-button": "awsui_previous-button_1hpp3_1q1bo_163",
+  "finish-button": "awsui_finish-button_1hpp3_1q1bo_164",
+  "header": "awsui_header_1hpp3_1q1bo_165",
+  "step-counter-content": "awsui_step-counter-content_1hpp3_1q1bo_166",
+  "content": "awsui_content_1hpp3_1q1bo_167",
+  "description": "awsui_description_1hpp3_1q1bo_171",
+  "actionBar": "awsui_actionBar_1hpp3_1q1bo_176",
+  "stepCounter": "awsui_stepCounter_1hpp3_1q1bo_183",
+  "divider": "awsui_divider_1hpp3_1q1bo_187",
+  "hotspot": "awsui_hotspot_1hpp3_1q1bo_191",
+  "icon": "awsui_icon_1hpp3_1q1bo_258"
 };
   

package/app-layout/implementation.d.ts

@@ -16,4 +16,35 @@ export declare const AppLayoutImplementation: React.ForwardRefExoticComponent<Om
         inlineSize: number;
     };
 } & React.RefAttributes<AppLayoutProps.Ref>>;
+export declare const createWidgetizedAppLayout: (Loader?: React.ForwardRefExoticComponent<Omit<AppLayoutProps, "headerSelector" | "footerSelector"> & {
+    contentType: AppLayoutProps.ContentType;
+    navigationOpen: boolean;
+    navigationWidth: number;
+    toolsWidth: number;
+    minContentWidth: number;
+    onNavigationChange: import("../internal/events").NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;
+} & {
+    placement: {
+        insetBlockStart: number;
+        insetBlockEnd: number;
+        insetInlineStart: number;
+        insetInlineEnd: number;
+        inlineSize: number;
+    };
+} & React.RefAttributes<AppLayoutProps.Ref>> | undefined) => React.ForwardRefExoticComponent<Omit<AppLayoutProps, "headerSelector" | "footerSelector"> & {
+    contentType: AppLayoutProps.ContentType;
+    navigationOpen: boolean;
+    navigationWidth: number;
+    toolsWidth: number;
+    minContentWidth: number;
+    onNavigationChange: import("../internal/events").NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;
+} & {
+    placement: {
+        insetBlockStart: number;
+        insetBlockEnd: number;
+        insetInlineStart: number;
+        insetInlineEnd: number;
+        inlineSize: number;
+    };
+} & React.RefAttributes<AppLayoutProps.Ref>>;
 //# sourceMappingURL=implementation.d.ts.map

package/app-layout/implementation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/app-layout/implementation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,cAAc,EAA8B,MAAM,cAAc,CAAC;AAE1E,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;4CAKnC,CAAC"}
+{"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/app-layout/implementation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,cAAc,EAA8B,MAAM,cAAc,CAAC;AAE1E,eAAO,MAAM,uBAAuB;;;;;;;;;;;;;;;4CAKnC,CAAC;AAEF,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4CAIZ,CAAC"}

package/app-layout/implementation.js

@@ -2,10 +2,12 @@
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
+import { createWidgetizedForwardRef } from '../internal/widgets';
 import ClassicAppLayout from './classic';
 import RefreshedAppLayout from './visual-refresh';
 export const AppLayoutImplementation = React.forwardRef((props, ref) => {
     const isRefresh = useVisualRefresh();
     return isRefresh ? React.createElement(RefreshedAppLayout, Object.assign({ ref: ref }, props)) : React.createElement(ClassicAppLayout, Object.assign({ ref: ref }, props));
 });
+export const createWidgetizedAppLayout = createWidgetizedForwardRef(AppLayoutImplementation);
 //# sourceMappingURL=implementation.js.map

package/app-layout/implementation.js.map

@@ -1 +1 @@
-{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/app-layout/implementation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,gBAAgB,MAAM,WAAW,CAAC;AACzC,OAAO,kBAAkB,MAAM,kBAAkB,CAAC;AAGlD,MAAM,CAAC,MAAM,uBAAuB,GAAG,KAAK,CAAC,UAAU,CACrD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,OAAO,SAAS,CAAC,CAAC,CAAC,oBAAC,kBAAkB,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,EAAI,CAAC,CAAC,CAAC,oBAAC,gBAAgB,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,EAAI,CAAC;AAC7G,CAAC,CACF,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport ClassicAppLayout from './classic';\nimport RefreshedAppLayout from './visual-refresh';\nimport { AppLayoutProps, AppLayoutPropsWithDefaults } from './interfaces';\n\nexport const AppLayoutImplementation = React.forwardRef<AppLayoutProps.Ref, AppLayoutPropsWithDefaults>(\n  (props, ref) => {\n    const isRefresh = useVisualRefresh();\n    return isRefresh ? <RefreshedAppLayout ref={ref} {...props} /> : <ClassicAppLayout ref={ref} {...props} />;\n  }\n);\n"]}
+{"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/app-layout/implementation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,EAAE,0BAA0B,EAAE,MAAM,qBAAqB,CAAC;AACjE,OAAO,gBAAgB,MAAM,WAAW,CAAC;AACzC,OAAO,kBAAkB,MAAM,kBAAkB,CAAC;AAGlD,MAAM,CAAC,MAAM,uBAAuB,GAAG,KAAK,CAAC,UAAU,CACrD,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,OAAO,SAAS,CAAC,CAAC,CAAC,oBAAC,kBAAkB,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,EAAI,CAAC,CAAC,CAAC,oBAAC,gBAAgB,kBAAC,GAAG,EAAE,GAAG,IAAM,KAAK,EAAI,CAAC;AAC7G,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,yBAAyB,GAAG,0BAA0B,CAIjE,uBAAuB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { createWidgetizedForwardRef } from '../internal/widgets';\nimport ClassicAppLayout from './classic';\nimport RefreshedAppLayout from './visual-refresh';\nimport { AppLayoutProps, AppLayoutPropsWithDefaults } from './interfaces';\n\nexport const AppLayoutImplementation = React.forwardRef<AppLayoutProps.Ref, AppLayoutPropsWithDefaults>(\n  (props, ref) => {\n    const isRefresh = useVisualRefresh();\n    return isRefresh ? <RefreshedAppLayout ref={ref} {...props} /> : <ClassicAppLayout ref={ref} {...props} />;\n  }\n);\n\nexport const createWidgetizedAppLayout = createWidgetizedForwardRef<\n  AppLayoutPropsWithDefaults,\n  AppLayoutProps.Ref,\n  typeof AppLayoutImplementation\n>(AppLayoutImplementation);\n"]}

package/app-layout/interfaces.d.ts

@@ -145,6 +145,13 @@ export interface AppLayoutProps extends BaseComponentProps {
      * @visualrefresh
      */
     disableContentHeaderOverlap?: boolean;
+    /**
+     * Determines the visual treatment for the breadcrumbs and notifications slots. Specifically:
+     * * `default` - Does not apply any visual treatment.
+     * * `high-contrast` - Applies high-contrast to both slots. Use in conjunction with `headerVariant="high-contrast"` in ContentLayout.
+     * @visualrefresh
+     */
+    headerVariant?: 'default' | 'high-contrast';
     /**
      * Main content.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/app-layout/interfaces.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/app-layout/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,WAAW,cAAe,SAAQ,kBAAkB;IACxD;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC;IAEzC;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IAEvC;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE/B;;OAEG;IACH,cAAc,CAAC,EAAE,yBAAyB,CAAC,cAAc,CAAC,kBAAkB,CAAC,CAAC;IAE9E;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IAEjC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAE5B;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA8BG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC;IAEnC;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEhC;;;;OAIG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;IAEtC;;;;;OAKG;IACH,aAAa,CAAC,EAAE,SAAS,GAAG,eAAe,CAAC;IAE5C;;OAEG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;OAIG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEhC;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE9B;;OAEG;IACH,kBAAkB,CAAC,EAAE,yBAAyB,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IAE5E;;OAEG;IACH,aAAa,CAAC,EAAE,yBAAyB,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IAEvE;;;;OAIG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE7B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,cAAc,CAAC,qBAAqB,CAAC;IAC7D;;OAEG;IACH,kBAAkB,CAAC,EAAE,yBAAyB,CAAC,cAAc,CAAC,sBAAsB,CAAC,CAAC;IACtF;;OAEG;IACH,kBAAkB,CAAC,EAAE,yBAAyB,CAAC,cAAc,CAAC,YAAY,CAAC,CAAC;IAC5E;;OAEG;IACH,6BAA6B,CAAC,EAAE,yBAAyB,CAAC,cAAc,CAAC,qBAAqB,CAAC,CAAC;CACjG;AAED,yBAAiB,cAAc,CAAC;IAC9B,KAAY,WAAW,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,WAAW,CAAC;IAE1F,UAAiB,GAAG;QAClB;;;WAGG;QACH,0BAA0B,IAAI,IAAI,CAAC;QAEnC;;;WAGG;QACH,SAAS,IAAI,IAAI,CAAC;QAElB;;;;WAIG;QACH,eAAe,IAAI,IAAI,CAAC;QAExB;;WAEG;QACH,iBAAiB,IAAI,IAAI,CAAC;QAE1B;;WAEG;QACH,eAAe,IAAI,IAAI,CAAC;KACzB;IAED,UAAiB,MAAM;QACrB,EAAE,EAAE,MAAM,CAAC;QACX,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,OAAO,EAAE;YACP,QAAQ,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;YAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;SAC3B,CAAC;QACF,UAAU,EAAE,gBAAgB,CAAC;QAC7B,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,SAAS,CAAC,EAAE,OAAO,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,yBAAyB,CAAC;YAAE,IAAI,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC;KACxD;IAED,UAAiB,gBAAgB;QAC/B,UAAU,EAAE,MAAM,CAAC;QACnB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,YAAY,CAAC,EAAE,MAAM,CAAC;KACvB;IAED,UAAiB,MAAM;QACrB,aAAa,CAAC,EAAE,MAAM,CAAC;QAEvB,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;QAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;QAEzB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,UAAU,CAAC,EAAE,MAAM,CAAC;QAEpB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,eAAe,CAAC,EAAE,MAAM,CAAC;QACzB,wBAAwB,CAAC,EAAE,MAAM,CAAC;KACnC;IAED,UAAiB,YAAY;QAC3B,IAAI,EAAE,OAAO,CAAC;KACf;IAED,UAAiB,sBAAsB;QACrC,IAAI,EAAE,MAAM,CAAC;KACd;IAED,UAAiB,qBAAqB;QACpC,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAAC;KAC7B;IAGD,KAAY,kBAAkB,GAAG,MAAM,GAAG,QAAQ,CAAC;IAEnD,UAAiB,kBAAkB;QACjC,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;KAC/B;CACF;AAED,MAAM,MAAM,0BAA0B,GAAG,YAAY,CACnD,IAAI,CAAC,cAAc,EAAE,gBAAgB,GAAG,gBAAgB,CAAC,EACzD,aAAa,GAAG,iBAAiB,GAAG,YAAY,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,oBAAoB,CAC/G,GAAG;IACF,SAAS,EAAE;QACT,eAAe,EAAE,MAAM,CAAC;QACxB,aAAa,EAAE,MAAM,CAAC;QACtB,gBAAgB,EAAE,MAAM,CAAC;QACzB,cAAc,EAAE,MAAM,CAAC;QACvB,UAAU,EAAE,MAAM,CAAC;KACpB,CAAC;CACH,CAAC"}

package/app-layout/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/app-layout/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { IconProps } from '../icon/interfaces';\nimport { SomeRequired } from '../internal/types';\n\nexport interface AppLayoutProps extends BaseComponentProps {\n  /**\n   * Determines the default behavior of the component based on some predefined page layouts.\n   * Individual properties will always take precedence over the default coming from the content type.\n   */\n  contentType?: AppLayoutProps.ContentType;\n\n  /**\n   * Drawers property. If you set both `drawers` and `tools`, `drawers` will take precedence.\n \n   * Each Drawer is an item in the drawers wrapper with the following properties:\n   * * id (string) - the id of the drawer.\n   * * content (React.ReactNode) - the content in the drawer.\n   * * trigger (DrawerTrigger) - the button that opens and closes the active drawer. \n   * * ariaLabels (DrawerAriaLabels) - the labels for the interactive elements of the drawer.\n   * * badge (boolean) - Adds a badge to the corner of the icon to indicate a state change. For example: Unread notifications.\n   * * resizable (boolean) - if the drawer is resizable or not.\n   * * defaultSize (number) - starting size of the drawer. if not set, defaults to 290.\n   * * onResize (({ size: number }) => void) - Fired when the active drawer is resized.\n   * \n   * #### DrawerTrigger\n   * - `iconName` (IconProps.Name) - (Optional) Specifies the icon to be displayed.\n   * - `iconSvg` (React.ReactNode) - (Optional) Specifies the SVG of a custom icon. For more information, see [SVG icon guidelines](/components/icon/?tabId=api#slots)\n   *\n   * #### DrawerAriaLabels\n   * - `drawerName` (string) - Label for the drawer itself.\n   * - `closeButton` (string) - (Optional) Label for the close button.\n   * - `triggerButton` (string) - (Optional) Label for the trigger button.\n   * - `resizeHandle` (string) - (Optional) Label for the resize handle.\n   */\n  drawers?: Array<AppLayoutProps.Drawer>;\n\n  /**\n   * The active drawer id. If you want to clear the active drawer, use `null`.\n   */\n  activeDrawerId?: string | null;\n\n  /**\n   * Fired when the active drawer is toggled.\n   */\n  onDrawerChange?: NonCancelableEventHandler<AppLayoutProps.DrawerChangeDetail>;\n\n  /**\n   * If `true`, disables outer paddings for the content slot.\n   */\n  disableContentPaddings?: boolean;\n\n  /**\n   * Activates a backwards-compatibility mode for applications with non-fixed headers and footers.\n   * @deprecated This layout is being phased out and may miss some features.\n   */\n  disableBodyScroll?: boolean;\n\n  /**\n   * State of the navigation drawer.\n   */\n  navigationOpen?: boolean;\n\n  /**\n   * Navigation drawer width in pixels.\n   */\n  navigationWidth?: number;\n\n  /**\n   * If `true`, the navigation drawer is not displayed at all.\n   */\n  navigationHide?: boolean;\n\n  /**\n   * State of the tools drawer.\n   */\n  toolsOpen?: boolean;\n\n  /**\n   * If `true`, the tools drawer is not displayed at all.\n   */\n  toolsHide?: boolean;\n\n  /**\n   * Tools drawer width in pixels.\n   */\n  toolsWidth?: number;\n\n  /**\n   * Maximum main content panel width in pixels.\n   *\n   * If set to `Number.MAX_VALUE`, the main content panel will occupy the full available width.\n   */\n  maxContentWidth?: number;\n\n  /**\n   * Minimum main content panel width in pixels.\n   */\n  minContentWidth?: number;\n\n  /**\n   * If true, the notification slot is rendered above the scrollable\n   * content area so it is always visible.\n   */\n  stickyNotifications?: boolean;\n\n  /**\n   * CSS selector for the application header.\n   */\n  headerSelector?: string;\n\n  /**\n   * CSS selector for the application footer.\n   */\n  footerSelector?: string;\n\n  /**\n   * Aria labels for the drawer operating buttons. Use this property to ensure accessibility.\n   *\n   * * `navigation` (string) - Label for the landmark that wraps the navigation drawer.\n   * * `navigationClose` (string) - Label for the button that closes the navigation drawer.\n   * * `navigationToggle` (string) - Label for the button that opens the navigation drawer.\n   * * `notification` (string) - Label for the region that contains notification messages.\n   * * `tools` (string) - Label for the landmark that wraps the tools drawer.\n   * * `toolsClose` (string) - Label for the button that closes the tools drawer.\n   * * `toolsToggle` (string) - Label for the button that opens the tools drawer.\n   * * `drawers` (string) - Label for the landmark that wraps the active drawer.\n   * * `drawersOverflow` (string) - Label for the ellipsis button with any overflow drawers.\n   * * `drawersOverflowWithBadge` (string) - Label for the ellipsis button with any overflow drawers, with a badge.\n   *\n   * Example:\n   * ```\n   * {\n   *   navigation: \"Navigation drawer\",\n   *   navigationClose: \"Close navigation drawer\",\n   *   navigationToggle: \"Open navigation drawer\",\n   *   notifications: \"Notifications\",\n   *   tools: \"Help panel\",\n   *   toolsClose: \"Close help panel\",\n   *   toolsToggle: \"Open help panel\",\n   *   drawers: \"Drawers\",\n   *   drawersOverflow: \"Overflow drawers\",\n   *   drawersOverflowWithBadge: \"Overflow drawers (Unread notifications)\"\n   * }\n   * ```\n   * @i18n\n   */\n  ariaLabels?: AppLayoutProps.Labels;\n\n  /**\n   * Navigation drawer.\n   */\n  navigation?: React.ReactNode;\n\n  /**\n   * Top area of the page content.\n   * @deprecated Replaced by the `header` slot of the [content layout](/components/content-layout/) component.\n   * @visualrefresh\n   */\n  contentHeader?: React.ReactNode;\n\n  /**\n   * Disables overlap between `contentHeader` and `content` slots.\n   * @deprecated Replaced by the `disableOverlap` property of the [content layout](/components/content-layout/) component.\n   * @visualrefresh\n   */\n  disableContentHeaderOverlap?: boolean;\n\n  /**\n   * Main content.\n   */\n  content?: React.ReactNode;\n\n  /**\n   * Tools drawer.\n   */\n  tools?: React.ReactNode;\n\n  /**\n   * Displayed on top of the main content in the scrollable area.\n   *\n   * Conceived to contain notifications (flash messages).\n   */\n  notifications?: React.ReactNode;\n\n  /**\n   * Use this slot to add the [breadcrumb group component](/components/breadcrumb-group/) to the app layout.\n   */\n  breadcrumbs?: React.ReactNode;\n\n  /**\n   * Fired when the navigation drawer is toggled.\n   */\n  onNavigationChange?: NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;\n\n  /**\n   * Fired when the tools drawer is toggled.\n   */\n  onToolsChange?: NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;\n\n  /**\n   * Use this slot to add the [split panel component](/components/split-panel/) to the app layout.\n   *\n   * Note: If provided, this property should be set to `null` or `undefined` if a split panel should not be rendered.\n   */\n  splitPanel?: React.ReactNode;\n\n  /**\n   * The size of the split panel in pixels.\n   */\n  splitPanelSize?: number;\n\n  /**\n   * State of the split panel.\n   */\n  splitPanelOpen?: boolean;\n  /**\n   * Controls the split panel preferences.\n   *\n   * By default, the preference is `{ position: 'bottom' }`\n   */\n  splitPanelPreferences?: AppLayoutProps.SplitPanelPreferences;\n  /**\n   * Fired when the split panel is resized.\n   */\n  onSplitPanelResize?: NonCancelableEventHandler<AppLayoutProps.SplitPanelResizeDetail>;\n  /**\n   * Fired when the split panel is toggled.\n   */\n  onSplitPanelToggle?: NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;\n  /**\n   * Fired when the split panel preferences change.\n   */\n  onSplitPanelPreferencesChange?: NonCancelableEventHandler<AppLayoutProps.SplitPanelPreferences>;\n}\n\nexport namespace AppLayoutProps {\n  export type ContentType = 'default' | 'form' | 'table' | 'cards' | 'wizard' | 'dashboard';\n\n  export interface Ref {\n    /**\n     * Manually closes the navigation drawer if it is necessary for the current\n     * viewport size.\n     */\n    closeNavigationIfNecessary(): void;\n\n    /**\n     * Opens the tools panel if it is not already open. Note that it is preferable\n     * to control the state by listening to `toolsChange` and providing `toolsOpen`.\n     */\n    openTools(): void;\n\n    /**\n     * Focuses the tools panel if it is open. Use this to focus the tools panel\n     * after changing the content, for example when clicking on an 'info' link while\n     * the panel is already open.\n     */\n    focusToolsClose(): void;\n\n    /**\n     * Focuses the active drawer. Use this to focus the active drawer after opening it programmatically.\n     */\n    focusActiveDrawer(): void;\n\n    /**\n     * Focuses the split panel if it is open.\n     */\n    focusSplitPanel(): void;\n  }\n\n  export interface Drawer {\n    id: string;\n    content: React.ReactNode;\n    trigger: {\n      iconName?: IconProps.Name;\n      iconSvg?: React.ReactNode;\n    };\n    ariaLabels: DrawerAriaLabels;\n    badge?: boolean;\n    resizable?: boolean;\n    defaultSize?: number;\n    onResize?: NonCancelableEventHandler<{ size: number }>;\n  }\n\n  export interface DrawerAriaLabels {\n    drawerName: string;\n    closeButton?: string;\n    triggerButton?: string;\n    resizeHandle?: string;\n  }\n\n  export interface Labels {\n    notifications?: string;\n\n    navigation?: string;\n    navigationToggle?: string;\n    navigationClose?: string;\n\n    tools?: string;\n    toolsToggle?: string;\n    toolsClose?: string;\n\n    drawers?: string;\n    drawersOverflow?: string;\n    drawersOverflowWithBadge?: string;\n  }\n\n  export interface ChangeDetail {\n    open: boolean;\n  }\n\n  export interface SplitPanelResizeDetail {\n    size: number;\n  }\n\n  export interface SplitPanelPreferences {\n    position: 'side' | 'bottom';\n  }\n  // Duplicated the positions because using this definition in SplitPanelPreferences would display\n  // 'AppLayoutProps.SplitPanelPosition' on the API docs instead of the string values.\n  export type SplitPanelPosition = 'side' | 'bottom';\n\n  export interface DrawerChangeDetail {\n    activeDrawerId: string | null;\n  }\n}\n\nexport type AppLayoutPropsWithDefaults = SomeRequired<\n  Omit<AppLayoutProps, 'headerSelector' | 'footerSelector'>,\n  'contentType' | 'navigationWidth' | 'toolsWidth' | 'minContentWidth' | 'navigationOpen' | 'onNavigationChange'\n> & {\n  placement: {\n    insetBlockStart: number;\n    insetBlockEnd: number;\n    insetInlineStart: number;\n    insetInlineEnd: number;\n    inlineSize: number;\n  };\n};\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/app-layout/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { IconProps } from '../icon/interfaces';\nimport { SomeRequired } from '../internal/types';\n\nexport interface AppLayoutProps extends BaseComponentProps {\n  /**\n   * Determines the default behavior of the component based on some predefined page layouts.\n   * Individual properties will always take precedence over the default coming from the content type.\n   */\n  contentType?: AppLayoutProps.ContentType;\n\n  /**\n   * Drawers property. If you set both `drawers` and `tools`, `drawers` will take precedence.\n \n   * Each Drawer is an item in the drawers wrapper with the following properties:\n   * * id (string) - the id of the drawer.\n   * * content (React.ReactNode) - the content in the drawer.\n   * * trigger (DrawerTrigger) - the button that opens and closes the active drawer. \n   * * ariaLabels (DrawerAriaLabels) - the labels for the interactive elements of the drawer.\n   * * badge (boolean) - Adds a badge to the corner of the icon to indicate a state change. For example: Unread notifications.\n   * * resizable (boolean) - if the drawer is resizable or not.\n   * * defaultSize (number) - starting size of the drawer. if not set, defaults to 290.\n   * * onResize (({ size: number }) => void) - Fired when the active drawer is resized.\n   * \n   * #### DrawerTrigger\n   * - `iconName` (IconProps.Name) - (Optional) Specifies the icon to be displayed.\n   * - `iconSvg` (React.ReactNode) - (Optional) Specifies the SVG of a custom icon. For more information, see [SVG icon guidelines](/components/icon/?tabId=api#slots)\n   *\n   * #### DrawerAriaLabels\n   * - `drawerName` (string) - Label for the drawer itself.\n   * - `closeButton` (string) - (Optional) Label for the close button.\n   * - `triggerButton` (string) - (Optional) Label for the trigger button.\n   * - `resizeHandle` (string) - (Optional) Label for the resize handle.\n   */\n  drawers?: Array<AppLayoutProps.Drawer>;\n\n  /**\n   * The active drawer id. If you want to clear the active drawer, use `null`.\n   */\n  activeDrawerId?: string | null;\n\n  /**\n   * Fired when the active drawer is toggled.\n   */\n  onDrawerChange?: NonCancelableEventHandler<AppLayoutProps.DrawerChangeDetail>;\n\n  /**\n   * If `true`, disables outer paddings for the content slot.\n   */\n  disableContentPaddings?: boolean;\n\n  /**\n   * Activates a backwards-compatibility mode for applications with non-fixed headers and footers.\n   * @deprecated This layout is being phased out and may miss some features.\n   */\n  disableBodyScroll?: boolean;\n\n  /**\n   * State of the navigation drawer.\n   */\n  navigationOpen?: boolean;\n\n  /**\n   * Navigation drawer width in pixels.\n   */\n  navigationWidth?: number;\n\n  /**\n   * If `true`, the navigation drawer is not displayed at all.\n   */\n  navigationHide?: boolean;\n\n  /**\n   * State of the tools drawer.\n   */\n  toolsOpen?: boolean;\n\n  /**\n   * If `true`, the tools drawer is not displayed at all.\n   */\n  toolsHide?: boolean;\n\n  /**\n   * Tools drawer width in pixels.\n   */\n  toolsWidth?: number;\n\n  /**\n   * Maximum main content panel width in pixels.\n   *\n   * If set to `Number.MAX_VALUE`, the main content panel will occupy the full available width.\n   */\n  maxContentWidth?: number;\n\n  /**\n   * Minimum main content panel width in pixels.\n   */\n  minContentWidth?: number;\n\n  /**\n   * If true, the notification slot is rendered above the scrollable\n   * content area so it is always visible.\n   */\n  stickyNotifications?: boolean;\n\n  /**\n   * CSS selector for the application header.\n   */\n  headerSelector?: string;\n\n  /**\n   * CSS selector for the application footer.\n   */\n  footerSelector?: string;\n\n  /**\n   * Aria labels for the drawer operating buttons. Use this property to ensure accessibility.\n   *\n   * * `navigation` (string) - Label for the landmark that wraps the navigation drawer.\n   * * `navigationClose` (string) - Label for the button that closes the navigation drawer.\n   * * `navigationToggle` (string) - Label for the button that opens the navigation drawer.\n   * * `notification` (string) - Label for the region that contains notification messages.\n   * * `tools` (string) - Label for the landmark that wraps the tools drawer.\n   * * `toolsClose` (string) - Label for the button that closes the tools drawer.\n   * * `toolsToggle` (string) - Label for the button that opens the tools drawer.\n   * * `drawers` (string) - Label for the landmark that wraps the active drawer.\n   * * `drawersOverflow` (string) - Label for the ellipsis button with any overflow drawers.\n   * * `drawersOverflowWithBadge` (string) - Label for the ellipsis button with any overflow drawers, with a badge.\n   *\n   * Example:\n   * ```\n   * {\n   *   navigation: \"Navigation drawer\",\n   *   navigationClose: \"Close navigation drawer\",\n   *   navigationToggle: \"Open navigation drawer\",\n   *   notifications: \"Notifications\",\n   *   tools: \"Help panel\",\n   *   toolsClose: \"Close help panel\",\n   *   toolsToggle: \"Open help panel\",\n   *   drawers: \"Drawers\",\n   *   drawersOverflow: \"Overflow drawers\",\n   *   drawersOverflowWithBadge: \"Overflow drawers (Unread notifications)\"\n   * }\n   * ```\n   * @i18n\n   */\n  ariaLabels?: AppLayoutProps.Labels;\n\n  /**\n   * Navigation drawer.\n   */\n  navigation?: React.ReactNode;\n\n  /**\n   * Top area of the page content.\n   * @deprecated Replaced by the `header` slot of the [content layout](/components/content-layout/) component.\n   * @visualrefresh\n   */\n  contentHeader?: React.ReactNode;\n\n  /**\n   * Disables overlap between `contentHeader` and `content` slots.\n   * @deprecated Replaced by the `disableOverlap` property of the [content layout](/components/content-layout/) component.\n   * @visualrefresh\n   */\n  disableContentHeaderOverlap?: boolean;\n\n  /**\n   * Determines the visual treatment for the breadcrumbs and notifications slots. Specifically:\n   * * `default` - Does not apply any visual treatment.\n   * * `high-contrast` - Applies high-contrast to both slots. Use in conjunction with `headerVariant=\"high-contrast\"` in ContentLayout.\n   * @visualrefresh\n   */\n  headerVariant?: 'default' | 'high-contrast';\n\n  /**\n   * Main content.\n   */\n  content?: React.ReactNode;\n\n  /**\n   * Tools drawer.\n   */\n  tools?: React.ReactNode;\n\n  /**\n   * Displayed on top of the main content in the scrollable area.\n   *\n   * Conceived to contain notifications (flash messages).\n   */\n  notifications?: React.ReactNode;\n\n  /**\n   * Use this slot to add the [breadcrumb group component](/components/breadcrumb-group/) to the app layout.\n   */\n  breadcrumbs?: React.ReactNode;\n\n  /**\n   * Fired when the navigation drawer is toggled.\n   */\n  onNavigationChange?: NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;\n\n  /**\n   * Fired when the tools drawer is toggled.\n   */\n  onToolsChange?: NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;\n\n  /**\n   * Use this slot to add the [split panel component](/components/split-panel/) to the app layout.\n   *\n   * Note: If provided, this property should be set to `null` or `undefined` if a split panel should not be rendered.\n   */\n  splitPanel?: React.ReactNode;\n\n  /**\n   * The size of the split panel in pixels.\n   */\n  splitPanelSize?: number;\n\n  /**\n   * State of the split panel.\n   */\n  splitPanelOpen?: boolean;\n  /**\n   * Controls the split panel preferences.\n   *\n   * By default, the preference is `{ position: 'bottom' }`\n   */\n  splitPanelPreferences?: AppLayoutProps.SplitPanelPreferences;\n  /**\n   * Fired when the split panel is resized.\n   */\n  onSplitPanelResize?: NonCancelableEventHandler<AppLayoutProps.SplitPanelResizeDetail>;\n  /**\n   * Fired when the split panel is toggled.\n   */\n  onSplitPanelToggle?: NonCancelableEventHandler<AppLayoutProps.ChangeDetail>;\n  /**\n   * Fired when the split panel preferences change.\n   */\n  onSplitPanelPreferencesChange?: NonCancelableEventHandler<AppLayoutProps.SplitPanelPreferences>;\n}\n\nexport namespace AppLayoutProps {\n  export type ContentType = 'default' | 'form' | 'table' | 'cards' | 'wizard' | 'dashboard';\n\n  export interface Ref {\n    /**\n     * Manually closes the navigation drawer if it is necessary for the current\n     * viewport size.\n     */\n    closeNavigationIfNecessary(): void;\n\n    /**\n     * Opens the tools panel if it is not already open. Note that it is preferable\n     * to control the state by listening to `toolsChange` and providing `toolsOpen`.\n     */\n    openTools(): void;\n\n    /**\n     * Focuses the tools panel if it is open. Use this to focus the tools panel\n     * after changing the content, for example when clicking on an 'info' link while\n     * the panel is already open.\n     */\n    focusToolsClose(): void;\n\n    /**\n     * Focuses the active drawer. Use this to focus the active drawer after opening it programmatically.\n     */\n    focusActiveDrawer(): void;\n\n    /**\n     * Focuses the split panel if it is open.\n     */\n    focusSplitPanel(): void;\n  }\n\n  export interface Drawer {\n    id: string;\n    content: React.ReactNode;\n    trigger: {\n      iconName?: IconProps.Name;\n      iconSvg?: React.ReactNode;\n    };\n    ariaLabels: DrawerAriaLabels;\n    badge?: boolean;\n    resizable?: boolean;\n    defaultSize?: number;\n    onResize?: NonCancelableEventHandler<{ size: number }>;\n  }\n\n  export interface DrawerAriaLabels {\n    drawerName: string;\n    closeButton?: string;\n    triggerButton?: string;\n    resizeHandle?: string;\n  }\n\n  export interface Labels {\n    notifications?: string;\n\n    navigation?: string;\n    navigationToggle?: string;\n    navigationClose?: string;\n\n    tools?: string;\n    toolsToggle?: string;\n    toolsClose?: string;\n\n    drawers?: string;\n    drawersOverflow?: string;\n    drawersOverflowWithBadge?: string;\n  }\n\n  export interface ChangeDetail {\n    open: boolean;\n  }\n\n  export interface SplitPanelResizeDetail {\n    size: number;\n  }\n\n  export interface SplitPanelPreferences {\n    position: 'side' | 'bottom';\n  }\n  // Duplicated the positions because using this definition in SplitPanelPreferences would display\n  // 'AppLayoutProps.SplitPanelPosition' on the API docs instead of the string values.\n  export type SplitPanelPosition = 'side' | 'bottom';\n\n  export interface DrawerChangeDetail {\n    activeDrawerId: string | null;\n  }\n}\n\nexport type AppLayoutPropsWithDefaults = SomeRequired<\n  Omit<AppLayoutProps, 'headerSelector' | 'footerSelector'>,\n  'contentType' | 'navigationWidth' | 'toolsWidth' | 'minContentWidth' | 'navigationOpen' | 'onNavigationChange'\n> & {\n  placement: {\n    insetBlockStart: number;\n    insetBlockEnd: number;\n    insetInlineStart: number;\n    insetInlineEnd: number;\n    inlineSize: number;\n  };\n};\n"]}

package/app-layout/internal.js

@@ -1,5 +1,5 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { createWidgetizedAppLayout } from './widget';
+import { createWidgetizedAppLayout } from './implementation';
 export const AppLayoutInternal = createWidgetizedAppLayout();
 //# sourceMappingURL=internal.js.map

package/app-layout/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/app-layout/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,yBAAyB,EAAE,MAAM,UAAU,CAAC;AAErD,MAAM,CAAC,MAAM,iBAAiB,GAAG,yBAAyB,EAAE,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { createWidgetizedAppLayout } from './widget';\n\nexport const AppLayoutInternal = createWidgetizedAppLayout();\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/app-layout/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAE7D,MAAM,CAAC,MAAM,iBAAiB,GAAG,yBAAyB,EAAE,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { createWidgetizedAppLayout } from './implementation';\n\nexport const AppLayoutInternal = createWidgetizedAppLayout();\n"]}

package/app-layout/notifications/styles.css.js

@@ -1,8 +1,8 @@
 
     import './styles.scoped.css';
     export default {
-  "notifications": "awsui_notifications_1hmm4_1cwxf_9",
-  "notifications-sticky": "awsui_notifications-sticky_1hmm4_1cwxf_10",
-  "no-content-paddings": "awsui_no-content-paddings_1hmm4_1cwxf_25"
+  "notifications": "awsui_notifications_1hmm4_kvr85_9",
+  "notifications-sticky": "awsui_notifications-sticky_1hmm4_kvr85_10",
+  "no-content-paddings": "awsui_no-content-paddings_1hmm4_kvr85_25"
 };
   

package/app-layout/notifications/styles.scoped.css

@@ -6,26 +6,26 @@
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_notifications_1hmm4_1cwxf_9:not(#\9),
-.awsui_notifications-sticky_1hmm4_1cwxf_10:not(#\9) {
+.awsui_notifications_1hmm4_kvr85_9:not(#\9),
+.awsui_notifications-sticky_1hmm4_kvr85_10:not(#\9) {
   z-index: 850;
 }
 
-.awsui_notifications_1hmm4_1cwxf_9:not(#\9) {
+.awsui_notifications_1hmm4_kvr85_9:not(#\9) {
   /* This is necessary for the z-index to have effect */
   position: relative;
 }
 
-.awsui_notifications-sticky_1hmm4_1cwxf_10:not(#\9) {
+.awsui_notifications-sticky_1hmm4_kvr85_10:not(#\9) {
   inset-block-start: 0;
   position: sticky;
-  --awsui-flashbar-sticky-bottom-margin-tkr9yl: var(--space-xxl-cu2m1r, 32px);
+  --awsui-flashbar-sticky-bottom-margin-7t5ed6: var(--space-xxl-cu2m1r, 32px);
 }
 
-.awsui_no-content-paddings_1hmm4_1cwxf_25:not(#\9) {
+.awsui_no-content-paddings_1hmm4_kvr85_25:not(#\9) {
   /*
   When using the disableContentPaddings option, the Flashbar will use this custom property to add additional space
   when the notification bar is rendered, to prevent it from overlapping the content.
    */
-  --awsui-stacked-notifications-bottom-margin-tkr9yl: var(--space-scaled-l-0hpmd7, 20px);
+  --awsui-stacked-notifications-bottom-margin-7t5ed6: var(--space-scaled-l-0hpmd7, 20px);
 }

package/app-layout/notifications/styles.selectors.js

@@ -2,8 +2,8 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "notifications": "awsui_notifications_1hmm4_1cwxf_9",
-  "notifications-sticky": "awsui_notifications-sticky_1hmm4_1cwxf_10",
-  "no-content-paddings": "awsui_no-content-paddings_1hmm4_1cwxf_25"
+  "notifications": "awsui_notifications_1hmm4_kvr85_9",
+  "notifications-sticky": "awsui_notifications-sticky_1hmm4_kvr85_10",
+  "no-content-paddings": "awsui_no-content-paddings_1hmm4_kvr85_25"
 };
   

package/app-layout/skeleton/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { AppLayoutPropsWithDefaults } from '../interfaces';
+export declare function AppLayoutSkeleton({ notifications, contentHeader, content, navigation, navigationHide, navigationOpen, navigationWidth, tools, toolsHide, toolsOpen, toolsWidth, placement, contentType, maxContentWidth, disableContentPaddings, }: AppLayoutPropsWithDefaults): JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/app-layout/skeleton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/skeleton/index.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAC;AAG3D,wBAAgB,iBAAiB,CAAC,EAChC,aAAa,EACb,aAAa,EACb,OAAO,EAEP,UAAU,EACV,cAAc,EACd,cAAc,EACd,eAAe,EACf,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EAEV,SAAS,EACT,WAAW,EACX,eAAe,EACf,sBAAsB,GACvB,EAAE,0BAA0B,eAmB5B"}

package/app-layout/skeleton/index.js

@@ -0,0 +1,10 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import { SkeletonLayout } from './layout';
+export function AppLayoutSkeleton({ notifications, contentHeader, content, navigation, navigationHide, navigationOpen, navigationWidth, tools, toolsHide, toolsOpen, toolsWidth, placement, contentType, maxContentWidth, disableContentPaddings, }) {
+    // render nothing in the skeleton state
+    const placeholder = React.createElement(React.Fragment, null);
+    return (React.createElement(SkeletonLayout, { topBar: placeholder, notifications: notifications, contentHeader: contentHeader, content: content, navigation: !navigationHide && navigationOpen && navigation && placeholder, navigationWidth: navigationWidth, tools: !toolsHide && toolsOpen && tools && placeholder, toolsWidth: toolsWidth, placement: placement, contentType: contentType, maxContentWidth: maxContentWidth, disableContentPaddings: disableContentPaddings }));
+}
+//# sourceMappingURL=index.js.map

package/app-layout/skeleton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/skeleton/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,MAAM,UAAU,iBAAiB,CAAC,EAChC,aAAa,EACb,aAAa,EACb,OAAO,EAEP,UAAU,EACV,cAAc,EACd,cAAc,EACd,eAAe,EACf,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EAEV,SAAS,EACT,WAAW,EACX,eAAe,EACf,sBAAsB,GACK;IAC3B,uCAAuC;IACvC,MAAM,WAAW,GAAG,yCAAK,CAAC;IAC1B,OAAO,CACL,oBAAC,cAAc,IACb,MAAM,EAAE,WAAW,EACnB,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,CAAC,cAAc,IAAI,cAAc,IAAI,UAAU,IAAI,WAAW,EAC1E,eAAe,EAAE,eAAe,EAChC,KAAK,EAAE,CAAC,SAAS,IAAI,SAAS,IAAI,KAAK,IAAI,WAAW,EACtD,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,eAAe,EAChC,sBAAsB,EAAE,sBAAsB,GAC9C,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { AppLayoutPropsWithDefaults } from '../interfaces';\nimport { SkeletonLayout } from './layout';\n\nexport function AppLayoutSkeleton({\n  notifications,\n  contentHeader,\n  content,\n\n  navigation,\n  navigationHide,\n  navigationOpen,\n  navigationWidth,\n  tools,\n  toolsHide,\n  toolsOpen,\n  toolsWidth,\n\n  placement,\n  contentType,\n  maxContentWidth,\n  disableContentPaddings,\n}: AppLayoutPropsWithDefaults) {\n  // render nothing in the skeleton state\n  const placeholder = <></>;\n  return (\n    <SkeletonLayout\n      topBar={placeholder}\n      notifications={notifications}\n      contentHeader={contentHeader}\n      content={content}\n      navigation={!navigationHide && navigationOpen && navigation && placeholder}\n      navigationWidth={navigationWidth}\n      tools={!toolsHide && toolsOpen && tools && placeholder}\n      toolsWidth={toolsWidth}\n      placement={placement}\n      contentType={contentType}\n      maxContentWidth={maxContentWidth}\n      disableContentPaddings={disableContentPaddings}\n    />\n  );\n}\n"]}

package/app-layout/skeleton/layout.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { AppLayoutPropsWithDefaults } from '../interfaces';
+interface SkeletonLayoutProps extends Pick<AppLayoutPropsWithDefaults, 'notifications' | 'contentHeader' | 'content' | 'contentType' | 'maxContentWidth' | 'disableContentPaddings' | 'navigation' | 'navigationWidth' | 'tools' | 'toolsWidth' | 'placement'> {
+    topBar?: React.ReactNode;
+}
+export declare function SkeletonLayout({ notifications, contentHeader, content, navigation, navigationWidth, tools, toolsWidth, topBar, placement, contentType, maxContentWidth, disableContentPaddings, }: SkeletonLayoutProps): JSX.Element;
+export {};
+//# sourceMappingURL=layout.d.ts.map

package/app-layout/skeleton/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../../src/app-layout/skeleton/layout.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,0BAA0B,EAAE,MAAM,eAAe,CAAC;AAO3D,UAAU,mBACR,SAAQ,IAAI,CACV,0BAA0B,EACxB,eAAe,GACf,eAAe,GACf,SAAS,GACT,aAAa,GACb,iBAAiB,GACjB,wBAAwB,GACxB,YAAY,GACZ,iBAAiB,GACjB,OAAO,GACP,YAAY,GACZ,WAAW,CACd;IACD,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,wBAAgB,cAAc,CAAC,EAC7B,aAAa,EACb,aAAa,EACb,OAAO,EACP,UAAU,EACV,eAAe,EACf,KAAK,EACL,UAAU,EACV,MAAM,EACN,SAAS,EACT,WAAW,EACX,eAAe,EACf,sBAAsB,GACvB,EAAE,mBAAmB,eA2BrB"}

package/app-layout/skeleton/layout.js

@@ -0,0 +1,28 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import styles from './styles.css.js';
+import customCssProps from '../../internal/generated/custom-css-properties';
+import clsx from 'clsx';
+const contentTypeCustomWidths = ['dashboard', 'cards', 'table'];
+export function SkeletonLayout({ notifications, contentHeader, content, navigation, navigationWidth, tools, toolsWidth, topBar, placement, contentType, maxContentWidth, disableContentPaddings, }) {
+    const isMaxWidth = maxContentWidth === Number.MAX_VALUE || maxContentWidth === Number.MAX_SAFE_INTEGER;
+    return (React.createElement("div", { className: clsx(styles.root, {
+            [styles['has-adaptive-widths-default']]: !contentTypeCustomWidths.includes(contentType),
+            [styles['has-adaptive-widths-dashboard']]: contentType === 'dashboard',
+        }), style: {
+            minBlockSize: `calc(100vh - ${placement.insetBlockStart}px - ${placement.insetBlockEnd}px)`,
+            [customCssProps.maxContentWidth]: isMaxWidth ? '100%' : maxContentWidth ? `${maxContentWidth}px` : '',
+            [customCssProps.navigationWidth]: `${navigationWidth}px`,
+            [customCssProps.toolsWidth]: `${toolsWidth}px`,
+        } },
+        React.createElement("section", { className: styles['top-bar'] }, topBar),
+        navigation && React.createElement("div", { className: styles.navigation }, navigation),
+        React.createElement("main", { className: styles['main-landmark'] },
+            notifications && React.createElement("div", { className: styles.notifications }, notifications),
+            React.createElement("div", { className: clsx(styles.main, { [styles['main-disable-paddings']]: disableContentPaddings }) },
+                contentHeader && React.createElement("div", { className: styles['content-header'] }, contentHeader),
+                React.createElement("div", null, content))),
+        tools && React.createElement("div", { className: styles.tools }, tools)));
+}
+//# sourceMappingURL=layout.js.map

package/app-layout/skeleton/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../../src/app-layout/skeleton/layout.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,gDAAgD,CAAC;AAC5E,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,MAAM,uBAAuB,GAA8B,CAAC,WAAW,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;AAoB3F,MAAM,UAAU,cAAc,CAAC,EAC7B,aAAa,EACb,aAAa,EACb,OAAO,EACP,UAAU,EACV,eAAe,EACf,KAAK,EACL,UAAU,EACV,MAAM,EACN,SAAS,EACT,WAAW,EACX,eAAe,EACf,sBAAsB,GACF;IACpB,MAAM,UAAU,GAAG,eAAe,KAAK,MAAM,CAAC,SAAS,IAAI,eAAe,KAAK,MAAM,CAAC,gBAAgB,CAAC;IACvG,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAC3B,CAAC,MAAM,CAAC,6BAA6B,CAAC,CAAC,EAAE,CAAC,uBAAuB,CAAC,QAAQ,CAAC,WAAW,CAAC;YACvF,CAAC,MAAM,CAAC,+BAA+B,CAAC,CAAC,EAAE,WAAW,KAAK,WAAW;SACvE,CAAC,EACF,KAAK,EAAE;YACL,YAAY,EAAE,gBAAgB,SAAS,CAAC,eAAe,QAAQ,SAAS,CAAC,aAAa,KAAK;YAC3F,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,eAAe,IAAI,CAAC,CAAC,CAAC,EAAE;YACrG,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,GAAG,eAAe,IAAI;YACxD,CAAC,cAAc,CAAC,UAAU,CAAC,EAAE,GAAG,UAAU,IAAI;SAC/C;QAED,iCAAS,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,IAAG,MAAM,CAAW;QACxD,UAAU,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,UAAU,IAAG,UAAU,CAAO;QACpE,8BAAM,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC;YACrC,aAAa,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,aAAa,IAAG,aAAa,CAAO;YAC7E,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,MAAM,CAAC,uBAAuB,CAAC,CAAC,EAAE,sBAAsB,EAAE,CAAC;gBAC7F,aAAa,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,IAAG,aAAa,CAAO;gBACjF,iCAAM,OAAO,CAAO,CAChB,CACD;QACN,KAAK,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK,IAAG,KAAK,CAAO,CACjD,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { AppLayoutPropsWithDefaults } from '../interfaces';\nimport styles from './styles.css.js';\nimport customCssProps from '../../internal/generated/custom-css-properties';\nimport clsx from 'clsx';\n\nconst contentTypeCustomWidths: Array<string | undefined> = ['dashboard', 'cards', 'table'];\n\ninterface SkeletonLayoutProps\n  extends Pick<\n    AppLayoutPropsWithDefaults,\n    | 'notifications'\n    | 'contentHeader'\n    | 'content'\n    | 'contentType'\n    | 'maxContentWidth'\n    | 'disableContentPaddings'\n    | 'navigation'\n    | 'navigationWidth'\n    | 'tools'\n    | 'toolsWidth'\n    | 'placement'\n  > {\n  topBar?: React.ReactNode;\n}\n\nexport function SkeletonLayout({\n  notifications,\n  contentHeader,\n  content,\n  navigation,\n  navigationWidth,\n  tools,\n  toolsWidth,\n  topBar,\n  placement,\n  contentType,\n  maxContentWidth,\n  disableContentPaddings,\n}: SkeletonLayoutProps) {\n  const isMaxWidth = maxContentWidth === Number.MAX_VALUE || maxContentWidth === Number.MAX_SAFE_INTEGER;\n  return (\n    <div\n      className={clsx(styles.root, {\n        [styles['has-adaptive-widths-default']]: !contentTypeCustomWidths.includes(contentType),\n        [styles['has-adaptive-widths-dashboard']]: contentType === 'dashboard',\n      })}\n      style={{\n        minBlockSize: `calc(100vh - ${placement.insetBlockStart}px - ${placement.insetBlockEnd}px)`,\n        [customCssProps.maxContentWidth]: isMaxWidth ? '100%' : maxContentWidth ? `${maxContentWidth}px` : '',\n        [customCssProps.navigationWidth]: `${navigationWidth}px`,\n        [customCssProps.toolsWidth]: `${toolsWidth}px`,\n      }}\n    >\n      <section className={styles['top-bar']}>{topBar}</section>\n      {navigation && <div className={styles.navigation}>{navigation}</div>}\n      <main className={styles['main-landmark']}>\n        {notifications && <div className={styles.notifications}>{notifications}</div>}\n        <div className={clsx(styles.main, { [styles['main-disable-paddings']]: disableContentPaddings })}>\n          {contentHeader && <div className={styles['content-header']}>{contentHeader}</div>}\n          <div>{content}</div>\n        </div>\n      </main>\n      {tools && <div className={styles.tools}>{tools}</div>}\n    </div>\n  );\n}\n"]}