@cloudscape-design/components 3.0.1061 → 3.0.1063

package/app-layout/visual-refresh-toolbar/skeleton/multi-layout.js

@@ -0,0 +1,41 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { useLayoutEffect, useState } from 'react';
+import { awsuiPluginsInternal } from '../../../internal/plugins/api';
+import { useAppLayoutFlagEnabled } from '../../utils/feature-flags';
+export function useMultiAppLayout(forceDeduplicationType, isEnabled, props, mergeProps) {
+    const [registration, setRegistration] = useState(null);
+    const isToolbar = useAppLayoutFlagEnabled();
+    useLayoutEffect(() => {
+        if (!isEnabled || forceDeduplicationType === 'suspended' || !isToolbar) {
+            return;
+        }
+        if (forceDeduplicationType === 'off') {
+            setRegistration({ type: 'primary', discoveredProps: [] });
+            return;
+        }
+        const unregister = awsuiPluginsInternal.appLayoutWidget.register(forceDeduplicationType, props => setRegistration(props));
+        return () => {
+            unregister();
+            setRegistration({ type: 'suspended' });
+        };
+    }, [forceDeduplicationType, isEnabled, isToolbar]);
+    useLayoutEffect(() => {
+        if ((registration === null || registration === void 0 ? void 0 : registration.type) === 'secondary') {
+            registration.update(props);
+        }
+    });
+    if (!isToolbar) {
+        return {
+            registered: true,
+            // mergeProps is needed here because the toolbar's behavior depends on reconciliation logic
+            // in this function. For example, navigation trigger visibility
+            toolbarProps: mergeProps(props, []),
+        };
+    }
+    return {
+        registered: !!(registration === null || registration === void 0 ? void 0 : registration.type),
+        toolbarProps: (registration === null || registration === void 0 ? void 0 : registration.type) === 'primary' ? mergeProps(props, registration.discoveredProps) : null,
+    };
+}
+//# sourceMappingURL=multi-layout.js.map

