@cloudscape-design/components 3.0.125 → 3.0.127

package/annotation-context/annotation/annotation-popover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"annotation-popover.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAQzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAKvD,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB,SAAS,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAErC,iBAAiB,EAAE,OAAO,CAAC;IAC3B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAE9B,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,qBAAqB,EAAE,OAAO,CAAC;IAC/B,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAElC,kBAAkB,EAAE,MAAM,CAAC;IAE3B,eAAe,EAAE,MAAM,CAAC;IAExB,gBAAgB,EAAE,OAAO,CAAC;IAE1B,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAEvC,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;CACpD;AASD,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,OAAO,EACP,KAAK,EAEL,SAAiB,EAEjB,kBAAkB,EAElB,eAAe,EAEf,kBAAkB,EAClB,gBAAgB,EAEhB,SAAS,EAET,iBAAiB,EACjB,iBAAiB,EAEjB,QAAQ,EAER,QAAQ,EAER,qBAAqB,EACrB,qBAAqB,EACrB,WAAW,GACZ,EAAE,sBAAsB,eAsFxB"}
+{"version":3,"file":"annotation-popover.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAQzC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAOvD,MAAM,WAAW,sBAAsB;IACrC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB,SAAS,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAErC,iBAAiB,EAAE,OAAO,CAAC;IAC3B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAE9B,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,qBAAqB,EAAE,OAAO,CAAC;IAC/B,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAElC,kBAAkB,EAAE,MAAM,CAAC;IAE3B,eAAe,EAAE,MAAM,CAAC;IAExB,gBAAgB,EAAE,OAAO,CAAC;IAE1B,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAEvC,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;CACpD;AASD,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,OAAO,EACP,KAAK,EAEL,SAAiB,EAEjB,kBAAkB,EAElB,eAAe,EAEf,kBAAkB,EAClB,gBAAgB,EAEhB,SAAS,EAET,iBAAiB,EACjB,iBAAiB,EAEjB,QAAQ,EAER,QAAQ,EAER,qBAAqB,EACrB,qBAAqB,EACrB,WAAW,GACZ,EAAE,sBAAsB,eAuGxB"}

package/annotation-context/annotation/annotation-popover.js

@@ -10,6 +10,8 @@ import PopoverContainer from '../../popover/container';
 import PopoverBody from '../../popover/body';
 import InternalAlert from '../../alert/internal';
 import { scrollElementIntoView } from '../../internal/utils/scrollable-containers';
+import { useUniqueId } from '../../internal/hooks/use-unique-id/index.js';
+import { joinStrings } from '../../internal/utils/strings/join-strings.js';
 var arrow = function (position) { return (React.createElement("div", { className: clsx(styles.arrow, styles["arrow-position-".concat(position)]) },
     React.createElement("div", { className: styles['arrow-outer'] }),
     React.createElement("div", { className: styles['arrow-inner'] }))); };
@@ -19,8 +21,12 @@ export function AnnotationPopover(_a) {
         var _a;
         scrollElementIntoView((_a = trackRef.current) !== null && _a !== void 0 ? _a : undefined);
     }, [trackRef]);
+    var popoverHeaderId = useUniqueId('poppver-header-');
+    var stepCounterId = useUniqueId('step-counter-');
     return (React.createElement(PopoverContainer, { size: "medium", fixedWidth: false, position: direction, trackRef: trackRef, trackKey: taskLocalStepIndex, variant: "annotation", arrow: arrow, zIndex: 1000 },
-        React.createElement(PopoverBody, { dismissButton: true, dismissAriaLabel: i18nStrings.labelDismissAnnotation, header: React.createElement(InternalBox, { color: "text-body-secondary", fontSize: "body-s", margin: { top: 'xxxs' }, className: styles.header }, title), onDismiss: onDismiss, className: styles.annotation, variant: "annotation", overflowVisible: "content" },
+        React.createElement(PopoverBody, { dismissButton: true, dismissAriaLabel: i18nStrings.labelDismissAnnotation, header: React.createElement(InternalBox, { id: popoverHeaderId, color: "text-body-secondary", fontSize: "body-s", margin: { top: 'xxxs' }, className: styles.header }, title), onDismiss: onDismiss, className: styles.annotation, variant: "annotation", overflowVisible: "content", 
+            // create new dialog to have the native dialog behavior of the screen readers
+            key: taskLocalStepIndex, ariaLabelledby: joinStrings(popoverHeaderId, stepCounterId) },
             React.createElement(InternalSpaceBetween, { size: "s" },
                 React.createElement("div", { className: styles.description },
                     React.createElement(InternalBox, { className: styles.content }, content)),
@@ -29,7 +35,7 @@ export function AnnotationPopover(_a) {
                     React.createElement("div", { className: styles.divider }),
                     React.createElement("div", { className: styles.actionBar },
                         React.createElement("div", { className: styles.stepCounter },
-                            React.createElement(InternalBox, { className: styles['step-counter-content'], color: "text-body-secondary", fontSize: "body-s" }, i18nStrings.stepCounterText(taskLocalStepIndex !== null && taskLocalStepIndex !== void 0 ? taskLocalStepIndex : 0, totalLocalSteps !== null && totalLocalSteps !== void 0 ? totalLocalSteps : 0))),
+                            React.createElement(InternalBox, { id: stepCounterId, className: styles['step-counter-content'], color: "text-body-secondary", fontSize: "body-s" }, i18nStrings.stepCounterText(taskLocalStepIndex !== null && taskLocalStepIndex !== void 0 ? taskLocalStepIndex : 0, totalLocalSteps !== null && totalLocalSteps !== void 0 ? totalLocalSteps : 0))),
                         React.createElement(InternalSpaceBetween, { size: "xs", direction: "horizontal" },
                             showPreviousButton && (React.createElement(InternalButton, { variant: "link", onClick: onPreviousButtonClick, disabled: !previousButtonEnabled, formAction: "none", ariaLabel: i18nStrings.previousButtonText, className: styles['previous-button'] }, i18nStrings.previousButtonText)),
                             showFinishButton ? (React.createElement(InternalButton, { onClick: onFinish, formAction: "none", ariaLabel: i18nStrings.finishButtonText, className: styles['finish-button'] }, i18nStrings.finishButtonText)) : (React.createElement(InternalButton, { onClick: onNextButtonClick, disabled: !nextButtonEnabled, formAction: "none", ariaLabel: i18nStrings.nextButtonText, className: styles['next-button'] }, i18nStrings.nextButtonText)))))))));

