@cloudscape-design/components 3.0.220 → 3.0.222

package/annotation-context/index.js

@@ -1,4 +1,4 @@
-import { __assign, __rest } from "tslib";
+import { __rest } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
@@ -10,83 +10,78 @@ import { useTelemetry } from '../internal/hooks/use-telemetry';
 import { applyDisplayName } from '../internal/utils/apply-display-name';
 export function getStepInfo(annotations, index) {
     if (index >= 0) {
-        var taskIndex = 0;
-        for (var _i = 0, annotations_1 = annotations; _i < annotations_1.length; _i++) {
-            var task = annotations_1[_i];
+        let taskIndex = 0;
+        for (const task of annotations) {
             if (task.steps.length <= index) {
                 index -= task.steps.length;
                 taskIndex++;
                 continue;
             }
-            return { task: task, step: task.steps[index], localIndex: index, taskIndex: taskIndex };
+            return { task, step: task.steps[index], localIndex: index, taskIndex };
         }
     }
     return { task: undefined, step: undefined, localIndex: 0, taskIndex: 0 };
 }
 // constant empty array to keep hook dependency stable
-var emptyTasks = [];
-export default function AnnotationContext(_a) {
-    var _b, _c, _d, _e;
-    var currentTutorial = _a.currentTutorial, children = _a.children, onStepChange = _a.onStepChange, onFinishHandler = _a.onFinish, onStartTutorial = _a.onStartTutorial, onExitTutorial = _a.onExitTutorial, i18nStrings = _a.i18nStrings;
+const emptyTasks = [];
+export default function AnnotationContext({ currentTutorial, children, onStepChange, onFinish: onFinishHandler, onStartTutorial, onExitTutorial, i18nStrings, }) {
+    var _a, _b, _c, _d;
     useTelemetry('AnnotationContext');
-    var _f = useState(true), open = _f[0], setOpen = _f[1];
-    var _g = useState(0), currentStepIndex = _g[0], setCurrentStepIndex = _g[1];
-    useEffect(function () {
+    const [open, setOpen] = useState(true);
+    const [currentStepIndex, setCurrentStepIndex] = useState(0);
+    useEffect(() => {
         // When a tutorial is started, we reset the progress to the first step.
         setCurrentStepIndex(0);
         setOpen(true);
     }, [currentTutorial, setOpen]);
-    var _h = useState({}), availableHotspots = _h[0], setAvailableHotspots = _h[1];
+    const [availableHotspots, setAvailableHotspots] = useState({});
     // availableHotspots is mirrored in this ref to prevent endless loops
     // in between registerHotspot and unregisterHotspot callbacks.
-    var availableHotspotsRef = useRef(availableHotspots);
-    var annotations = currentTutorial ? currentTutorial.tasks : emptyTasks;
-    var _j = getStepInfo(annotations, currentStepIndex), task = _j.task, step = _j.step, localIndex = _j.localIndex, taskIndex = _j.taskIndex;
-    var currentId = step === null || step === void 0 ? void 0 : step.hotspotId;
-    var totalStepCount = annotations.map(function (a) { return a.steps.length; }).reduce(function (a, b) { return a + b; }, 0);
-    var id2index = useMemo(function () {
-        var mapping = {};
-        var counter = 0;
-        for (var _i = 0, annotations_2 = annotations; _i < annotations_2.length; _i++) {
-            var annotation = annotations_2[_i];
-            for (var _a = 0, _b = annotation.steps; _a < _b.length; _a++) {
-                var step_1 = _b[_a];
-                if (mapping[step_1.hotspotId] === undefined) {
-                    mapping[step_1.hotspotId] = counter;
+    const availableHotspotsRef = useRef(availableHotspots);
+    const annotations = currentTutorial ? currentTutorial.tasks : emptyTasks;
+    const { task, step, localIndex, taskIndex } = getStepInfo(annotations, currentStepIndex);
+    const currentId = step === null || step === void 0 ? void 0 : step.hotspotId;
+    const totalStepCount = annotations.map(a => a.steps.length).reduce((a, b) => a + b, 0);
+    const id2index = useMemo(() => {
+        const mapping = {};
+        let counter = 0;
+        for (const annotation of annotations) {
+            for (const step of annotation.steps) {
+                if (mapping[step.hotspotId] === undefined) {
+                    mapping[step.hotspotId] = counter;
                 }
                 counter++;
             }
         }
         return mapping;
     }, [annotations]);
-    var openNextStep = useCallback(function () {
-        var newStepIndex = Math.min(currentStepIndex + 1, totalStepCount);
+    const openNextStep = useCallback(() => {
+        const newStepIndex = Math.min(currentStepIndex + 1, totalStepCount);
         setCurrentStepIndex(newStepIndex);
         fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'next' });
     }, [currentStepIndex, onStepChange, totalStepCount]);
-    var openPreviousStep = useCallback(function () {
-        var newStepIndex = Math.max(currentStepIndex - 1, 0);
+    const openPreviousStep = useCallback(() => {
+        const newStepIndex = Math.max(currentStepIndex - 1, 0);
         setCurrentStepIndex(newStepIndex);
         fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'previous' });
     }, [onStepChange, currentStepIndex]);
-    var onFinish = useCallback(function () { return fireNonCancelableEvent(onFinishHandler); }, [onFinishHandler]);
+    const onFinish = useCallback(() => fireNonCancelableEvent(onFinishHandler), [onFinishHandler]);
     /**
      * If the currently open hotspot disappears from the page (e.g. because of a react-router navigation),
      * this Effect detects the nearest available hotspot and changes to it. This allows us to e.g. automatically
      * advance to the first step on the new page (or the last step on the previous page, in case the user
      * navigates back).
      */
-    var isCurrentHotspotAvailable = currentId ? availableHotspots[currentId] : null;
-    useEffect(function () {
+    const isCurrentHotspotAvailable = currentId ? availableHotspots[currentId] : null;
+    useEffect(() => {
         if (!currentId || availableHotspotsRef.current[currentId]) {
             return;
         }
-        var findNearestHotspot = function () {
-            var nearestHotspot = undefined;
-            var nearestDistance = Infinity;
-            for (var _i = 0, _a = Object.keys(availableHotspotsRef.current); _i < _a.length; _i++) {
-                var hotspotId = _a[_i];
-                var distanceFromCurrentHotspot = Math.abs(id2index[hotspotId] - currentStepIndex);
+        const findNearestHotspot = () => {
+            let nearestHotspot = undefined;
+            let nearestDistance = Infinity;
+            for (const hotspotId of Object.keys(availableHotspotsRef.current)) {
+                const distanceFromCurrentHotspot = Math.abs(id2index[hotspotId] - currentStepIndex);
                 if (distanceFromCurrentHotspot < nearestDistance) {
                     nearestDistance = distanceFromCurrentHotspot;
                     nearestHotspot = hotspotId;
@@ -94,38 +89,38 @@ export default function AnnotationContext(_a) {
             }
             return nearestHotspot;
         };
-        var nearestHotspot = findNearestHotspot();
+        const nearestHotspot = findNearestHotspot();
         if (nearestHotspot) {
-            var newStepIndex = id2index[nearestHotspot];
+            const newStepIndex = id2index[nearestHotspot];
             setCurrentStepIndex(newStepIndex);
             setOpen(true);
             fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'auto-fallback' });
         }
     }, [annotations, isCurrentHotspotAvailable, currentId, currentStepIndex, id2index, onStepChange]);
-    var onDismiss = useCallback(function () {
+    const onDismiss = useCallback(() => {
         setOpen(false);
     }, [setOpen]);
-    var onOpen = useCallback(function (stepIndex) {
+    const onOpen = useCallback((stepIndex) => {
         setCurrentStepIndex(stepIndex);
         fireNonCancelableEvent(onStepChange, { step: stepIndex, reason: 'open' });
         setOpen(true);
     }, [onStepChange, setOpen]);
-    var idOfPreviousHotspot = (_b = getStepInfo(annotations, currentStepIndex - 1).step) === null || _b === void 0 ? void 0 : _b.hotspotId;
-    var idOfNextHotspot = (_c = getStepInfo(annotations, currentStepIndex + 1).step) === null || _c === void 0 ? void 0 : _c.hotspotId;
-    var previousHotspotIsAvailable = (_d = (idOfPreviousHotspot !== undefined && availableHotspots[idOfPreviousHotspot])) !== null && _d !== void 0 ? _d : false;
-    var nextHotspotIsAvailable = (_e = (idOfNextHotspot !== undefined && availableHotspots[idOfNextHotspot])) !== null && _e !== void 0 ? _e : false;
-    var getContentForId = useCallback(function (id, direction) {
+    const idOfPreviousHotspot = (_a = getStepInfo(annotations, currentStepIndex - 1).step) === null || _a === void 0 ? void 0 : _a.hotspotId;
+    const idOfNextHotspot = (_b = getStepInfo(annotations, currentStepIndex + 1).step) === null || _b === void 0 ? void 0 : _b.hotspotId;
+    const previousHotspotIsAvailable = (_c = (idOfPreviousHotspot !== undefined && availableHotspots[idOfPreviousHotspot])) !== null && _c !== void 0 ? _c : false;
+    const nextHotspotIsAvailable = (_d = (idOfNextHotspot !== undefined && availableHotspots[idOfNextHotspot])) !== null && _d !== void 0 ? _d : false;
+    const getContentForId = useCallback((id, direction) => {
         if (currentTutorial === null || currentTutorial === void 0 ? void 0 : currentTutorial.completed) {
             return null;
         }
-        var globalStepIndex = id2index[id];
+        const globalStepIndex = id2index[id];
         if (globalStepIndex === undefined) {
             // This hotspot is not used in the current tutorial.
             return null;
         }
         if (!task || !step || !open || id !== currentId) {
-            var _a = getStepInfo(annotations, globalStepIndex), currentTask = _a.task, currentStepIndex_1 = _a.localIndex;
-            return (React.createElement(ClosedAnnotation, { globalStepIndex: globalStepIndex, i18nStrings: i18nStrings, onOpen: onOpen, focusOnRender: id === currentId, totalLocalSteps: currentTask ? currentTask.steps.length : 0, taskLocalStepIndex: currentStepIndex_1 }));
+            const { task: currentTask, localIndex: currentStepIndex } = getStepInfo(annotations, globalStepIndex);
+            return (React.createElement(ClosedAnnotation, { globalStepIndex: globalStepIndex, i18nStrings: i18nStrings, onOpen: onOpen, focusOnRender: id === currentId, totalLocalSteps: currentTask ? currentTask.steps.length : 0, taskLocalStepIndex: currentStepIndex }));
         }
         return (React.createElement(OpenAnnotation, { i18nStrings: i18nStrings, direction: direction, title: i18nStrings.taskTitle(taskIndex, task.title), content: step.content, alert: step.warningAlert, showPreviousButton: currentStepIndex !== 0, showFinishButton: currentStepIndex + 1 === totalStepCount, taskLocalStepIndex: localIndex, totalLocalSteps: task.steps.length, nextButtonEnabled: nextHotspotIsAvailable, onNextButtonClick: openNextStep, onFinish: onFinish, previousButtonEnabled: previousHotspotIsAvailable, onPreviousButtonClick: openPreviousStep, onDismiss: onDismiss }));
     }, [
@@ -149,8 +144,7 @@ export default function AnnotationContext(_a) {
         onOpen,
         annotations,
     ]);
-    var registerHotspot = useCallback(function (id) {
-        var _a;
+    const registerHotspot = useCallback((id) => {
         if (!id2index || id2index[id] === undefined) {
             // This hotspot is not used in the current tutorial.
             return;
@@ -160,19 +154,18 @@ export default function AnnotationContext(_a) {
           need to update the availableHotspotsRef BEFORE the setAvailableHotspots calls, since
           they will be batched and delayed until after the useEffects are run.
         */
-        availableHotspotsRef.current = __assign(__assign({}, availableHotspotsRef.current), (_a = {}, _a[id] = true, _a));
-        setAvailableHotspots(function (availableHotspots) {
-            var _a;
+        availableHotspotsRef.current = Object.assign(Object.assign({}, availableHotspotsRef.current), { [id]: true });
+        setAvailableHotspots(availableHotspots => {
             if (availableHotspots[id]) {
                 return availableHotspots;
             }
-            return __assign(__assign({}, availableHotspots), (_a = {}, _a[id] = true, _a));
+            return Object.assign(Object.assign({}, availableHotspots), { [id]: true });
         });
     }, 
     // We need to react on id2index changes for registering new hotspots when the map changes.
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [id2index]);
-    var unregisterHotspot = useCallback(function (id) {
+    const unregisterHotspot = useCallback((id) => {
         if (!availableHotspotsRef.current[id]) {
             // Prevents unnecessary re-renders.
             return;
@@ -183,28 +176,28 @@ export default function AnnotationContext(_a) {
           they will be batched and delayed until after the useEffects are run.
         */
         availableHotspotsRef.current = removeKey(id, availableHotspotsRef.current);
-        setAvailableHotspots(function (availableHotspots) {
+        setAvailableHotspots(availableHotspots => {
             if (!availableHotspots[id]) {
                 return availableHotspots;
             }
             return removeKey(id, availableHotspots);
         });
     }, []);
-    var context = {
-        getContentForId: getContentForId,
-        registerHotspot: registerHotspot,
-        unregisterHotspot: unregisterHotspot,
-        onStartTutorial: onStartTutorial,
-        onExitTutorial: onExitTutorial,
-        currentStepIndex: currentStepIndex,
-        currentTutorial: currentTutorial
+    const context = {
+        getContentForId,
+        registerHotspot,
+        unregisterHotspot,
+        onStartTutorial,
+        onExitTutorial,
+        currentStepIndex,
+        currentTutorial,
     };
     return React.createElement(hotspotContext.Provider, { value: context }, children);
 }
 applyDisplayName(AnnotationContext, 'AnnotationContext');
 function removeKey(key, object) {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    var _a = object, _b = key, _ = _a[_b], remainingObject = __rest(_a, [typeof _b === "symbol" ? _b : _b + ""]);
+    const _a = object, _b = key, _ = _a[_b], remainingObject = __rest(_a, [typeof _b === "symbol" ? _b : _b + ""]);
     return remainingObject;
 }
 //# sourceMappingURL=index.js.map

package/annotation-context/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/annotation-context/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { OpenAnnotation } from './annotation/open-annotation';\nimport { ClosedAnnotation } from './annotation/closed-annotation';\nimport { AnnotationContextProps } from './interfaces';\nimport { HotspotContext, hotspotContext } from './context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { HotspotProps } from '../hotspot/interfaces';\nimport { useTelemetry } from '../internal/hooks/use-telemetry';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\n\nexport { AnnotationContextProps };\n\nexport function getStepInfo(annotations: readonly AnnotationContextProps.Task[], index: number) {\n  if (index >= 0) {\n    let taskIndex = 0;\n    for (const task of annotations) {\n      if (task.steps.length <= index) {\n        index -= task.steps.length;\n        taskIndex++;\n        continue;\n      }\n      return { task, step: task.steps[index], localIndex: index, taskIndex };\n    }\n  }\n  return { task: undefined, step: undefined, localIndex: 0, taskIndex: 0 };\n}\n\n// constant empty array to keep hook dependency stable\nconst emptyTasks: ReadonlyArray<AnnotationContextProps.Task> = [];\n\nexport default function AnnotationContext({\n  currentTutorial,\n  children,\n  onStepChange,\n  onFinish: onFinishHandler,\n  onStartTutorial,\n  onExitTutorial,\n  i18nStrings,\n}: AnnotationContextProps): JSX.Element {\n  useTelemetry('AnnotationContext');\n\n  const [open, setOpen] = useState(true);\n\n  const [currentStepIndex, setCurrentStepIndex] = useState(0);\n  useEffect(() => {\n    // When a tutorial is started, we reset the progress to the first step.\n    setCurrentStepIndex(0);\n    setOpen(true);\n  }, [currentTutorial, setOpen]);\n\n  const [availableHotspots, setAvailableHotspots] = useState<Record<string, true | undefined>>({});\n  // availableHotspots is mirrored in this ref to prevent endless loops\n  // in between registerHotspot and unregisterHotspot callbacks.\n  const availableHotspotsRef = useRef<Record<string, true | undefined>>(availableHotspots);\n\n  const annotations = currentTutorial ? currentTutorial.tasks : emptyTasks;\n  const { task, step, localIndex, taskIndex } = getStepInfo(annotations, currentStepIndex);\n  const currentId = step?.hotspotId;\n  const totalStepCount = annotations.map(a => a.steps.length).reduce((a, b) => a + b, 0);\n\n  const id2index = useMemo(() => {\n    const mapping: Record<string, number> = {};\n\n    let counter = 0;\n    for (const annotation of annotations) {\n      for (const step of annotation.steps) {\n        if (mapping[step.hotspotId] === undefined) {\n          mapping[step.hotspotId] = counter;\n        }\n        counter++;\n      }\n    }\n\n    return mapping;\n  }, [annotations]);\n\n  const openNextStep = useCallback(() => {\n    const newStepIndex = Math.min(currentStepIndex + 1, totalStepCount);\n    setCurrentStepIndex(newStepIndex);\n    fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'next' });\n  }, [currentStepIndex, onStepChange, totalStepCount]);\n\n  const openPreviousStep = useCallback(() => {\n    const newStepIndex = Math.max(currentStepIndex - 1, 0);\n    setCurrentStepIndex(newStepIndex);\n    fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'previous' });\n  }, [onStepChange, currentStepIndex]);\n\n  const onFinish = useCallback(() => fireNonCancelableEvent(onFinishHandler), [onFinishHandler]);\n\n  /**\n   * If the currently open hotspot disappears from the page (e.g. because of a react-router navigation),\n   * this Effect detects the nearest available hotspot and changes to it. This allows us to e.g. automatically\n   * advance to the first step on the new page (or the last step on the previous page, in case the user\n   * navigates back).\n   */\n  const isCurrentHotspotAvailable = currentId ? availableHotspots[currentId] : null;\n  useEffect(() => {\n    if (!currentId || availableHotspotsRef.current[currentId]) {\n      return;\n    }\n\n    const findNearestHotspot = () => {\n      let nearestHotspot: string | undefined = undefined;\n      let nearestDistance = Infinity;\n      for (const hotspotId of Object.keys(availableHotspotsRef.current)) {\n        const distanceFromCurrentHotspot = Math.abs(id2index[hotspotId] - currentStepIndex);\n        if (distanceFromCurrentHotspot < nearestDistance) {\n          nearestDistance = distanceFromCurrentHotspot;\n          nearestHotspot = hotspotId;\n        }\n      }\n      return nearestHotspot;\n    };\n\n    const nearestHotspot = findNearestHotspot();\n    if (nearestHotspot) {\n      const newStepIndex = id2index[nearestHotspot];\n      setCurrentStepIndex(newStepIndex);\n      setOpen(true);\n      fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'auto-fallback' });\n    }\n  }, [annotations, isCurrentHotspotAvailable, currentId, currentStepIndex, id2index, onStepChange]);\n\n  const onDismiss = useCallback(() => {\n    setOpen(false);\n  }, [setOpen]);\n\n  const onOpen = useCallback(\n    (stepIndex: number) => {\n      setCurrentStepIndex(stepIndex);\n      fireNonCancelableEvent(onStepChange, { step: stepIndex, reason: 'open' });\n      setOpen(true);\n    },\n    [onStepChange, setOpen]\n  );\n\n  const idOfPreviousHotspot = getStepInfo(annotations, currentStepIndex - 1).step?.hotspotId;\n  const idOfNextHotspot = getStepInfo(annotations, currentStepIndex + 1).step?.hotspotId;\n  const previousHotspotIsAvailable =\n    (idOfPreviousHotspot !== undefined && availableHotspots[idOfPreviousHotspot]) ?? false;\n  const nextHotspotIsAvailable = (idOfNextHotspot !== undefined && availableHotspots[idOfNextHotspot]) ?? false;\n\n  const getContentForId = useCallback(\n    (id: string, direction: HotspotProps['direction']) => {\n      if (currentTutorial?.completed) {\n        return null;\n      }\n\n      const globalStepIndex = id2index[id];\n      if (globalStepIndex === undefined) {\n        // This hotspot is not used in the current tutorial.\n        return null;\n      }\n\n      if (!task || !step || !open || id !== currentId) {\n        const { task: currentTask, localIndex: currentStepIndex } = getStepInfo(annotations, globalStepIndex);\n        return (\n          <ClosedAnnotation\n            globalStepIndex={globalStepIndex}\n            i18nStrings={i18nStrings}\n            onOpen={onOpen}\n            focusOnRender={id === currentId}\n            totalLocalSteps={currentTask ? currentTask.steps.length : 0}\n            taskLocalStepIndex={currentStepIndex}\n          />\n        );\n      }\n\n      return (\n        <OpenAnnotation\n          i18nStrings={i18nStrings}\n          direction={direction}\n          title={i18nStrings.taskTitle(taskIndex, task.title)}\n          content={step.content}\n          alert={step.warningAlert}\n          showPreviousButton={currentStepIndex !== 0}\n          showFinishButton={currentStepIndex + 1 === totalStepCount}\n          taskLocalStepIndex={localIndex}\n          totalLocalSteps={task.steps.length}\n          nextButtonEnabled={nextHotspotIsAvailable}\n          onNextButtonClick={openNextStep}\n          onFinish={onFinish}\n          previousButtonEnabled={previousHotspotIsAvailable}\n          onPreviousButtonClick={openPreviousStep}\n          onDismiss={onDismiss}\n        />\n      );\n    },\n    [\n      id2index,\n      currentTutorial,\n      task,\n      step,\n      open,\n      currentId,\n      currentStepIndex,\n      i18nStrings,\n      taskIndex,\n      localIndex,\n      totalStepCount,\n      nextHotspotIsAvailable,\n      openNextStep,\n      onFinish,\n      previousHotspotIsAvailable,\n      openPreviousStep,\n      onDismiss,\n      onOpen,\n      annotations,\n    ]\n  );\n\n  const registerHotspot = useCallback(\n    (id: string) => {\n      if (!id2index || id2index[id] === undefined) {\n        // This hotspot is not used in the current tutorial.\n        return;\n      }\n\n      /*\n        To ensure that all hotspots are immediately known to all triggered useEffects, we\n        need to update the availableHotspotsRef BEFORE the setAvailableHotspots calls, since\n        they will be batched and delayed until after the useEffects are run.\n      */\n      availableHotspotsRef.current = { ...availableHotspotsRef.current, [id]: true } as const;\n\n      setAvailableHotspots(availableHotspots => {\n        if (availableHotspots[id]) {\n          return availableHotspots;\n        }\n\n        return { ...availableHotspots, [id]: true } as const;\n      });\n    },\n    // We need to react on id2index changes for registering new hotspots when the map changes.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [id2index]\n  );\n\n  const unregisterHotspot = useCallback((id: string) => {\n    if (!availableHotspotsRef.current[id]) {\n      // Prevents unnecessary re-renders.\n      return;\n    }\n\n    /*\n      To ensure that all hotspots are immediately known to all triggered useEffects, we\n      need to update the availableHotspotsRef BEFORE the setAvailableHotspots calls, since\n      they will be batched and delayed until after the useEffects are run.\n    */\n    availableHotspotsRef.current = removeKey(id, availableHotspotsRef.current);\n\n    setAvailableHotspots(availableHotspots => {\n      if (!availableHotspots[id]) {\n        return availableHotspots;\n      }\n\n      return removeKey(id, availableHotspots);\n    });\n  }, []);\n\n  const context: HotspotContext = {\n    getContentForId,\n    registerHotspot,\n    unregisterHotspot,\n    onStartTutorial,\n    onExitTutorial,\n    currentStepIndex,\n    currentTutorial,\n  };\n\n  return <hotspotContext.Provider value={context}>{children}</hotspotContext.Provider>;\n}\n\napplyDisplayName(AnnotationContext, 'AnnotationContext');\n\nfunction removeKey<T extends Record<string, any>>(key: keyof T, object: T) {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { [key]: _, ...remainingObject } = object;\n  return remainingObject;\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/annotation-context/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { OpenAnnotation } from './annotation/open-annotation';\nimport { ClosedAnnotation } from './annotation/closed-annotation';\nimport { AnnotationContextProps } from './interfaces';\nimport { HotspotContext, hotspotContext } from './context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { HotspotProps } from '../hotspot/interfaces';\nimport { useTelemetry } from '../internal/hooks/use-telemetry';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\n\nexport { AnnotationContextProps };\n\nexport function getStepInfo(annotations: readonly AnnotationContextProps.Task[], index: number) {\n  if (index >= 0) {\n    let taskIndex = 0;\n    for (const task of annotations) {\n      if (task.steps.length <= index) {\n        index -= task.steps.length;\n        taskIndex++;\n        continue;\n      }\n      return { task, step: task.steps[index], localIndex: index, taskIndex };\n    }\n  }\n  return { task: undefined, step: undefined, localIndex: 0, taskIndex: 0 };\n}\n\n// constant empty array to keep hook dependency stable\nconst emptyTasks: ReadonlyArray<AnnotationContextProps.Task> = [];\n\nexport default function AnnotationContext({\n  currentTutorial,\n  children,\n  onStepChange,\n  onFinish: onFinishHandler,\n  onStartTutorial,\n  onExitTutorial,\n  i18nStrings,\n}: AnnotationContextProps): JSX.Element {\n  useTelemetry('AnnotationContext');\n\n  const [open, setOpen] = useState(true);\n\n  const [currentStepIndex, setCurrentStepIndex] = useState(0);\n  useEffect(() => {\n    // When a tutorial is started, we reset the progress to the first step.\n    setCurrentStepIndex(0);\n    setOpen(true);\n  }, [currentTutorial, setOpen]);\n\n  const [availableHotspots, setAvailableHotspots] = useState<Record<string, true | undefined>>({});\n  // availableHotspots is mirrored in this ref to prevent endless loops\n  // in between registerHotspot and unregisterHotspot callbacks.\n  const availableHotspotsRef = useRef<Record<string, true | undefined>>(availableHotspots);\n\n  const annotations = currentTutorial ? currentTutorial.tasks : emptyTasks;\n  const { task, step, localIndex, taskIndex } = getStepInfo(annotations, currentStepIndex);\n  const currentId = step?.hotspotId;\n  const totalStepCount = annotations.map(a => a.steps.length).reduce((a, b) => a + b, 0);\n\n  const id2index = useMemo(() => {\n    const mapping: Record<string, number> = {};\n\n    let counter = 0;\n    for (const annotation of annotations) {\n      for (const step of annotation.steps) {\n        if (mapping[step.hotspotId] === undefined) {\n          mapping[step.hotspotId] = counter;\n        }\n        counter++;\n      }\n    }\n\n    return mapping;\n  }, [annotations]);\n\n  const openNextStep = useCallback(() => {\n    const newStepIndex = Math.min(currentStepIndex + 1, totalStepCount);\n    setCurrentStepIndex(newStepIndex);\n    fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'next' });\n  }, [currentStepIndex, onStepChange, totalStepCount]);\n\n  const openPreviousStep = useCallback(() => {\n    const newStepIndex = Math.max(currentStepIndex - 1, 0);\n    setCurrentStepIndex(newStepIndex);\n    fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'previous' });\n  }, [onStepChange, currentStepIndex]);\n\n  const onFinish = useCallback(() => fireNonCancelableEvent(onFinishHandler), [onFinishHandler]);\n\n  /**\n   * If the currently open hotspot disappears from the page (e.g. because of a react-router navigation),\n   * this Effect detects the nearest available hotspot and changes to it. This allows us to e.g. automatically\n   * advance to the first step on the new page (or the last step on the previous page, in case the user\n   * navigates back).\n   */\n  const isCurrentHotspotAvailable = currentId ? availableHotspots[currentId] : null;\n  useEffect(() => {\n    if (!currentId || availableHotspotsRef.current[currentId]) {\n      return;\n    }\n\n    const findNearestHotspot = () => {\n      let nearestHotspot: string | undefined = undefined;\n      let nearestDistance = Infinity;\n      for (const hotspotId of Object.keys(availableHotspotsRef.current)) {\n        const distanceFromCurrentHotspot = Math.abs(id2index[hotspotId] - currentStepIndex);\n        if (distanceFromCurrentHotspot < nearestDistance) {\n          nearestDistance = distanceFromCurrentHotspot;\n          nearestHotspot = hotspotId;\n        }\n      }\n      return nearestHotspot;\n    };\n\n    const nearestHotspot = findNearestHotspot();\n    if (nearestHotspot) {\n      const newStepIndex = id2index[nearestHotspot];\n      setCurrentStepIndex(newStepIndex);\n      setOpen(true);\n      fireNonCancelableEvent(onStepChange, { step: newStepIndex, reason: 'auto-fallback' });\n    }\n  }, [annotations, isCurrentHotspotAvailable, currentId, currentStepIndex, id2index, onStepChange]);\n\n  const onDismiss = useCallback(() => {\n    setOpen(false);\n  }, [setOpen]);\n\n  const onOpen = useCallback(\n    (stepIndex: number) => {\n      setCurrentStepIndex(stepIndex);\n      fireNonCancelableEvent(onStepChange, { step: stepIndex, reason: 'open' });\n      setOpen(true);\n    },\n    [onStepChange, setOpen]\n  );\n\n  const idOfPreviousHotspot = getStepInfo(annotations, currentStepIndex - 1).step?.hotspotId;\n  const idOfNextHotspot = getStepInfo(annotations, currentStepIndex + 1).step?.hotspotId;\n  const previousHotspotIsAvailable =\n    (idOfPreviousHotspot !== undefined && availableHotspots[idOfPreviousHotspot]) ?? false;\n  const nextHotspotIsAvailable = (idOfNextHotspot !== undefined && availableHotspots[idOfNextHotspot]) ?? false;\n\n  const getContentForId = useCallback(\n    (id: string, direction: HotspotProps['direction']) => {\n      if (currentTutorial?.completed) {\n        return null;\n      }\n\n      const globalStepIndex = id2index[id];\n      if (globalStepIndex === undefined) {\n        // This hotspot is not used in the current tutorial.\n        return null;\n      }\n\n      if (!task || !step || !open || id !== currentId) {\n        const { task: currentTask, localIndex: currentStepIndex } = getStepInfo(annotations, globalStepIndex);\n        return (\n          <ClosedAnnotation\n            globalStepIndex={globalStepIndex}\n            i18nStrings={i18nStrings}\n            onOpen={onOpen}\n            focusOnRender={id === currentId}\n            totalLocalSteps={currentTask ? currentTask.steps.length : 0}\n            taskLocalStepIndex={currentStepIndex}\n          />\n        );\n      }\n\n      return (\n        <OpenAnnotation\n          i18nStrings={i18nStrings}\n          direction={direction}\n          title={i18nStrings.taskTitle(taskIndex, task.title)}\n          content={step.content}\n          alert={step.warningAlert}\n          showPreviousButton={currentStepIndex !== 0}\n          showFinishButton={currentStepIndex + 1 === totalStepCount}\n          taskLocalStepIndex={localIndex}\n          totalLocalSteps={task.steps.length}\n          nextButtonEnabled={nextHotspotIsAvailable}\n          onNextButtonClick={openNextStep}\n          onFinish={onFinish}\n          previousButtonEnabled={previousHotspotIsAvailable}\n          onPreviousButtonClick={openPreviousStep}\n          onDismiss={onDismiss}\n        />\n      );\n    },\n    [\n      id2index,\n      currentTutorial,\n      task,\n      step,\n      open,\n      currentId,\n      currentStepIndex,\n      i18nStrings,\n      taskIndex,\n      localIndex,\n      totalStepCount,\n      nextHotspotIsAvailable,\n      openNextStep,\n      onFinish,\n      previousHotspotIsAvailable,\n      openPreviousStep,\n      onDismiss,\n      onOpen,\n      annotations,\n    ]\n  );\n\n  const registerHotspot = useCallback(\n    (id: string) => {\n      if (!id2index || id2index[id] === undefined) {\n        // This hotspot is not used in the current tutorial.\n        return;\n      }\n\n      /*\n        To ensure that all hotspots are immediately known to all triggered useEffects, we\n        need to update the availableHotspotsRef BEFORE the setAvailableHotspots calls, since\n        they will be batched and delayed until after the useEffects are run.\n      */\n      availableHotspotsRef.current = { ...availableHotspotsRef.current, [id]: true } as const;\n\n      setAvailableHotspots(availableHotspots => {\n        if (availableHotspots[id]) {\n          return availableHotspots;\n        }\n\n        return { ...availableHotspots, [id]: true } as const;\n      });\n    },\n    // We need to react on id2index changes for registering new hotspots when the map changes.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [id2index]\n  );\n\n  const unregisterHotspot = useCallback((id: string) => {\n    if (!availableHotspotsRef.current[id]) {\n      // Prevents unnecessary re-renders.\n      return;\n    }\n\n    /*\n      To ensure that all hotspots are immediately known to all triggered useEffects, we\n      need to update the availableHotspotsRef BEFORE the setAvailableHotspots calls, since\n      they will be batched and delayed until after the useEffects are run.\n    */\n    availableHotspotsRef.current = removeKey(id, availableHotspotsRef.current);\n\n    setAvailableHotspots(availableHotspots => {\n      if (!availableHotspots[id]) {\n        return availableHotspots;\n      }\n\n      return removeKey(id, availableHotspots);\n    });\n  }, []);\n\n  const context: HotspotContext = {\n    getContentForId,\n    registerHotspot,\n    unregisterHotspot,\n    onStartTutorial,\n    onExitTutorial,\n    currentStepIndex,\n    currentTutorial,\n  };\n\n  return <hotspotContext.Provider value={context}>{children}</hotspotContext.Provider>;\n}\n\napplyDisplayName(AnnotationContext, 'AnnotationContext');\n\nfunction removeKey<T extends Record<string, any>>(key: keyof T, object: T) {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { [key]: _, ...remainingObject } = object;\n  return remainingObject;\n}\n"]}

package/app-layout/content-wrapper/index.js

@@ -3,12 +3,11 @@
 import clsx from 'clsx';
 import React from 'react';
 import styles from './styles.css.js';
-var ContentWrapper = React.forwardRef(function (_a, ref) {
-    var className = _a.className, contentType = _a.contentType, children = _a.children, toolsPadding = _a.toolsPadding, disablePaddings = _a.disablePaddings, navigationPadding = _a.navigationPadding, isMobile = _a.isMobile, contentWidthStyles = _a.contentWidthStyles;
+const ContentWrapper = React.forwardRef(({ className, contentType, children, toolsPadding, disablePaddings, navigationPadding, isMobile, contentWidthStyles, }, ref) => {
     if (disablePaddings) {
         return (React.createElement("div", { className: className, ref: ref }, children));
     }
-    return (React.createElement("div", { ref: ref, className: clsx(className, styles['content-wrapper'], styles["content-type-".concat(contentType)], !navigationPadding && styles['content-wrapper-no-navigation-padding'], !toolsPadding && styles['content-wrapper-no-tools-padding'], isMobile && styles['content-wrapper-mobile']), style: contentWidthStyles }, children));
+    return (React.createElement("div", { ref: ref, className: clsx(className, styles['content-wrapper'], styles[`content-type-${contentType}`], !navigationPadding && styles['content-wrapper-no-navigation-padding'], !toolsPadding && styles['content-wrapper-no-tools-padding'], isMobile && styles['content-wrapper-mobile']), style: contentWidthStyles }, children));
 });
 export default ContentWrapper;
 //# sourceMappingURL=index.js.map

package/app-layout/content-wrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/content-wrapper/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAcrC,IAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CACrC,UACE,EASsB,EACtB,GAA8B;QAT5B,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,QAAQ,cAAA,EACR,YAAY,kBAAA,EACZ,eAAe,qBAAA,EACf,iBAAiB,uBAAA,EACjB,QAAQ,cAAA,EACR,kBAAkB,wBAAA;IAIpB,IAAI,eAAe,EAAE;QACnB,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAChC,QAAQ,CACL,CACP,CAAC;KACH;IACD,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CACb,SAAS,EACT,MAAM,CAAC,iBAAiB,CAAC,EACzB,MAAM,CAAC,uBAAgB,WAAW,CAAE,CAAC,EACrC,CAAC,iBAAiB,IAAI,MAAM,CAAC,uCAAuC,CAAC,EACrE,CAAC,YAAY,IAAI,MAAM,CAAC,kCAAkC,CAAC,EAC3D,QAAQ,IAAI,MAAM,CAAC,wBAAwB,CAAC,CAC7C,EACD,KAAK,EAAE,kBAAkB,IAExB,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport styles from './styles.css.js';\nimport { AppLayoutProps } from '../interfaces';\n\nexport interface ContentWrapperProps {\n  className?: string;\n  contentType: AppLayoutProps.ContentType;\n  children?: React.ReactNode;\n  isMobile: boolean;\n  navigationPadding: boolean;\n  toolsPadding: boolean;\n  disablePaddings?: boolean;\n  contentWidthStyles?: React.CSSProperties;\n}\n\nconst ContentWrapper = React.forwardRef(\n  (\n    {\n      className,\n      contentType,\n      children,\n      toolsPadding,\n      disablePaddings,\n      navigationPadding,\n      isMobile,\n      contentWidthStyles,\n    }: ContentWrapperProps,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    if (disablePaddings) {\n      return (\n        <div className={className} ref={ref}>\n          {children}\n        </div>\n      );\n    }\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          className,\n          styles['content-wrapper'],\n          styles[`content-type-${contentType}`],\n          !navigationPadding && styles['content-wrapper-no-navigation-padding'],\n          !toolsPadding && styles['content-wrapper-no-tools-padding'],\n          isMobile && styles['content-wrapper-mobile']\n        )}\n        style={contentWidthStyles}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n\nexport default ContentWrapper;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/app-layout/content-wrapper/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAcrC,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,CACrC,CACE,EACE,SAAS,EACT,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,eAAe,EACf,iBAAiB,EACjB,QAAQ,EACR,kBAAkB,GACE,EACtB,GAA8B,EAC9B,EAAE;IACF,IAAI,eAAe,EAAE;QACnB,OAAO,CACL,6BAAK,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,IAChC,QAAQ,CACL,CACP,CAAC;KACH;IACD,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CACb,SAAS,EACT,MAAM,CAAC,iBAAiB,CAAC,EACzB,MAAM,CAAC,gBAAgB,WAAW,EAAE,CAAC,EACrC,CAAC,iBAAiB,IAAI,MAAM,CAAC,uCAAuC,CAAC,EACrE,CAAC,YAAY,IAAI,MAAM,CAAC,kCAAkC,CAAC,EAC3D,QAAQ,IAAI,MAAM,CAAC,wBAAwB,CAAC,CAC7C,EACD,KAAK,EAAE,kBAAkB,IAExB,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport styles from './styles.css.js';\nimport { AppLayoutProps } from '../interfaces';\n\nexport interface ContentWrapperProps {\n  className?: string;\n  contentType: AppLayoutProps.ContentType;\n  children?: React.ReactNode;\n  isMobile: boolean;\n  navigationPadding: boolean;\n  toolsPadding: boolean;\n  disablePaddings?: boolean;\n  contentWidthStyles?: React.CSSProperties;\n}\n\nconst ContentWrapper = React.forwardRef(\n  (\n    {\n      className,\n      contentType,\n      children,\n      toolsPadding,\n      disablePaddings,\n      navigationPadding,\n      isMobile,\n      contentWidthStyles,\n    }: ContentWrapperProps,\n    ref: React.Ref<HTMLDivElement>\n  ) => {\n    if (disablePaddings) {\n      return (\n        <div className={className} ref={ref}>\n          {children}\n        </div>\n      );\n    }\n    return (\n      <div\n        ref={ref}\n        className={clsx(\n          className,\n          styles['content-wrapper'],\n          styles[`content-type-${contentType}`],\n          !navigationPadding && styles['content-wrapper-no-navigation-padding'],\n          !toolsPadding && styles['content-wrapper-no-tools-padding'],\n          isMobile && styles['content-wrapper-mobile']\n        )}\n        style={contentWidthStyles}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n\nexport default ContentWrapper;\n"]}

package/app-layout/defaults.js

@@ -1,42 +1,41 @@
-import { __assign } from "tslib";
-var defaultContentTypeState = {
+const defaultContentTypeState = {
     navigationOpen: true,
     minContentWidth: 280,
-    maxContentWidth: undefined
+    maxContentWidth: undefined,
 };
-var defaults = {
-    "default": __assign({}, defaultContentTypeState),
-    dashboard: __assign({}, defaultContentTypeState),
+const defaults = {
+    default: Object.assign({}, defaultContentTypeState),
+    dashboard: Object.assign({}, defaultContentTypeState),
     cards: {
         navigationOpen: true,
         minContentWidth: 280,
-        maxContentWidth: undefined
+        maxContentWidth: undefined,
     },
     form: {
         navigationOpen: false,
         minContentWidth: 280,
-        maxContentWidth: 800
+        maxContentWidth: 800,
     },
     table: {
         navigationOpen: true,
         minContentWidth: 280,
-        maxContentWidth: undefined
+        maxContentWidth: undefined,
     },
     wizard: {
         navigationOpen: false,
         minContentWidth: 280,
-        maxContentWidth: 1080
-    }
+        maxContentWidth: 1080,
+    },
 };
 export function applyDefaults(contentType, stateFromProps, isRefresh) {
     var _a, _b, _c, _d;
-    var contentTypeDefaults = isRefresh
-        ? __assign(__assign({}, defaults[contentType]), { maxContentWidth: undefined }) : defaults[contentType];
+    const contentTypeDefaults = isRefresh
+        ? Object.assign(Object.assign({}, defaults[contentType]), { maxContentWidth: undefined }) : defaults[contentType];
     return {
         maxContentWidth: (_a = stateFromProps.maxContentWidth) !== null && _a !== void 0 ? _a : contentTypeDefaults.maxContentWidth,
         minContentWidth: (_b = stateFromProps.minContentWidth) !== null && _b !== void 0 ? _b : contentTypeDefaults.minContentWidth,
         navigationOpen: (_c = stateFromProps.navigationOpen) !== null && _c !== void 0 ? _c : contentTypeDefaults.navigationOpen,
-        toolsOpen: (_d = stateFromProps.toolsOpen) !== null && _d !== void 0 ? _d : contentTypeDefaults.toolsOpen
+        toolsOpen: (_d = stateFromProps.toolsOpen) !== null && _d !== void 0 ? _d : contentTypeDefaults.toolsOpen,
     };
 }
 //# sourceMappingURL=defaults.js.map

package/app-layout/defaults.js.map

@@ -1 +1 @@
-{"version":3,"file":"defaults.js","sourceRoot":"","sources":["../../../src/app-layout/defaults.ts"],"names":[],"mappings":";AAIA,IAAM,uBAAuB,GAAmB;IAC9C,cAAc,EAAE,IAAI;IACpB,eAAe,EAAE,GAAG;IACpB,eAAe,EAAE,SAAS;CAC3B,CAAC;AAEF,IAAM,QAAQ,GAAuD;IACnE,SAAO,eACF,uBAAuB,CAC3B;IACD,SAAS,eACJ,uBAAuB,CAC3B;IACD,KAAK,EAAE;QACL,cAAc,EAAE,IAAI;QACpB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,SAAS;KAC3B;IACD,IAAI,EAAE;QACJ,cAAc,EAAE,KAAK;QACrB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,GAAG;KACrB;IACD,KAAK,EAAE;QACL,cAAc,EAAE,IAAI;QACpB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,SAAS;KAC3B;IACD,MAAM,EAAE;QACN,cAAc,EAAE,KAAK;QACrB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,IAAI;KACtB;CACF,CAAC;AASF,MAAM,UAAU,aAAa,CAC3B,WAAuC,EACvC,cAA8B,EAC9B,SAAkB;;IAElB,IAAM,mBAAmB,GAAG,SAAS;QACnC,CAAC,uBAAM,QAAQ,CAAC,WAAW,CAAC,KAAE,eAAe,EAAE,SAAS,IACxD,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;IAE1B,OAAO;QACL,eAAe,EAAE,MAAA,cAAc,CAAC,eAAe,mCAAI,mBAAmB,CAAC,eAAe;QACtF,eAAe,EAAE,MAAA,cAAc,CAAC,eAAe,mCAAI,mBAAmB,CAAC,eAAe;QACtF,cAAc,EAAE,MAAA,cAAc,CAAC,cAAc,mCAAI,mBAAmB,CAAC,cAAc;QACnF,SAAS,EAAE,MAAA,cAAc,CAAC,SAAS,mCAAI,mBAAmB,CAAC,SAAS;KACrE,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { AppLayoutProps } from './interfaces';\n\nconst defaultContentTypeState: AppLayoutState = {\n  navigationOpen: true,\n  minContentWidth: 280,\n  maxContentWidth: undefined,\n};\n\nconst defaults: Record<AppLayoutProps.ContentType, AppLayoutState> = {\n  default: {\n    ...defaultContentTypeState,\n  },\n  dashboard: {\n    ...defaultContentTypeState,\n  },\n  cards: {\n    navigationOpen: true,\n    minContentWidth: 280,\n    maxContentWidth: undefined,\n  },\n  form: {\n    navigationOpen: false,\n    minContentWidth: 280,\n    maxContentWidth: 800,\n  },\n  table: {\n    navigationOpen: true,\n    minContentWidth: 280,\n    maxContentWidth: undefined,\n  },\n  wizard: {\n    navigationOpen: false,\n    minContentWidth: 280,\n    maxContentWidth: 1080,\n  },\n};\n\ninterface AppLayoutState {\n  navigationOpen?: boolean;\n  toolsOpen?: boolean;\n  minContentWidth?: number;\n  maxContentWidth?: number | undefined;\n}\n\nexport function applyDefaults(\n  contentType: AppLayoutProps.ContentType,\n  stateFromProps: AppLayoutState,\n  isRefresh: boolean\n): AppLayoutState {\n  const contentTypeDefaults = isRefresh\n    ? { ...defaults[contentType], maxContentWidth: undefined }\n    : defaults[contentType];\n\n  return {\n    maxContentWidth: stateFromProps.maxContentWidth ?? contentTypeDefaults.maxContentWidth,\n    minContentWidth: stateFromProps.minContentWidth ?? contentTypeDefaults.minContentWidth,\n    navigationOpen: stateFromProps.navigationOpen ?? contentTypeDefaults.navigationOpen,\n    toolsOpen: stateFromProps.toolsOpen ?? contentTypeDefaults.toolsOpen,\n  };\n}\n"]}
+{"version":3,"file":"defaults.js","sourceRoot":"","sources":["../../../src/app-layout/defaults.ts"],"names":[],"mappings":"AAIA,MAAM,uBAAuB,GAAmB;IAC9C,cAAc,EAAE,IAAI;IACpB,eAAe,EAAE,GAAG;IACpB,eAAe,EAAE,SAAS;CAC3B,CAAC;AAEF,MAAM,QAAQ,GAAuD;IACnE,OAAO,oBACF,uBAAuB,CAC3B;IACD,SAAS,oBACJ,uBAAuB,CAC3B;IACD,KAAK,EAAE;QACL,cAAc,EAAE,IAAI;QACpB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,SAAS;KAC3B;IACD,IAAI,EAAE;QACJ,cAAc,EAAE,KAAK;QACrB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,GAAG;KACrB;IACD,KAAK,EAAE;QACL,cAAc,EAAE,IAAI;QACpB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,SAAS;KAC3B;IACD,MAAM,EAAE;QACN,cAAc,EAAE,KAAK;QACrB,eAAe,EAAE,GAAG;QACpB,eAAe,EAAE,IAAI;KACtB;CACF,CAAC;AASF,MAAM,UAAU,aAAa,CAC3B,WAAuC,EACvC,cAA8B,EAC9B,SAAkB;;IAElB,MAAM,mBAAmB,GAAG,SAAS;QACnC,CAAC,iCAAM,QAAQ,CAAC,WAAW,CAAC,KAAE,eAAe,EAAE,SAAS,IACxD,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;IAE1B,OAAO;QACL,eAAe,EAAE,MAAA,cAAc,CAAC,eAAe,mCAAI,mBAAmB,CAAC,eAAe;QACtF,eAAe,EAAE,MAAA,cAAc,CAAC,eAAe,mCAAI,mBAAmB,CAAC,eAAe;QACtF,cAAc,EAAE,MAAA,cAAc,CAAC,cAAc,mCAAI,mBAAmB,CAAC,cAAc;QACnF,SAAS,EAAE,MAAA,cAAc,CAAC,SAAS,mCAAI,mBAAmB,CAAC,SAAS;KACrE,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { AppLayoutProps } from './interfaces';\n\nconst defaultContentTypeState: AppLayoutState = {\n  navigationOpen: true,\n  minContentWidth: 280,\n  maxContentWidth: undefined,\n};\n\nconst defaults: Record<AppLayoutProps.ContentType, AppLayoutState> = {\n  default: {\n    ...defaultContentTypeState,\n  },\n  dashboard: {\n    ...defaultContentTypeState,\n  },\n  cards: {\n    navigationOpen: true,\n    minContentWidth: 280,\n    maxContentWidth: undefined,\n  },\n  form: {\n    navigationOpen: false,\n    minContentWidth: 280,\n    maxContentWidth: 800,\n  },\n  table: {\n    navigationOpen: true,\n    minContentWidth: 280,\n    maxContentWidth: undefined,\n  },\n  wizard: {\n    navigationOpen: false,\n    minContentWidth: 280,\n    maxContentWidth: 1080,\n  },\n};\n\ninterface AppLayoutState {\n  navigationOpen?: boolean;\n  toolsOpen?: boolean;\n  minContentWidth?: number;\n  maxContentWidth?: number | undefined;\n}\n\nexport function applyDefaults(\n  contentType: AppLayoutProps.ContentType,\n  stateFromProps: AppLayoutState,\n  isRefresh: boolean\n): AppLayoutState {\n  const contentTypeDefaults = isRefresh\n    ? { ...defaults[contentType], maxContentWidth: undefined }\n    : defaults[contentType];\n\n  return {\n    maxContentWidth: stateFromProps.maxContentWidth ?? contentTypeDefaults.maxContentWidth,\n    minContentWidth: stateFromProps.minContentWidth ?? contentTypeDefaults.minContentWidth,\n    navigationOpen: stateFromProps.navigationOpen ?? contentTypeDefaults.navigationOpen,\n    toolsOpen: stateFromProps.toolsOpen ?? contentTypeDefaults.toolsOpen,\n  };\n}\n"]}

package/app-layout/drawer.js

@@ -20,28 +20,26 @@ import styles from './styles.css.js';
 // * https://github.com/nvaccess/nvda/issues/5825
 // * https://github.com/nvaccess/nvda/issues/5247
 // * https://github.com/nvaccess/nvda/pull/8869 (reverted PR that was going to fix it)
-export function Drawer(_a) {
-    var _b;
-    var contentClassName = _a.contentClassName, toggleClassName = _a.toggleClassName, closeClassName = _a.closeClassName, width = _a.width, type = _a.type, toggleRefs = _a.toggleRefs, topOffset = _a.topOffset, bottomOffset = _a.bottomOffset, ariaLabels = _a.ariaLabels, children = _a.children, isOpen = _a.isOpen, isMobile = _a.isMobile, onToggle = _a.onToggle, onClick = _a.onClick, onLoseFocus = _a.onLoseFocus;
-    var _c = togglesConfig[type], TagName = _c.TagName, iconName = _c.iconName, getLabels = _c.getLabels;
-    var _d = getLabels(ariaLabels), mainLabel = _d.mainLabel, closeLabel = _d.closeLabel, openLabel = _d.openLabel;
-    var drawerContentWidthOpen = isMobile ? undefined : width;
-    var drawerContentWidth = isOpen ? drawerContentWidthOpen : undefined;
-    var closeIconName = 'close';
-    var regularOpenButton = (React.createElement(TagName, { "aria-label": mainLabel, className: styles.toggle, "aria-hidden": isOpen },
-        React.createElement(AppLayoutButton, { ref: toggleRefs.toggle, className: toggleClassName, iconName: iconName, ariaLabel: openLabel, onClick: function () { return onToggle(true); }, ariaExpanded: false })));
-    return (React.createElement("div", { className: clsx(styles.drawer, (_b = {},
-            _b[styles['drawer-closed']] = !isOpen,
-            _b[styles['drawer-mobile']] = isMobile,
-            _b)), style: {
-            width: drawerContentWidth
+export function Drawer({ contentClassName, toggleClassName, closeClassName, width, type, toggleRefs, topOffset, bottomOffset, ariaLabels, children, isOpen, isMobile, onToggle, onClick, onLoseFocus, }) {
+    const { TagName, iconName, getLabels } = togglesConfig[type];
+    const { mainLabel, closeLabel, openLabel } = getLabels(ariaLabels);
+    const drawerContentWidthOpen = isMobile ? undefined : width;
+    const drawerContentWidth = isOpen ? drawerContentWidthOpen : undefined;
+    const closeIconName = 'close';
+    const regularOpenButton = (React.createElement(TagName, { "aria-label": mainLabel, className: styles.toggle, "aria-hidden": isOpen },
+        React.createElement(AppLayoutButton, { ref: toggleRefs.toggle, className: toggleClassName, iconName: iconName, ariaLabel: openLabel, onClick: () => onToggle(true), ariaExpanded: false })));
+    return (React.createElement("div", { className: clsx(styles.drawer, {
+            [styles['drawer-closed']]: !isOpen,
+            [styles['drawer-mobile']]: isMobile,
+        }), style: {
+            width: drawerContentWidth,
         }, onBlur: onLoseFocus
-            ? function (e) {
+            ? e => {
                 if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {
                     onLoseFocus(e);
                 }
             }
-            : undefined, onClick: function (event) {
+            : undefined, onClick: event => {
             if (onClick) {
                 onClick(event);
             }
@@ -55,7 +53,7 @@ export function Drawer(_a) {
         React.createElement("div", { style: { width: drawerContentWidth, top: topOffset, bottom: bottomOffset }, className: clsx(styles['drawer-content'], contentClassName) },
             !isMobile && regularOpenButton,
             React.createElement(TagName, { "aria-label": mainLabel, "aria-hidden": !isOpen },
-                React.createElement(CloseButton, { ref: toggleRefs.close, className: closeClassName, ariaLabel: closeLabel, onClick: function () { return onToggle(false); }, iconName: closeIconName }),
+                React.createElement(CloseButton, { ref: toggleRefs.close, className: closeClassName, ariaLabel: closeLabel, onClick: () => onToggle(false), iconName: closeIconName }),
                 children))));
 }
 //# sourceMappingURL=drawer.js.map

package/app-layout/drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../../src/app-layout/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { ButtonProps } from '../button/interfaces';\nimport { AppLayoutButton, CloseButton, togglesConfig } from './toggles';\nimport { AppLayoutProps } from './interfaces';\nimport styles from './styles.css.js';\n\nexport interface DesktopDrawerProps {\n  contentClassName?: string;\n  toggleClassName?: string;\n  closeClassName?: string;\n  toggleRefs: {\n    toggle: React.Ref<ButtonProps.Ref>;\n    close: React.Ref<ButtonProps.Ref>;\n  };\n  width: number;\n  topOffset?: number;\n  bottomOffset?: number;\n  ariaLabels?: AppLayoutProps.Labels;\n  children: React.ReactNode;\n  type: keyof typeof togglesConfig;\n  isMobile?: boolean;\n  isOpen?: boolean;\n  onToggle: (isOpen: boolean) => void;\n  onClick?: (event: React.MouseEvent) => void;\n  onLoseFocus?: (event: React.FocusEvent) => void;\n}\n\n// We are using two landmarks per drawer, i.e. two NAVs and two ASIDEs, because of several\n// known bugs in NVDA that cause focus changes within a container to sometimes not be\n// announced. As a result, we use one region for the open button and one region for the\n// actual drawer content, always hiding the other one when it's not visible.\n// An alternative solution to follow a more classic implementation here to only have one\n// button that triggers the opening/closing of the drawer also did not work due to another\n// series of bugs in NVDA (together with Firefox) which prevent the changed expanded state\n// from being announced.\n// Even with this workaround in place, the announcement of the close button when opening a\n// panel in NVDA is not working correctly. The suspected root cause is one of the bugs below\n// as well.\n// Relevant tickets:\n// * https://github.com/nvaccess/nvda/issues/6606\n// * https://github.com/nvaccess/nvda/issues/5825\n// * https://github.com/nvaccess/nvda/issues/5247\n// * https://github.com/nvaccess/nvda/pull/8869 (reverted PR that was going to fix it)\n\nexport function Drawer({\n  contentClassName,\n  toggleClassName,\n  closeClassName,\n  width,\n  type,\n  toggleRefs,\n  topOffset,\n  bottomOffset,\n  ariaLabels,\n  children,\n  isOpen,\n  isMobile,\n  onToggle,\n  onClick,\n  onLoseFocus,\n}: DesktopDrawerProps) {\n  const { TagName, iconName, getLabels } = togglesConfig[type];\n  const { mainLabel, closeLabel, openLabel } = getLabels(ariaLabels);\n  const drawerContentWidthOpen = isMobile ? undefined : width;\n  const drawerContentWidth = isOpen ? drawerContentWidthOpen : undefined;\n  const closeIconName = 'close';\n\n  const regularOpenButton = (\n    <TagName aria-label={mainLabel} className={styles.toggle} aria-hidden={isOpen}>\n      <AppLayoutButton\n        ref={toggleRefs.toggle}\n        className={toggleClassName}\n        iconName={iconName}\n        ariaLabel={openLabel}\n        onClick={() => onToggle(true)}\n        ariaExpanded={false}\n      />\n    </TagName>\n  );\n\n  return (\n    <div\n      className={clsx(styles.drawer, {\n        [styles['drawer-closed']]: !isOpen,\n        [styles['drawer-mobile']]: isMobile,\n      })}\n      style={{\n        width: drawerContentWidth,\n      }}\n      onBlur={\n        onLoseFocus\n          ? e => {\n              if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n                onLoseFocus(e);\n              }\n            }\n          : undefined\n      }\n      onClick={event => {\n        if (onClick) {\n          onClick(event);\n        }\n\n        if (!isOpen) {\n          // to prevent calling onToggle from the drawer when it's called from the toggle button\n          if ((event.target as Element).tagName !== 'BUTTON') {\n            onToggle(true);\n          }\n        }\n      }}\n    >\n      <div\n        style={{ width: drawerContentWidth, top: topOffset, bottom: bottomOffset }}\n        className={clsx(styles['drawer-content'], contentClassName)}\n      >\n        {!isMobile && regularOpenButton}\n        <TagName aria-label={mainLabel} aria-hidden={!isOpen}>\n          <CloseButton\n            ref={toggleRefs.close}\n            className={closeClassName}\n            ariaLabel={closeLabel}\n            onClick={() => onToggle(false)}\n            iconName={closeIconName}\n          />\n          {children}\n        </TagName>\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"drawer.js","sourceRoot":"","sources":["../../../src/app-layout/drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport clsx from 'clsx';\nimport React from 'react';\nimport { ButtonProps } from '../button/interfaces';\nimport { AppLayoutButton, CloseButton, togglesConfig } from './toggles';\nimport { AppLayoutProps } from './interfaces';\nimport styles from './styles.css.js';\n\nexport interface DesktopDrawerProps {\n  contentClassName?: string;\n  toggleClassName?: string;\n  closeClassName?: string;\n  toggleRefs: {\n    toggle: React.Ref<ButtonProps.Ref>;\n    close: React.Ref<ButtonProps.Ref>;\n  };\n  width: number;\n  topOffset?: number;\n  bottomOffset?: number;\n  ariaLabels?: AppLayoutProps.Labels;\n  children: React.ReactNode;\n  type: keyof typeof togglesConfig;\n  isMobile?: boolean;\n  isOpen?: boolean;\n  onToggle: (isOpen: boolean) => void;\n  onClick?: (event: React.MouseEvent) => void;\n  onLoseFocus?: (event: React.FocusEvent) => void;\n}\n\n// We are using two landmarks per drawer, i.e. two NAVs and two ASIDEs, because of several\n// known bugs in NVDA that cause focus changes within a container to sometimes not be\n// announced. As a result, we use one region for the open button and one region for the\n// actual drawer content, always hiding the other one when it's not visible.\n// An alternative solution to follow a more classic implementation here to only have one\n// button that triggers the opening/closing of the drawer also did not work due to another\n// series of bugs in NVDA (together with Firefox) which prevent the changed expanded state\n// from being announced.\n// Even with this workaround in place, the announcement of the close button when opening a\n// panel in NVDA is not working correctly. The suspected root cause is one of the bugs below\n// as well.\n// Relevant tickets:\n// * https://github.com/nvaccess/nvda/issues/6606\n// * https://github.com/nvaccess/nvda/issues/5825\n// * https://github.com/nvaccess/nvda/issues/5247\n// * https://github.com/nvaccess/nvda/pull/8869 (reverted PR that was going to fix it)\n\nexport function Drawer({\n  contentClassName,\n  toggleClassName,\n  closeClassName,\n  width,\n  type,\n  toggleRefs,\n  topOffset,\n  bottomOffset,\n  ariaLabels,\n  children,\n  isOpen,\n  isMobile,\n  onToggle,\n  onClick,\n  onLoseFocus,\n}: DesktopDrawerProps) {\n  const { TagName, iconName, getLabels } = togglesConfig[type];\n  const { mainLabel, closeLabel, openLabel } = getLabels(ariaLabels);\n  const drawerContentWidthOpen = isMobile ? undefined : width;\n  const drawerContentWidth = isOpen ? drawerContentWidthOpen : undefined;\n  const closeIconName = 'close';\n\n  const regularOpenButton = (\n    <TagName aria-label={mainLabel} className={styles.toggle} aria-hidden={isOpen}>\n      <AppLayoutButton\n        ref={toggleRefs.toggle}\n        className={toggleClassName}\n        iconName={iconName}\n        ariaLabel={openLabel}\n        onClick={() => onToggle(true)}\n        ariaExpanded={false}\n      />\n    </TagName>\n  );\n\n  return (\n    <div\n      className={clsx(styles.drawer, {\n        [styles['drawer-closed']]: !isOpen,\n        [styles['drawer-mobile']]: isMobile,\n      })}\n      style={{\n        width: drawerContentWidth,\n      }}\n      onBlur={\n        onLoseFocus\n          ? e => {\n              if (!e.relatedTarget || !e.currentTarget.contains(e.relatedTarget)) {\n                onLoseFocus(e);\n              }\n            }\n          : undefined\n      }\n      onClick={event => {\n        if (onClick) {\n          onClick(event);\n        }\n\n        if (!isOpen) {\n          // to prevent calling onToggle from the drawer when it's called from the toggle button\n          if ((event.target as Element).tagName !== 'BUTTON') {\n            onToggle(true);\n          }\n        }\n      }}\n    >\n      <div\n        style={{ width: drawerContentWidth, top: topOffset, bottom: bottomOffset }}\n        className={clsx(styles['drawer-content'], contentClassName)}\n      >\n        {!isMobile && regularOpenButton}\n        <TagName aria-label={mainLabel} aria-hidden={!isOpen}>\n          <CloseButton\n            ref={toggleRefs.close}\n            className={closeClassName}\n            ariaLabel={closeLabel}\n            onClick={() => onToggle(false)}\n            iconName={closeIconName}\n          />\n          {children}\n        </TagName>\n      </div>\n    </div>\n  );\n}\n"]}