@cloudscape-design/components-themeable 3.0.678 → 3.0.680

package/lib/internal/template/internal/generated/theming/index.js

@@ -1046,17 +1046,21 @@ export var preset = {
         "dark": "{colorGrey500}"
       },
       "colorBackgroundAvatarGenAi": {
-        "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-        "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+        "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+        "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
       },
       "colorBackgroundAvatarDefault": {
         "light": "{colorGrey600}",
-        "dark": "{colorGrey550}"
+        "dark": "{colorGrey600}"
       },
       "colorTextAvatar": {
         "light": "{colorWhite}",
         "dark": "{colorWhite}"
       },
+      "colorBackgroundLoadingBarGenAi": {
+        "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+        "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+      },
       "colorBorderButtonNormalActive": {
         "light": "{colorBlue800}",
         "dark": "{colorBlue400}"
@@ -3188,17 +3192,21 @@ export var preset = {
             "dark": "{colorGrey500}"
           },
           "colorBackgroundAvatarGenAi": {
-            "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-            "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+            "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+            "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
           },
           "colorBackgroundAvatarDefault": {
-            "light": "{colorGrey550}",
-            "dark": "{colorGrey550}"
+            "light": "{colorGrey600}",
+            "dark": "{colorGrey600}"
           },
           "colorTextAvatar": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
           },
+          "colorBackgroundLoadingBarGenAi": {
+            "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+            "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+          },
           "colorBorderButtonNormalActive": {
             "light": "{colorBlue400}",
             "dark": "{colorBlue400}"
@@ -4250,17 +4258,21 @@ export var preset = {
             "dark": "{colorGrey500}"
           },
           "colorBackgroundAvatarGenAi": {
-            "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-            "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+            "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+            "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
           },
           "colorBackgroundAvatarDefault": {
-            "light": "{colorGrey550}",
-            "dark": "{colorGrey550}"
+            "light": "{colorGrey600}",
+            "dark": "{colorGrey600}"
           },
           "colorTextAvatar": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
           },
+          "colorBackgroundLoadingBarGenAi": {
+            "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+            "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+          },
           "colorBorderButtonNormalActive": {
             "light": "{colorBlue400}",
             "dark": "{colorBlue400}"
@@ -5244,17 +5256,21 @@ export var preset = {
             "dark": "{colorGrey500}"
           },
           "colorBackgroundAvatarGenAi": {
-            "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-            "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+            "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+            "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
           },
           "colorBackgroundAvatarDefault": {
             "light": "{colorGrey600}",
-            "dark": "{colorGrey550}"
+            "dark": "{colorGrey600}"
           },
           "colorTextAvatar": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
           },
+          "colorBackgroundLoadingBarGenAi": {
+            "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+            "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+          },
           "colorBorderButtonNormalActive": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
@@ -6238,17 +6254,21 @@ export var preset = {
             "dark": "{colorGrey500}"
           },
           "colorBackgroundAvatarGenAi": {
-            "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-            "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+            "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+            "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
           },
           "colorBackgroundAvatarDefault": {
             "light": "{colorGrey600}",
-            "dark": "{colorGrey550}"
+            "dark": "{colorGrey600}"
           },
           "colorTextAvatar": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
           },
+          "colorBackgroundLoadingBarGenAi": {
+            "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+            "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+          },
           "colorBorderButtonNormalActive": {
             "light": "{colorTextButtonNormalHover}",
             "dark": "{colorTextButtonNormalHover}"
@@ -7232,17 +7252,21 @@ export var preset = {
             "dark": "{colorGrey500}"
           },
           "colorBackgroundAvatarGenAi": {
-            "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-            "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+            "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+            "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
           },
           "colorBackgroundAvatarDefault": {
             "light": "{colorGrey600}",
-            "dark": "{colorGrey550}"
+            "dark": "{colorGrey600}"
           },
           "colorTextAvatar": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
           },