package/annotation-context/annotation/annotation-popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"annotation-popover.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-popover.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, { useEffect } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalBox from '../../box/internal';\nimport { InternalButton } from '../../button/internal';\nimport InternalSpaceBetween from '../../space-between/internal';\nimport PopoverContainer from '../../popover/container';\nimport PopoverBody from '../../popover/body';\nimport { HotspotProps } from '../../hotspot/interfaces';\nimport { AnnotationContextProps } from '../interfaces';\nimport InternalAlert from '../../alert/internal';\nimport { InternalPosition } from '../../popover/interfaces';\nimport { scrollElementIntoView } from '../../internal/utils/scrollable-containers';\n\nexport interface AnnotationPopoverProps {\n  title: string;\n  content: React.ReactNode;\n  alert: React.ReactNode;\n\n  direction: HotspotProps['direction'];\n\n  nextButtonEnabled: boolean;\n  onNextButtonClick: () => void;\n\n  onFinish: () => void;\n\n  showPreviousButton: boolean;\n  previousButtonEnabled: boolean;\n  onPreviousButtonClick: () => void;\n\n  taskLocalStepIndex: number;\n\n  totalLocalSteps: number;\n\n  showFinishButton: boolean;\n\n  onDismiss: () => void;\n\n  trackRef: React.RefObject<HTMLElement>;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n}\n\nconst arrow = (position: InternalPosition | null) => (\n  <div className={clsx(styles.arrow, styles[`arrow-position-${position}`])}>\n    <div className={styles['arrow-outer']} />\n    <div className={styles['arrow-inner']} />\n  </div>\n);\n\nexport function AnnotationPopover({\n  title,\n  content,\n  alert,\n\n  direction = 'top',\n\n  taskLocalStepIndex,\n\n  totalLocalSteps,\n\n  showPreviousButton,\n  showFinishButton,\n\n  onDismiss,\n\n  nextButtonEnabled,\n  onNextButtonClick,\n\n  onFinish,\n\n  trackRef,\n\n  previousButtonEnabled,\n  onPreviousButtonClick,\n  i18nStrings,\n}: AnnotationPopoverProps) {\n  useEffect(() => {\n    scrollElementIntoView(trackRef.current ?? undefined);\n  }, [trackRef]);\n\n  return (\n    <PopoverContainer\n      size=\"medium\"\n      fixedWidth={false}\n      position={direction}\n      trackRef={trackRef}\n      trackKey={taskLocalStepIndex}\n      variant=\"annotation\"\n      arrow={arrow}\n      zIndex={1000}\n    >\n      <PopoverBody\n        dismissButton={true}\n        dismissAriaLabel={i18nStrings.labelDismissAnnotation}\n        header={\n          <InternalBox color=\"text-body-secondary\" fontSize=\"body-s\" margin={{ top: 'xxxs' }} className={styles.header}>\n            {title}\n          </InternalBox>\n        }\n        onDismiss={onDismiss}\n        className={styles.annotation}\n        variant=\"annotation\"\n        overflowVisible=\"content\"\n      >\n        <InternalSpaceBetween size=\"s\">\n          <div className={styles.description}>\n            <InternalBox className={styles.content}>{content}</InternalBox>\n          </div>\n\n          {alert && <InternalAlert type=\"warning\">{alert}</InternalAlert>}\n\n          <InternalSpaceBetween size=\"s\">\n            <div className={styles.divider} />\n\n            <div className={styles.actionBar}>\n              <div className={styles.stepCounter}>\n                <InternalBox className={styles['step-counter-content']} color=\"text-body-secondary\" fontSize=\"body-s\">\n                  {i18nStrings.stepCounterText(taskLocalStepIndex ?? 0, totalLocalSteps ?? 0)}\n                </InternalBox>\n              </div>\n              <InternalSpaceBetween size=\"xs\" direction=\"horizontal\">\n                {showPreviousButton && (\n                  <InternalButton\n                    variant=\"link\"\n                    onClick={onPreviousButtonClick}\n                    disabled={!previousButtonEnabled}\n                    formAction=\"none\"\n                    ariaLabel={i18nStrings.previousButtonText}\n                    className={styles['previous-button']}\n                  >\n                    {i18nStrings.previousButtonText}\n                  </InternalButton>\n                )}\n\n                {showFinishButton ? (\n                  <InternalButton\n                    onClick={onFinish}\n                    formAction=\"none\"\n                    ariaLabel={i18nStrings.finishButtonText}\n                    className={styles['finish-button']}\n                  >\n                    {i18nStrings.finishButtonText}\n                  </InternalButton>\n                ) : (\n                  <InternalButton\n                    onClick={onNextButtonClick}\n                    disabled={!nextButtonEnabled}\n                    formAction=\"none\"\n                    ariaLabel={i18nStrings.nextButtonText}\n                    className={styles['next-button']}\n                  >\n                    {i18nStrings.nextButtonText}\n                  </InternalButton>\n                )}\n              </InternalSpaceBetween>\n            </div>\n          </InternalSpaceBetween>\n        </InternalSpaceBetween>\n      </PopoverBody>\n    </PopoverContainer>\n  );\n}\n"]}
+{"version":3,"file":"annotation-popover.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-popover.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, { useEffect } from 'react';\nimport clsx from 'clsx';\nimport styles from './styles.css.js';\nimport InternalBox from '../../box/internal';\nimport { InternalButton } from '../../button/internal';\nimport InternalSpaceBetween from '../../space-between/internal';\nimport PopoverContainer from '../../popover/container';\nimport PopoverBody from '../../popover/body';\nimport { HotspotProps } from '../../hotspot/interfaces';\nimport { AnnotationContextProps } from '../interfaces';\nimport InternalAlert from '../../alert/internal';\nimport { InternalPosition } from '../../popover/interfaces';\nimport { scrollElementIntoView } from '../../internal/utils/scrollable-containers';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id/index.js';\nimport { joinStrings } from '../../internal/utils/strings/join-strings.js';\n\nexport interface AnnotationPopoverProps {\n  title: string;\n  content: React.ReactNode;\n  alert: React.ReactNode;\n\n  direction: HotspotProps['direction'];\n\n  nextButtonEnabled: boolean;\n  onNextButtonClick: () => void;\n\n  onFinish: () => void;\n\n  showPreviousButton: boolean;\n  previousButtonEnabled: boolean;\n  onPreviousButtonClick: () => void;\n\n  taskLocalStepIndex: number;\n\n  totalLocalSteps: number;\n\n  showFinishButton: boolean;\n\n  onDismiss: () => void;\n\n  trackRef: React.RefObject<HTMLElement>;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n}\n\nconst arrow = (position: InternalPosition | null) => (\n  <div className={clsx(styles.arrow, styles[`arrow-position-${position}`])}>\n    <div className={styles['arrow-outer']} />\n    <div className={styles['arrow-inner']} />\n  </div>\n);\n\nexport function AnnotationPopover({\n  title,\n  content,\n  alert,\n\n  direction = 'top',\n\n  taskLocalStepIndex,\n\n  totalLocalSteps,\n\n  showPreviousButton,\n  showFinishButton,\n\n  onDismiss,\n\n  nextButtonEnabled,\n  onNextButtonClick,\n\n  onFinish,\n\n  trackRef,\n\n  previousButtonEnabled,\n  onPreviousButtonClick,\n  i18nStrings,\n}: AnnotationPopoverProps) {\n  useEffect(() => {\n    scrollElementIntoView(trackRef.current ?? undefined);\n  }, [trackRef]);\n\n  const popoverHeaderId = useUniqueId('poppver-header-');\n  const stepCounterId = useUniqueId('step-counter-');\n\n  return (\n    <PopoverContainer\n      size=\"medium\"\n      fixedWidth={false}\n      position={direction}\n      trackRef={trackRef}\n      trackKey={taskLocalStepIndex}\n      variant=\"annotation\"\n      arrow={arrow}\n      zIndex={1000}\n    >\n      <PopoverBody\n        dismissButton={true}\n        dismissAriaLabel={i18nStrings.labelDismissAnnotation}\n        header={\n          <InternalBox\n            id={popoverHeaderId}\n            color=\"text-body-secondary\"\n            fontSize=\"body-s\"\n            margin={{ top: 'xxxs' }}\n            className={styles.header}\n          >\n            {title}\n          </InternalBox>\n        }\n        onDismiss={onDismiss}\n        className={styles.annotation}\n        variant=\"annotation\"\n        overflowVisible=\"content\"\n        // create new dialog to have the native dialog behavior of the screen readers\n        key={taskLocalStepIndex}\n        ariaLabelledby={joinStrings(popoverHeaderId, stepCounterId)}\n      >\n        <InternalSpaceBetween size=\"s\">\n          <div className={styles.description}>\n            <InternalBox className={styles.content}>{content}</InternalBox>\n          </div>\n\n          {alert && <InternalAlert type=\"warning\">{alert}</InternalAlert>}\n\n          <InternalSpaceBetween size=\"s\">\n            <div className={styles.divider} />\n\n            <div className={styles.actionBar}>\n              <div className={styles.stepCounter}>\n                <InternalBox\n                  id={stepCounterId}\n                  className={styles['step-counter-content']}\n                  color=\"text-body-secondary\"\n                  fontSize=\"body-s\"\n                >\n                  {i18nStrings.stepCounterText(taskLocalStepIndex ?? 0, totalLocalSteps ?? 0)}\n                </InternalBox>\n              </div>\n              <InternalSpaceBetween size=\"xs\" direction=\"horizontal\">\n                {showPreviousButton && (\n                  <InternalButton\n                    variant=\"link\"\n                    onClick={onPreviousButtonClick}\n                    disabled={!previousButtonEnabled}\n                    formAction=\"none\"\n                    ariaLabel={i18nStrings.previousButtonText}\n                    className={styles['previous-button']}\n                  >\n                    {i18nStrings.previousButtonText}\n                  </InternalButton>\n                )}\n\n                {showFinishButton ? (\n                  <InternalButton\n                    onClick={onFinish}\n                    formAction=\"none\"\n                    ariaLabel={i18nStrings.finishButtonText}\n                    className={styles['finish-button']}\n                  >\n                    {i18nStrings.finishButtonText}\n                  </InternalButton>\n                ) : (\n                  <InternalButton\n                    onClick={onNextButtonClick}\n                    disabled={!nextButtonEnabled}\n                    formAction=\"none\"\n                    ariaLabel={i18nStrings.nextButtonText}\n                    className={styles['next-button']}\n                  >\n                    {i18nStrings.nextButtonText}\n                  </InternalButton>\n                )}\n              </InternalSpaceBetween>\n            </div>\n          </InternalSpaceBetween>\n        </InternalSpaceBetween>\n      </PopoverBody>\n    </PopoverContainer>\n  );\n}\n"]}