package/app-layout/visual-refresh-toolbar/skeleton/multi-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-layout.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/multi-layout.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AAErE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAMpE,MAAM,UAAU,iBAAiB,CAC/B,sBAAyC,EACzC,SAAkB,EAClB,KAAkB,EAClB,UAAsB;IAEtB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAwC,IAAI,CAAC,CAAC;IAC9F,MAAM,SAAS,GAAG,uBAAuB,EAAE,CAAC;IAE5C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,SAAS,IAAI,sBAAsB,KAAK,WAAW,IAAI,CAAC,SAAS,EAAE;YACtE,OAAO;SACR;QACD,IAAI,sBAAsB,KAAK,KAAK,EAAE;YACpC,eAAe,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,eAAe,EAAE,EAAE,EAAE,CAAC,CAAC;YAC1D,OAAO;SACR;QACD,MAAM,UAAU,GAAG,oBAAoB,CAAC,eAAe,CAAC,QAAQ,CAAC,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAC/F,eAAe,CAAC,KAAuC,CAAC,CACzD,CAAC;QACF,OAAO,GAAG,EAAE;YACV,UAAU,EAAE,CAAC;YACb,eAAe,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,CAAC;QACzC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,sBAAsB,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC,CAAC;IAEnD,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,MAAK,WAAW,EAAE;YACtC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;SAC5B;IACH,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,SAAS,EAAE;QACd,OAAO;YACL,UAAU,EAAE,IAAI;YAChB,2FAA2F;YAC3F,+DAA+D;YAC/D,YAAY,EAAE,UAAU,CAAC,KAAK,EAAE,EAAE,CAAC;SACpC,CAAC;KACH;IAED,OAAO;QACL,UAAU,EAAE,CAAC,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,CAAA;QAChC,YAAY,EAAE,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,MAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,EAAE,YAAY,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,IAAI;KACxG,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { useLayoutEffect, useState } from 'react';\n\nimport { awsuiPluginsInternal } from '../../../internal/plugins/api';\nimport { RegistrationState } from '../../../internal/plugins/controllers/app-layout-widget';\nimport { useAppLayoutFlagEnabled } from '../../utils/feature-flags';\nimport { MergeProps, SharedProps } from '../state/interfaces';\nimport { ToolbarProps } from '../toolbar';\n\nexport type DeduplicationType = 'primary' | 'secondary' | 'suspended' | 'off';\n\nexport function useMultiAppLayout(\n  forceDeduplicationType: DeduplicationType,\n  isEnabled: boolean,\n  props: SharedProps,\n  mergeProps: MergeProps\n): { registered: boolean; toolbarProps: ToolbarProps | null } {\n  const [registration, setRegistration] = useState<RegistrationState<SharedProps> | null>(null);\n  const isToolbar = useAppLayoutFlagEnabled();\n\n  useLayoutEffect(() => {\n    if (!isEnabled || forceDeduplicationType === 'suspended' || !isToolbar) {\n      return;\n    }\n    if (forceDeduplicationType === 'off') {\n      setRegistration({ type: 'primary', discoveredProps: [] });\n      return;\n    }\n    const unregister = awsuiPluginsInternal.appLayoutWidget.register(forceDeduplicationType, props =>\n      setRegistration(props as RegistrationState<SharedProps>)\n    );\n    return () => {\n      unregister();\n      setRegistration({ type: 'suspended' });\n    };\n  }, [forceDeduplicationType, isEnabled, isToolbar]);\n\n  useLayoutEffect(() => {\n    if (registration?.type === 'secondary') {\n      registration.update(props);\n    }\n  });\n\n  if (!isToolbar) {\n    return {\n      registered: true,\n      // mergeProps is needed here because the toolbar's behavior depends on reconciliation logic\n      // in this function. For example, navigation trigger visibility\n      toolbarProps: mergeProps(props, []),\n    };\n  }\n\n  return {\n    registered: !!registration?.type,\n    toolbarProps: registration?.type === 'primary' ? mergeProps(props, registration.discoveredProps) : null,\n  };\n}\n"]}

package/app-layout/visual-refresh-toolbar/skeleton/{slot-skeletons.d.ts → skeleton-parts.d.ts}

@@ -1,5 +1,13 @@
 import React from 'react';
 import { AppLayoutNotificationsImplementationProps } from '../notifications';
 import { AppLayoutToolbarImplementationProps } from '../toolbar';
+import { SkeletonPartProps } from './interfaces';
+/**
+ * New widgetized parts
+ */
+export declare const BeforeMainSlotSkeleton: React.ForwardRefExoticComponent<SkeletonPartProps & React.RefAttributes<HTMLElement>>;
+/**
+ * Legacy parts
+ */
 export declare const ToolbarSkeleton: React.ForwardRefExoticComponent<AppLayoutToolbarImplementationProps & React.RefAttributes<HTMLElement>>;
 export declare const NotificationsSkeleton: React.ForwardRefExoticComponent<AppLayoutNotificationsImplementationProps & React.RefAttributes<HTMLElement>>;

package/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton-parts.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,yCAAyC,EAAE,MAAM,kBAAkB,CAAC;AAC7E,OAAO,EAAE,mCAAmC,EAAE,MAAM,YAAY,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAKjD;;GAEG;AAEH,eAAO,MAAM,sBAAsB,uFAalC,CAAC;AAEF;;GAEG;AAEH,eAAO,MAAM,eAAe,yGAS3B,CAAC;AAEF,eAAO,MAAM,qBAAqB,+GAEjC,CAAC"}

package/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.js

@@ -0,0 +1,21 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React from 'react';
+import { BreadcrumbsSlot, NotificationsSlot, ToolbarSlot } from './slots';
+import styles from './styles.css.js';
+/**
+ * New widgetized parts
+ */
+export const BeforeMainSlotSkeleton = React.forwardRef(({ toolbarProps, appLayoutProps }, ref) => {
+    return (React.createElement(React.Fragment, null,
+        !!toolbarProps && (React.createElement(ToolbarSlot, { ref: ref },
+            React.createElement(BreadcrumbsSlot, { ownBreadcrumbs: appLayoutProps.breadcrumbs }))),
+        (toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.navigationOpen) && React.createElement("div", { className: styles.navigation })));
+});
+/**
+ * Legacy parts
+ */
+export const ToolbarSkeleton = React.forwardRef(({ appLayoutInternals }, ref) => (React.createElement(ToolbarSlot, { ref: ref },
+    React.createElement(BreadcrumbsSlot, { ownBreadcrumbs: appLayoutInternals.breadcrumbs, discoveredBreadcrumbs: appLayoutInternals.discoveredBreadcrumbs }))));
+export const NotificationsSkeleton = React.forwardRef((props, ref) => React.createElement(NotificationsSlot, { ref: ref }));
+//# sourceMappingURL=skeleton-parts.js.map

package/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton-parts.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/skeleton-parts.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE1E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC;;GAEG;AAEH,MAAM,CAAC,MAAM,sBAAsB,GAAG,KAAK,CAAC,UAAU,CACpD,CAAC,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,GAAG,EAAE,EAAE;IACxC,OAAO,CACL;QACG,CAAC,CAAC,YAAY,IAAI,CACjB,oBAAC,WAAW,IAAC,GAAG,EAAE,GAAG;YACnB,oBAAC,eAAe,IAAC,cAAc,EAAE,cAAc,CAAC,WAAW,GAAI,CACnD,CACf;QACA,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,cAAc,KAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,UAAU,GAAI,CACrE,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF;;GAEG;AAEH,MAAM,CAAC,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAC7C,CAAC,EAAE,kBAAkB,EAAuC,EAAE,GAAG,EAAE,EAAE,CAAC,CACpE,oBAAC,WAAW,IAAC,GAAG,EAAE,GAAG;IACnB,oBAAC,eAAe,IACd,cAAc,EAAE,kBAAkB,CAAC,WAAW,EAC9C,qBAAqB,EAAE,kBAAkB,CAAC,qBAAqB,GAC/D,CACU,CACf,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,CAAC,UAAU,CACnD,CAAC,KAAgD,EAAE,GAAG,EAAE,EAAE,CAAC,oBAAC,iBAAiB,IAAC,GAAG,EAAE,GAAG,GAAI,CAC3F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { AppLayoutNotificationsImplementationProps } from '../notifications';\nimport { AppLayoutToolbarImplementationProps } from '../toolbar';\nimport { SkeletonPartProps } from './interfaces';\nimport { BreadcrumbsSlot, NotificationsSlot, ToolbarSlot } from './slots';\n\nimport styles from './styles.css.js';\n\n/**\n * New widgetized parts\n */\n\nexport const BeforeMainSlotSkeleton = React.forwardRef<HTMLElement, SkeletonPartProps>(\n  ({ toolbarProps, appLayoutProps }, ref) => {\n    return (\n      <>\n        {!!toolbarProps && (\n          <ToolbarSlot ref={ref}>\n            <BreadcrumbsSlot ownBreadcrumbs={appLayoutProps.breadcrumbs} />\n          </ToolbarSlot>\n        )}\n        {toolbarProps?.navigationOpen && <div className={styles.navigation} />}\n      </>\n    );\n  }\n);\n\n/**\n * Legacy parts\n */\n\nexport const ToolbarSkeleton = React.forwardRef<HTMLElement, AppLayoutToolbarImplementationProps>(\n  ({ appLayoutInternals }: AppLayoutToolbarImplementationProps, ref) => (\n    <ToolbarSlot ref={ref}>\n      <BreadcrumbsSlot\n        ownBreadcrumbs={appLayoutInternals.breadcrumbs}\n        discoveredBreadcrumbs={appLayoutInternals.discoveredBreadcrumbs}\n      />\n    </ToolbarSlot>\n  )\n);\n\nexport const NotificationsSkeleton = React.forwardRef<HTMLElement, AppLayoutNotificationsImplementationProps>(\n  (props: AppLayoutNotificationsImplementationProps, ref) => <NotificationsSlot ref={ref} />\n);\n"]}

package/app-layout/visual-refresh-toolbar/skeleton/{slot-wrappers.d.ts → slots.d.ts}

@@ -1,4 +1,5 @@
 import React from 'react';
+import { BreadcrumbGroupProps } from '../../../breadcrumb-group/interfaces';
 interface ToolbarSlotProps {
   className?: string;
   style?: React.CSSProperties;
@@ -11,4 +12,12 @@ interface NotificationsSlotProps {
   children?: React.ReactNode;
 }
 export declare const NotificationsSlot: React.ForwardRefExoticComponent<NotificationsSlotProps & React.RefAttributes<HTMLElement>>;
+interface BreadcrumbsSlotProps {
+  ownBreadcrumbs: React.ReactNode;
+  discoveredBreadcrumbs?: BreadcrumbGroupProps | null;
+}
+export declare function BreadcrumbsSlot({
+  ownBreadcrumbs,
+  discoveredBreadcrumbs
+}: BreadcrumbsSlotProps): JSX.Element;
 export {};

package/app-layout/visual-refresh-toolbar/skeleton/slots.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slots.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/slots.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAK5E,UAAU,gBAAgB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,WAAW,sFAItB,CAAC;AAEH,UAAU,sBAAsB;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,iBAAiB,4FAM7B,CAAC;AAEF,UAAU,oBAAoB;IAC5B,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,qBAAqB,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;CACrD;AAED,wBAAgB,eAAe,CAAC,EAAE,cAAc,EAAE,qBAAqB,EAAE,EAAE,oBAAoB,eAe9F"}

package/app-layout/visual-refresh-toolbar/skeleton/{breadcrumbs/index.js → slots.js}

@@ -1,13 +1,16 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
-import { BreadcrumbGroupImplementation } from '../../../../breadcrumb-group/implementation';
-import { BreadcrumbsSlotContext } from '../../contexts';
+import clsx from 'clsx';
+import { BreadcrumbGroupImplementation } from '../../../breadcrumb-group/implementation';
+import { BreadcrumbsSlotContext } from '../contexts';
 import styles from './styles.css.js';
+export const ToolbarSlot = React.forwardRef(({ className, style, children }, ref) => (React.createElement("section", { ref: ref, className: clsx(styles['toolbar-container'], className), style: style }, children)));
+export const NotificationsSlot = React.forwardRef(({ className, style, children }, ref) => (React.createElement("div", { ref: ref, className: clsx(styles['notifications-container'], className), style: style }, children)));
 export function BreadcrumbsSlot({ ownBreadcrumbs, discoveredBreadcrumbs }) {
     return (React.createElement(BreadcrumbsSlotContext.Provider, { value: { isInToolbar: true } },
         React.createElement("div", { className: styles['breadcrumbs-own'] }, ownBreadcrumbs),
         discoveredBreadcrumbs && (React.createElement("div", { className: styles['breadcrumbs-discovered'] },
             React.createElement(BreadcrumbGroupImplementation, Object.assign({}, discoveredBreadcrumbs, { "data-awsui-discovered-breadcrumbs": true, __injectAnalyticsComponentMetadata: true }))))));
 }
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=slots.js.map

package/app-layout/visual-refresh-toolbar/skeleton/slots.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slots.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/skeleton/slots.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,6BAA6B,EAAE,MAAM,0CAA0C,CAAC;AAEzF,OAAO,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAErD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAQrC,MAAM,CAAC,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAgC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClH,iCAAS,GAAG,EAAE,GAAqB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,mBAAmB,CAAC,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IACvG,QAAQ,CACD,CACX,CAAC,CAAC;AAQH,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAC/C,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACvC,6BAAK,GAAG,EAAE,GAAqB,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,yBAAyB,CAAC,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,IACzG,QAAQ,CACL,CACP,CACF,CAAC;AAOF,MAAM,UAAU,eAAe,CAAC,EAAE,cAAc,EAAE,qBAAqB,EAAwB;IAC7F,OAAO,CACL,oBAAC,sBAAsB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,WAAW,EAAE,IAAI,EAAE;QAC3D,6BAAK,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,IAAG,cAAc,CAAO;QAChE,qBAAqB,IAAI,CACxB,6BAAK,SAAS,EAAE,MAAM,CAAC,wBAAwB,CAAC;YAC9C,oBAAC,6BAA6B,oBACxB,qBAAqB,yCACU,IAAI,EACvC,kCAAkC,EAAE,IAAI,IACxC,CACE,CACP,CAC+B,CACnC,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 clsx from 'clsx';\n\nimport { BreadcrumbGroupImplementation } from '../../../breadcrumb-group/implementation';\nimport { BreadcrumbGroupProps } from '../../../breadcrumb-group/interfaces';\nimport { BreadcrumbsSlotContext } from '../contexts';\n\nimport styles from './styles.css.js';\n\ninterface ToolbarSlotProps {\n  className?: string;\n  style?: React.CSSProperties;\n  children?: React.ReactNode;\n}\n\nexport const ToolbarSlot = React.forwardRef<HTMLElement, ToolbarSlotProps>(({ className, style, children }, ref) => (\n  <section ref={ref as React.Ref<any>} className={clsx(styles['toolbar-container'], className)} style={style}>\n    {children}\n  </section>\n));\n\ninterface NotificationsSlotProps {\n  className?: string;\n  style?: React.CSSProperties;\n  children?: React.ReactNode;\n}\n\nexport const NotificationsSlot = React.forwardRef<HTMLElement, NotificationsSlotProps>(\n  ({ className, style, children }, ref) => (\n    <div ref={ref as React.Ref<any>} className={clsx(styles['notifications-container'], className)} style={style}>\n      {children}\n    </div>\n  )\n);\n\ninterface BreadcrumbsSlotProps {\n  ownBreadcrumbs: React.ReactNode;\n  discoveredBreadcrumbs?: BreadcrumbGroupProps | null;\n}\n\nexport function BreadcrumbsSlot({ ownBreadcrumbs, discoveredBreadcrumbs }: BreadcrumbsSlotProps) {\n  return (\n    <BreadcrumbsSlotContext.Provider value={{ isInToolbar: true }}>\n      <div className={styles['breadcrumbs-own']}>{ownBreadcrumbs}</div>\n      {discoveredBreadcrumbs && (\n        <div className={styles['breadcrumbs-discovered']}>\n          <BreadcrumbGroupImplementation\n            {...discoveredBreadcrumbs}\n            data-awsui-discovered-breadcrumbs={true}\n            __injectAnalyticsComponentMetadata={true}\n          />\n        </div>\n      )}\n    </BreadcrumbsSlotContext.Provider>\n  );\n}\n"]}

package/app-layout/visual-refresh-toolbar/skeleton/styles.css.js

@@ -1,26 +1,28 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_7nfqu_1hhs8_153",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_1hhs8_197",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_1hhs8_202",
-  "drawer-expanded-mode": "awsui_drawer-expanded-mode_7nfqu_1hhs8_217",
-  "navigation": "awsui_navigation_7nfqu_1hhs8_222",
-  "tools": "awsui_tools_7nfqu_1hhs8_223",
-  "global-tools": "awsui_global-tools_7nfqu_1hhs8_224",
-  "tools-open": "awsui_tools-open_7nfqu_1hhs8_262",
-  "split-panel-side": "awsui_split-panel-side_7nfqu_1hhs8_276",
-  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_1hhs8_283",
-  "panel-hidden": "awsui_panel-hidden_7nfqu_1hhs8_296",
-  "toolbar-container": "awsui_toolbar-container_7nfqu_1hhs8_306",
-  "notifications-container": "awsui_notifications-container_7nfqu_1hhs8_312",
-  "notifications-background": "awsui_notifications-background_7nfqu_1hhs8_316",
-  "main-landmark": "awsui_main-landmark_7nfqu_1hhs8_327",
-  "main": "awsui_main_7nfqu_1hhs8_327",
-  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_1hhs8_336",
-  "content-header": "awsui_content-header_7nfqu_1hhs8_346",
-  "content": "awsui_content_7nfqu_1hhs8_346",
-  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_1hhs8_356",
-  "hidden": "awsui_hidden_7nfqu_1hhs8_361"
+  "root": "awsui_root_7nfqu_3u5n8_153",
+  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_3u5n8_197",
+  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_3u5n8_202",
+  "drawer-expanded-mode": "awsui_drawer-expanded-mode_7nfqu_3u5n8_217",
+  "navigation": "awsui_navigation_7nfqu_3u5n8_222",
+  "tools": "awsui_tools_7nfqu_3u5n8_223",
+  "global-tools": "awsui_global-tools_7nfqu_3u5n8_224",
+  "tools-open": "awsui_tools-open_7nfqu_3u5n8_262",
+  "split-panel-side": "awsui_split-panel-side_7nfqu_3u5n8_276",
+  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_3u5n8_283",
+  "panel-hidden": "awsui_panel-hidden_7nfqu_3u5n8_296",
+  "toolbar-container": "awsui_toolbar-container_7nfqu_3u5n8_306",
+  "notifications-container": "awsui_notifications-container_7nfqu_3u5n8_313",
+  "notifications-background": "awsui_notifications-background_7nfqu_3u5n8_317",
+  "main-landmark": "awsui_main-landmark_7nfqu_3u5n8_328",
+  "main": "awsui_main_7nfqu_3u5n8_328",
+  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_3u5n8_337",
+  "content-header": "awsui_content-header_7nfqu_3u5n8_347",
+  "content": "awsui_content_7nfqu_3u5n8_347",
+  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_3u5n8_357",
+  "hidden": "awsui_hidden_7nfqu_3u5n8_362",
+  "breadcrumbs-own": "awsui_breadcrumbs-own_7nfqu_3u5n8_366",
+  "breadcrumbs-discovered": "awsui_breadcrumbs-discovered_7nfqu_3u5n8_366"
 };
   

package/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css

@@ -150,7 +150,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_7nfqu_1hhs8_153:not(#\9) {
+.awsui_root_7nfqu_3u5n8_153:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -189,83 +189,83 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-template-rows: min-content min-content 1fr;
 }
 @media (min-width: 689px) {
-  .awsui_root_7nfqu_1hhs8_153:not(#\9) {
+  .awsui_root_7nfqu_3u5n8_153:not(#\9) {
     grid-template-areas: "toolbar    toolbar      toolbar       toolbar   toolbar         toolbar  toolbar" "navigation .         notifications    .         sideSplitPanel  tools    global-tools" "navigation .             main         .         sideSplitPanel  tools    global-tools";
     grid-template-columns: min-content minmax(var(--space-layout-content-horizontal-buc0zz, 24px), 1fr) minmax(0, var(--awsui-max-content-width-kcc2gu)) minmax(var(--space-layout-content-horizontal-buc0zz, 24px), 1fr) min-content min-content;
     grid-template-rows: min-content min-content 1fr min-content;
   }
-  .awsui_root_7nfqu_1hhs8_153.awsui_has-adaptive-widths-default_7nfqu_1hhs8_197:not(#\9) {
+  .awsui_root_7nfqu_3u5n8_153.awsui_has-adaptive-widths-default_7nfqu_3u5n8_197:not(#\9) {
     --awsui-max-content-width-kcc2gu: 1620px;
   }
 }
 @media (min-width: 689px) and (min-width: 1401px) {
-  .awsui_root_7nfqu_1hhs8_153.awsui_has-adaptive-widths-dashboard_7nfqu_1hhs8_202:not(#\9) {
+  .awsui_root_7nfqu_3u5n8_153.awsui_has-adaptive-widths-dashboard_7nfqu_3u5n8_202:not(#\9) {
     --awsui-max-content-width-kcc2gu: 1280px;
   }
 }
 @media (min-width: 689px) and (min-width: 1921px) {
-  .awsui_root_7nfqu_1hhs8_153.awsui_has-adaptive-widths-dashboard_7nfqu_1hhs8_202:not(#\9) {
+  .awsui_root_7nfqu_3u5n8_153.awsui_has-adaptive-widths-dashboard_7nfqu_3u5n8_202:not(#\9) {
     --awsui-max-content-width-kcc2gu: 1620px;
   }
 }
 @media (min-width: 689px) and (min-width: 2541px) {
-  .awsui_root_7nfqu_1hhs8_153.awsui_has-adaptive-widths-dashboard_7nfqu_1hhs8_202:not(#\9) {
+  .awsui_root_7nfqu_3u5n8_153.awsui_has-adaptive-widths-dashboard_7nfqu_3u5n8_202:not(#\9) {
     --awsui-max-content-width-kcc2gu: 2160px;
   }
 }
 @media (min-width: 689px) {
-  .awsui_root_7nfqu_1hhs8_153.awsui_drawer-expanded-mode_7nfqu_1hhs8_217:not(#\9) {
+  .awsui_root_7nfqu_3u5n8_153.awsui_drawer-expanded-mode_7nfqu_3u5n8_217:not(#\9) {
     grid-template-columns: 0 0 0 0 0 0 auto;
   }
 }
 
-.awsui_navigation_7nfqu_1hhs8_222:not(#\9),
-.awsui_tools_7nfqu_1hhs8_223:not(#\9),
-.awsui_global-tools_7nfqu_1hhs8_224:not(#\9) {
+.awsui_navigation_7nfqu_3u5n8_222:not(#\9),
+.awsui_tools_7nfqu_3u5n8_223:not(#\9),
+.awsui_global-tools_7nfqu_3u5n8_224:not(#\9) {
   grid-row: 1/-1;
   grid-column: 1/-1;
   background: var(--color-background-container-content-6u8rvp, #ffffff);
   opacity: 1;
 }
 @media (max-width: 688px) {
-  .awsui_navigation_7nfqu_1hhs8_222:not(#\9),
-  .awsui_tools_7nfqu_1hhs8_223:not(#\9),
-  .awsui_global-tools_7nfqu_1hhs8_224:not(#\9) {
+  .awsui_navigation_7nfqu_3u5n8_222:not(#\9),
+  .awsui_tools_7nfqu_3u5n8_223:not(#\9),
+  .awsui_global-tools_7nfqu_3u5n8_224:not(#\9) {
     inline-size: 100%;
   }
 }
 
-.awsui_navigation_7nfqu_1hhs8_222:not(#\9) {
+.awsui_navigation_7nfqu_3u5n8_222:not(#\9) {
   z-index: 830;
 }
 @media (min-width: 689px) {
-  .awsui_navigation_7nfqu_1hhs8_222:not(#\9) {
+  .awsui_navigation_7nfqu_3u5n8_222:not(#\9) {
     grid-area: navigation;
     inline-size: var(--awsui-navigation-width-kcc2gu);
     border-inline-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-layout-ayg8vb, #c6c6cd);
   }
 }
 @media (max-width: 688px) {
-  .awsui_navigation_7nfqu_1hhs8_222:not(#\9) {
+  .awsui_navigation_7nfqu_3u5n8_222:not(#\9) {
     z-index: 1001;
   }
 }
 
 @media (min-width: 689px) {
-  .awsui_tools_7nfqu_1hhs8_223:not(#\9) {
+  .awsui_tools_7nfqu_3u5n8_223:not(#\9) {
     grid-area: tools;
     /* stylelint-disable plugin/no-unsupported-browser-features */
   }
-  .awsui_tools_7nfqu_1hhs8_223:not(#\9):not(:has(> [data-testid])) {
+  .awsui_tools_7nfqu_3u5n8_223:not(#\9):not(:has(> [data-testid])) {
     inline-size: var(--awsui-tools-width-kcc2gu);
   }
-  .awsui_tools_7nfqu_1hhs8_223:not(#\9):not(:has(> [data-testid])).awsui_tools-open_7nfqu_1hhs8_262 {
+  .awsui_tools_7nfqu_3u5n8_223:not(#\9):not(:has(> [data-testid])).awsui_tools-open_7nfqu_3u5n8_262 {
     border-inline-start: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-layout-ayg8vb, #c6c6cd);
   }
 }
 
 @media (min-width: 689px) {
-  .awsui_global-tools_7nfqu_1hhs8_224:not(#\9) {
+  .awsui_global-tools_7nfqu_3u5n8_224:not(#\9) {
     display: flex;
     grid-area: global-tools;
     justify-content: flex-end;
@@ -273,14 +273,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 }
 
 @media (min-width: 689px) {
-  .awsui_split-panel-side_7nfqu_1hhs8_276:not(#\9) {
+  .awsui_split-panel-side_7nfqu_3u5n8_276:not(#\9) {
     grid-area: sideSplitPanel;
     border-inline-start: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-layout-ayg8vb, #c6c6cd);
     opacity: 1;
   }
 }
 
-.awsui_split-panel-bottom_7nfqu_1hhs8_283:not(#\9) {
+.awsui_split-panel-bottom_7nfqu_3u5n8_283:not(#\9) {
   position: sticky;
   z-index: 840;
   align-self: end;
@@ -288,76 +288,81 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   grid-column: 1/-1;
 }
 @media (min-width: 689px) {
-  .awsui_split-panel-bottom_7nfqu_1hhs8_283:not(#\9) {
+  .awsui_split-panel-bottom_7nfqu_3u5n8_283:not(#\9) {
     grid-column: 2/5;
   }
 }
 
-.awsui_panel-hidden_7nfqu_1hhs8_296:not(#\9) {
+.awsui_panel-hidden_7nfqu_3u5n8_296:not(#\9) {
   border-block: none;
   border-inline: none;
   opacity: 0;
   z-index: 0;
 }
-.awsui_panel-hidden_7nfqu_1hhs8_296.awsui_navigation_7nfqu_1hhs8_222:not(#\9), .awsui_panel-hidden_7nfqu_1hhs8_296.awsui_tools_7nfqu_1hhs8_223:not(#\9), .awsui_panel-hidden_7nfqu_1hhs8_296.awsui_global-tools_7nfqu_1hhs8_224:not(#\9) {
+.awsui_panel-hidden_7nfqu_3u5n8_296.awsui_navigation_7nfqu_3u5n8_222:not(#\9), .awsui_panel-hidden_7nfqu_3u5n8_296.awsui_tools_7nfqu_3u5n8_223:not(#\9), .awsui_panel-hidden_7nfqu_3u5n8_296.awsui_global-tools_7nfqu_3u5n8_224:not(#\9) {
   inline-size: 0px;
 }
 
-.awsui_toolbar-container_7nfqu_1hhs8_306:not(#\9) {
+.awsui_toolbar-container_7nfqu_3u5n8_306:not(#\9) {
   grid-area: toolbar;
   block-size: 42px;
   border-block-end: var(--border-divider-section-width-uwo8my, 1px) solid var(--color-border-layout-ayg8vb, #c6c6cd);
+  box-sizing: border-box;
 }
 
-.awsui_notifications-container_7nfqu_1hhs8_312:not(#\9) {
+.awsui_notifications-container_7nfqu_3u5n8_313:not(#\9) {
   grid-area: notifications;
 }
 
-.awsui_notifications-background_7nfqu_1hhs8_316:not(#\9) {
+.awsui_notifications-background_7nfqu_3u5n8_317:not(#\9) {
   background: var(--color-background-layout-main-5ilwcb, #ffffff);
   grid-area: notifications;
   grid-column: 1/-1;
 }
 @media (min-width: 689px) {
-  .awsui_notifications-background_7nfqu_1hhs8_316:not(#\9) {
+  .awsui_notifications-background_7nfqu_3u5n8_317:not(#\9) {
     grid-column: 2/5;
   }
 }
 
-.awsui_main-landmark_7nfqu_1hhs8_327:not(#\9) {
+.awsui_main-landmark_7nfqu_3u5n8_328:not(#\9) {
   display: contents;
 }
 
-.awsui_main_7nfqu_1hhs8_327:not(#\9) {
+.awsui_main_7nfqu_3u5n8_328:not(#\9) {
   grid-area: main;
   margin-block-start: var(--space-scaled-s-8ozaad, 12px);
   margin-block-end: var(--space-layout-content-bottom-zeb1g9, 40px);
 }
-.awsui_main-disable-paddings_7nfqu_1hhs8_336:not(#\9) {
+.awsui_main-disable-paddings_7nfqu_3u5n8_337:not(#\9) {
   margin-block: 0;
   grid-column: 1/-1;
 }
 @media (min-width: 689px) {
-  .awsui_main-disable-paddings_7nfqu_1hhs8_336:not(#\9) {
+  .awsui_main-disable-paddings_7nfqu_3u5n8_337:not(#\9) {
     grid-column: 2/5;
   }
 }
 
-.awsui_content-header_7nfqu_1hhs8_346:not(#\9) {
+.awsui_content-header_7nfqu_3u5n8_347:not(#\9) {
   margin-block-end: var(--space-content-header-padding-bottom-rvy5xz, 16px);
 }
 
-.awsui_content_7nfqu_1hhs8_346:not(#\9) {
+.awsui_content_7nfqu_3u5n8_347:not(#\9) {
   display: contents;
 }
 
 /* stylelint-disable-next-line selector-combinator-disallowed-list, selector-max-universal */
 @media (max-width: 688px) {
-  .awsui_unfocusable-mobile_7nfqu_1hhs8_356 *:not(#\9) {
+  .awsui_unfocusable-mobile_7nfqu_3u5n8_357 *:not(#\9) {
     visibility: hidden;
   }
 }
 
-.awsui_hidden_7nfqu_1hhs8_361:not(#\9) {
+.awsui_hidden_7nfqu_3u5n8_362:not(#\9) {
+  display: none;
+}
+
+.awsui_breadcrumbs-own_7nfqu_3u5n8_366:not(#\9):not(:empty) + .awsui_breadcrumbs-discovered_7nfqu_3u5n8_366 {
   display: none;
 }

package/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js

@@ -2,26 +2,28 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_7nfqu_1hhs8_153",
-  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_1hhs8_197",
-  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_1hhs8_202",
-  "drawer-expanded-mode": "awsui_drawer-expanded-mode_7nfqu_1hhs8_217",
-  "navigation": "awsui_navigation_7nfqu_1hhs8_222",
-  "tools": "awsui_tools_7nfqu_1hhs8_223",
-  "global-tools": "awsui_global-tools_7nfqu_1hhs8_224",
-  "tools-open": "awsui_tools-open_7nfqu_1hhs8_262",
-  "split-panel-side": "awsui_split-panel-side_7nfqu_1hhs8_276",
-  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_1hhs8_283",
-  "panel-hidden": "awsui_panel-hidden_7nfqu_1hhs8_296",
-  "toolbar-container": "awsui_toolbar-container_7nfqu_1hhs8_306",
-  "notifications-container": "awsui_notifications-container_7nfqu_1hhs8_312",
-  "notifications-background": "awsui_notifications-background_7nfqu_1hhs8_316",
-  "main-landmark": "awsui_main-landmark_7nfqu_1hhs8_327",
-  "main": "awsui_main_7nfqu_1hhs8_327",
-  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_1hhs8_336",
-  "content-header": "awsui_content-header_7nfqu_1hhs8_346",
-  "content": "awsui_content_7nfqu_1hhs8_346",
-  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_1hhs8_356",
-  "hidden": "awsui_hidden_7nfqu_1hhs8_361"
+  "root": "awsui_root_7nfqu_3u5n8_153",
+  "has-adaptive-widths-default": "awsui_has-adaptive-widths-default_7nfqu_3u5n8_197",
+  "has-adaptive-widths-dashboard": "awsui_has-adaptive-widths-dashboard_7nfqu_3u5n8_202",
+  "drawer-expanded-mode": "awsui_drawer-expanded-mode_7nfqu_3u5n8_217",
+  "navigation": "awsui_navigation_7nfqu_3u5n8_222",
+  "tools": "awsui_tools_7nfqu_3u5n8_223",
+  "global-tools": "awsui_global-tools_7nfqu_3u5n8_224",
+  "tools-open": "awsui_tools-open_7nfqu_3u5n8_262",
+  "split-panel-side": "awsui_split-panel-side_7nfqu_3u5n8_276",
+  "split-panel-bottom": "awsui_split-panel-bottom_7nfqu_3u5n8_283",
+  "panel-hidden": "awsui_panel-hidden_7nfqu_3u5n8_296",
+  "toolbar-container": "awsui_toolbar-container_7nfqu_3u5n8_306",
+  "notifications-container": "awsui_notifications-container_7nfqu_3u5n8_313",
+  "notifications-background": "awsui_notifications-background_7nfqu_3u5n8_317",
+  "main-landmark": "awsui_main-landmark_7nfqu_3u5n8_328",
+  "main": "awsui_main_7nfqu_3u5n8_328",
+  "main-disable-paddings": "awsui_main-disable-paddings_7nfqu_3u5n8_337",
+  "content-header": "awsui_content-header_7nfqu_3u5n8_347",
+  "content": "awsui_content_7nfqu_3u5n8_347",
+  "unfocusable-mobile": "awsui_unfocusable-mobile_7nfqu_3u5n8_357",
+  "hidden": "awsui_hidden_7nfqu_3u5n8_362",
+  "breadcrumbs-own": "awsui_breadcrumbs-own_7nfqu_3u5n8_366",
+  "breadcrumbs-discovered": "awsui_breadcrumbs-discovered_7nfqu_3u5n8_366"
 };
   

package/app-layout/visual-refresh-toolbar/state/index.d.ts

@@ -0,0 +1,29 @@
+import React, { ForwardedRef } from 'react';
+import { AppLayoutProps } from '../../interfaces';
+import { AppLayoutInternalProps, AppLayoutState } from '../interfaces';
+import { SkeletonSlotsAttributes } from '../skeleton/interfaces';
+import { MergeProps, SharedProps } from './interfaces';
+export interface StateManager {
+  setState: ((appLayoutState: AppLayoutState, skeletonAttributes: SkeletonSlotsAttributes, deduplicationProps: SharedProps, mergeProps: MergeProps) => void) | undefined;
+  hasToolbar: boolean;
+  setToolbar: ((hasToolbar: boolean) => void) | undefined;
+}
+export interface AppLayoutStateProps {
+  appLayoutProps: AppLayoutInternalProps;
+  stateManager: React.MutableRefObject<StateManager>;
+  forwardRef: ForwardedRef<AppLayoutProps.Ref>;
+}
+export declare const AppLayoutStateProvider: ({
+  appLayoutProps,
+  stateManager,
+  forwardRef
+}: AppLayoutStateProps) => JSX.Element;
+export declare const createWidgetizedAppLayoutState: (Loader?: (({
+  appLayoutProps,
+  stateManager,
+  forwardRef
+}: AppLayoutStateProps) => JSX.Element) | undefined) => ({
+  appLayoutProps,
+  stateManager,
+  forwardRef
+}: AppLayoutStateProps) => JSX.Element;

package/app-layout/visual-refresh-toolbar/state/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/state/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAE,YAAY,EAA6B,MAAM,OAAO,CAAC;AAGvE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,sBAAsB,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AACvE,OAAO,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAKvD,MAAM,WAAW,YAAY;IAC3B,QAAQ,EACJ,CAAC,CACC,cAAc,EAAE,cAAc,EAC9B,kBAAkB,EAAE,uBAAuB,EAC3C,kBAAkB,EAAE,WAAW,EAC/B,UAAU,EAAE,UAAU,KACnB,IAAI,CAAC,GACV,SAAS,CAAC;IACd,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,CAAC,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACzD;AAED,MAAM,WAAW,mBAAmB;IAClC,cAAc,EAAE,sBAAsB,CAAC;IACvC,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACnD,UAAU,EAAE,YAAY,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;CAC9C;AAED,eAAO,MAAM,sBAAsB,iDAAkD,mBAAmB,gBAuBvG,CAAC;AAEF,eAAO,MAAM,8BAA8B,4DAzB0C,mBAAmB,iFAAnB,mBAAmB,gBAyBT,CAAC"}

package/app-layout/visual-refresh-toolbar/state/index.js

@@ -0,0 +1,27 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import React, { useLayoutEffect, useState } from 'react';
+import { createWidgetizedComponent } from '../../../internal/widgets';
+import { getPropsToMerge, mergeProps } from './props-merger';
+import { useAppLayout } from './use-app-layout';
+import { useSkeletonSlotsAttributes } from './use-skeleton-slots-attributes';
+export const AppLayoutStateProvider = ({ appLayoutProps, stateManager, forwardRef }) => {
+    var _a;
+    const [hasToolbar, setHasToolbar] = useState((_a = stateManager.current.hasToolbar) !== null && _a !== void 0 ? _a : true);
+    const appLayoutState = useAppLayout(hasToolbar, appLayoutProps, forwardRef);
+    const skeletonSlotsAttributes = useSkeletonSlotsAttributes(hasToolbar, appLayoutProps, appLayoutState);
+    useLayoutEffect(() => {
+        var _a;
+        if (!((_a = stateManager.current) === null || _a === void 0 ? void 0 : _a.setState)) {
+            console.warn('AppLayout state manager is not found');
+            return;
+        }
+        stateManager.current.setState(appLayoutState, skeletonSlotsAttributes, getPropsToMerge(appLayoutProps, appLayoutState), mergeProps);
+    });
+    useLayoutEffect(() => {
+        stateManager.current.setToolbar = setHasToolbar;
+    }, [stateManager]);
+    return React.createElement(React.Fragment, null);
+};
+export const createWidgetizedAppLayoutState = createWidgetizedComponent(AppLayoutStateProvider);
+//# sourceMappingURL=index.js.map

package/app-layout/visual-refresh-toolbar/state/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/state/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAgB,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEvE,OAAO,EAAE,yBAAyB,EAAE,MAAM,2BAA2B,CAAC;AAKtE,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAC;AAqB7E,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EAAE,cAAc,EAAE,YAAY,EAAE,UAAU,EAAuB,EAAE,EAAE;;IAC1G,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,MAAA,YAAY,CAAC,OAAO,CAAC,UAAU,mCAAI,IAAI,CAAC,CAAC;IACtF,MAAM,cAAc,GAAG,YAAY,CAAC,UAAU,EAAE,cAAc,EAAE,UAAU,CAAC,CAAC;IAC5E,MAAM,uBAAuB,GAAG,0BAA0B,CAAC,UAAU,EAAE,cAAc,EAAE,cAAc,CAAC,CAAC;IAEvG,eAAe,CAAC,GAAG,EAAE;;QACnB,IAAI,CAAC,CAAA,MAAA,YAAY,CAAC,OAAO,0CAAE,QAAQ,CAAA,EAAE;YACnC,OAAO,CAAC,IAAI,CAAC,sCAAsC,CAAC,CAAC;YACrD,OAAO;SACR;QACD,YAAY,CAAC,OAAO,CAAC,QAAQ,CAC3B,cAAc,EACd,uBAAuB,EACvB,eAAe,CAAC,cAAc,EAAE,cAAc,CAAC,EAC/C,UAAU,CACX,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,eAAe,CAAC,GAAG,EAAE;QACnB,YAAY,CAAC,OAAO,CAAC,UAAU,GAAG,aAAa,CAAC;IAClD,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,OAAO,yCAAK,CAAC;AACf,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,8BAA8B,GAAG,yBAAyB,CAAC,sBAAsB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { ForwardedRef, useLayoutEffect, useState } from 'react';\n\nimport { createWidgetizedComponent } from '../../../internal/widgets';\nimport { AppLayoutProps } from '../../interfaces';\nimport { AppLayoutInternalProps, AppLayoutState } from '../interfaces';\nimport { SkeletonSlotsAttributes } from '../skeleton/interfaces';\nimport { MergeProps, SharedProps } from './interfaces';\nimport { getPropsToMerge, mergeProps } from './props-merger';\nimport { useAppLayout } from './use-app-layout';\nimport { useSkeletonSlotsAttributes } from './use-skeleton-slots-attributes';\n\nexport interface StateManager {\n  setState:\n    | ((\n        appLayoutState: AppLayoutState,\n        skeletonAttributes: SkeletonSlotsAttributes,\n        deduplicationProps: SharedProps,\n        mergeProps: MergeProps\n      ) => void)\n    | undefined;\n  hasToolbar: boolean;\n  setToolbar: ((hasToolbar: boolean) => void) | undefined;\n}\n\nexport interface AppLayoutStateProps {\n  appLayoutProps: AppLayoutInternalProps;\n  stateManager: React.MutableRefObject<StateManager>;\n  forwardRef: ForwardedRef<AppLayoutProps.Ref>;\n}\n\nexport const AppLayoutStateProvider = ({ appLayoutProps, stateManager, forwardRef }: AppLayoutStateProps) => {\n  const [hasToolbar, setHasToolbar] = useState(stateManager.current.hasToolbar ?? true);\n  const appLayoutState = useAppLayout(hasToolbar, appLayoutProps, forwardRef);\n  const skeletonSlotsAttributes = useSkeletonSlotsAttributes(hasToolbar, appLayoutProps, appLayoutState);\n\n  useLayoutEffect(() => {\n    if (!stateManager.current?.setState) {\n      console.warn('AppLayout state manager is not found');\n      return;\n    }\n    stateManager.current.setState(\n      appLayoutState,\n      skeletonSlotsAttributes,\n      getPropsToMerge(appLayoutProps, appLayoutState),\n      mergeProps\n    );\n  });\n\n  useLayoutEffect(() => {\n    stateManager.current.setToolbar = setHasToolbar;\n  }, [stateManager]);\n\n  return <></>;\n};\n\nexport const createWidgetizedAppLayoutState = createWidgetizedComponent(AppLayoutStateProvider);\n"]}

package/app-layout/visual-refresh-toolbar/{multi-layout.d.ts → state/interfaces.d.ts}

@@ -1,14 +1,13 @@
 import React from 'react';
-import { AppLayoutProps } from '../interfaces';
-import { OnChangeParams } from '../utils/use-drawers';
-import { Focusable, FocusControlMultipleStates } from '../utils/use-focus-control';
-import { SplitPanelToggleProps, ToolbarProps } from './toolbar';
+import { AppLayoutProps } from '../../interfaces';
+import { OnChangeParams } from '../../utils/use-drawers';
+import { Focusable, FocusControlMultipleStates } from '../../utils/use-focus-control';
+import { SplitPanelToggleProps, ToolbarProps } from '../toolbar';
 export interface SharedProps {
-  forceDeduplicationType?: 'primary' | 'secondary' | 'suspended' | 'off';
+  navigationOpen: boolean;
   ariaLabels: AppLayoutProps.Labels | undefined;
   navigation: React.ReactNode;
-  navigationOpen: boolean;
-  onNavigationToggle: (open: boolean) => void;
+  onNavigationToggle?: (open: boolean) => void;
   navigationFocusRef: React.Ref<Focusable> | undefined;
   breadcrumbs: React.ReactNode;
   activeDrawerId: string | null;
@@ -17,17 +16,13 @@ export interface SharedProps {
   drawersFocusRef: React.Ref<Focusable> | undefined;
   globalDrawersFocusControl?: FocusControlMultipleStates | undefined;
   globalDrawers?: ReadonlyArray<AppLayoutProps.Drawer> | undefined;
-  activeGlobalDrawersIds?: Array<string> | undefined;
+  activeGlobalDrawersIds?: ReadonlyArray<string> | undefined;
   onActiveGlobalDrawersChange?: ((newDrawerId: string, params: OnChangeParams) => void) | undefined;
   splitPanel: React.ReactNode;
   splitPanelToggleProps: SplitPanelToggleProps | undefined;
-  splitPanelFocusRef: React.Ref<Focusable> | undefined;
-  onSplitPanelToggle: () => void;
+  splitPanelFocusRef?: React.Ref<Focusable> | undefined;
+  onSplitPanelToggle?: () => void;
   expandedDrawerId?: string | null;
-  setExpandedDrawerId: (value: string | null) => void;
+  setExpandedDrawerId?: (value: string | null) => void;
 }
-export declare function mergeProps(ownProps: SharedProps, additionalProps: ReadonlyArray<Partial<SharedProps>>): ToolbarProps | null;
-export declare function useMultiAppLayout(props: SharedProps, isEnabled: boolean): {
-  registered: boolean;
-  toolbarProps: ToolbarProps | null;
-};
+export type MergeProps = (ownProps: SharedProps, additionalProps: ReadonlyArray<Partial<SharedProps>>) => ToolbarProps | null;

package/app-layout/visual-refresh-toolbar/state/interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/state/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,SAAS,EAAE,0BAA0B,EAAE,MAAM,+BAA+B,CAAC;AACtF,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAEjE,MAAM,WAAW,WAAW;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,UAAU,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;IAC9C,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,kBAAkB,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACrD,WAAW,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,OAAO,EAAE,aAAa,CAAC,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IAC1D,oBAAoB,EAAE,CAAC,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAC9F,eAAe,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IAClD,yBAAyB,CAAC,EAAE,0BAA0B,GAAG,SAAS,CAAC;IACnE,aAAa,CAAC,EAAE,aAAa,CAAC,cAAc,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IACjE,sBAAsB,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,GAAG,SAAS,CAAC;IAC3D,2BAA2B,CAAC,EAAE,CAAC,CAAC,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;IAClG,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,qBAAqB,EAAE,qBAAqB,GAAG,SAAS,CAAC;IACzD,kBAAkB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACtD,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,gBAAgB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACjC,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CACtD;AAED,MAAM,MAAM,UAAU,GAAG,CACvB,QAAQ,EAAE,WAAW,EACrB,eAAe,EAAE,aAAa,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,KACjD,YAAY,GAAG,IAAI,CAAC"}

package/app-layout/visual-refresh-toolbar/state/interfaces.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=interfaces.js.map

package/app-layout/visual-refresh-toolbar/state/interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../../../src/app-layout/visual-refresh-toolbar/state/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';\n\nimport { AppLayoutProps } from '../../interfaces';\nimport { OnChangeParams } from '../../utils/use-drawers';\nimport { Focusable, FocusControlMultipleStates } from '../../utils/use-focus-control';\nimport { SplitPanelToggleProps, ToolbarProps } from '../toolbar';\n\nexport interface SharedProps {\n  navigationOpen: boolean;\n  ariaLabels: AppLayoutProps.Labels | undefined;\n  navigation: React.ReactNode;\n  onNavigationToggle?: (open: boolean) => void;\n  navigationFocusRef: React.Ref<Focusable> | undefined;\n  breadcrumbs: React.ReactNode;\n  activeDrawerId: string | null;\n  drawers: ReadonlyArray<AppLayoutProps.Drawer> | undefined;\n  onActiveDrawerChange: ((drawerId: string | null, params: OnChangeParams) => void) | undefined;\n  drawersFocusRef: React.Ref<Focusable> | undefined;\n  globalDrawersFocusControl?: FocusControlMultipleStates | undefined;\n  globalDrawers?: ReadonlyArray<AppLayoutProps.Drawer> | undefined;\n  activeGlobalDrawersIds?: ReadonlyArray<string> | undefined;\n  onActiveGlobalDrawersChange?: ((newDrawerId: string, params: OnChangeParams) => void) | undefined;\n  splitPanel: React.ReactNode;\n  splitPanelToggleProps: SplitPanelToggleProps | undefined;\n  splitPanelFocusRef?: React.Ref<Focusable> | undefined;\n  onSplitPanelToggle?: () => void;\n  expandedDrawerId?: string | null;\n  setExpandedDrawerId?: (value: string | null) => void;\n}\n\nexport type MergeProps = (\n  ownProps: SharedProps,\n  additionalProps: ReadonlyArray<Partial<SharedProps>>\n) => ToolbarProps | null;\n"]}