+          "colorBackgroundLoadingBarGenAi": {
+            "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+            "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+          },
           "colorBorderButtonNormalActive": {
             "light": "{colorTextButtonNormalHover}",
             "dark": "{colorTextButtonNormalHover}"
@@ -8228,17 +8252,21 @@ export var preset = {
             "dark": "{colorGrey500}"
           },
           "colorBackgroundAvatarGenAi": {
-            "light": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
-            "dark": "radial-gradient(circle farthest-corner at bottom left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top left, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
+            "light": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)",
+            "dark": "radial-gradient(circle farthest-corner at top left,rgba(0, 150, 250, 1) -25%,rgba(0, 150, 250, 0) 55%),radial-gradient(circle farthest-corner at top right, rgba(216, 178, 255, 1) -10%, rgba(115, 0, 229, 1) 50%)"
           },
           "colorBackgroundAvatarDefault": {
-            "light": "{colorGrey550}",
-            "dark": "{colorGrey550}"
+            "light": "{colorGrey600}",
+            "dark": "{colorGrey600}"
           },
           "colorTextAvatar": {
             "light": "{colorWhite}",
             "dark": "{colorWhite}"
           },
+          "colorBackgroundLoadingBarGenAi": {
+            "light": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)",
+            "dark": "linear-gradient(90deg, #99f7ff 0%, #0096fa 10%, #bf80ff 24%, #7300e5 50%, #bf80ff 76%, #0096fa 90%, #99f7ff 100%)"
+          },
           "colorBorderButtonNormalActive": {
             "light": "{colorTextButtonNormalHover}",
             "dark": "{colorTextButtonNormalHover}"
@@ -9124,6 +9152,7 @@ export var preset = {
       "colorBackgroundAvatarGenAi": "color",
       "colorBackgroundAvatarDefault": "color",
       "colorTextAvatar": "color",
+      "colorBackgroundLoadingBarGenAi": "color",
       "colorBorderButtonNormalActive": "color",
       "colorBorderButtonNormalDefault": "color",
       "colorBorderButtonNormalDisabled": "color",
@@ -9873,6 +9902,7 @@ export var preset = {
     "colorBackgroundAvatarGenAi",
     "colorBackgroundAvatarDefault",
     "colorTextAvatar",
+    "colorBackgroundLoadingBarGenAi",
     "colorBorderButtonNormalActive",
     "colorBorderButtonNormalDefault",
     "colorBorderButtonNormalDisabled",
@@ -9991,6 +10021,9 @@ export var preset = {
     "borderRadiusTiles",
     "borderRadiusToken",
     "borderRadiusTutorialPanelItem",
+    "motionDurationAvatarGenAiGradient",
+    "motionDurationAvatarLoadingDots",
+    "motionEasingAvatarGenAiGradient",
     "motionEasingResponsive",
     "motionEasingSticky",
     "motionEasingExpressive",
@@ -10319,6 +10352,7 @@ export var preset = {
     "colorBackgroundAvatarGenAi": "color-background-avatar-gen-ai",
     "colorBackgroundAvatarDefault": "color-background-avatar-default",
     "colorTextAvatar": "color-text-avatar",
+    "colorBackgroundLoadingBarGenAi": "color-background-loading-bar-gen-ai",
     "colorBorderButtonNormalActive": "color-border-button-normal-active",
     "colorBorderButtonNormalDefault": "color-border-button-normal-default",
     "colorBorderButtonNormalDisabled": "color-border-button-normal-disabled",
@@ -11024,9 +11058,10 @@ export var preset = {
     "colorBackgroundTilesDisabled": "--color-background-tiles-disabled-0j6ior",
     "colorBackgroundToggleCheckedDisabled": "--color-background-toggle-checked-disabled-uqvx2z",
     "colorBackgroundToggleDefault": "--color-background-toggle-default-6qtbef",
-    "colorBackgroundAvatarGenAi": "--color-background-avatar-gen-ai-xsgmt7",
-    "colorBackgroundAvatarDefault": "--color-background-avatar-default-s460u2",
+    "colorBackgroundAvatarGenAi": "--color-background-avatar-gen-ai-i9hcw6",
+    "colorBackgroundAvatarDefault": "--color-background-avatar-default-vm4u8g",
     "colorTextAvatar": "--color-text-avatar-jddpvm",
+    "colorBackgroundLoadingBarGenAi": "--color-background-loading-bar-gen-ai-7qfi9s",
     "colorBorderButtonNormalActive": "--color-border-button-normal-active-tc4102",
     "colorBorderButtonNormalDefault": "--color-border-button-normal-default-x52rkp",
     "colorBorderButtonNormalDisabled": "--color-border-button-normal-disabled-40wkb4",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/components-themeable",
-  "version": "3.0.678",
+  "version": "3.0.680",
   "files": [
     "lib"
   ],

package/lib/internal/template/app-layout/implementation.d.ts

@@ -1,50 +0,0 @@
-import React from 'react';
-import { AppLayoutProps } from './interfaces';
-export declare const AppLayoutImplementation: 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>>;
-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/lib/internal/template/app-layout/implementation.d.ts.map

@@ -1 +0,0 @@
-{"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/lib/internal/template/app-layout/implementation.js

@@ -1,13 +0,0 @@
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// 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/lib/internal/template/app-layout/implementation.js.map

@@ -1 +0,0 @@
-{"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/lib/internal/template/app-layout/skeleton/index.d.ts

@@ -1,4 +0,0 @@
-/// <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/lib/internal/template/app-layout/skeleton/index.d.ts.map

@@ -1 +0,0 @@
-{"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/lib/internal/template/app-layout/skeleton/index.js

@@ -1,10 +0,0 @@
-// 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/lib/internal/template/app-layout/skeleton/index.js.map

@@ -1 +0,0 @@
-{"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/lib/internal/template/app-layout/skeleton/layout.d.ts

@@ -1,8 +0,0 @@
-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/lib/internal/template/app-layout/skeleton/layout.d.ts.map

@@ -1 +0,0 @@
-{"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/lib/internal/template/app-layout/skeleton/layout.js

@@ -1,28 +0,0 @@
-// 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/lib/internal/template/app-layout/skeleton/layout.js.map

@@ -1 +0,0 @@
-{"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"]}

package/lib/internal/template/app-layout/skeleton/styles.css.js

@@ -1,16 +0,0 @@
-
-    import './styles.scoped.css';
-    export default {
-  "root": "awsui_root_1uxbz_irwnc_101",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_1uxbz_irwnc_150",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_1uxbz_irwnc_165",
-  "navigation": "awsui_navigation_1uxbz_irwnc_180",
-  "tools": "awsui_tools_1uxbz_irwnc_181",
-  "top-bar": "awsui_top-bar_1uxbz_irwnc_204",
-  "notifications": "awsui_notifications_1uxbz_irwnc_210",
-  "main-landmark": "awsui_main-landmark_1uxbz_irwnc_217",
-  "main": "awsui_main_1uxbz_irwnc_217",
-  "main-disable-paddings": "awsui_main-disable-paddings_1uxbz_irwnc_226",
-  "content-header": "awsui_content-header_1uxbz_irwnc_236"
-};
-  

package/lib/internal/template/app-layout/skeleton/styles.selectors.js

@@ -1,17 +0,0 @@
-
-    // es-module interop with Babel and Typescript
-    Object.defineProperty(exports, "__esModule", { value: true });
-    module.exports.default = {
-  "root": "awsui_root_1uxbz_irwnc_101",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_1uxbz_irwnc_150",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_1uxbz_irwnc_165",
-  "navigation": "awsui_navigation_1uxbz_irwnc_180",
-  "tools": "awsui_tools_1uxbz_irwnc_181",
-  "top-bar": "awsui_top-bar_1uxbz_irwnc_204",
-  "notifications": "awsui_notifications_1uxbz_irwnc_210",
-  "main-landmark": "awsui_main-landmark_1uxbz_irwnc_217",
-  "main": "awsui_main_1uxbz_irwnc_217",
-  "main-disable-paddings": "awsui_main-disable-paddings_1uxbz_irwnc_226",
-  "content-header": "awsui_content-header_1uxbz_irwnc_236"
-};
-