package/annotation-context/annotation/annotation-trigger.d.ts

@@ -4,6 +4,8 @@ export interface AnnotationTriggerProps {
     open: boolean;
     onClick: () => void;
     i18nStrings: AnnotationContextProps['i18nStrings'];
+    taskLocalStepIndex: number;
+    totalLocalSteps: number;
 }
 declare const _default: React.ForwardRefExoticComponent<AnnotationTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 export default _default;

package/annotation-context/annotation/annotation-trigger.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"annotation-trigger.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAEvD,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,OAAO,CAAC;IAEd,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;CACpD;;AAED,wBA0BG"}
+{"version":3,"file":"annotation-trigger.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-trigger.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAI3C,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAEvD,MAAM,WAAW,sBAAsB;IACrC,IAAI,EAAE,OAAO,CAAC;IAEd,OAAO,EAAE,MAAM,IAAI,CAAC;IAEpB,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IACnD,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,EAAE,MAAM,CAAC;CACzB;;AAED,wBA0BG"}

package/annotation-context/annotation/annotation-trigger.js

@@ -6,13 +6,13 @@ import styles from './styles.css.js';
 import { AnnotationIcon } from './annotation-icon';
 import useFocusVisible from '../../internal/hooks/focus-visible/index.js';
 export default React.forwardRef(function AnnotationTrigger(_a, ref) {
-    var open = _a.open, onClickHandler = _a.onClick, i18nStrings = _a.i18nStrings;
+    var open = _a.open, onClickHandler = _a.onClick, i18nStrings = _a.i18nStrings, taskLocalStepIndex = _a.taskLocalStepIndex, totalLocalSteps = _a.totalLocalSteps;
     var focusVisible = useFocusVisible();
     var onClick = useCallback(function (event) {
         event.preventDefault();
         onClickHandler();
     }, [onClickHandler]);
-    return (React.createElement("button", __assign({ ref: ref, className: styles.hotspot, "aria-haspopup": "dialog", "aria-label": i18nStrings.labelHotspot(open), onClick: onClick }, focusVisible),
+    return (React.createElement("button", __assign({ ref: ref, className: styles.hotspot, "aria-haspopup": "dialog", "aria-label": i18nStrings.labelHotspot(open, taskLocalStepIndex !== null && taskLocalStepIndex !== void 0 ? taskLocalStepIndex : 0, totalLocalSteps !== null && totalLocalSteps !== void 0 ? totalLocalSteps : 0), onClick: onClick }, focusVisible),
         React.createElement(AnnotationIcon, { open: open })));
 });
 //# sourceMappingURL=annotation-trigger.js.map

package/annotation-context/annotation/annotation-trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"annotation-trigger.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-trigger.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAW1E,eAAe,KAAK,CAAC,UAAU,CAA4C,SAAS,iBAAiB,CACnG,EAAsE,EACtE,GAAG;QADD,IAAI,UAAA,EAAW,cAAc,aAAA,EAAE,WAAW,iBAAA;IAG5C,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,IAAM,OAAO,GAAG,WAAW,CACzB,UAAC,KAAuB;QACtB,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,cAAc,EAAE,CAAC;IACnB,CAAC,EACD,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,OAAO,CACL,yCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,MAAM,CAAC,OAAO,mBACX,QAAQ,gBACV,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,EAC1C,OAAO,EAAE,OAAO,IACZ,YAAY;QAEhB,oBAAC,cAAc,IAAC,IAAI,EAAE,IAAI,GAAI,CACvB,CACV,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback } from 'react';\nimport styles from './styles.css.js';\nimport { AnnotationIcon } from './annotation-icon';\nimport useFocusVisible from '../../internal/hooks/focus-visible/index.js';\nimport { AnnotationContextProps } from '../interfaces';\n\nexport interface AnnotationTriggerProps {\n  open: boolean;\n\n  onClick: () => void;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n}\n\nexport default React.forwardRef<HTMLButtonElement, AnnotationTriggerProps>(function AnnotationTrigger(\n  { open, onClick: onClickHandler, i18nStrings }: AnnotationTriggerProps,\n  ref\n) {\n  const focusVisible = useFocusVisible();\n\n  const onClick = useCallback(\n    (event: React.MouseEvent) => {\n      event.preventDefault();\n      onClickHandler();\n    },\n    [onClickHandler]\n  );\n\n  return (\n    <button\n      ref={ref}\n      className={styles.hotspot}\n      aria-haspopup=\"dialog\"\n      aria-label={i18nStrings.labelHotspot(open)}\n      onClick={onClick}\n      {...focusVisible}\n    >\n      <AnnotationIcon open={open} />\n    </button>\n  );\n});\n"]}
+{"version":3,"file":"annotation-trigger.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/annotation-trigger.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,eAAe,MAAM,6CAA6C,CAAC;AAa1E,eAAe,KAAK,CAAC,UAAU,CAA4C,SAAS,iBAAiB,CACnG,EAA2G,EAC3G,GAAG;QADD,IAAI,UAAA,EAAW,cAAc,aAAA,EAAE,WAAW,iBAAA,EAAE,kBAAkB,wBAAA,EAAE,eAAe,qBAAA;IAGjF,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,IAAM,OAAO,GAAG,WAAW,CACzB,UAAC,KAAuB;QACtB,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,cAAc,EAAE,CAAC;IACnB,CAAC,EACD,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,OAAO,CACL,yCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,MAAM,CAAC,OAAO,mBACX,QAAQ,gBACV,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,CAAC,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,CAAC,CAAC,EACzF,OAAO,EAAE,OAAO,IACZ,YAAY;QAEhB,oBAAC,cAAc,IAAC,IAAI,EAAE,IAAI,GAAI,CACvB,CACV,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback } from 'react';\nimport styles from './styles.css.js';\nimport { AnnotationIcon } from './annotation-icon';\nimport useFocusVisible from '../../internal/hooks/focus-visible/index.js';\nimport { AnnotationContextProps } from '../interfaces';\n\nexport interface AnnotationTriggerProps {\n  open: boolean;\n\n  onClick: () => void;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n  taskLocalStepIndex: number;\n  totalLocalSteps: number;\n}\n\nexport default React.forwardRef<HTMLButtonElement, AnnotationTriggerProps>(function AnnotationTrigger(\n  { open, onClick: onClickHandler, i18nStrings, taskLocalStepIndex, totalLocalSteps }: AnnotationTriggerProps,\n  ref\n) {\n  const focusVisible = useFocusVisible();\n\n  const onClick = useCallback(\n    (event: React.MouseEvent) => {\n      event.preventDefault();\n      onClickHandler();\n    },\n    [onClickHandler]\n  );\n\n  return (\n    <button\n      ref={ref}\n      className={styles.hotspot}\n      aria-haspopup=\"dialog\"\n      aria-label={i18nStrings.labelHotspot(open, taskLocalStepIndex ?? 0, totalLocalSteps ?? 0)}\n      onClick={onClick}\n      {...focusVisible}\n    >\n      <AnnotationIcon open={open} />\n    </button>\n  );\n});\n"]}

