npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.1382 → 3.0.1384 - Mend

@cloudscape-design/components-themeable 3.0.1382 → 3.0.1384

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (221) hide show

package/lib/internal/template/modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/modal/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAE5E,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,sBAAsB,GACvB,MAAM,mDAAmD,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,EAAkC,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AACvG,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,aAAa,EAAE,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAElE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,SAAS,wBAAwB,CAAC,EAChC,iBAAiB,EACjB,kBAAkB,EAClB,IAAI,GAAG,QAAQ,EACf,GAAG,KAAK,EACyF;IACjG,MAAM,OAAO,GAAG,WAAW,EAAE,CAAC;IAC9B,MAAM,cAAc,GAAG;QACrB,CAAC,kBAAkB,CAAC,EAAE,OAAO;KAC9B,CAAC;IAEF,OAAO,CACL,oBAAC,eAAe,IACd,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,gBAAgB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,kBAAkB,EACvD,cAAc,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,QAAQ,EAC3C,kBAAkB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY,EACnD,kBAAkB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY,EACnD,UAAU,EAAC,OAAO,EAClB,mBAAmB,EAAE,EAAE,EACvB,gBAAgB,EAAE,CAAC,EACnB,mBAAmB,EAAE,GAAG,EAAE;;YAAC,OAAA;gBACzB,IAAI,kBAAkB,KAAK,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,0CAAE,MAAM,CAAC,OAAO,CAAC,OAAO,MAAM,CAAC,cAAc,CAAC,EAAE;aACvF,CAAA;SAAA;QAED,oBAAC,mBAAmB,IAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,cAAc,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,kBAAkB,EACrD,gBAAgB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY,EACjD,UAAU,EAAE,CAAC;YAEb,oBAAC,sBAAsB,IACrB,iBAAiB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,kBAAkB,EACxD,mBAAmB,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY;gBAEpD,oBAAC,qBAAqB,IACpB,IAAI,EAAE,IAAI,~~KACN~~,KAAK,KACL,kBAAkB,KAClB,cAAc,EAClB,kCAAkC,EAAE,IAAI,GACxC,CACqB,CACL,CACN,CACnB,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,~~EAAE~~,IAAI,GAAG,QAAQ,~~EAAE~~,QAAQ,GAAG,QAAQ,~~EAAE~~,KAAK,~~EAAE~~,MAAM,~~EAAE~~,GAAG,KAAK,~~EAAc~~;~~IACzG~~,MAAM,EAAE,UAAU,EAAE,GAAG,SAAS,EAAE,CAAC;IACnC,MAAM,iBAAiB,GAAG,yBAAyB,CAAC,KAAuC,CAAC,CAAC;IAC7F,MAAM,kBAAkB,GAAG,gBAAgB,CACzC,OAAO,EACP;QACE,KAAK,EAAE;YACL,IAAI;YACJ,QAAQ;YACR,sBAAsB,EAAE,KAAK,CAAC,sBAAsB;YACpD,QAAQ,EAAE,iBAAiB,CAAC,QAAQ;YACpC,KAAK;YACL,MAAM;SACP;QACD,QAAQ,EAAE;YACR,eAAe,EAAE,OAAO,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,YAAY,CAAC;YACzD,qBAAqB,EAAE,OAAO,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,kBAAkB,CAAC;SACtE;KACF,EACD,iBAAiB,CAClB,CAAC;IAEF,IAAI,CAAC,UAAU,EAAE,CAAC;QAChB,OAAO,CACL,oBAAC,wBAAwB,IACvB,iBAAiB,EAAE,iBAAiB,EACpC,kBAAkB,EAAE,kBAAkB,EACtC,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,KAAK,GACT,CACH,CAAC;IACJ,CAAC;IAED,OAAO,CACL,oBAAC,aAAa,IACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,KAAK,KACL,kBAAkB,EACtB,kCAAkC,EAAE,IAAI,GACxC,CACH,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport {\n AnalyticsFunnel,\n AnalyticsFunnelStep,\n AnalyticsFunnelSubStep,\n} from '../internal/analytics/components/analytics-funnel';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel';\nimport { DATA_ATTR_MODAL_ID } from '../internal/analytics/selectors';\nimport { BasePropsWithAnalyticsMetadata, getAnalyticsMetadataProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { ModalProps } from './interfaces';\nimport InternalModal, { InternalModalAsFunnel } from './internal';\n\nimport styles from './styles.css.js';\n\nexport { ModalProps };\n\nfunction ModalWithAnalyticsFunnel({\n analyticsMetadata,\n baseComponentProps,\n size = 'medium',\n ...props\n}: ModalProps & { analyticsMetadata: any; baseComponentProps: ReturnType<typeof useBaseComponent> }) {\n const modalId = useUniqueId();\n const dataAttributes = {\n [DATA_ATTR_MODAL_ID]: modalId,\n };\n\n return (\n <AnalyticsFunnel\n mounted={props.visible}\n funnelIdentifier={analyticsMetadata?.instanceIdentifier}\n funnelFlowType={analyticsMetadata?.flowType}\n funnelErrorContext={analyticsMetadata?.errorContext}\n funnelResourceType={analyticsMetadata?.resourceType}\n funnelType=\"modal\"\n optionalStepNumbers={[]}\n totalFunnelSteps={1}\n funnelNameSelectors={() => [\n `[${DATA_ATTR_MODAL_ID}=\"${window?.CSS?.escape(modalId)}\"] .${styles['header--text']}`,\n ]}\n >\n <AnalyticsFunnelStep\n mounted={props.visible}\n stepIdentifier={analyticsMetadata?.instanceIdentifier}\n stepErrorContext={analyticsMetadata?.errorContext}\n stepNumber={1}\n >\n <AnalyticsFunnelSubStep\n subStepIdentifier={analyticsMetadata?.instanceIdentifier}\n subStepErrorContext={analyticsMetadata?.errorContext}\n >\n <InternalModalAsFunnel\n size={size}\n {...props}\n {...baseComponentProps}\n {...dataAttributes}\n __injectAnalyticsComponentMetadata={true}\n />\n </AnalyticsFunnelSubStep>\n </AnalyticsFunnelStep>\n </AnalyticsFunnel>\n );\n}\n\nexport default function Modal({ size = 'medium', position = 'center', width, height, ...props }: ModalProps) {\n const { isInFunnel } = useFunnel();\n const analyticsMetadata = getAnalyticsMetadataProps(props as BasePropsWithAnalyticsMetadata);\n const baseComponentProps = useBaseComponent(\n 'Modal',\n {\n props: {\n size,\n position,\n disableContentPaddings: props.disableContentPaddings,\n flowType: analyticsMetadata.flowType,\n width,\n height,\n },\n metadata: {\n hasResourceType: Boolean(analyticsMetadata?.resourceType),\n hasInstanceIdentifier: Boolean(analyticsMetadata?.instanceIdentifier),\n },\n },\n analyticsMetadata\n );\n\n if (!isInFunnel) {\n return (\n <ModalWithAnalyticsFunnel\n analyticsMetadata={analyticsMetadata}\n baseComponentProps={baseComponentProps}\n size={size}\n position={position}\n width={width}\n height={height}\n {...props}\n />\n );\n }\n\n return (\n <InternalModal\n size={size}\n position={position}\n width={width}\n height={height}\n {...props}\n {...baseComponentProps}\n __injectAnalyticsComponentMetadata={true}\n />\n );\n}\n\napplyDisplayName(Modal, 'Modal');\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/modal/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\n'use client';\nimport React from 'react';\n\nimport { useUniqueId } from '@cloudscape-design/component-toolkit/internal';\n\nimport {\n AnalyticsFunnel,\n AnalyticsFunnelStep,\n AnalyticsFunnelSubStep,\n} from '../internal/analytics/components/analytics-funnel';\nimport { useFunnel } from '../internal/analytics/hooks/use-funnel';\nimport { DATA_ATTR_MODAL_ID } from '../internal/analytics/selectors';\nimport { BasePropsWithAnalyticsMetadata, getAnalyticsMetadataProps } from '../internal/base-component';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { ModalProps } from './interfaces';\nimport InternalModal, { InternalModalAsFunnel } from './internal';\n\nimport styles from './styles.css.js';\n\nexport { ModalProps };\n\nfunction ModalWithAnalyticsFunnel({\n analyticsMetadata,\n baseComponentProps,\n size = 'medium',\n hideDismissButton,\n ...props\n}: ModalProps & { analyticsMetadata: any; baseComponentProps: ReturnType<typeof useBaseComponent> }) {\n const modalId = useUniqueId();\n const dataAttributes = {\n [DATA_ATTR_MODAL_ID]: modalId,\n };\n\n return (\n <AnalyticsFunnel\n mounted={props.visible}\n funnelIdentifier={analyticsMetadata?.instanceIdentifier}\n funnelFlowType={analyticsMetadata?.flowType}\n funnelErrorContext={analyticsMetadata?.errorContext}\n funnelResourceType={analyticsMetadata?.resourceType}\n funnelType=\"modal\"\n optionalStepNumbers={[]}\n totalFunnelSteps={1}\n funnelNameSelectors={() => [\n `[${DATA_ATTR_MODAL_ID}=\"${window?.CSS?.escape(modalId)}\"] .${styles['header--text']}`,\n ]}\n >\n <AnalyticsFunnelStep\n mounted={props.visible}\n stepIdentifier={analyticsMetadata?.instanceIdentifier}\n stepErrorContext={analyticsMetadata?.errorContext}\n stepNumber={1}\n >\n <AnalyticsFunnelSubStep\n subStepIdentifier={analyticsMetadata?.instanceIdentifier}\n subStepErrorContext={analyticsMetadata?.errorContext}\n >\n <InternalModalAsFunnel\n size={size}\n hideDismissButton={hideDismissButton}\n {...props}\n {...baseComponentProps}\n {...dataAttributes}\n __injectAnalyticsComponentMetadata={true}\n />\n </AnalyticsFunnelSubStep>\n </AnalyticsFunnelStep>\n </AnalyticsFunnel>\n );\n}\n\nexport default function Modal({\n size = 'medium',\n position = 'center',\n hideDismissButton = false,\n width,\n height,\n ...props\n}: ModalProps) {\n const { isInFunnel } = useFunnel();\n const analyticsMetadata = getAnalyticsMetadataProps(props as BasePropsWithAnalyticsMetadata);\n const baseComponentProps = useBaseComponent(\n 'Modal',\n {\n props: {\n size,\n position,\n hideDismissButton,\n disableContentPaddings: props.disableContentPaddings,\n flowType: analyticsMetadata.flowType,\n width,\n height,\n },\n metadata: {\n hasResourceType: Boolean(analyticsMetadata?.resourceType),\n hasInstanceIdentifier: Boolean(analyticsMetadata?.instanceIdentifier),\n },\n },\n analyticsMetadata\n );\n\n if (!isInFunnel) {\n return (\n <ModalWithAnalyticsFunnel\n analyticsMetadata={analyticsMetadata}\n baseComponentProps={baseComponentProps}\n size={size}\n position={position}\n hideDismissButton={hideDismissButton}\n width={width}\n height={height}\n {...props}\n />\n );\n }\n\n return (\n <InternalModal\n size={size}\n position={position}\n hideDismissButton={hideDismissButton}\n width={width}\n height={height}\n {...props}\n {...baseComponentProps}\n __injectAnalyticsComponentMetadata={true}\n />\n );\n}\n\napplyDisplayName(Modal, 'Modal');\n"]}

