@cloudscape-design/components 3.0.309 → 3.0.310
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.
- package/internal/environment.js +1 -1
- package/internal/manifest.json +1 -1
- package/modal/internal.js +1 -1
- package/modal/internal.js.map +1 -1
- package/package.json +1 -1
package/internal/environment.js
CHANGED
package/internal/manifest.json
CHANGED
package/modal/internal.js
CHANGED
|
@@ -85,7 +85,7 @@ function InnerModal(_a) {
|
|
|
85
85
|
return (React.createElement(FormFieldContext.Provider, { value: {} },
|
|
86
86
|
React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, { [styles.hidden]: !visible }, baseProps.className, isRefresh && styles.refresh), role: "dialog", "aria-modal": true, "aria-labelledby": headerId, onMouseDown: onOverlayMouseDown, onClick: onOverlayClick, ref: mergedRef, style: footerHeight ? { scrollPaddingBottom: footerHeight } : undefined }),
|
|
87
87
|
React.createElement(FocusLock, { disabled: !visible, autoFocus: true, restoreFocus: true, className: styles['focus-lock'] },
|
|
88
|
-
React.createElement("div", { className: clsx(styles.dialog, styles[size], styles[`breakpoint-${breakpoint}`], isRefresh && styles.refresh), onKeyDown: escKeyHandler
|
|
88
|
+
React.createElement("div", { className: clsx(styles.dialog, styles[size], styles[`breakpoint-${breakpoint}`], isRefresh && styles.refresh), onKeyDown: escKeyHandler },
|
|
89
89
|
React.createElement("div", { className: styles.container },
|
|
90
90
|
React.createElement("div", { className: styles.header },
|
|
91
91
|
React.createElement(InternalHeader, { variant: "h2", __disableActionsWrapping: true, actions: React.createElement(InternalButton, { ariaLabel: closeAriaLabel, className: styles['dismiss-control'], variant: "modal-dismiss", iconName: "close", formAction: "none", onClick: onCloseButtonClick }) },
|
package/modal/internal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["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 { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { KeyCode } from '../internal/keycode';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { InternalButton } from '../button/internal';\nimport InternalHeader from '../header/internal';\nimport Portal from '../internal/components/portal';\nimport { useContainerBreakpoints, useContainerQuery } from '../internal/hooks/container-queries';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { FormFieldContext } from '../internal/context/form-field-context';\n\nimport { disableBodyScrolling, enableBodyScrolling } from './body-scroll';\nimport { ModalProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { SomeRequired } from '../internal/types';\nimport FocusLock from '../internal/components/focus-lock';\nimport { useInternalI18n } from '../internal/i18n/context';\nimport { useIntersectionObserver } from '../internal/hooks/use-intersection-observer';\n\ntype InternalModalProps = SomeRequired<ModalProps, 'size'> & InternalBaseComponentProps;\n\nexport default function InternalModal({ modalRoot, ...rest }: InternalModalProps) {\n return (\n <Portal container={modalRoot}>\n <InnerModal {...rest} />\n </Portal>\n );\n}\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 InnerModal({\n size,\n visible,\n header,\n children,\n footer,\n disableContentPaddings,\n onDismiss,\n __internalRootRef = null,\n ...rest\n}: InternalModalProps) {\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 // enable body scroll and restore focus if unmounting while visible\n useEffect(() => {\n return () => {\n enableBodyScrolling();\n };\n }, []);\n\n // enable / disable body scroll\n useEffect(() => {\n if (visible) {\n disableBodyScrolling();\n } else {\n enableBodyScrolling();\n }\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 // Add extra scroll padding to account for the height of the sticky footer,\n // to prevent it from covering focused elements.\n const [footerHeight, footerRef] = useContainerQuery(rect => rect.borderBoxHeight);\n\n return (\n <FormFieldContext.Provider value={{}}>\n <div\n {...baseProps}\n className={clsx(styles.root, { [styles.hidden]: !visible }, baseProps.className, isRefresh && styles.refresh)}\n role=\"dialog\"\n aria-modal={true}\n aria-labelledby={headerId}\n onMouseDown={onOverlayMouseDown}\n onClick={onOverlayClick}\n ref={mergedRef}\n style={footerHeight ? { scrollPaddingBottom: footerHeight } : undefined}\n >\n <FocusLock disabled={!visible} autoFocus={true} restoreFocus={true} className={styles['focus-lock']}>\n <div\n className={clsx(\n styles.dialog,\n styles[size],\n styles[`breakpoint-${breakpoint}`],\n isRefresh && styles.refresh\n )}\n onKeyDown={escKeyHandler}\n tabIndex={-1}\n >\n <div className={styles.container}>\n <div className={styles.header}>\n <InternalHeader\n variant=\"h2\"\n __disableActionsWrapping={true}\n actions={\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 }\n >\n <span id={headerId} className={styles['header--text']}>\n {header}\n </span>\n </InternalHeader>\n </div>\n <div className={clsx(styles.content, { [styles['no-paddings']]: disableContentPaddings })}>\n {children}\n <div ref={stickySentinelRef} />\n </div>\n {footer && (\n <div ref={footerRef} className={clsx(styles.footer, footerStuck && styles['footer--stuck'])}>\n {footer}\n </div>\n )}\n </div>\n </div>\n </FocusLock>\n </div>\n </FormFieldContext.Provider>\n );\n}\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"lib/default/","sources":["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 { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { KeyCode } from '../internal/keycode';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { InternalButton } from '../button/internal';\nimport InternalHeader from '../header/internal';\nimport Portal from '../internal/components/portal';\nimport { useContainerBreakpoints, useContainerQuery } from '../internal/hooks/container-queries';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { FormFieldContext } from '../internal/context/form-field-context';\n\nimport { disableBodyScrolling, enableBodyScrolling } from './body-scroll';\nimport { ModalProps } from './interfaces';\nimport styles from './styles.css.js';\nimport { SomeRequired } from '../internal/types';\nimport FocusLock from '../internal/components/focus-lock';\nimport { useInternalI18n } from '../internal/i18n/context';\nimport { useIntersectionObserver } from '../internal/hooks/use-intersection-observer';\n\ntype InternalModalProps = SomeRequired<ModalProps, 'size'> & InternalBaseComponentProps;\n\nexport default function InternalModal({ modalRoot, ...rest }: InternalModalProps) {\n return (\n <Portal container={modalRoot}>\n <InnerModal {...rest} />\n </Portal>\n );\n}\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 InnerModal({\n size,\n visible,\n header,\n children,\n footer,\n disableContentPaddings,\n onDismiss,\n __internalRootRef = null,\n ...rest\n}: InternalModalProps) {\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 // enable body scroll and restore focus if unmounting while visible\n useEffect(() => {\n return () => {\n enableBodyScrolling();\n };\n }, []);\n\n // enable / disable body scroll\n useEffect(() => {\n if (visible) {\n disableBodyScrolling();\n } else {\n enableBodyScrolling();\n }\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 // Add extra scroll padding to account for the height of the sticky footer,\n // to prevent it from covering focused elements.\n const [footerHeight, footerRef] = useContainerQuery(rect => rect.borderBoxHeight);\n\n return (\n <FormFieldContext.Provider value={{}}>\n <div\n {...baseProps}\n className={clsx(styles.root, { [styles.hidden]: !visible }, baseProps.className, isRefresh && styles.refresh)}\n role=\"dialog\"\n aria-modal={true}\n aria-labelledby={headerId}\n onMouseDown={onOverlayMouseDown}\n onClick={onOverlayClick}\n ref={mergedRef}\n style={footerHeight ? { scrollPaddingBottom: footerHeight } : undefined}\n >\n <FocusLock disabled={!visible} autoFocus={true} restoreFocus={true} className={styles['focus-lock']}>\n <div\n className={clsx(\n styles.dialog,\n styles[size],\n styles[`breakpoint-${breakpoint}`],\n isRefresh && styles.refresh\n )}\n onKeyDown={escKeyHandler}\n >\n <div className={styles.container}>\n <div className={styles.header}>\n <InternalHeader\n variant=\"h2\"\n __disableActionsWrapping={true}\n actions={\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 }\n >\n <span id={headerId} className={styles['header--text']}>\n {header}\n </span>\n </InternalHeader>\n </div>\n <div className={clsx(styles.content, { [styles['no-paddings']]: disableContentPaddings })}>\n {children}\n <div ref={stickySentinelRef} />\n </div>\n {footer && (\n <div ref={footerRef} className={clsx(styles.footer, footerStuck && styles['footer--stuck'])}>\n {footer}\n </div>\n )}\n </div>\n </div>\n </FocusLock>\n </div>\n </FormFieldContext.Provider>\n );\n}\n"]}
|
package/package.json
CHANGED