package/annotation-context/annotation/closed-annotation.d.ts

@@ -4,6 +4,8 @@ export interface AnnotationProps {
     onOpen: (stepId: number) => void;
     i18nStrings: AnnotationContextProps['i18nStrings'];
     focusOnRender: boolean;
+    totalLocalSteps: number;
+    taskLocalStepIndex: number;
 }
-export declare function ClosedAnnotation({ globalStepIndex, onOpen, i18nStrings, focusOnRender }: AnnotationProps): JSX.Element;
+export declare function ClosedAnnotation({ globalStepIndex, onOpen, i18nStrings, focusOnRender, totalLocalSteps, taskLocalStepIndex, }: AnnotationProps): JSX.Element;
 //# sourceMappingURL=closed-annotation.d.ts.map

package/annotation-context/annotation/closed-annotation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"closed-annotation.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/closed-annotation.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAGvD,MAAM,WAAW,eAAe;IAC9B,eAAe,EAAE,MAAM,CAAC;IAExB,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEjC,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAEnD,aAAa,EAAE,OAAO,CAAC;CACxB;AAED,wBAAgB,gBAAgB,CAAC,EAAE,eAAe,EAAE,MAAM,EAAE,WAAW,EAAE,aAAa,EAAE,EAAE,eAAe,eAaxG"}
+{"version":3,"file":"closed-annotation.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/closed-annotation.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAGvD,MAAM,WAAW,eAAe;IAC9B,eAAe,EAAE,MAAM,CAAC;IAExB,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEjC,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;IAEnD,aAAa,EAAE,OAAO,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,kBAAkB,EAAE,MAAM,CAAC;CAC5B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,eAAe,EACf,MAAM,EACN,WAAW,EACX,aAAa,EACb,eAAe,EACf,kBAAkB,GACnB,EAAE,eAAe,eAsBjB"}

package/annotation-context/annotation/closed-annotation.js

@@ -3,7 +3,7 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import AnnotationTrigger from './annotation-trigger';
 export function ClosedAnnotation(_a) {
-    var globalStepIndex = _a.globalStepIndex, onOpen = _a.onOpen, i18nStrings = _a.i18nStrings, focusOnRender = _a.focusOnRender;
+    var globalStepIndex = _a.globalStepIndex, onOpen = _a.onOpen, i18nStrings = _a.i18nStrings, focusOnRender = _a.focusOnRender, totalLocalSteps = _a.totalLocalSteps, taskLocalStepIndex = _a.taskLocalStepIndex;
     var _b = useState(null), hotspotRef = _b[0], setHotspotRef = _b[1];
     var onClick = useCallback(function () {
         onOpen(globalStepIndex);
@@ -13,6 +13,6 @@ export function ClosedAnnotation(_a) {
             hotspotRef.focus();
         }
     }, [focusOnRender, hotspotRef]);
-    return React.createElement(AnnotationTrigger, { open: false, onClick: onClick, i18nStrings: i18nStrings, ref: setHotspotRef });
+    return (React.createElement(AnnotationTrigger, { open: false, onClick: onClick, i18nStrings: i18nStrings, ref: setHotspotRef, totalLocalSteps: totalLocalSteps, taskLocalStepIndex: taskLocalStepIndex }));
 }
 //# sourceMappingURL=closed-annotation.js.map

package/annotation-context/annotation/closed-annotation.js.map

@@ -1 +1 @@
-{"version":3,"file":"closed-annotation.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/closed-annotation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AAYrD,MAAM,UAAU,gBAAgB,CAAC,EAAwE;QAAtE,eAAe,qBAAA,EAAE,MAAM,YAAA,EAAE,WAAW,iBAAA,EAAE,aAAa,mBAAA;IAC9E,IAAA,KAA8B,QAAQ,CAA2B,IAAI,CAAC,EAArE,UAAU,QAAA,EAAE,aAAa,QAA4C,CAAC;IAC7E,IAAM,OAAO,GAAG,WAAW,CAAC;QAC1B,MAAM,CAAC,eAAe,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC;QACR,IAAI,aAAa,IAAI,UAAU,EAAE;YAC/B,UAAU,CAAC,KAAK,EAAE,CAAC;SACpB;IACH,CAAC,EAAE,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC;IAEhC,OAAO,oBAAC,iBAAiB,IAAC,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,EAAE,aAAa,GAAI,CAAC;AAC5G,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { AnnotationContextProps } from '../interfaces';\nimport AnnotationTrigger from './annotation-trigger';\n\nexport interface AnnotationProps {\n  globalStepIndex: number;\n\n  onOpen: (stepId: number) => void;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n\n  focusOnRender: boolean;\n}\n\nexport function ClosedAnnotation({ globalStepIndex, onOpen, i18nStrings, focusOnRender }: AnnotationProps) {\n  const [hotspotRef, setHotspotRef] = useState<HTMLButtonElement | null>(null);\n  const onClick = useCallback(() => {\n    onOpen(globalStepIndex);\n  }, [globalStepIndex, onOpen]);\n\n  useEffect(() => {\n    if (focusOnRender && hotspotRef) {\n      hotspotRef.focus();\n    }\n  }, [focusOnRender, hotspotRef]);\n\n  return <AnnotationTrigger open={false} onClick={onClick} i18nStrings={i18nStrings} ref={setHotspotRef} />;\n}\n"]}
+{"version":3,"file":"closed-annotation.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/closed-annotation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AAcrD,MAAM,UAAU,gBAAgB,CAAC,EAOf;QANhB,eAAe,qBAAA,EACf,MAAM,YAAA,EACN,WAAW,iBAAA,EACX,aAAa,mBAAA,EACb,eAAe,qBAAA,EACf,kBAAkB,wBAAA;IAEZ,IAAA,KAA8B,QAAQ,CAA2B,IAAI,CAAC,EAArE,UAAU,QAAA,EAAE,aAAa,QAA4C,CAAC;IAC7E,IAAM,OAAO,GAAG,WAAW,CAAC;QAC1B,MAAM,CAAC,eAAe,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC;QACR,IAAI,aAAa,IAAI,UAAU,EAAE;YAC/B,UAAU,CAAC,KAAK,EAAE,CAAC;SACpB;IACH,CAAC,EAAE,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC;IAEhC,OAAO,CACL,oBAAC,iBAAiB,IAChB,IAAI,EAAE,KAAK,EACX,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,GAAG,EAAE,aAAa,EAClB,eAAe,EAAE,eAAe,EAChC,kBAAkB,EAAE,kBAAkB,GACtC,CACH,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { AnnotationContextProps } from '../interfaces';\nimport AnnotationTrigger from './annotation-trigger';\n\nexport interface AnnotationProps {\n  globalStepIndex: number;\n\n  onOpen: (stepId: number) => void;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n\n  focusOnRender: boolean;\n  totalLocalSteps: number;\n  taskLocalStepIndex: number;\n}\n\nexport function ClosedAnnotation({\n  globalStepIndex,\n  onOpen,\n  i18nStrings,\n  focusOnRender,\n  totalLocalSteps,\n  taskLocalStepIndex,\n}: AnnotationProps) {\n  const [hotspotRef, setHotspotRef] = useState<HTMLButtonElement | null>(null);\n  const onClick = useCallback(() => {\n    onOpen(globalStepIndex);\n  }, [globalStepIndex, onOpen]);\n\n  useEffect(() => {\n    if (focusOnRender && hotspotRef) {\n      hotspotRef.focus();\n    }\n  }, [focusOnRender, hotspotRef]);\n\n  return (\n    <AnnotationTrigger\n      open={false}\n      onClick={onClick}\n      i18nStrings={i18nStrings}\n      ref={setHotspotRef}\n      totalLocalSteps={totalLocalSteps}\n      taskLocalStepIndex={taskLocalStepIndex}\n    />\n  );\n}\n"]}