package/lib/internal/template/modal/interfaces.d.ts CHANGED Viewed

@@ -47,6 +47,13 @@ export interface ModalProps extends BaseComponentProps, BaseModalProps {
      *   vertical repositioning that can cause users to lose context.
      */
     position?: ModalProps.Position;
+    /**
+     * Determines whether the close button is displayed in the header.
+     * When set to `true`, the close button isn't rendered, and the user resolves
+     * the modal by choosing one of the actions in the footer.
+     * ESC and clicks outside the modal still call `onDismiss`.
+     */
+    hideDismissButton?: boolean;
     /**
      * Determines whether the modal is displayed on the screen. Modals are hidden by default.
      * Set this property to `true` to show them.

package/lib/internal/template/modal/interfaces.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/modal/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAE5E,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAE5D,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC,cAAc,CAAC,CAAC;IAE3C;;;;OAIG;IACH,eAAe,CAAC,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAC;CAClD;AAED,MAAM,WAAW,UAAW,SAAQ,kBAAkB,EAAE,cAAc;IACpE;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC;IACvB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC;IAC/B;;;OAGG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IAChE;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;IAExB;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC;CAClD;AAED,yBAAiB,UAAU,CAAC;IAC1B,KAAY,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,KAAK,CAAC;IACjF,KAAY,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;IAExC,UAAiB,aAAa;QAC5B,MAAM,EAAE,MAAM,CAAC;KAChB;IAED,UAAiB,iBAAiB;QAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,QAAQ,CAAC,EAAE,QAAQ,CAAC;QACpB,YAAY,CAAC,EAAE,MAAM,CAAC;KACvB;CACF"}
1	+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/modal/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,+CAA+C,CAAC;AAE5E,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAE5D,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC,cAAc,CAAC,CAAC;IAE3C;;;;OAIG;IACH,eAAe,CAAC,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAC;CAClD;AAED,MAAM,WAAW,UAAW,SAAQ,kBAAkB,EAAE,cAAc;IACpE;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC;IACvB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC;IAC/B;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;OAEG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IAChE;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC;IAExB;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC;CAClD;AAED,yBAAiB,UAAU,CAAC;IAC1B,KAAY,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,KAAK,CAAC;IACjF,KAAY,QAAQ,GAAG,QAAQ,GAAG,KAAK,CAAC;IAExC,UAAiB,aAAa;QAC5B,MAAM,EAAE,MAAM,CAAC;KAChB;IAED,UAAiB,iBAAiB;QAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;QAC5B,QAAQ,CAAC,EAAE,QAAQ,CAAC;QACpB,YAAY,CAAC,EAAE,MAAM,CAAC;KACvB;CACF"}

package/lib/internal/template/modal/interfaces.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/modal/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { PortalProps } from '@cloudscape-design/component-toolkit/internal';\n\nimport { FlowType } from '../types/analytics';\nimport { BaseComponentProps } from '../types/base-component';\nimport { NonCancelableEventHandler } from '../types/events';\n\nexport interface BaseModalProps {\n /*\n Use this property to specify a different dynamic modal root for the dialog.\n * The function will be called when a user clicks on the trigger button.\n /\n getModalRoot?: PortalProps['getContainer'];\n\n /\n Use this property when `getModalRoot` is used to clean up the modal root\n * element after a user closes the dialog. The function receives the return value\n * of the most recent getModalRoot call as an argument.\n /\n removeModalRoot?: PortalProps['removeContainer'];\n}\n\nexport interface ModalProps extends BaseComponentProps, BaseModalProps {\n /\n Specifies the width of the modal. When provided, takes precedence over the `size` property.\n * If the specified width exceeds available viewport space, the modal will use the maximum available space.\n * The minimum width is 320px (equivalent to the `small` size).\n /\n width?: number;\n\n /\n Specifies the height of the modal. When provided, the modal content becomes scrollable if it exceeds the specified height.\n * If the specified height exceeds available viewport space, the modal will use the maximum available space.\n * To make sure the content is accessible, the component will apply a minimum height of 60px for the content area,\n * plus the header height and the footer height.\n /\n height?: number;\n\n /\n Sets the width of the modal. `max` uses variable width up to the\n * largest size allowed by the design guidelines. Other sizes have fixed widths:\n * `small` (320px), `medium` (600px), `large` (820px), `x-large` (1024px), `xx-large` (1280px).\n /\n size?: ModalProps.Size;\n /\n Controls the vertical positioning of the modal.\n \n - `center` (default) - The modal is vertically centered in the viewport and re-centers\n * when content height changes. Use for dialogs with static, predictable content.\n \n - `top` - The modal anchors at fixed distance and grows downward\n * as content expands. Use when the content changes dynamically to prevent disruptive\n * vertical repositioning that can cause users to lose context.\n /\n position?: ModalProps.Position;\n /\n Determines whether the modal is displayed on the screen. Modals are hidden by default.\n * Set this property to `true` to show them.\n /\n visible: boolean;\n /\n Adds an `aria-label` to the close button, for accessibility.\n * @i18n\n /\n closeAriaLabel?: string;\n /\n Specifies a title for the modal. Although this can be empty, we suggest that you always provide a title.\n /\n header?: React.ReactNode;\n /\n Body of the modal.\n /\n children?: React.ReactNode;\n /\n Specifies a footer for the modal. If empty, the footer isn't displayed.\n /\n footer?: React.ReactNode;\n /\n Determines whether the modal content has padding. If `true`, removes the default padding from the content area.\n /\n disableContentPaddings?: boolean;\n /\n Called when a user closes the modal by using the close icon button,\n * clicking outside of the modal, or pressing ESC.\n * The event detail contains the `reason`, which can be any of the following:\n * `['closeButton', 'overlay', 'keyboard']`.\n /\n onDismiss?: NonCancelableEventHandler<ModalProps.DismissDetail>;\n /\n Specifies the HTML element where the modal is rendered.\n * If neither `modalRoot` or `getModalRoot` properties are provided, the modal will\n * render to an element under `document.body`.\n /\n modalRoot?: HTMLElement;\n\n /\n Specifies additional analytics-related metadata.\n * * `instanceIdentifier` - A unique string that identifies this component instance in your application.\n * * `flowType` - Identifies the type of flow represented by the component.\n * * `resourceType` - Identifies the type of resource represented by the flow. Note: This API is currently experimental.\n * @analytics\n */\n analyticsMetadata?: ModalProps.AnalyticsMetadata;\n}\n\nexport namespace ModalProps {\n export type Size = 'small' \| 'medium' \| 'large' \| 'x-large' \| 'xx-large' \| 'max';\n export type Position = 'center' \| 'top';\n\n export interface DismissDetail {\n reason: string;\n }\n\n export interface AnalyticsMetadata {\n instanceIdentifier?: string;\n flowType?: FlowType;\n resourceType?: string;\n }\n}\n"]}
1	+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/modal/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\n\nimport { PortalProps } from '@cloudscape-design/component-toolkit/internal';\n\nimport { FlowType } from '../types/analytics';\nimport { BaseComponentProps } from '../types/base-component';\nimport { NonCancelableEventHandler } from '../types/events';\n\nexport interface BaseModalProps {\n /*\n Use this property to specify a different dynamic modal root for the dialog.\n * The function will be called when a user clicks on the trigger button.\n /\n getModalRoot?: PortalProps['getContainer'];\n\n /\n Use this property when `getModalRoot` is used to clean up the modal root\n * element after a user closes the dialog. The function receives the return value\n * of the most recent getModalRoot call as an argument.\n /\n removeModalRoot?: PortalProps['removeContainer'];\n}\n\nexport interface ModalProps extends BaseComponentProps, BaseModalProps {\n /\n Specifies the width of the modal. When provided, takes precedence over the `size` property.\n * If the specified width exceeds available viewport space, the modal will use the maximum available space.\n * The minimum width is 320px (equivalent to the `small` size).\n /\n width?: number;\n\n /\n Specifies the height of the modal. When provided, the modal content becomes scrollable if it exceeds the specified height.\n * If the specified height exceeds available viewport space, the modal will use the maximum available space.\n * To make sure the content is accessible, the component will apply a minimum height of 60px for the content area,\n * plus the header height and the footer height.\n /\n height?: number;\n\n /\n Sets the width of the modal. `max` uses variable width up to the\n * largest size allowed by the design guidelines. Other sizes have fixed widths:\n * `small` (320px), `medium` (600px), `large` (820px), `x-large` (1024px), `xx-large` (1280px).\n /\n size?: ModalProps.Size;\n /\n Controls the vertical positioning of the modal.\n \n - `center` (default) - The modal is vertically centered in the viewport and re-centers\n * when content height changes. Use for dialogs with static, predictable content.\n \n - `top` - The modal anchors at fixed distance and grows downward\n * as content expands. Use when the content changes dynamically to prevent disruptive\n * vertical repositioning that can cause users to lose context.\n /\n position?: ModalProps.Position;\n /\n Determines whether the close button is displayed in the header.\n * When set to `true`, the close button isn't rendered, and the user resolves\n * the modal by choosing one of the actions in the footer.\n * ESC and clicks outside the modal still call `onDismiss`.\n /\n hideDismissButton?: boolean;\n /\n Determines whether the modal is displayed on the screen. Modals are hidden by default.\n * Set this property to `true` to show them.\n /\n visible: boolean;\n /\n Adds an `aria-label` to the close button, for accessibility.\n * @i18n\n /\n closeAriaLabel?: string;\n /\n Specifies a title for the modal. Although this can be empty, we suggest that you always provide a title.\n /\n header?: React.ReactNode;\n /\n Body of the modal.\n /\n children?: React.ReactNode;\n /\n Specifies a footer for the modal. If empty, the footer isn't displayed.\n /\n footer?: React.ReactNode;\n /\n Determines whether the modal content has padding. If `true`, removes the default padding from the content area.\n /\n disableContentPaddings?: boolean;\n /\n Called when a user closes the modal by using the close icon button,\n * clicking outside of the modal, or pressing ESC.\n * The event detail contains the `reason`, which can be any of the following:\n * `['closeButton', 'overlay', 'keyboard']`.\n /\n onDismiss?: NonCancelableEventHandler<ModalProps.DismissDetail>;\n /\n Specifies the HTML element where the modal is rendered.\n * If neither `modalRoot` or `getModalRoot` properties are provided, the modal will\n * render to an element under `document.body`.\n /\n modalRoot?: HTMLElement;\n\n /\n Specifies additional analytics-related metadata.\n * * `instanceIdentifier` - A unique string that identifies this component instance in your application.\n * * `flowType` - Identifies the type of flow represented by the component.\n * * `resourceType` - Identifies the type of resource represented by the flow. Note: This API is currently experimental.\n * @analytics\n */\n analyticsMetadata?: ModalProps.AnalyticsMetadata;\n}\n\nexport namespace ModalProps {\n export type Size = 'small' \| 'medium' \| 'large' \| 'x-large' \| 'xx-large' \| 'max';\n export type Position = 'center' \| 'top';\n\n export interface DismissDetail {\n reason: string;\n }\n\n export interface AnalyticsMetadata {\n instanceIdentifier?: string;\n flowType?: FlowType;\n resourceType?: string;\n }\n}\n"]}