package/annotation-context/annotation/open-annotation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"open-annotation.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/open-annotation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAIvD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,SAAS,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAErC,iBAAiB,EAAE,OAAO,CAAC;IAC3B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAE9B,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,qBAAqB,EAAE,OAAO,CAAC;IAC/B,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAElC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,gBAAgB,EAAE,OAAO,CAAC;IAE1B,kBAAkB,EAAE,MAAM,CAAC;IAE3B,eAAe,EAAE,MAAM,CAAC;IAExB,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;CACpD;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,OAAO,EACP,KAAK,EAEL,SAAS,EAET,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,EAElB,eAAe,EAEf,SAAS,EAET,iBAAiB,EACjB,iBAAiB,EAEjB,QAAQ,EAER,qBAAqB,EACrB,qBAAqB,EACrB,WAAW,GACZ,EAAE,eAAe,eA2BjB"}
+{"version":3,"file":"open-annotation.d.ts","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/open-annotation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAIvD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB,SAAS,EAAE,YAAY,CAAC,WAAW,CAAC,CAAC;IAErC,iBAAiB,EAAE,OAAO,CAAC;IAC3B,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAE9B,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB,qBAAqB,EAAE,OAAO,CAAC;IAC/B,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAElC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,gBAAgB,EAAE,OAAO,CAAC;IAE1B,kBAAkB,EAAE,MAAM,CAAC;IAE3B,eAAe,EAAE,MAAM,CAAC;IAExB,SAAS,EAAE,MAAM,IAAI,CAAC;IAEtB,WAAW,EAAE,sBAAsB,CAAC,aAAa,CAAC,CAAC;CACpD;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,OAAO,EACP,KAAK,EAEL,SAAS,EAET,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,EAElB,eAAe,EAEf,SAAS,EAET,iBAAiB,EACjB,iBAAiB,EAEjB,QAAQ,EAER,qBAAqB,EACrB,qBAAqB,EACrB,WAAW,GACZ,EAAE,eAAe,eAkCjB"}

package/annotation-context/annotation/open-annotation.js

@@ -7,7 +7,7 @@ export function OpenAnnotation(_a) {
     var title = _a.title, content = _a.content, alert = _a.alert, direction = _a.direction, showPreviousButton = _a.showPreviousButton, showFinishButton = _a.showFinishButton, taskLocalStepIndex = _a.taskLocalStepIndex, totalLocalSteps = _a.totalLocalSteps, onDismiss = _a.onDismiss, nextButtonEnabled = _a.nextButtonEnabled, onNextButtonClick = _a.onNextButtonClick, onFinish = _a.onFinish, previousButtonEnabled = _a.previousButtonEnabled, onPreviousButtonClick = _a.onPreviousButtonClick, i18nStrings = _a.i18nStrings;
     var trackRef = useRef(null);
     return (React.createElement(React.Fragment, null,
-        React.createElement(AnnotationTrigger, { open: true, onClick: onDismiss, i18nStrings: i18nStrings, ref: trackRef }),
+        React.createElement(AnnotationTrigger, { open: true, onClick: onDismiss, i18nStrings: i18nStrings, ref: trackRef, totalLocalSteps: totalLocalSteps, taskLocalStepIndex: taskLocalStepIndex }),
         React.createElement(AnnotationPopover, { trackRef: trackRef, previousButtonEnabled: previousButtonEnabled, showPreviousButton: showPreviousButton, showFinishButton: showFinishButton, totalLocalSteps: totalLocalSteps, i18nStrings: i18nStrings, nextButtonEnabled: nextButtonEnabled, onDismiss: onDismiss, onFinish: onFinish, onNextButtonClick: onNextButtonClick, onPreviousButtonClick: onPreviousButtonClick, taskLocalStepIndex: taskLocalStepIndex, direction: direction, title: title, content: content, alert: alert })));
 }
 //# sourceMappingURL=open-annotation.js.map

package/annotation-context/annotation/open-annotation.js.map

@@ -1 +1 @@
-{"version":3,"file":"open-annotation.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/open-annotation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAGtC,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AA6BzD,MAAM,UAAU,cAAc,CAAC,EAuBb;QAtBhB,KAAK,WAAA,EACL,OAAO,aAAA,EACP,KAAK,WAAA,EAEL,SAAS,eAAA,EAET,kBAAkB,wBAAA,EAClB,gBAAgB,sBAAA,EAChB,kBAAkB,wBAAA,EAElB,eAAe,qBAAA,EAEf,SAAS,eAAA,EAET,iBAAiB,uBAAA,EACjB,iBAAiB,uBAAA,EAEjB,QAAQ,cAAA,EAER,qBAAqB,2BAAA,EACrB,qBAAqB,2BAAA,EACrB,WAAW,iBAAA;IAEX,IAAM,QAAQ,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEjD,OAAO,CACL;QACE,oBAAC,iBAAiB,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,EAAE,QAAQ,GAAI;QAE9F,oBAAC,iBAAiB,IAChB,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,iBAAiB,EACpC,qBAAqB,EAAE,qBAAqB,EAC5C,kBAAkB,EAAE,kBAAkB,EACtC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,GACZ,CACD,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport { HotspotProps } from '../../hotspot/interfaces';\nimport { AnnotationContextProps } from '../interfaces';\nimport AnnotationTrigger from './annotation-trigger';\nimport { AnnotationPopover } from './annotation-popover';\n\nexport interface AnnotationProps {\n  title: string;\n  content: React.ReactNode;\n  alert?: React.ReactNode;\n\n  direction: HotspotProps['direction'];\n\n  nextButtonEnabled: boolean;\n  onNextButtonClick: () => void;\n\n  onFinish: () => void;\n\n  previousButtonEnabled: boolean;\n  onPreviousButtonClick: () => void;\n\n  showPreviousButton: boolean;\n  showFinishButton: boolean;\n\n  taskLocalStepIndex: number;\n\n  totalLocalSteps: number;\n\n  onDismiss: () => void;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n}\n\nexport function OpenAnnotation({\n  title,\n  content,\n  alert,\n\n  direction,\n\n  showPreviousButton,\n  showFinishButton,\n  taskLocalStepIndex,\n\n  totalLocalSteps,\n\n  onDismiss,\n\n  nextButtonEnabled,\n  onNextButtonClick,\n\n  onFinish,\n\n  previousButtonEnabled,\n  onPreviousButtonClick,\n  i18nStrings,\n}: AnnotationProps) {\n  const trackRef = useRef<HTMLButtonElement>(null);\n\n  return (\n    <>\n      <AnnotationTrigger open={true} onClick={onDismiss} i18nStrings={i18nStrings} ref={trackRef} />\n\n      <AnnotationPopover\n        trackRef={trackRef}\n        previousButtonEnabled={previousButtonEnabled}\n        showPreviousButton={showPreviousButton}\n        showFinishButton={showFinishButton}\n        totalLocalSteps={totalLocalSteps}\n        i18nStrings={i18nStrings}\n        nextButtonEnabled={nextButtonEnabled}\n        onDismiss={onDismiss}\n        onFinish={onFinish}\n        onNextButtonClick={onNextButtonClick}\n        onPreviousButtonClick={onPreviousButtonClick}\n        taskLocalStepIndex={taskLocalStepIndex}\n        direction={direction}\n        title={title}\n        content={content}\n        alert={alert}\n      />\n    </>\n  );\n}\n"]}
+{"version":3,"file":"open-annotation.js","sourceRoot":"","sources":["../../../../src/annotation-context/annotation/open-annotation.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAGtC,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AA6BzD,MAAM,UAAU,cAAc,CAAC,EAuBb;QAtBhB,KAAK,WAAA,EACL,OAAO,aAAA,EACP,KAAK,WAAA,EAEL,SAAS,eAAA,EAET,kBAAkB,wBAAA,EAClB,gBAAgB,sBAAA,EAChB,kBAAkB,wBAAA,EAElB,eAAe,qBAAA,EAEf,SAAS,eAAA,EAET,iBAAiB,uBAAA,EACjB,iBAAiB,uBAAA,EAEjB,QAAQ,cAAA,EAER,qBAAqB,2BAAA,EACrB,qBAAqB,2BAAA,EACrB,WAAW,iBAAA;IAEX,IAAM,QAAQ,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAEjD,OAAO,CACL;QACE,oBAAC,iBAAiB,IAChB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,SAAS,EAClB,WAAW,EAAE,WAAW,EACxB,GAAG,EAAE,QAAQ,EACb,eAAe,EAAE,eAAe,EAChC,kBAAkB,EAAE,kBAAkB,GACtC;QAEF,oBAAC,iBAAiB,IAChB,QAAQ,EAAE,QAAQ,EAClB,qBAAqB,EAAE,qBAAqB,EAC5C,kBAAkB,EAAE,kBAAkB,EACtC,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,iBAAiB,EACpC,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,iBAAiB,EAAE,iBAAiB,EACpC,qBAAqB,EAAE,qBAAqB,EAC5C,kBAAkB,EAAE,kBAAkB,EACtC,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,GACZ,CACD,CACJ,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useRef } from 'react';\nimport { HotspotProps } from '../../hotspot/interfaces';\nimport { AnnotationContextProps } from '../interfaces';\nimport AnnotationTrigger from './annotation-trigger';\nimport { AnnotationPopover } from './annotation-popover';\n\nexport interface AnnotationProps {\n  title: string;\n  content: React.ReactNode;\n  alert?: React.ReactNode;\n\n  direction: HotspotProps['direction'];\n\n  nextButtonEnabled: boolean;\n  onNextButtonClick: () => void;\n\n  onFinish: () => void;\n\n  previousButtonEnabled: boolean;\n  onPreviousButtonClick: () => void;\n\n  showPreviousButton: boolean;\n  showFinishButton: boolean;\n\n  taskLocalStepIndex: number;\n\n  totalLocalSteps: number;\n\n  onDismiss: () => void;\n\n  i18nStrings: AnnotationContextProps['i18nStrings'];\n}\n\nexport function OpenAnnotation({\n  title,\n  content,\n  alert,\n\n  direction,\n\n  showPreviousButton,\n  showFinishButton,\n  taskLocalStepIndex,\n\n  totalLocalSteps,\n\n  onDismiss,\n\n  nextButtonEnabled,\n  onNextButtonClick,\n\n  onFinish,\n\n  previousButtonEnabled,\n  onPreviousButtonClick,\n  i18nStrings,\n}: AnnotationProps) {\n  const trackRef = useRef<HTMLButtonElement>(null);\n\n  return (\n    <>\n      <AnnotationTrigger\n        open={true}\n        onClick={onDismiss}\n        i18nStrings={i18nStrings}\n        ref={trackRef}\n        totalLocalSteps={totalLocalSteps}\n        taskLocalStepIndex={taskLocalStepIndex}\n      />\n\n      <AnnotationPopover\n        trackRef={trackRef}\n        previousButtonEnabled={previousButtonEnabled}\n        showPreviousButton={showPreviousButton}\n        showFinishButton={showFinishButton}\n        totalLocalSteps={totalLocalSteps}\n        i18nStrings={i18nStrings}\n        nextButtonEnabled={nextButtonEnabled}\n        onDismiss={onDismiss}\n        onFinish={onFinish}\n        onNextButtonClick={onNextButtonClick}\n        onPreviousButtonClick={onPreviousButtonClick}\n        taskLocalStepIndex={taskLocalStepIndex}\n        direction={direction}\n        title={title}\n        content={content}\n        alert={alert}\n      />\n    </>\n  );\n}\n"]}

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