package/lib/internal/template/modal/internal.js CHANGED Viewed

@@ -44,7 +44,7 @@ export default function InternalModal({ modalRoot, getModalRoot, removeModalRoot
 }
 // Separate component to prevent the Portal from getting in the way of refs, as it needs extra cycles to render the inner components.
 // useContainerQuery needs its targeted element to exist on the first render in order to work properly.
-function PortaledModal({ size, visible, header, children, footer, disableContentPaddings, position = 'center', onButtonClick = () => { }, onDismiss, width, height, __internalRootRef, __injectAnalyticsComponentMetadata, __funnelProps, __funnelStepProps, __subStepRef, __subStepFunnelProps, referrerId, ...rest }) {
+function PortaledModal({ size, hideDismissButton = false, visible, header, children, footer, disableContentPaddings, position = 'center', onButtonClick = () => { }, onDismiss, width, height, __internalRootRef, __injectAnalyticsComponentMetadata, __funnelProps, __funnelStepProps, __subStepRef, __subStepFunnelProps, referrerId, ...rest }) {
     var _a;
     const instanceUniqueId = useUniqueId();
     const headerId = `${rest.id || instanceUniqueId}-header`;
@@ -54,6 +54,7 @@ function PortaledModal({ size, visible, header, children, footer, disableContent
     const closeAriaLabel = i18n('closeAriaLabel', rest.closeAriaLabel);
     const refObject = useRef(null);
     const mergedRef = useMergeRefs(breakpointsRef, refObject, __internalRootRef);
+    const dialogRef = useRef(null);
     const isRefresh = useVisualRefresh();
     const baseProps = getBaseProps(rest);
     const analyticsComponentMetadata = {
@@ -122,6 +123,13 @@ function PortaledModal({ size, visible, header, children, footer, disableContent
     const dismiss = (reason) => fireNonCancelableEvent(onDismiss, { reason });
     const onOverlayMouseDown = (event) => {
         lastMouseDownElementRef.current = event.target;
+        // The overlay can't hold focus, so pressing it would blur whatever is focused inside the
+        // dialog and leave focus on the document body. That takes focus out of the dialog, which
+        // breaks focus containment and stops ESC from reaching the handler on the dialog element.
+        // Preventing the default action keeps focus where it is.
+        if (event.target === refObject.current) {
+            event.preventDefault();
+        }
     };
     const onOverlayClick = (event) => {
         const overlay = refObject.current;
@@ -140,7 +148,13 @@ function PortaledModal({ size, visible, header, children, footer, disableContent
     // to detect when the user has scrolled to the bottom.
     const { ref: stickySentinelRef, isIntersecting: footerStuck } = useIntersectionObserver();
     const headerTextRef = useRef(null);
+    const headingTagRef = useRef(null);
     const { subStepRef } = useFunnelSubStep();
+    // Without a dismiss button there is no predictable first focusable element, so focus the
+    // heading to announce what the modal is about. When no header is given, fall back to the
+    // dialog.
+    const hasHeader = header !== undefined && header !== null && header !== false && header !== '';
+    const autoFocusTarget = hideDismissButton ? (hasHeader ? headingTagRef : dialogRef) : undefined;
     const { footerRef, headerRef, hasCustomHeight, hasCustomWidth, dialogCustomStyles, footerHeight } = useModalDimensions({
         height,
         width,
@@ -153,15 +167,18 @@ function PortaledModal({ size, visible, header, children, footer, disableContent
                     componentLoadingCount,
                     emitTimeToContentReadyInModal,
                 } },
-                React.createElement("div", { ...baseProps, ...__funnelProps, ...__funnelStepProps, className: clsx(styles.root, { [styles.hidden]: !visible }, baseProps.className, isRefresh && styles.refresh), role: "dialog", "aria-labelledby": headerId, onMouseDown: onOverlayMouseDown, onClick: onOverlayClick, ref: mergedRef, style: footerHeight ? { scrollPaddingBottom: footerHeight } : undefined, "data-awsui-referrer-id": ((_a = subStepRef.current) === null || _a === void 0 ? void 0 : _a.id) || referrerId },
-                    React.createElement(FocusLock, { disabled: !visible, autoFocus: true, restoreFocus: true, className: clsx(styles['focus-lock'], styles[`position-${position}`]) },
-                        React.createElement("div", { className: clsx(styles.dialog, !hasCustomWidth && styles[size], styles[`breakpoint-${breakpoint}`], isRefresh && styles.refresh, hasCustomWidth && styles['custom-width'], hasCustomHeight && styles['custom-height']), style: dialogCustomStyles, onKeyDown: escKeyHandler, ...metadataAttribute },
+                React.createElement("div", { ...baseProps, ...__funnelProps, ...__funnelStepProps, className: clsx(styles.root, { [styles.hidden]: !visible }, hideDismissButton && styles['hide-dismiss-button'], baseProps.className, isRefresh && styles.refresh), role: "dialog", "aria-labelledby": headerId, onMouseDown: onOverlayMouseDown, onClick: onOverlayClick, ref: mergedRef, style: footerHeight ? { scrollPaddingBottom: footerHeight } : undefined, "data-awsui-referrer-id": ((_a = subStepRef.current) === null || _a === void 0 ? void 0 : _a.id) || referrerId },
+                    React.createElement(FocusLock, { disabled: !visible, autoFocus: true, restoreFocus: true, autoFocusTarget: autoFocusTarget, className: clsx(styles['focus-lock'], styles[`position-${position}`]) },
+                        React.createElement("div", { className: clsx(styles.dialog, !hasCustomWidth && styles[size], styles[`breakpoint-${breakpoint}`], isRefresh && styles.refresh, hasCustomWidth && styles['custom-width'], hasCustomHeight && styles['custom-height']), ref: dialogRef, style: dialogCustomStyles, onKeyDown: escKeyHandler,
+                            // Keeps the dialog focusable so that clicking a non-focusable area inside it moves
+                            // focus to the dialog rather than the document body.
+                            tabIndex: -1, ...metadataAttribute },
                             React.createElement("div", { className: clsx(styles.container, hasCustomHeight && styles['custom-height-container']) },
                                 React.createElement("div", { ref: headerRef, className: clsx(styles.header, analyticsSelectors.header) },
-                                    React.createElement(InternalHeader, { variant: "h2", __disableActionsWrapping: true, actions: React.createElement("div", { ...getAnalyticsMetadataAttribute({
+                                    React.createElement(InternalHeader, { variant: "h2", __disableActionsWrapping: true, __headingTagRef: headingTagRef, __headingTagTabIndex: -1, actions: hideDismissButton ? undefined : (React.createElement("div", { ...getAnalyticsMetadataAttribute({
                                                 action: 'dismiss',
                                             }) },
-                                            React.createElement(InternalButton, { ariaLabel: closeAriaLabel, className: styles['dismiss-control'], variant: "modal-dismiss", iconName: "close", formAction: "none", onClick: onCloseButtonClick })) },
+                                            React.createElement(InternalButton, { ariaLabel: closeAriaLabel, className: styles['dismiss-control'], variant: "modal-dismiss", iconName: "close", formAction: "none", onClick: onCloseButtonClick }))) },
                                         React.createElement("span", { ref: headerTextRef, id: headerId, className: styles['header--text'] }, header))),
                                 React.createElement(BuiltInErrorBoundary, { wrapper: content => React.createElement(InternalBox, { padding: { bottom: 'm', horizontal: 'l' } }, content) },
                                     React.createElement("div", { ref: __subStepRef, ...__subStepFunnelProps, className: clsx(styles.content, { [styles['no-paddings']]: disableContentPaddings }, hasCustomHeight && styles['custom-height-content']), ...(hasCustomHeight && {

package/lib/internal/template/modal/internal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/modal/internal.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, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { Portal, useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalBox from '../box/internal';\nimport { InternalButton } from '../button/internal';\nimport { BuiltInErrorBoundary } from '../error-boundary/internal';\nimport InternalHeader from '../header/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { PerformanceMetrics } from '../internal/analytics';\nimport {\n FunnelNameSelectorContext,\n FunnelStepContextValue,\n FunnelSubStepContextValue,\n} from '../internal/analytics/context/analytics-context';\nimport { FunnelProps, useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport FocusLock from '../internal/components/focus-lock';\nimport { ButtonContext, ButtonContextProps } from '../internal/context/button-context';\nimport { ModalContext } from '../internal/context/modal-context';\nimport ResetContextsForModal from '../internal/context/reset-contexts-for-modal';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useIntersectionObserver } from '../internal/hooks/use-intersection-observer';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport {\n GeneratedAnalyticsMetadataModalComponent,\n GeneratedAnalyticsMetadataModalDismiss,\n} from './analytics-metadata/interfaces';\nimport { disableBodyScrolling, enableBodyScrolling } from './body-scroll';\nimport { ModalProps } from './interfaces';\nimport { useModalDimensions } from './use-modal-dimensions';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport function InternalModalAsFunnel(props: InternalModalProps) {\n const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const onButtonClick: ButtonContextProps['onClick'] = ({ variant }) => {\n if (variant === 'primary') {\n funnelNextOrSubmitAttempt();\n funnelSubmit();\n }\n };\n\n return (\n <InternalModal\n __funnelProps={funnelProps}\n __funnelStepProps={funnelStepProps}\n __subStepRef={subStepRef}\n __subStepFunnelProps={funnelSubStepProps}\n onButtonClick={onButtonClick}\n {...props}\n />\n );\n}\n\ntype InternalModalProps = SomeRequired<ModalProps, 'size'> &\n InternalBaseComponentProps & {\n __funnelProps?: FunnelProps;\n __funnelStepProps?: FunnelStepContextValue['funnelStepProps'];\n __subStepRef?: FunnelSubStepContextValue['subStepRef'];\n __subStepFunnelProps?: FunnelSubStepContextValue['funnelSubStepProps'];\n __injectAnalyticsComponentMetadata?: boolean;\n onButtonClick?: ButtonContextProps['onClick'];\n referrerId?: string;\n width?: number;\n height?: number;\n };\n\nexport default function InternalModal({ modalRoot, getModalRoot, removeModalRoot, ...rest }: InternalModalProps) {\n return (\n <Portal container={modalRoot} getContainer={getModalRoot} removeContainer={removeModalRoot}>\n <PortaledModal {...rest} />\n </Portal>\n );\n}\n\ntype PortaledModalProps = Omit<InternalModalProps, 'modalRoot' \| 'getModalRoot' \| 'removeModalRoot'>;\n\n// Separate component to prevent the Portal from getting in the way of refs, as it needs extra cycles to render the inner components.\n// useContainerQuery needs its targeted element to exist on the first render in order to work properly.\nfunction PortaledModal({\n size,\n visible,\n header,\n children,\n footer,\n disableContentPaddings,\n position = 'center',\n onButtonClick = () => {},\n onDismiss,\n width,\n height,\n __internalRootRef,\n __injectAnalyticsComponentMetadata,\n __funnelProps,\n __funnelStepProps,\n __subStepRef,\n __subStepFunnelProps,\n referrerId,\n ...rest\n}: PortaledModalProps) {\n const instanceUniqueId = useUniqueId();\n const headerId = `${rest.id \|\| instanceUniqueId}-header`;\n const lastMouseDownElementRef = useRef<HTMLElement \| null>(null);\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n\n const i18n = useInternalI18n('modal');\n const closeAriaLabel = i18n('closeAriaLabel', rest.closeAriaLabel);\n\n const refObject = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(breakpointsRef, refObject, __internalRootRef);\n\n const isRefresh = useVisualRefresh();\n\n const baseProps = getBaseProps(rest);\n\n const analyticsComponentMetadata: GeneratedAnalyticsMetadataModalComponent = {\n name: 'awsui.Modal',\n label: `.${analyticsSelectors.header} h2`,\n };\n const metadataAttribute = __injectAnalyticsComponentMetadata\n ? getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })\n : {};\n const loadStartTime = useRef<number>(0);\n const loadCompleteTime = useRef<number>(0);\n const componentLoadingCount = useRef<number>(0);\n const performanceMetricLogged = useRef<boolean>(false);\n\n // enable body scroll and restore focus if unmounting while visible\n useEffect(() => {\n return () => {\n enableBodyScrolling();\n };\n }, []);\n\n const resetModalPerformanceData = () => {\n loadStartTime.current = performance.now();\n loadCompleteTime.current = 0;\n performanceMetricLogged.current = false;\n };\n\n const emitTimeToContentReadyInModal = (loadCompleteTime: number) => {\n if (\n componentLoadingCount.current === 0 &&\n loadStartTime.current &&\n loadStartTime.current !== 0 &&\n !performanceMetricLogged.current\n ) {\n const timeToContentReadyInModal = loadCompleteTime - loadStartTime.current;\n PerformanceMetrics.modalPerformanceData({\n timeToContentReadyInModal,\n instanceIdentifier: instanceUniqueId,\n componentIdentifier: headerTextRef.current?.textContent \|\| '',\n });\n performanceMetricLogged.current = true;\n }\n };\n\n const MODAL_READY_TIMEOUT = 100;\n /*\n This useEffect is triggered when the visible attribute of modal changes.\n * When modal becomes visible, modal performance metrics are reset marking the beginning loading process.\n * To ensure that the modal component ready metric is always emitted, a setTimeout is implemented.\n * This setTimeout automatically emits the component ready metric after a specified duration.\n */\n useEffect(() => {\n if (visible) {\n disableBodyScrolling();\n resetModalPerformanceData();\n setTimeout(() => {\n emitTimeToContentReadyInModal(loadStartTime.current);\n }, MODAL_READY_TIMEOUT);\n } else {\n enableBodyScrolling();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [visible]);\n\n // Because we hide the element with styles (and not actually detach it from DOM), we need to scroll to top\n useEffect(() => {\n if (visible && refObject.current) {\n refObject.current.scrollTop = 0;\n }\n }, [visible]);\n\n const dismiss = (reason: string) => fireNonCancelableEvent(onDismiss, { reason });\n\n const onOverlayMouseDown = (event: React.MouseEvent) => {\n lastMouseDownElementRef.current = event.target as HTMLElement;\n };\n const onOverlayClick = (event: React.MouseEvent) => {\n const overlay = refObject.current;\n const lastClicked = lastMouseDownElementRef.current;\n\n if (event.target === overlay && lastClicked === overlay) {\n dismiss('overlay');\n }\n };\n const onCloseButtonClick = () => dismiss('closeButton');\n const escKeyHandler = (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n dismiss('keyboard');\n }\n };\n\n // We use an empty div element at the end of the content slot as a sentinel\n // to detect when the user has scrolled to the bottom.\n const { ref: stickySentinelRef, isIntersecting: footerStuck } = useIntersectionObserver();\n\n const headerTextRef = useRef<HTMLSpanElement>(null);\n const { subStepRef } = useFunnelSubStep();\n\n const { footerRef, headerRef, hasCustomHeight, hasCustomWidth, dialogCustomStyles, footerHeight } =\n useModalDimensions({\n height,\n width,\n hasFooter: !!footer,\n });\n\n return (\n <FunnelNameSelectorContext.Provider value={`.${styles['header--text']}`}>\n <ResetContextsForModal>\n <ModalContext.Provider\n value={{\n isInModal: true,\n componentLoadingCount,\n emitTimeToContentReadyInModal,\n }}\n >\n <div\n {...baseProps}\n {...__funnelProps}\n {...__funnelStepProps}\n className={clsx(\n styles.root,\n { [styles.hidden]: !visible },\n baseProps.className,\n isRefresh && styles.refresh\n )}\n role=\"dialog\"\n aria-labelledby={headerId}\n onMouseDown={onOverlayMouseDown}\n onClick={onOverlayClick}\n ref={mergedRef}\n style={footerHeight ? { scrollPaddingBottom: footerHeight } : undefined}\n data-awsui-referrer-id={subStepRef.current?.id \|\| referrerId}\n >\n <FocusLock\n disabled={!visible}\n autoFocus={true}\n restoreFocus={true}\n className={clsx(styles['focus-lock'], styles[`position-${position}`])}\n >\n <div\n className={clsx(\n styles.dialog,\n !hasCustomWidth && styles[size],\n styles[`breakpoint-${breakpoint}`],\n isRefresh && styles.refresh,\n hasCustomWidth && styles['custom-width'],\n hasCustomHeight && styles['custom-height']\n )}\n style={dialogCustomStyles}\n onKeyDown={escKeyHandler}\n {...metadataAttribute}\n >\n <div className={clsx(styles.container, hasCustomHeight && styles['custom-height-container'])}>\n <div ref={headerRef} className={clsx(styles.header, analyticsSelectors.header)}>\n <InternalHeader\n variant=\"h2\"\n __disableActionsWrapping={true}\n actions={\n <div\n {...getAnalyticsMetadataAttribute({\n action: 'dismiss',\n } as Partial<GeneratedAnalyticsMetadataModalDismiss>)}\n >\n <InternalButton\n ariaLabel={closeAriaLabel}\n className={styles['dismiss-control']}\n variant=\"modal-dismiss\"\n iconName=\"close\"\n formAction=\"none\"\n onClick={onCloseButtonClick}\n />\n </div>\n }\n >\n <span ref={headerTextRef} id={headerId} className={styles['header--text']}>\n {header}\n </span>\n </InternalHeader>\n </div>\n <BuiltInErrorBoundary\n wrapper={content => <InternalBox padding={{ bottom: 'm', horizontal: 'l' }}>{content}</InternalBox>}\n >\n <div\n ref={__subStepRef}\n {...__subStepFunnelProps}\n className={clsx(\n styles.content,\n { [styles['no-paddings']]: disableContentPaddings },\n hasCustomHeight && styles['custom-height-content']\n )}\n {...(hasCustomHeight && {\n tabIndex: 0,\n role: 'region',\n 'aria-labelledby': headerId,\n })}\n >\n {children}\n <div ref={stickySentinelRef} />\n </div>\n {footer && (\n <ButtonContext.Provider value={{ onClick: onButtonClick }}>\n <div\n ref={footerRef}\n className={clsx(styles.footer, (footerStuck \|\| hasCustomHeight) && styles['footer--rounded'])}\n >\n {footer}\n </div>\n </ButtonContext.Provider>\n )}\n </BuiltInErrorBoundary>\n </div>\n </div>\n </FocusLock>\n </div>\n </ModalContext.Provider>\n </ResetContextsForModal>\n </FunnelNameSelectorContext.Provider>\n );\n}\n"]}
1	+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/modal/internal.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, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { Portal, useMergeRefs, useUniqueId } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalBox from '../box/internal';\nimport { InternalButton } from '../button/internal';\nimport { BuiltInErrorBoundary } from '../error-boundary/internal';\nimport InternalHeader from '../header/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { PerformanceMetrics } from '../internal/analytics';\nimport {\n FunnelNameSelectorContext,\n FunnelStepContextValue,\n FunnelSubStepContextValue,\n} from '../internal/analytics/context/analytics-context';\nimport { FunnelProps, useFunnel, useFunnelStep, useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport FocusLock from '../internal/components/focus-lock';\nimport { ButtonContext, ButtonContextProps } from '../internal/context/button-context';\nimport { ModalContext } from '../internal/context/modal-context';\nimport ResetContextsForModal from '../internal/context/reset-contexts-for-modal';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useIntersectionObserver } from '../internal/hooks/use-intersection-observer';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport {\n GeneratedAnalyticsMetadataModalComponent,\n GeneratedAnalyticsMetadataModalDismiss,\n} from './analytics-metadata/interfaces';\nimport { disableBodyScrolling, enableBodyScrolling } from './body-scroll';\nimport { ModalProps } from './interfaces';\nimport { useModalDimensions } from './use-modal-dimensions';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nexport function InternalModalAsFunnel(props: InternalModalProps) {\n const { funnelProps, funnelSubmit, funnelNextOrSubmitAttempt } = useFunnel();\n const { funnelStepProps } = useFunnelStep();\n const { subStepRef, funnelSubStepProps } = useFunnelSubStep();\n const onButtonClick: ButtonContextProps['onClick'] = ({ variant }) => {\n if (variant === 'primary') {\n funnelNextOrSubmitAttempt();\n funnelSubmit();\n }\n };\n\n return (\n <InternalModal\n __funnelProps={funnelProps}\n __funnelStepProps={funnelStepProps}\n __subStepRef={subStepRef}\n __subStepFunnelProps={funnelSubStepProps}\n onButtonClick={onButtonClick}\n {...props}\n />\n );\n}\n\ntype InternalModalProps = SomeRequired<ModalProps, 'size'> &\n InternalBaseComponentProps & {\n __funnelProps?: FunnelProps;\n __funnelStepProps?: FunnelStepContextValue['funnelStepProps'];\n __subStepRef?: FunnelSubStepContextValue['subStepRef'];\n __subStepFunnelProps?: FunnelSubStepContextValue['funnelSubStepProps'];\n __injectAnalyticsComponentMetadata?: boolean;\n onButtonClick?: ButtonContextProps['onClick'];\n referrerId?: string;\n width?: number;\n height?: number;\n };\n\nexport default function InternalModal({ modalRoot, getModalRoot, removeModalRoot, ...rest }: InternalModalProps) {\n return (\n <Portal container={modalRoot} getContainer={getModalRoot} removeContainer={removeModalRoot}>\n <PortaledModal {...rest} />\n </Portal>\n );\n}\n\ntype PortaledModalProps = Omit<InternalModalProps, 'modalRoot' \| 'getModalRoot' \| 'removeModalRoot'>;\n\n// Separate component to prevent the Portal from getting in the way of refs, as it needs extra cycles to render the inner components.\n// useContainerQuery needs its targeted element to exist on the first render in order to work properly.\nfunction PortaledModal({\n size,\n hideDismissButton = false,\n visible,\n header,\n children,\n footer,\n disableContentPaddings,\n position = 'center',\n onButtonClick = () => {},\n onDismiss,\n width,\n height,\n __internalRootRef,\n __injectAnalyticsComponentMetadata,\n __funnelProps,\n __funnelStepProps,\n __subStepRef,\n __subStepFunnelProps,\n referrerId,\n ...rest\n}: PortaledModalProps) {\n const instanceUniqueId = useUniqueId();\n const headerId = `${rest.id \|\| instanceUniqueId}-header`;\n const lastMouseDownElementRef = useRef<HTMLElement \| null>(null);\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n\n const i18n = useInternalI18n('modal');\n const closeAriaLabel = i18n('closeAriaLabel', rest.closeAriaLabel);\n\n const refObject = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(breakpointsRef, refObject, __internalRootRef);\n const dialogRef = useRef<HTMLDivElement>(null);\n\n const isRefresh = useVisualRefresh();\n\n const baseProps = getBaseProps(rest);\n\n const analyticsComponentMetadata: GeneratedAnalyticsMetadataModalComponent = {\n name: 'awsui.Modal',\n label: `.${analyticsSelectors.header} h2`,\n };\n const metadataAttribute = __injectAnalyticsComponentMetadata\n ? getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })\n : {};\n const loadStartTime = useRef<number>(0);\n const loadCompleteTime = useRef<number>(0);\n const componentLoadingCount = useRef<number>(0);\n const performanceMetricLogged = useRef<boolean>(false);\n\n // enable body scroll and restore focus if unmounting while visible\n useEffect(() => {\n return () => {\n enableBodyScrolling();\n };\n }, []);\n\n const resetModalPerformanceData = () => {\n loadStartTime.current = performance.now();\n loadCompleteTime.current = 0;\n performanceMetricLogged.current = false;\n };\n\n const emitTimeToContentReadyInModal = (loadCompleteTime: number) => {\n if (\n componentLoadingCount.current === 0 &&\n loadStartTime.current &&\n loadStartTime.current !== 0 &&\n !performanceMetricLogged.current\n ) {\n const timeToContentReadyInModal = loadCompleteTime - loadStartTime.current;\n PerformanceMetrics.modalPerformanceData({\n timeToContentReadyInModal,\n instanceIdentifier: instanceUniqueId,\n componentIdentifier: headerTextRef.current?.textContent \|\| '',\n });\n performanceMetricLogged.current = true;\n }\n };\n\n const MODAL_READY_TIMEOUT = 100;\n /*\n This useEffect is triggered when the visible attribute of modal changes.\n * When modal becomes visible, modal performance metrics are reset marking the beginning loading process.\n * To ensure that the modal component ready metric is always emitted, a setTimeout is implemented.\n * This setTimeout automatically emits the component ready metric after a specified duration.\n */\n useEffect(() => {\n if (visible) {\n disableBodyScrolling();\n resetModalPerformanceData();\n setTimeout(() => {\n emitTimeToContentReadyInModal(loadStartTime.current);\n }, MODAL_READY_TIMEOUT);\n } else {\n enableBodyScrolling();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [visible]);\n\n // Because we hide the element with styles (and not actually detach it from DOM), we need to scroll to top\n useEffect(() => {\n if (visible && refObject.current) {\n refObject.current.scrollTop = 0;\n }\n }, [visible]);\n\n const dismiss = (reason: string) => fireNonCancelableEvent(onDismiss, { reason });\n\n const onOverlayMouseDown = (event: React.MouseEvent) => {\n lastMouseDownElementRef.current = event.target as HTMLElement;\n // The overlay can't hold focus, so pressing it would blur whatever is focused inside the\n // dialog and leave focus on the document body. That takes focus out of the dialog, which\n // breaks focus containment and stops ESC from reaching the handler on the dialog element.\n // Preventing the default action keeps focus where it is.\n if (event.target === refObject.current) {\n event.preventDefault();\n }\n };\n const onOverlayClick = (event: React.MouseEvent) => {\n const overlay = refObject.current;\n const lastClicked = lastMouseDownElementRef.current;\n\n if (event.target === overlay && lastClicked === overlay) {\n dismiss('overlay');\n }\n };\n const onCloseButtonClick = () => dismiss('closeButton');\n const escKeyHandler = (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n dismiss('keyboard');\n }\n };\n\n // We use an empty div element at the end of the content slot as a sentinel\n // to detect when the user has scrolled to the bottom.\n const { ref: stickySentinelRef, isIntersecting: footerStuck } = useIntersectionObserver();\n\n const headerTextRef = useRef<HTMLSpanElement>(null);\n const headingTagRef = useRef<HTMLHeadingElement \| null>(null);\n const { subStepRef } = useFunnelSubStep();\n\n // Without a dismiss button there is no predictable first focusable element, so focus the\n // heading to announce what the modal is about. When no header is given, fall back to the\n // dialog.\n const hasHeader = header !== undefined && header !== null && header !== false && header !== '';\n const autoFocusTarget = hideDismissButton ? (hasHeader ? headingTagRef : dialogRef) : undefined;\n\n const { footerRef, headerRef, hasCustomHeight, hasCustomWidth, dialogCustomStyles, footerHeight } =\n useModalDimensions({\n height,\n width,\n hasFooter: !!footer,\n });\n\n return (\n <FunnelNameSelectorContext.Provider value={`.${styles['header--text']}`}>\n <ResetContextsForModal>\n <ModalContext.Provider\n value={{\n isInModal: true,\n componentLoadingCount,\n emitTimeToContentReadyInModal,\n }}\n >\n <div\n {...baseProps}\n {...__funnelProps}\n {...__funnelStepProps}\n className={clsx(\n styles.root,\n { [styles.hidden]: !visible },\n hideDismissButton && styles['hide-dismiss-button'],\n baseProps.className,\n isRefresh && styles.refresh\n )}\n role=\"dialog\"\n aria-labelledby={headerId}\n onMouseDown={onOverlayMouseDown}\n onClick={onOverlayClick}\n ref={mergedRef}\n style={footerHeight ? { scrollPaddingBottom: footerHeight } : undefined}\n data-awsui-referrer-id={subStepRef.current?.id \|\| referrerId}\n >\n <FocusLock\n disabled={!visible}\n autoFocus={true}\n restoreFocus={true}\n autoFocusTarget={autoFocusTarget}\n className={clsx(styles['focus-lock'], styles[`position-${position}`])}\n >\n <div\n className={clsx(\n styles.dialog,\n !hasCustomWidth && styles[size],\n styles[`breakpoint-${breakpoint}`],\n isRefresh && styles.refresh,\n hasCustomWidth && styles['custom-width'],\n hasCustomHeight && styles['custom-height']\n )}\n ref={dialogRef}\n style={dialogCustomStyles}\n onKeyDown={escKeyHandler}\n // Keeps the dialog focusable so that clicking a non-focusable area inside it moves\n // focus to the dialog rather than the document body.\n tabIndex={-1}\n {...metadataAttribute}\n >\n <div className={clsx(styles.container, hasCustomHeight && styles['custom-height-container'])}>\n <div ref={headerRef} className={clsx(styles.header, analyticsSelectors.header)}>\n <InternalHeader\n variant=\"h2\"\n __disableActionsWrapping={true}\n __headingTagRef={headingTagRef}\n __headingTagTabIndex={-1}\n actions={\n hideDismissButton ? undefined : (\n <div\n {...getAnalyticsMetadataAttribute({\n action: 'dismiss',\n } as Partial<GeneratedAnalyticsMetadataModalDismiss>)}\n >\n <InternalButton\n ariaLabel={closeAriaLabel}\n className={styles['dismiss-control']}\n variant=\"modal-dismiss\"\n iconName=\"close\"\n formAction=\"none\"\n onClick={onCloseButtonClick}\n />\n </div>\n )\n }\n >\n <span ref={headerTextRef} id={headerId} className={styles['header--text']}>\n {header}\n </span>\n </InternalHeader>\n </div>\n <BuiltInErrorBoundary\n wrapper={content => <InternalBox padding={{ bottom: 'm', horizontal: 'l' }}>{content}</InternalBox>}\n >\n <div\n ref={__subStepRef}\n {...__subStepFunnelProps}\n className={clsx(\n styles.content,\n { [styles['no-paddings']]: disableContentPaddings },\n hasCustomHeight && styles['custom-height-content']\n )}\n {...(hasCustomHeight && {\n tabIndex: 0,\n role: 'region',\n 'aria-labelledby': headerId,\n })}\n >\n {children}\n <div ref={stickySentinelRef} />\n </div>\n {footer && (\n <ButtonContext.Provider value={{ onClick: onButtonClick }}>\n <div\n ref={footerRef}\n className={clsx(styles.footer, (footerStuck \|\| hasCustomHeight) && styles['footer--rounded'])}\n >\n {footer}\n </div>\n </ButtonContext.Provider>\n )}\n </BuiltInErrorBoundary>\n </div>\n </div>\n </FocusLock>\n </div>\n </ModalContext.Provider>\n </ResetContextsForModal>\n </FunnelNameSelectorContext.Provider>\n );\n}\n"]}

package/lib/internal/template/modal/styles.css.js CHANGED Viewed

@@ -1,36 +1,37 @@
     import './styles.scoped.css';
     export default {
-  "dialog": "awsui_dialog_1d2i7_1wk28_25",
-  "modal-slide-up": "awsui_modal-slide-up_1d2i7_1wk28_1",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1d2i7_1wk28_1",
-  "refresh": "awsui_refresh_1d2i7_1wk28_48",
-  "awsui-motion-scale-popup": "awsui_awsui-motion-scale-popup_1d2i7_1wk28_1",
-  "root": "awsui_root_1d2i7_1wk28_81",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_1d2i7_1wk28_1",
-  "hidden": "awsui_hidden_1d2i7_1wk28_158",
-  "focus-lock": "awsui_focus-lock_1d2i7_1wk28_162",
-  "position-top": "awsui_position-top_1d2i7_1wk28_170",
-  "position-center": "awsui_position-center_1d2i7_1wk28_173",
-  "small": "awsui_small_1d2i7_1wk28_187",
-  "medium": "awsui_medium_1d2i7_1wk28_190",
-  "large": "awsui_large_1d2i7_1wk28_193",
-  "x-large": "awsui_x-large_1d2i7_1wk28_196",
-  "xx-large": "awsui_xx-large_1d2i7_1wk28_199",
-  "custom-width": "awsui_custom-width_1d2i7_1wk28_202",
-  "max": "awsui_max_1d2i7_1wk28_205",
-  "breakpoint-xs": "awsui_breakpoint-xs_1d2i7_1wk28_205",
-  "custom-height": "awsui_custom-height_1d2i7_1wk28_210",
-  "container": "awsui_container_1d2i7_1wk28_215",
-  "custom-height-container": "awsui_custom-height-container_1d2i7_1wk28_255",
-  "content": "awsui_content_1d2i7_1wk28_261",
-  "no-paddings": "awsui_no-paddings_1d2i7_1wk28_266",
-  "custom-height-content": "awsui_custom-height-content_1d2i7_1wk28_270",
-  "header": "awsui_header_1d2i7_1wk28_275",
-  "header--text": "awsui_header--text_1d2i7_1wk28_287",
-  "footer": "awsui_footer_1d2i7_1wk28_291",
-  "footer--rounded": "awsui_footer--rounded_1d2i7_1wk28_300",
-  "dismiss-control": "awsui_dismiss-control_1d2i7_1wk28_312",
-  "modal-open": "awsui_modal-open_1d2i7_1wk28_316"
+  "dialog": "awsui_dialog_1d2i7_1ls09_25",
+  "modal-slide-up": "awsui_modal-slide-up_1d2i7_1ls09_1",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1d2i7_1ls09_1",
+  "refresh": "awsui_refresh_1d2i7_1ls09_48",
+  "awsui-motion-scale-popup": "awsui_awsui-motion-scale-popup_1d2i7_1ls09_1",
+  "root": "awsui_root_1d2i7_1ls09_81",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_1d2i7_1ls09_1",
+  "hide-dismiss-button": "awsui_hide-dismiss-button_1d2i7_1ls09_158",
+  "hidden": "awsui_hidden_1d2i7_1ls09_161",
+  "focus-lock": "awsui_focus-lock_1d2i7_1ls09_165",
+  "position-top": "awsui_position-top_1d2i7_1ls09_173",
+  "position-center": "awsui_position-center_1d2i7_1ls09_176",
+  "small": "awsui_small_1d2i7_1ls09_190",
+  "medium": "awsui_medium_1d2i7_1ls09_193",
+  "large": "awsui_large_1d2i7_1ls09_196",
+  "x-large": "awsui_x-large_1d2i7_1ls09_199",
+  "xx-large": "awsui_xx-large_1d2i7_1ls09_202",
+  "custom-width": "awsui_custom-width_1d2i7_1ls09_205",
+  "max": "awsui_max_1d2i7_1ls09_208",
+  "breakpoint-xs": "awsui_breakpoint-xs_1d2i7_1ls09_208",
+  "custom-height": "awsui_custom-height_1d2i7_1ls09_213",
+  "container": "awsui_container_1d2i7_1ls09_218",
+  "custom-height-container": "awsui_custom-height-container_1d2i7_1ls09_258",
+  "content": "awsui_content_1d2i7_1ls09_264",
+  "no-paddings": "awsui_no-paddings_1d2i7_1ls09_269",
+  "custom-height-content": "awsui_custom-height-content_1d2i7_1ls09_273",
+  "header": "awsui_header_1d2i7_1ls09_278",
+  "header--text": "awsui_header--text_1d2i7_1ls09_290",
+  "footer": "awsui_footer_1d2i7_1ls09_294",
+  "footer--rounded": "awsui_footer--rounded_1d2i7_1ls09_303",
+  "dismiss-control": "awsui_dismiss-control_1d2i7_1ls09_315",
+  "modal-open": "awsui_modal-open_1d2i7_1ls09_319"
 };