@@ -1,29 +1,29 @@
 
     import './styles.scoped.css';
     export default {
-  "arrow": "awsui_arrow_1hpp3_12z9m_93",
-  "arrow-outer": "awsui_arrow-outer_1hpp3_12z9m_97",
-  "arrow-inner": "awsui_arrow-inner_1hpp3_12z9m_97",
-  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_12z9m_128",
-  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_12z9m_128",
-  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_12z9m_131",
-  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_12z9m_131",
-  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_12z9m_134",
-  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_12z9m_134",
-  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_12z9m_137",
-  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_12z9m_137",
-  "annotation": "awsui_annotation_1hpp3_12z9m_145",
-  "next-button": "awsui_next-button_1hpp3_12z9m_146",
-  "previous-button": "awsui_previous-button_1hpp3_12z9m_147",
-  "finish-button": "awsui_finish-button_1hpp3_12z9m_148",
-  "header": "awsui_header_1hpp3_12z9m_149",
-  "step-counter-content": "awsui_step-counter-content_1hpp3_12z9m_150",
-  "content": "awsui_content_1hpp3_12z9m_151",
-  "description": "awsui_description_1hpp3_12z9m_155",
-  "actionBar": "awsui_actionBar_1hpp3_12z9m_160",
-  "stepCounter": "awsui_stepCounter_1hpp3_12z9m_167",
-  "divider": "awsui_divider_1hpp3_12z9m_171",
-  "hotspot": "awsui_hotspot_1hpp3_12z9m_175",
-  "icon": "awsui_icon_1hpp3_12z9m_213"
+  "arrow": "awsui_arrow_1hpp3_cgcuy_93",
+  "arrow-outer": "awsui_arrow-outer_1hpp3_cgcuy_97",
+  "arrow-inner": "awsui_arrow-inner_1hpp3_cgcuy_97",
+  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_cgcuy_128",
+  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_cgcuy_128",
+  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_cgcuy_131",
+  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_cgcuy_131",
+  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_cgcuy_134",
+  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_cgcuy_134",
+  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_cgcuy_137",
+  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_cgcuy_137",
+  "annotation": "awsui_annotation_1hpp3_cgcuy_145",
+  "next-button": "awsui_next-button_1hpp3_cgcuy_146",
+  "previous-button": "awsui_previous-button_1hpp3_cgcuy_147",
+  "finish-button": "awsui_finish-button_1hpp3_cgcuy_148",
+  "header": "awsui_header_1hpp3_cgcuy_149",
+  "step-counter-content": "awsui_step-counter-content_1hpp3_cgcuy_150",
+  "content": "awsui_content_1hpp3_cgcuy_151",
+  "description": "awsui_description_1hpp3_cgcuy_155",
+  "actionBar": "awsui_actionBar_1hpp3_cgcuy_160",
+  "stepCounter": "awsui_stepCounter_1hpp3_cgcuy_167",
+  "divider": "awsui_divider_1hpp3_cgcuy_171",
+  "hotspot": "awsui_hotspot_1hpp3_cgcuy_175",
+  "icon": "awsui_icon_1hpp3_cgcuy_213"
 };
   

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

@@ -90,11 +90,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_arrow_1hpp3_12z9m_93:not(#\9) {
+.awsui_arrow_1hpp3_cgcuy_93:not(#\9) {
   width: 20px;
   height: 10px;
 }
-.awsui_arrow-outer_1hpp3_12z9m_97:not(#\9), .awsui_arrow-inner_1hpp3_12z9m_97:not(#\9) {
+.awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9), .awsui_arrow-inner_1hpp3_cgcuy_97:not(#\9) {
   position: absolute;
   overflow: hidden;
   width: 20px;
@@ -102,7 +102,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   top: 0;
   left: 0;
 }
-.awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after, .awsui_arrow-inner_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after, .awsui_arrow-inner_1hpp3_cgcuy_97:not(#\9)::after {
   content: "";
   box-sizing: border-box;
   display: inline-block;
@@ -115,26 +115,26 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   transform: rotate(45deg);
   transform-origin: 0 100%;
 }
-.awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after {
   background-color: var(--color-border-status-info-546i7i, #0972d3);
 }
-.awsui_arrow-inner_1hpp3_12z9m_97:not(#\9) {
+.awsui_arrow-inner_1hpp3_cgcuy_97:not(#\9) {
   top: 2px;
 }
-.awsui_arrow-inner_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-inner_1hpp3_cgcuy_97:not(#\9)::after {
   border-radius: 1px 0 0 0;
   background-color: var(--color-background-status-info-usb30e, #f2f8fd);
 }
-.awsui_arrow-position-right-top_1hpp3_12z9m_128 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after, .awsui_arrow-position-right-bottom_1hpp3_12z9m_128 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-position-right-top_1hpp3_cgcuy_128 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after, .awsui_arrow-position-right-bottom_1hpp3_cgcuy_128 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after {
   box-shadow: -0.71px 0.71px 4px -2px var(--color-shadow-default-3se70f, rgba(0, 7, 22, 0.12));
 }
-.awsui_arrow-position-left-top_1hpp3_12z9m_131 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after, .awsui_arrow-position-left-bottom_1hpp3_12z9m_131 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-position-left-top_1hpp3_cgcuy_131 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after, .awsui_arrow-position-left-bottom_1hpp3_cgcuy_131 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after {
   box-shadow: 0.71px -0.71px 4px -2px var(--color-shadow-default-3se70f, rgba(0, 7, 22, 0.12));
 }
-.awsui_arrow-position-top-center_1hpp3_12z9m_134 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after, .awsui_arrow-position-top-responsive_1hpp3_12z9m_134 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-position-top-center_1hpp3_cgcuy_134 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after, .awsui_arrow-position-top-responsive_1hpp3_cgcuy_134 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after {
   box-shadow: -0.71px -0.71px 4px -2px var(--color-shadow-default-3se70f, rgba(0, 7, 22, 0.12));
 }
-.awsui_arrow-position-bottom-center_1hpp3_12z9m_137 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after, .awsui_arrow-position-bottom-responsive_1hpp3_12z9m_137 > .awsui_arrow-outer_1hpp3_12z9m_97:not(#\9)::after {
+.awsui_arrow-position-bottom-center_1hpp3_cgcuy_137 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after, .awsui_arrow-position-bottom-responsive_1hpp3_cgcuy_137 > .awsui_arrow-outer_1hpp3_cgcuy_97:not(#\9)::after {
   box-shadow: 0.71px 0.71px 4px -2px var(--color-shadow-default-3se70f, rgba(0, 7, 22, 0.12));
 }
 
@@ -142,37 +142,37 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_annotation_1hpp3_12z9m_145:not(#\9),
-.awsui_next-button_1hpp3_12z9m_146:not(#\9),
-.awsui_previous-button_1hpp3_12z9m_147:not(#\9),
-.awsui_finish-button_1hpp3_12z9m_148:not(#\9),
-.awsui_header_1hpp3_12z9m_149:not(#\9),
-.awsui_step-counter-content_1hpp3_12z9m_150:not(#\9),
-.awsui_content_1hpp3_12z9m_151:not(#\9) {
+.awsui_annotation_1hpp3_cgcuy_145:not(#\9),
+.awsui_next-button_1hpp3_cgcuy_146:not(#\9),
+.awsui_previous-button_1hpp3_cgcuy_147:not(#\9),
+.awsui_finish-button_1hpp3_cgcuy_148:not(#\9),
+.awsui_header_1hpp3_cgcuy_149:not(#\9),
+.awsui_step-counter-content_1hpp3_cgcuy_150:not(#\9),
+.awsui_content_1hpp3_cgcuy_151:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_description_1hpp3_12z9m_155:not(#\9) {
+.awsui_description_1hpp3_cgcuy_155:not(#\9) {
   overflow: hidden;
   margin-top: var(--space-xxs-ynfts5, 4px);
 }
 
-.awsui_actionBar_1hpp3_12z9m_160:not(#\9) {
+.awsui_actionBar_1hpp3_cgcuy_160:not(#\9) {
   display: flex;
   justify-content: space-between;
   align-items: center;
   position: relative;
 }
 
-.awsui_stepCounter_1hpp3_12z9m_167:not(#\9) {
+.awsui_stepCounter_1hpp3_cgcuy_167:not(#\9) {
   margin-right: 20px;
 }
 
-.awsui_divider_1hpp3_12z9m_171:not(#\9) {
+.awsui_divider_1hpp3_cgcuy_171:not(#\9) {
   border-bottom: var(--border-divider-section-width-4wm2it, 2px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
 }
 
-.awsui_hotspot_1hpp3_12z9m_175:not(#\9) {
+.awsui_hotspot_1hpp3_cgcuy_175:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -211,21 +211,21 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border: none;
   padding: 0;
   cursor: pointer;
-  scroll-margin: var(--awsui-content-scroll-margin-f9jj7p, 40px 0 0 0);
+  scroll-margin: var(--awsui-content-scroll-margin-5mks97, 40px 0 0 0);
   width: 16px;
   height: 16px;
 }
-.awsui_hotspot_1hpp3_12z9m_175:not(#\9):focus {
+.awsui_hotspot_1hpp3_cgcuy_175:not(#\9):focus {
   outline: none;
 }
-.awsui_hotspot_1hpp3_12z9m_175[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_hotspot_1hpp3_cgcuy_175[data-awsui-focus-visible=true]:not(#\9):focus {
   position: relative;
 }
-.awsui_hotspot_1hpp3_12z9m_175[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_hotspot_1hpp3_cgcuy_175[data-awsui-focus-visible=true]:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(2px - 1px);
 }
-.awsui_hotspot_1hpp3_12z9m_175[data-awsui-focus-visible=true]:not(#\9):focus::before {
+.awsui_hotspot_1hpp3_cgcuy_175[data-awsui-focus-visible=true]:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -236,13 +236,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-control-circular-focus-ring-qawzn7, 4px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-ap3b6s, #0972d3);
 }
-.awsui_hotspot_1hpp3_12z9m_175 > .awsui_icon_1hpp3_12z9m_213:not(#\9) {
+.awsui_hotspot_1hpp3_cgcuy_175 > .awsui_icon_1hpp3_cgcuy_213:not(#\9) {
   position: relative;
   stroke: var(--color-text-link-default-5f186r, #0972d3);
 }
-.awsui_hotspot_1hpp3_12z9m_175:not(#\9):hover > .awsui_icon_1hpp3_12z9m_213 {
+.awsui_hotspot_1hpp3_cgcuy_175:not(#\9):hover > .awsui_icon_1hpp3_cgcuy_213 {
   stroke: var(--color-text-link-hover-kololx, #033160);
 }
-.awsui_hotspot_1hpp3_12z9m_175:not(#\9):active > .awsui_icon_1hpp3_12z9m_213 {
+.awsui_hotspot_1hpp3_cgcuy_175:not(#\9):active > .awsui_icon_1hpp3_cgcuy_213 {
   stroke: var(--color-text-link-default-5f186r, #0972d3);
 }

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

@@ -2,29 +2,29 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "arrow": "awsui_arrow_1hpp3_12z9m_93",
-  "arrow-outer": "awsui_arrow-outer_1hpp3_12z9m_97",
-  "arrow-inner": "awsui_arrow-inner_1hpp3_12z9m_97",
-  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_12z9m_128",
-  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_12z9m_128",
-  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_12z9m_131",
-  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_12z9m_131",
-  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_12z9m_134",
-  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_12z9m_134",
-  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_12z9m_137",
-  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_12z9m_137",
-  "annotation": "awsui_annotation_1hpp3_12z9m_145",
-  "next-button": "awsui_next-button_1hpp3_12z9m_146",
-  "previous-button": "awsui_previous-button_1hpp3_12z9m_147",
-  "finish-button": "awsui_finish-button_1hpp3_12z9m_148",
-  "header": "awsui_header_1hpp3_12z9m_149",
-  "step-counter-content": "awsui_step-counter-content_1hpp3_12z9m_150",
-  "content": "awsui_content_1hpp3_12z9m_151",
-  "description": "awsui_description_1hpp3_12z9m_155",
-  "actionBar": "awsui_actionBar_1hpp3_12z9m_160",
-  "stepCounter": "awsui_stepCounter_1hpp3_12z9m_167",
-  "divider": "awsui_divider_1hpp3_12z9m_171",
-  "hotspot": "awsui_hotspot_1hpp3_12z9m_175",
-  "icon": "awsui_icon_1hpp3_12z9m_213"
+  "arrow": "awsui_arrow_1hpp3_cgcuy_93",
+  "arrow-outer": "awsui_arrow-outer_1hpp3_cgcuy_97",
+  "arrow-inner": "awsui_arrow-inner_1hpp3_cgcuy_97",
+  "arrow-position-right-top": "awsui_arrow-position-right-top_1hpp3_cgcuy_128",
+  "arrow-position-right-bottom": "awsui_arrow-position-right-bottom_1hpp3_cgcuy_128",
+  "arrow-position-left-top": "awsui_arrow-position-left-top_1hpp3_cgcuy_131",
+  "arrow-position-left-bottom": "awsui_arrow-position-left-bottom_1hpp3_cgcuy_131",
+  "arrow-position-top-center": "awsui_arrow-position-top-center_1hpp3_cgcuy_134",
+  "arrow-position-top-responsive": "awsui_arrow-position-top-responsive_1hpp3_cgcuy_134",
+  "arrow-position-bottom-center": "awsui_arrow-position-bottom-center_1hpp3_cgcuy_137",
+  "arrow-position-bottom-responsive": "awsui_arrow-position-bottom-responsive_1hpp3_cgcuy_137",
+  "annotation": "awsui_annotation_1hpp3_cgcuy_145",
+  "next-button": "awsui_next-button_1hpp3_cgcuy_146",
+  "previous-button": "awsui_previous-button_1hpp3_cgcuy_147",
+  "finish-button": "awsui_finish-button_1hpp3_cgcuy_148",
+  "header": "awsui_header_1hpp3_cgcuy_149",
+  "step-counter-content": "awsui_step-counter-content_1hpp3_cgcuy_150",
+  "content": "awsui_content_1hpp3_cgcuy_151",
+  "description": "awsui_description_1hpp3_cgcuy_155",
+  "actionBar": "awsui_actionBar_1hpp3_cgcuy_160",
+  "stepCounter": "awsui_stepCounter_1hpp3_cgcuy_167",
+  "divider": "awsui_divider_1hpp3_cgcuy_171",
+  "hotspot": "awsui_hotspot_1hpp3_cgcuy_175",
+  "icon": "awsui_icon_1hpp3_cgcuy_213"
 };
   

package/annotation-context/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/annotation-context/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAOtD,OAAO,EAAE,sBAAsB,EAAE,CAAC;AAElC,wBAAgB,WAAW,CAAC,WAAW,EAAE,SAAS,sBAAsB,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM;;;;;;;;;;EAa7F;AAKD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,eAAe,EACf,QAAQ,EACR,YAAY,EACZ,QAAQ,EAAE,eAAe,EACzB,eAAe,EACf,cAAc,EACd,WAAW,GACZ,EAAE,sBAAsB,GAAG,GAAG,CAAC,OAAO,CAsOtC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/annotation-context/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAOtD,OAAO,EAAE,sBAAsB,EAAE,CAAC;AAElC,wBAAgB,WAAW,CAAC,WAAW,EAAE,SAAS,sBAAsB,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM;;;;;;;;;;EAa7F;AAKD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,EACxC,eAAe,EACf,QAAQ,EACR,YAAY,EACZ,QAAQ,EAAE,eAAe,EACzB,eAAe,EACf,cAAc,EACd,WAAW,GACZ,EAAE,sBAAsB,GAAG,GAAG,CAAC,OAAO,CA0OtC"}

package/annotation-context/index.js

@@ -124,7 +124,8 @@ export default function AnnotationContext(_a) {
             return null;
         }
         if (!task || !step || !open || id !== currentId) {
-            return (React.createElement(ClosedAnnotation, { globalStepIndex: globalStepIndex, i18nStrings: i18nStrings, onOpen: onOpen, focusOnRender: 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 }));
         }
         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 }));
     }, [
@@ -146,6 +147,7 @@ export default function AnnotationContext(_a) {
         openPreviousStep,
         onDismiss,
         onOpen,
+        annotations,
     ]);
     var registerHotspot = useCallback(function (id) {
         var _a;