npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.127 → 3.0.129 - Mend

@cloudscape-design/components-themeable 3.0.127 → 3.0.129

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 (212) hide show

package/lib/internal/template/split-panel/index.js CHANGED Viewed

@@ -19,23 +19,24 @@ import { AppLayoutContext } from '../internal/context/app-layout-context';
 import { getLimitedValue } from './utils/size-utils';
 import { Transition } from '../internal/components/transition';
 import { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';
+import { useUniqueId } from '../internal/hooks/use-unique-id';
 var MIN_HEIGHT = 160;
 var MIN_WIDTH = 280;
 var TransitionContentSide = function (_a) {
     var _b, _c;
-    var baseProps = _a.baseProps, isOpen = _a.isOpen, splitPanelRef = _a.splitPanelRef, handleRef = _a.handleRef, topOffset = _a.topOffset, bottomOffset = _a.bottomOffset, cappedSize = _a.cappedSize, isRefresh = _a.isRefresh, onToggle = _a.onToggle, i18nStrings = _a.i18nStrings, relativeSize = _a.relativeSize, onKeyDown = _a.onKeyDown, onSliderPointerDown = _a.onSliderPointerDown, focusVisible = _a.focusVisible, toggleRef = _a.toggleRef, paneHeader = _a.paneHeader, wrappedChildren = _a.wrappedChildren;
+    var baseProps = _a.baseProps, isOpen = _a.isOpen, splitPanelRef = _a.splitPanelRef, handleRef = _a.handleRef, topOffset = _a.topOffset, bottomOffset = _a.bottomOffset, cappedSize = _a.cappedSize, isRefresh = _a.isRefresh, onToggle = _a.onToggle, i18nStrings = _a.i18nStrings, relativeSize = _a.relativeSize, onKeyDown = _a.onKeyDown, onSliderPointerDown = _a.onSliderPointerDown, focusVisible = _a.focusVisible, toggleRef = _a.toggleRef, paneHeader = _a.paneHeader, panelHeaderId = _a.panelHeaderId, wrappedChildren = _a.wrappedChildren;
     return (React.createElement("div", __assign({}, baseProps, { className: clsx(baseProps.className, styles.drawer, styles.root, styles['position-side'], (_b = {},
             _b[styles['drawer-closed']] = !isOpen,
             _b)), style: {
             width: isOpen ? cappedSize : undefined,
             maxWidth: isRefresh ? '100%' : undefined
         }, ref: splitPanelRef }),
-        React.createElement("aside", { className: clsx(styles['drawer-content-side'], (_c = {},
+        React.createElement("div", { className: clsx(styles['drawer-content-side'], (_c = {},
                 _c[styles.refresh] = isRefresh,
                 _c)), style: {
                 top: topOffset,
                 bottom: bottomOffset
-            }, onClick: function () { return !isOpen && onToggle(); } },
+            }, onClick: function () { return !isOpen && onToggle(); }, "aria-labelledby": panelHeaderId, role: "region" },
             isOpen ? (React.createElement("div", { className: styles['slider-wrapper-side'] },
                 React.createElement("div", __assign({ role: "slider", tabIndex: 0, "aria-label": i18nStrings.resizeHandleAriaLabel, "aria-valuemax": 100, "aria-valuemin": 0, "aria-valuenow": relativeSize, className: clsx(styles.slider, styles['slider-side']), onKeyDown: onKeyDown, onPointerDown: onSliderPointerDown, ref: handleRef }, focusVisible),
                     React.createElement(ResizeHandler, { className: clsx(styles['slider-icon'], styles['slider-icon-side']) })))) : (React.createElement(InternalButton, { className: clsx(styles['open-button'], styles['open-button-side']), iconName: "angle-left", variant: "icon", formAction: "none", ariaLabel: i18nStrings.openButtonAriaLabel, ariaExpanded: isOpen, ref: isRefresh ? null : toggleRef })),
@@ -46,7 +47,7 @@ var TransitionContentSide = function (_a) {
 };
 var TransitionContentBottom = function (_a) {
     var _b, _c;
-    var baseProps = _a.baseProps, isOpen = _a.isOpen, splitPanelRef = _a.splitPanelRef, handleRef = _a.handleRef, bottomOffset = _a.bottomOffset, cappedSize = _a.cappedSize, isRefresh = _a.isRefresh, onToggle = _a.onToggle, i18nStrings = _a.i18nStrings, relativeSize = _a.relativeSize, onKeyDown = _a.onKeyDown, onSliderPointerDown = _a.onSliderPointerDown, focusVisible = _a.focusVisible, paneHeader = _a.paneHeader, wrappedChildren = _a.wrappedChildren, isMobile = _a.isMobile, disableContentPaddings = _a.disableContentPaddings, state = _a.state, leftOffset = _a.leftOffset, rightOffset = _a.rightOffset, transitioningElementRef = _a.transitioningElementRef, centeredMaxWidthClasses = _a.centeredMaxWidthClasses, splitPanelHeaderRef = _a.splitPanelHeaderRef, appLayoutMaxWidth = _a.appLayoutMaxWidth;
+    var baseProps = _a.baseProps, isOpen = _a.isOpen, splitPanelRef = _a.splitPanelRef, handleRef = _a.handleRef, bottomOffset = _a.bottomOffset, cappedSize = _a.cappedSize, isRefresh = _a.isRefresh, onToggle = _a.onToggle, i18nStrings = _a.i18nStrings, relativeSize = _a.relativeSize, onKeyDown = _a.onKeyDown, onSliderPointerDown = _a.onSliderPointerDown, focusVisible = _a.focusVisible, paneHeader = _a.paneHeader, wrappedChildren = _a.wrappedChildren, isMobile = _a.isMobile, disableContentPaddings = _a.disableContentPaddings, state = _a.state, leftOffset = _a.leftOffset, rightOffset = _a.rightOffset, transitioningElementRef = _a.transitioningElementRef, centeredMaxWidthClasses = _a.centeredMaxWidthClasses, splitPanelHeaderRef = _a.splitPanelHeaderRef, appLayoutMaxWidth = _a.appLayoutMaxWidth, panelHeaderId = _a.panelHeaderId;
     var transitionContentBottomRef = useMergeRefs(splitPanelRef || null, transitioningElementRef);
     return (React.createElement("div", __assign({}, baseProps, { className: clsx(baseProps.className, styles.root, styles.drawer, styles['position-bottom'], (_b = {},
             _b[styles['drawer-closed']] = !isOpen,
@@ -63,7 +64,7 @@ var TransitionContentBottom = function (_a) {
         isOpen && (React.createElement("div", { className: styles['slider-wrapper-bottom'] },
             React.createElement("div", __assign({ role: "slider", tabIndex: 0, "aria-label": i18nStrings.resizeHandleAriaLabel, "aria-valuemax": 100, "aria-valuemin": 0, "aria-valuenow": relativeSize, className: clsx(styles.slider, styles['slider-bottom']), onKeyDown: onKeyDown, onPointerDown: onSliderPointerDown, ref: handleRef }, focusVisible),
                 React.createElement(ResizeHandler, { className: clsx(styles['slider-icon'], styles['slider-icon-bottom']) })))),
-        React.createElement("div", { className: styles['drawer-content-bottom'] },
+        React.createElement("div", { className: styles['drawer-content-bottom'], "aria-labelledby": panelHeaderId, role: "region" },
             React.createElement("div", { className: clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses), ref: splitPanelHeaderRef }, paneHeader),
             React.createElement("div", { className: clsx(styles['content-bottom'], centeredMaxWidthClasses), "aria-hidden": !isOpen },
                 React.createElement("div", { className: clsx((_c = {}, _c[styles['content-bottom-max-width']] = isRefresh, _c)), style: appLayoutMaxWidth }, wrappedChildren)))));
@@ -134,7 +135,7 @@ export default function SplitPanel(_a) {
         var _a, _b, _c;
         switch (lastInteraction === null || lastInteraction === void 0 ? void 0 : lastInteraction.type) {
             case 'open':
-                return (_a = closeRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                return (_a = handleRef.current) === null || _a === void 0 ? void 0 : _a.focus();
             case 'close':
                 return (_b = toggleRef.current) === null || _b === void 0 ? void 0 : _b.focus();
             case 'position':
@@ -147,8 +148,9 @@ export default function SplitPanel(_a) {
             stickyOffsetTop: topOffset,
             stickyOffsetBottom: bottomOffset
         } }, children));
+    var panelHeaderId = useUniqueId('split-panel-header');
     var paneHeader = (React.createElement("div", { className: styles.header, style: appLayoutMaxWidth },
-        React.createElement("h2", { className: styles['header-text'] }, header),
+        React.createElement("h2", { className: styles['header-text'], id: panelHeaderId }, header),
         React.createElement("div", { className: styles['header-actions'] },
             !hidePreferencesButton && isOpen && (React.createElement(React.Fragment, null,
                 React.createElement(InternalButton, { className: styles['preferences-button'], iconName: "settings", variant: "icon", onClick: function () { return setPreferencesOpen(true); }, formAction: "none", ariaLabel: i18nStrings.preferencesTitle, ref: preferencesRef }),
@@ -190,8 +192,8 @@ export default function SplitPanel(_a) {
         _b[styles['pane-bottom-content-tools-padding']] = contentWrapperPaddings === null || contentWrapperPaddings === void 0 ? void 0 : contentWrapperPaddings.closedTools,
         _b));
     return (React.createElement(Transition, { "in": isOpen !== null && isOpen !== void 0 ? isOpen : false }, function (state, transitioningElementRef) { return (React.createElement(React.Fragment, null,
-        position === 'side' && (React.createElement(TransitionContentSide, { baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, handleRef: handleRef, topOffset: topOffset, bottomOffset: bottomOffset, cappedSize: cappedSize, isRefresh: isRefresh, onToggle: onToggle, i18nStrings: i18nStrings, relativeSize: relativeSize, onKeyDown: onKeyDown, onSliderPointerDown: onSliderPointerDown, focusVisible: focusVisible, toggleRef: toggleRef, paneHeader: paneHeader, wrappedChildren: wrappedChildren })),
-        position === 'bottom' && (React.createElement(TransitionContentBottom, { baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, handleRef: handleRef, bottomOffset: bottomOffset, cappedSize: cappedSize, isRefresh: isRefresh, onToggle: onToggle, i18nStrings: i18nStrings, relativeSize: relativeSize, onKeyDown: onKeyDown, onSliderPointerDown: onSliderPointerDown, focusVisible: focusVisible, paneHeader: paneHeader, wrappedChildren: wrappedChildren, isMobile: isMobile, disableContentPaddings: disableContentPaddings, state: state, leftOffset: leftOffset, rightOffset: rightOffset, transitioningElementRef: transitioningElementRef, centeredMaxWidthClasses: centeredMaxWidthClasses, splitPanelHeaderRef: splitPanelHeaderRef, appLayoutMaxWidth: appLayoutMaxWidth })),
+        position === 'side' && (React.createElement(TransitionContentSide, { baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, handleRef: handleRef, topOffset: topOffset, bottomOffset: bottomOffset, cappedSize: cappedSize, isRefresh: isRefresh, onToggle: onToggle, i18nStrings: i18nStrings, relativeSize: relativeSize, onKeyDown: onKeyDown, onSliderPointerDown: onSliderPointerDown, focusVisible: focusVisible, toggleRef: toggleRef, paneHeader: paneHeader, wrappedChildren: wrappedChildren, panelHeaderId: panelHeaderId })),
+        position === 'bottom' && (React.createElement(TransitionContentBottom, { baseProps: baseProps, isOpen: isOpen, splitPanelRef: mergedRef, handleRef: handleRef, bottomOffset: bottomOffset, cappedSize: cappedSize, isRefresh: isRefresh, onToggle: onToggle, i18nStrings: i18nStrings, relativeSize: relativeSize, onKeyDown: onKeyDown, onSliderPointerDown: onSliderPointerDown, focusVisible: focusVisible, paneHeader: paneHeader, wrappedChildren: wrappedChildren, isMobile: isMobile, disableContentPaddings: disableContentPaddings, state: state, leftOffset: leftOffset, rightOffset: rightOffset, transitioningElementRef: transitioningElementRef, centeredMaxWidthClasses: centeredMaxWidthClasses, splitPanelHeaderRef: splitPanelHeaderRef, appLayoutMaxWidth: appLayoutMaxWidth, panelHeaderId: panelHeaderId })),
         isPreferencesOpen && (React.createElement(PreferencesModal, { visible: true, preferences: { position: position }, disabledSidePosition: position === 'bottom' && isForcedPosition, isRefresh: isRefresh, i18nStrings: {
                 header: i18nStrings.preferencesTitle,
                 confirm: i18nStrings.preferencesConfirm,

package/lib/internal/template/split-panel/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/split-panel/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState, useEffect, useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { InternalButton } from '../button/internal';\nimport { getBaseProps, BaseComponentProps } from '../internal/base-component';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\n\nimport { SplitPanelProps, SizeControlProps } from './interfaces';\nimport ResizeHandler from './icons/resize-handler';\nimport PreferencesModal from './preferences-modal';\nimport { usePointerEvents } from './utils/use-pointer-events';\nimport { useKeyboardEvents } from './utils/use-keyboard-events';\n\nimport styles from './styles.css.js';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { AppLayoutContext } from '../internal/context/app-layout-context';\nimport { getLimitedValue } from './utils/size-utils';\nimport { Transition, TransitionStatus } from '../internal/components/transition';\nimport { ButtonProps } from '../button/interfaces';\nimport { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';\n\nexport { SplitPanelProps };\n\nconst MIN_HEIGHT = 160;\nconst MIN_WIDTH = 280;\ninterface TransitionContentProps {\n baseProps: BaseComponentProps;\n isOpen?: boolean;\n splitPanelRef?: React.Ref<any>;\n handleRef: React.RefObject<HTMLDivElement>;\n bottomOffset: number;\n cappedSize: number;\n isRefresh: boolean;\n onToggle: () => void;\n i18nStrings: SplitPanelProps.I18nStrings;\n relativeSize: number;\n onKeyDown: (event: React.KeyboardEvent<Element>) => void;\n onSliderPointerDown: () => void;\n focusVisible: { 'data-awsui-focus-visible': true } \| { 'data-awsui-focus-visible'?: undefined };\n paneHeader: JSX.Element;\n wrappedChildren: JSX.Element;\n}\n\ninterface TransitionContentSideProps extends TransitionContentProps {\n topOffset: number;\n toggleRef: React.RefObject<ButtonProps.Ref>;\n}\n\nconst TransitionContentSide = ({\n baseProps,\n isOpen,\n splitPanelRef,\n handleRef,\n topOffset,\n bottomOffset,\n cappedSize,\n isRefresh,\n onToggle,\n i18nStrings,\n relativeSize,\n onKeyDown,\n onSliderPointerDown,\n focusVisible,\n toggleRef,\n paneHeader,\n wrappedChildren,\n}: TransitionContentSideProps) => {\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles.root, styles['position-side'], {\n [styles['drawer-closed']]: !isOpen,\n })}\n style={{\n width: isOpen ? cappedSize : undefined,\n maxWidth: isRefresh ? '100%' : undefined,\n }}\n ref={splitPanelRef}\n >\n <aside\n className={clsx(styles['drawer-content-side'], {\n [styles.refresh]: isRefresh,\n })}\n style={{\n top: topOffset,\n bottom: bottomOffset,\n }}\n onClick={() => !isOpen && onToggle()}\n >\n {isOpen ? (\n <div className={styles['slider-wrapper-side']}>\n <div\n role=\"slider\"\n tabIndex={0}\n aria-label={i18nStrings.resizeHandleAriaLabel}\n aria-valuemax={100}\n aria-valuemin={0}\n aria-valuenow={relativeSize}\n className={clsx(styles.slider, styles['slider-side'])}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n ref={handleRef}\n {...focusVisible}\n >\n <ResizeHandler className={clsx(styles['slider-icon'], styles['slider-icon-side'])} />\n </div>\n </div>\n ) : (\n <InternalButton\n className={clsx(styles['open-button'], styles['open-button-side'])}\n iconName=\"angle-left\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18nStrings.openButtonAriaLabel}\n ariaExpanded={isOpen}\n ref={isRefresh ? null : toggleRef}\n />\n )}\n <div className={styles['content-side']} aria-hidden={!isOpen}>\n <div className={clsx(styles['pane-header-wrapper-side'])}>{paneHeader}</div>\n <hr className={styles['header-divider']} />\n <div className={clsx(styles['pane-content-wrapper-side'])}>{wrappedChildren}</div>\n </div>\n </aside>\n </div>\n );\n};\n\ninterface TransitionContentBottomProps extends TransitionContentProps {\n isMobile: boolean;\n disableContentPaddings?: boolean;\n state: TransitionStatus;\n leftOffset: number;\n rightOffset: number;\n transitioningElementRef: React.Ref<any>;\n centeredMaxWidthClasses: string;\n splitPanelHeaderRef?: React.Ref<any>;\n appLayoutMaxWidth: React.CSSProperties \| undefined;\n}\n\nconst TransitionContentBottom = ({\n baseProps,\n isOpen,\n splitPanelRef,\n handleRef,\n bottomOffset,\n cappedSize,\n isRefresh,\n onToggle,\n i18nStrings,\n relativeSize,\n onKeyDown,\n onSliderPointerDown,\n focusVisible,\n paneHeader,\n wrappedChildren,\n isMobile,\n disableContentPaddings,\n state,\n leftOffset,\n rightOffset,\n transitioningElementRef,\n centeredMaxWidthClasses,\n splitPanelHeaderRef,\n appLayoutMaxWidth,\n}: TransitionContentBottomProps) => {\n const transitionContentBottomRef = useMergeRefs(splitPanelRef \|\| null, transitioningElementRef);\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root, styles.drawer, styles['position-bottom'], {\n [styles['drawer-closed']]: !isOpen,\n [styles['drawer-mobile']]: isMobile,\n [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n [styles.animating]: isRefresh && (state === 'entering' \|\| state === 'exiting'),\n [styles.refresh]: isRefresh,\n })}\n onClick={() => !isOpen && onToggle()}\n style={{\n bottom: bottomOffset,\n left: leftOffset,\n right: rightOffset,\n height: isOpen ? cappedSize : undefined,\n }}\n ref={transitionContentBottomRef}\n >\n {isOpen && (\n <div className={styles['slider-wrapper-bottom']}>\n <div\n role=\"slider\"\n tabIndex={0}\n aria-label={i18nStrings.resizeHandleAriaLabel}\n aria-valuemax={100}\n aria-valuemin={0}\n aria-valuenow={relativeSize}\n className={clsx(styles.slider, styles['slider-bottom'])}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n ref={handleRef}\n {...focusVisible}\n >\n <ResizeHandler className={clsx(styles['slider-icon'], styles['slider-icon-bottom'])} />\n </div>\n </div>\n )}\n <div className={styles['drawer-content-bottom']}>\n <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={splitPanelHeaderRef}>\n {paneHeader}\n </div>\n <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n {wrappedChildren}\n </div>\n </div>\n </div>\n </div>\n );\n};\n\nexport default function SplitPanel({\n header,\n children,\n hidePreferencesButton = false,\n i18nStrings,\n ...restProps\n}: SplitPanelProps) {\n const { __internalRootRef } = useBaseComponent('SplitPanel');\n const {\n size,\n getMaxWidth,\n getMaxHeight,\n position,\n topOffset,\n bottomOffset,\n leftOffset,\n rightOffset,\n disableContentPaddings,\n contentWidthStyles,\n contentWrapperPaddings,\n isCopy,\n isOpen,\n isMobile,\n isRefresh,\n isForcedPosition,\n splitPanelRef,\n splitPanelHeaderRef,\n lastInteraction,\n onPreferencesChange,\n onResize,\n onToggle,\n reportSize,\n setOpenButtonAriaLabel,\n } = useSplitPanelContext();\n const baseProps = getBaseProps(restProps);\n const focusVisible = useFocusVisible();\n const [isPreferencesOpen, setPreferencesOpen] = useState<boolean>(false);\n const [relativeSize, setRelativeSize] = useState(0);\n const [maxSize, setMaxSize] = useState(size);\n const minSize = position === 'bottom' ? MIN_HEIGHT : MIN_WIDTH;\n const cappedSize = getLimitedValue(minSize, size, maxSize);\n const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;\n\n useEffect(() => {\n setOpenButtonAriaLabel?.(i18nStrings.openButtonAriaLabel);\n }, [setOpenButtonAriaLabel, i18nStrings.openButtonAriaLabel]);\n\n useEffect(() => {\n // effects are called inside out in the components tree\n // wait one frame to allow app-layout to complete its calculations\n const handle = requestAnimationFrame(() => {\n const maxSize = position === 'bottom' ? getMaxHeight() : getMaxWidth();\n setRelativeSize((size / maxSize) * 100);\n setMaxSize(maxSize);\n });\n return () => cancelAnimationFrame(handle);\n }, [size, position, getMaxHeight, getMaxWidth]);\n\n useEffect(() => {\n reportSize(cappedSize);\n }, [reportSize, cappedSize]);\n\n useEffect(() => {\n const handler = () => setMaxSize(position === 'bottom' ? getMaxHeight() : getMaxWidth());\n window.addEventListener('resize', handler);\n return () => window.removeEventListener('resize', handler);\n }, [position, getMaxWidth, getMaxHeight]);\n\n const setSidePanelWidth = (width: number) => {\n const maxWidth = getMaxWidth();\n const size = getLimitedValue(MIN_WIDTH, width, maxWidth);\n\n if (isOpen && maxWidth >= MIN_WIDTH) {\n onResize({ size });\n }\n };\n\n const setBottomPanelHeight = (height: number) => {\n const maxHeight = getMaxHeight();\n const size = getLimitedValue(MIN_HEIGHT, height, maxHeight);\n\n if (isOpen && maxHeight >= MIN_HEIGHT) {\n onResize({ size });\n }\n };\n\n const splitPanelRefObject = useRef<HTMLDivElement>(null);\n const handleRef = useRef<HTMLDivElement>(null);\n\n const sizeControlProps: SizeControlProps = {\n position,\n splitPanelRef: splitPanelRefObject,\n handleRef,\n setSidePanelWidth,\n setBottomPanelHeight,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = useKeyboardEvents(sizeControlProps);\n\n const toggleRef = useRef<ButtonProps.Ref>(null);\n const closeRef = useRef<ButtonProps.Ref>(null);\n const preferencesRef = useRef<ButtonProps.Ref>(null);\n\n useEffectOnUpdate(() => {\n switch (lastInteraction?.type) {\n case 'open':\n return closeRef.current?.focus();\n case 'close':\n return toggleRef.current?.focus();\n case 'position':\n return preferencesRef.current?.focus();\n default:\n return;\n }\n }, [lastInteraction]);\n\n const wrappedChildren = (\n <AppLayoutContext.Provider\n value={{\n stickyOffsetTop: topOffset,\n stickyOffsetBottom: bottomOffset,\n }}\n >\n {children}\n </AppLayoutContext.Provider>\n );\n\n const paneHeader = (\n <div className={styles.header} style={appLayoutMaxWidth}>\n <h2 className={styles['header-text']}>{header}</h2>\n <div className={styles['header-actions']}>\n {!hidePreferencesButton && isOpen && (\n <>\n <InternalButton\n className={styles['preferences-button']}\n iconName=\"settings\"\n variant=\"icon\"\n onClick={() => setPreferencesOpen(true)}\n formAction=\"none\"\n ariaLabel={i18nStrings.preferencesTitle}\n ref={preferencesRef}\n />\n <span className={styles.divider} />\n </>\n )}\n\n {isOpen ? (\n <InternalButton\n className={styles['close-button']}\n iconName={isRefresh && position === 'side' ? 'angle-right' : isRefresh ? 'angle-down' : 'close'}\n variant=\"icon\"\n onClick={onToggle}\n formAction=\"none\"\n ariaLabel={i18nStrings.closeButtonAriaLabel}\n ref={closeRef}\n ariaExpanded={isOpen}\n />\n ) : position === 'side' ? null : (\n <InternalButton\n className={styles['open-button']}\n iconName=\"angle-up\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18nStrings.openButtonAriaLabel}\n ref={toggleRef}\n ariaExpanded={isOpen}\n />\n )}\n </div>\n </div>\n );\n\n /\n This effect forces the browser to recalculate the layout\n whenever the split panel might have moved.\n\n This is needed as a workaround for a bug in Safari, which does\n not automatically calculate the new position of the split panel\n _content_ when the split panel moves.\n /\n useLayoutEffect(() => {\n const root = __internalRootRef.current;\n\n if (root) {\n const property = 'transform';\n const temporaryValue = 'translateZ(0)';\n\n const valueBefore = root.style[property];\n root.style[property] = temporaryValue;\n\n // This line forces the browser to recalculate the layout\n void root.offsetHeight;\n\n root.style[property] = valueBefore;\n }\n }, [rightOffset, __internalRootRef]);\n\n const mergedRef = useMergeRefs(splitPanelRef, splitPanelRefObject, __internalRootRef);\n\n /*\n The AppLayout factor moved the circular buttons out of the\n * SplitPanel and into the Tools component. This conditional\n * is still needed for the early return to prevent execution\n * of the following code.\n */\n if (isRefresh && (!isOpen \|\| isCopy) && position === 'side') {\n return <></>;\n }\n\n const centeredMaxWidthClasses = clsx({\n [styles['pane-bottom-center-align']]: isRefresh,\n [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n });\n\n return (\n <Transition in={isOpen ?? false}>\n {(state, transitioningElementRef) => (\n <>\n {position === 'side' && (\n <TransitionContentSide\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n handleRef={handleRef}\n topOffset={topOffset}\n bottomOffset={bottomOffset}\n cappedSize={cappedSize}\n isRefresh={isRefresh}\n onToggle={onToggle}\n i18nStrings={i18nStrings}\n relativeSize={relativeSize}\n onKeyDown={onKeyDown}\n onSliderPointerDown={onSliderPointerDown}\n focusVisible={focusVisible}\n toggleRef={toggleRef}\n paneHeader={paneHeader}\n wrappedChildren={wrappedChildren}\n ></TransitionContentSide>\n )}\n\n {position === 'bottom' && (\n <TransitionContentBottom\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n handleRef={handleRef}\n bottomOffset={bottomOffset}\n cappedSize={cappedSize}\n isRefresh={isRefresh}\n onToggle={onToggle}\n i18nStrings={i18nStrings}\n relativeSize={relativeSize}\n onKeyDown={onKeyDown}\n onSliderPointerDown={onSliderPointerDown}\n focusVisible={focusVisible}\n paneHeader={paneHeader}\n wrappedChildren={wrappedChildren}\n isMobile={isMobile}\n disableContentPaddings={disableContentPaddings}\n state={state}\n leftOffset={leftOffset}\n rightOffset={rightOffset}\n transitioningElementRef={transitioningElementRef}\n centeredMaxWidthClasses={centeredMaxWidthClasses}\n splitPanelHeaderRef={splitPanelHeaderRef}\n appLayoutMaxWidth={appLayoutMaxWidth}\n ></TransitionContentBottom>\n )}\n {isPreferencesOpen && (\n <PreferencesModal\n visible={true}\n preferences={{ position }}\n disabledSidePosition={position === 'bottom' && isForcedPosition}\n isRefresh={isRefresh}\n i18nStrings={{\n header: i18nStrings.preferencesTitle,\n confirm: i18nStrings.preferencesConfirm,\n cancel: i18nStrings.preferencesCancel,\n positionLabel: i18nStrings.preferencesPositionLabel,\n positionDescription: i18nStrings.preferencesPositionDescription,\n positionBottom: i18nStrings.preferencesPositionBottom,\n positionSide: i18nStrings.preferencesPositionSide,\n }}\n onConfirm={preferences => {\n onPreferencesChange({ ...preferences });\n setPreferencesOpen(false);\n }}\n onDismiss={() => {\n setPreferencesOpen(false);\n }}\n />\n )}\n </>\n )}\n </Transition>\n );\n}\n\napplyDisplayName(SplitPanel, 'SplitPanel');\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/split-panel/index.tsx"],"names":[],"mappings":";AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC5E,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,YAAY,EAAsB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,eAAe,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAGxE,OAAO,aAAa,MAAM,wBAAwB,CAAC;AACnD,OAAO,gBAAgB,MAAM,qBAAqB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAEhE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,UAAU,EAAoB,MAAM,mCAAmC,CAAC;AAEjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAC3E,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAI9D,IAAM,UAAU,GAAG,GAAG,CAAC;AACvB,IAAM,SAAS,GAAG,GAAG,CAAC;AAyBtB,IAAM,qBAAqB,GAAG,UAAC,EAmBF;;QAlB3B,SAAS,eAAA,EACT,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,SAAS,eAAA,EACT,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,UAAU,gBAAA,EACV,aAAa,mBAAA,EACb,eAAe,qBAAA;IAEf,OAAO,CACL,wCACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,eAAe,CAAC;YACtF,GAAC,MAAM,CAAC,eAAe,CAAC,IAAG,CAAC,MAAM;gBAClC,EACF,KAAK,EAAE;YACL,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS;YACtC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;SACzC,EACD,GAAG,EAAE,aAAa;QAElB,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC;gBAC3C,GAAC,MAAM,CAAC,OAAO,IAAG,SAAS;oBAC3B,EACF,KAAK,EAAE;gBACL,GAAG,EAAE,SAAS;gBACd,MAAM,EAAE,YAAY;aACrB,EACD,OAAO,EAAE,cAAM,OAAA,CAAC,MAAM,IAAI,QAAQ,EAAE,EAArB,CAAqB,qBACnB,aAAa,EAC9B,IAAI,EAAC,QAAQ;YAEZ,MAAM,CAAC,CAAC,CAAC,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC;gBAC3C,sCACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,gBACC,WAAW,CAAC,qBAAqB,mBAC9B,GAAG,mBACH,CAAC,mBACD,YAAY,EAC3B,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC,EACrD,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,mBAAmB,EAClC,GAAG,EAAE,SAAS,IACV,YAAY;oBAEhB,oBAAC,aAAa,IAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC,GAAI,CACjF,CACF,CACP,CAAC,CAAC,CAAC,CACF,oBAAC,cAAc,IACb,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAClE,QAAQ,EAAC,YAAY,EACrB,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,WAAW,CAAC,mBAAmB,EAC1C,YAAY,EAAE,MAAM,EACpB,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,GACjC,CACH;YACD,6BAAK,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,iBAAe,CAAC,MAAM;gBAC1D,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,IAAG,UAAU,CAAO;gBAC5E,4BAAI,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,GAAI;gBAC3C,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,2BAA2B,CAAC,CAAC,IAAG,eAAe,CAAO,CAC9E,CACF,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAcF,IAAM,uBAAuB,GAAG,UAAC,EA0BF;;QAzB7B,SAAS,eAAA,EACT,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,UAAU,gBAAA,EACV,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,mBAAmB,yBAAA,EACnB,YAAY,kBAAA,EACZ,UAAU,gBAAA,EACV,eAAe,qBAAA,EACf,QAAQ,cAAA,EACR,sBAAsB,4BAAA,EACtB,KAAK,WAAA,EACL,UAAU,gBAAA,EACV,WAAW,iBAAA,EACX,uBAAuB,6BAAA,EACvB,uBAAuB,6BAAA,EACvB,mBAAmB,yBAAA,EACnB,iBAAiB,uBAAA,EACjB,aAAa,mBAAA;IAEb,IAAM,0BAA0B,GAAG,YAAY,CAAC,aAAa,IAAI,IAAI,EAAE,uBAAuB,CAAC,CAAC;IAChG,OAAO,CACL,wCACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC;YACxF,GAAC,MAAM,CAAC,eAAe,CAAC,IAAG,CAAC,MAAM;YAClC,GAAC,MAAM,CAAC,eAAe,CAAC,IAAG,QAAQ;YACnC,GAAC,MAAM,CAAC,iCAAiC,CAAC,IAAG,sBAAsB;YACnE,GAAC,MAAM,CAAC,SAAS,IAAG,SAAS,IAAI,CAAC,KAAK,KAAK,UAAU,IAAI,KAAK,KAAK,SAAS,CAAC;YAC9E,GAAC,MAAM,CAAC,OAAO,IAAG,SAAS;gBAC3B,EACF,OAAO,EAAE,cAAM,OAAA,CAAC,MAAM,IAAI,QAAQ,EAAE,EAArB,CAAqB,EACpC,KAAK,EAAE;YACL,MAAM,EAAE,YAAY;YACpB,IAAI,EAAE,UAAU;YAChB,KAAK,EAAE,WAAW;YAClB,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS;SACxC,EACD,GAAG,EAAE,0BAA0B;QAE9B,MAAM,IAAI,CACT,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC;YAC7C,sCACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,gBACC,WAAW,CAAC,qBAAqB,mBAC9B,GAAG,mBACH,CAAC,mBACD,YAAY,EAC3B,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC,EACvD,SAAS,EAAE,SAAS,EACpB,aAAa,EAAE,mBAAmB,EAClC,GAAG,EAAE,SAAS,IACV,YAAY;gBAEhB,oBAAC,aAAa,IAAC,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,oBAAoB,CAAC,CAAC,GAAI,CACnF,CACF,CACP;QACD,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC,qBAAmB,aAAa,EAAE,IAAI,EAAC,QAAQ;YAC5F,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,4BAA4B,CAAC,EAAE,uBAAuB,CAAC,EAAE,GAAG,EAAE,mBAAmB,IAC1G,UAAU,CACP;YACN,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,EAAE,uBAAuB,CAAC,iBAAe,CAAC,MAAM;gBAC3F,6BAAK,SAAS,EAAE,IAAI,WAAG,GAAC,MAAM,CAAC,0BAA0B,CAAC,IAAG,SAAS,MAAG,EAAE,KAAK,EAAE,iBAAiB,IAChG,eAAe,CACZ,CACF,CACF,CACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAMjB;;IALhB,IAAA,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA,EAC7B,WAAW,iBAAA,EACR,SAAS,cALqB,8DAMlC,CADa;IAEJ,IAAA,iBAAiB,GAAK,gBAAgB,CAAC,YAAY,CAAC,kBAAnC,CAAoC;IACvD,IAAA,KAyBF,oBAAoB,EAAE,EAxBxB,IAAI,UAAA,EACJ,WAAW,iBAAA,EACX,YAAY,kBAAA,EACZ,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,YAAY,kBAAA,EACZ,UAAU,gBAAA,EACV,WAAW,iBAAA,EACX,sBAAsB,4BAAA,EACtB,kBAAkB,wBAAA,EAClB,sBAAsB,4BAAA,EACtB,MAAM,YAAA,EACN,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,SAAS,eAAA,EACT,gBAAgB,sBAAA,EAChB,aAAa,mBAAA,EACb,mBAAmB,yBAAA,EACnB,eAAe,qBAAA,EACf,mBAAmB,yBAAA,EACnB,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,UAAU,gBAAA,EACV,sBAAsB,4BACE,CAAC;IAC3B,IAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC,CAAC;IAC1C,IAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IACjC,IAAA,KAA0C,QAAQ,CAAU,KAAK,CAAC,EAAjE,iBAAiB,QAAA,EAAE,kBAAkB,QAA4B,CAAC;IACnE,IAAA,KAAkC,QAAQ,CAAC,CAAC,CAAC,EAA5C,YAAY,QAAA,EAAE,eAAe,QAAe,CAAC;IAC9C,IAAA,KAAwB,QAAQ,CAAC,IAAI,CAAC,EAArC,OAAO,QAAA,EAAE,UAAU,QAAkB,CAAC;IAC7C,IAAM,OAAO,GAAG,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/D,IAAM,UAAU,GAAG,eAAe,CAAC,OAAO,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;IAC3D,IAAM,iBAAiB,GAAG,SAAS,IAAI,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS,CAAC;IAE9F,SAAS,CAAC;QACR,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAG,WAAW,CAAC,mBAAmB,CAAC,CAAC;IAC5D,CAAC,EAAE,CAAC,sBAAsB,EAAE,WAAW,CAAC,mBAAmB,CAAC,CAAC,CAAC;IAE9D,SAAS,CAAC;QACR,uDAAuD;QACvD,kEAAkE;QAClE,IAAM,MAAM,GAAG,qBAAqB,CAAC;YACnC,IAAM,OAAO,GAAG,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;YACvE,eAAe,CAAC,CAAC,IAAI,GAAG,OAAO,CAAC,GAAG,GAAG,CAAC,CAAC;YACxC,UAAU,CAAC,OAAO,CAAC,CAAC;QACtB,CAAC,CAAC,CAAC;QACH,OAAO,cAAM,OAAA,oBAAoB,CAAC,MAAM,CAAC,EAA5B,CAA4B,CAAC;IAC5C,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,WAAW,CAAC,CAAC,CAAC;IAEhD,SAAS,CAAC;QACR,UAAU,CAAC,UAAU,CAAC,CAAC;IACzB,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC;IAE7B,SAAS,CAAC;QACR,IAAM,OAAO,GAAG,cAAM,OAAA,UAAU,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,EAAlE,CAAkE,CAAC;QACzF,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;QAC3C,OAAO,cAAM,OAAA,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC,EAA7C,CAA6C,CAAC;IAC7D,CAAC,EAAE,CAAC,QAAQ,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC,CAAC;IAE1C,IAAM,iBAAiB,GAAG,UAAC,KAAa;QACtC,IAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;QAC/B,IAAM,IAAI,GAAG,eAAe,CAAC,SAAS,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;QAEzD,IAAI,MAAM,IAAI,QAAQ,IAAI,SAAS,EAAE;YACnC,QAAQ,CAAC,EAAE,IAAI,MAAA,EAAE,CAAC,CAAC;SACpB;IACH,CAAC,CAAC;IAEF,IAAM,oBAAoB,GAAG,UAAC,MAAc;QAC1C,IAAM,SAAS,GAAG,YAAY,EAAE,CAAC;QACjC,IAAM,IAAI,GAAG,eAAe,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC;QAE5D,IAAI,MAAM,IAAI,SAAS,IAAI,UAAU,EAAE;YACrC,QAAQ,CAAC,EAAE,IAAI,MAAA,EAAE,CAAC,CAAC;SACpB;IACH,CAAC,CAAC;IAEF,IAAM,mBAAmB,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzD,IAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,IAAM,gBAAgB,GAAqB;QACzC,QAAQ,UAAA;QACR,aAAa,EAAE,mBAAmB;QAClC,SAAS,WAAA;QACT,iBAAiB,mBAAA;QACjB,oBAAoB,sBAAA;KACrB,CAAC;IACF,IAAM,mBAAmB,GAAG,gBAAgB,CAAC,gBAAgB,CAAC,CAAC;IAC/D,IAAM,SAAS,GAAG,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAEtD,IAAM,SAAS,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAChD,IAAM,QAAQ,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAC/C,IAAM,cAAc,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAErD,iBAAiB,CAAC;;QAChB,QAAQ,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,IAAI,EAAE;YAC7B,KAAK,MAAM;gBACT,OAAO,MAAA,SAAS,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YACpC,KAAK,OAAO;gBACV,OAAO,MAAA,SAAS,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YACpC,KAAK,UAAU;gBACb,OAAO,MAAA,cAAc,CAAC,OAAO,0CAAE,KAAK,EAAE,CAAC;YACzC;gBACE,OAAO;SACV;IACH,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAEtB,IAAM,eAAe,GAAG,CACtB,oBAAC,gBAAgB,CAAC,QAAQ,IACxB,KAAK,EAAE;YACL,eAAe,EAAE,SAAS;YAC1B,kBAAkB,EAAE,YAAY;SACjC,IAEA,QAAQ,CACiB,CAC7B,CAAC;IAEF,IAAM,aAAa,GAAG,WAAW,CAAC,oBAAoB,CAAC,CAAC;IAExD,IAAM,UAAU,GAAG,CACjB,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,EAAE,iBAAiB;QACrD,4BAAI,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,EAAE,EAAE,EAAE,aAAa,IACpD,MAAM,CACJ;QACL,6BAAK,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC;YACrC,CAAC,qBAAqB,IAAI,MAAM,IAAI,CACnC;gBACE,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,oBAAoB,CAAC,EACvC,QAAQ,EAAC,UAAU,EACnB,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,cAAM,OAAA,kBAAkB,CAAC,IAAI,CAAC,EAAxB,CAAwB,EACvC,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,WAAW,CAAC,gBAAgB,EACvC,GAAG,EAAE,cAAc,GACnB;gBACF,8BAAM,SAAS,EAAE,MAAM,CAAC,OAAO,GAAI,CAClC,CACJ;YAEA,MAAM,CAAC,CAAC,CAAC,CACR,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,EACjC,QAAQ,EAAE,SAAS,IAAI,QAAQ,KAAK,MAAM,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,OAAO,EAC/F,OAAO,EAAC,MAAM,EACd,OAAO,EAAE,QAAQ,EACjB,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,WAAW,CAAC,oBAAoB,EAC3C,GAAG,EAAE,QAAQ,EACb,YAAY,EAAE,MAAM,GACpB,CACH,CAAC,CAAC,CAAC,QAAQ,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC/B,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,aAAa,CAAC,EAChC,QAAQ,EAAC,UAAU,EACnB,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,WAAW,CAAC,mBAAmB,EAC1C,GAAG,EAAE,SAAS,EACd,YAAY,EAAE,MAAM,GACpB,CACH,CACG,CACF,CACP,CAAC;IAEF;;;;;;;MAOE;IACF,eAAe,CAAC;QACd,IAAM,IAAI,GAAG,iBAAiB,CAAC,OAAO,CAAC;QAEvC,IAAI,IAAI,EAAE;YACR,IAAM,QAAQ,GAAG,WAAW,CAAC;YAC7B,IAAM,cAAc,GAAG,eAAe,CAAC;YAEvC,IAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;YACzC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,cAAc,CAAC;YAEtC,yDAAyD;YACzD,KAAK,IAAI,CAAC,YAAY,CAAC;YAEvB,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,WAAW,CAAC;SACpC;IACH,CAAC,EAAE,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAErC,IAAM,SAAS,GAAG,YAAY,CAAC,aAAa,EAAE,mBAAmB,EAAE,iBAAiB,CAAC,CAAC;IAEtF;;;;;OAKG;IACH,IAAI,SAAS,IAAI,CAAC,CAAC,MAAM,IAAI,MAAM,CAAC,IAAI,QAAQ,KAAK,MAAM,EAAE;QAC3D,OAAO,yCAAK,CAAC;KACd;IAED,IAAM,uBAAuB,GAAG,IAAI;QAClC,GAAC,MAAM,CAAC,0BAA0B,CAAC,IAAG,SAAS;QAC/C,GAAC,MAAM,CAAC,iCAAiC,CAAC,IAAG,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,SAAS;QAC9E,GAAC,MAAM,CAAC,mCAAmC,CAAC,IAAG,sBAAsB,aAAtB,sBAAsB,uBAAtB,sBAAsB,CAAE,WAAW;YAClF,CAAC;IAEH,OAAO,CACL,oBAAC,UAAU,IAAC,IAAE,EAAE,MAAM,aAAN,MAAM,cAAN,MAAM,GAAI,KAAK,IAC5B,UAAC,KAAK,EAAE,uBAAuB,IAAK,OAAA,CACnC;QACG,QAAQ,KAAK,MAAM,IAAI,CACtB,oBAAC,qBAAqB,IACpB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,SAAS,EACxB,SAAS,EAAE,SAAS,EACpB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,aAAa,EAAE,aAAa,GACL,CAC1B;QAEA,QAAQ,KAAK,QAAQ,IAAI,CACxB,oBAAC,uBAAuB,IACtB,SAAS,EAAE,SAAS,EACpB,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,SAAS,EACxB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,YAAY,EAAE,YAAY,EAC1B,UAAU,EAAE,UAAU,EACtB,eAAe,EAAE,eAAe,EAChC,QAAQ,EAAE,QAAQ,EAClB,sBAAsB,EAAE,sBAAsB,EAC9C,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,uBAAuB,EAAE,uBAAuB,EAChD,uBAAuB,EAAE,uBAAuB,EAChD,mBAAmB,EAAE,mBAAmB,EACxC,iBAAiB,EAAE,iBAAiB,EACpC,aAAa,EAAE,aAAa,GACH,CAC5B;QACA,iBAAiB,IAAI,CACpB,oBAAC,gBAAgB,IACf,OAAO,EAAE,IAAI,EACb,WAAW,EAAE,EAAE,QAAQ,UAAA,EAAE,EACzB,oBAAoB,EAAE,QAAQ,KAAK,QAAQ,IAAI,gBAAgB,EAC/D,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE;gBACX,MAAM,EAAE,WAAW,CAAC,gBAAgB;gBACpC,OAAO,EAAE,WAAW,CAAC,kBAAkB;gBACvC,MAAM,EAAE,WAAW,CAAC,iBAAiB;gBACrC,aAAa,EAAE,WAAW,CAAC,wBAAwB;gBACnD,mBAAmB,EAAE,WAAW,CAAC,8BAA8B;gBAC/D,cAAc,EAAE,WAAW,CAAC,yBAAyB;gBACrD,YAAY,EAAE,WAAW,CAAC,uBAAuB;aAClD,EACD,SAAS,EAAE,UAAA,WAAW;gBACpB,mBAAmB,cAAM,WAAW,EAAG,CAAC;gBACxC,kBAAkB,CAAC,KAAK,CAAC,CAAC;YAC5B,CAAC,EACD,SAAS,EAAE;gBACT,kBAAkB,CAAC,KAAK,CAAC,CAAC;YAC5B,CAAC,GACD,CACH,CACA,CACJ,EA/EoC,CA+EpC,CACU,CACd,CAAC;AACJ,CAAC;AAED,gBAAgB,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useState, useEffect, useLayoutEffect, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { InternalButton } from '../button/internal';\nimport { getBaseProps, BaseComponentProps } from '../internal/base-component';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport useFocusVisible from '../internal/hooks/focus-visible';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\n\nimport { SplitPanelProps, SizeControlProps } from './interfaces';\nimport ResizeHandler from './icons/resize-handler';\nimport PreferencesModal from './preferences-modal';\nimport { usePointerEvents } from './utils/use-pointer-events';\nimport { useKeyboardEvents } from './utils/use-keyboard-events';\n\nimport styles from './styles.css.js';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { AppLayoutContext } from '../internal/context/app-layout-context';\nimport { getLimitedValue } from './utils/size-utils';\nimport { Transition, TransitionStatus } from '../internal/components/transition';\nimport { ButtonProps } from '../button/interfaces';\nimport { useEffectOnUpdate } from '../internal/hooks/use-effect-on-update';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\n\nexport { SplitPanelProps };\n\nconst MIN_HEIGHT = 160;\nconst MIN_WIDTH = 280;\ninterface TransitionContentProps {\n baseProps: BaseComponentProps;\n isOpen?: boolean;\n splitPanelRef?: React.Ref<any>;\n handleRef: React.RefObject<HTMLDivElement>;\n bottomOffset: number;\n cappedSize: number;\n isRefresh: boolean;\n onToggle: () => void;\n i18nStrings: SplitPanelProps.I18nStrings;\n relativeSize: number;\n onKeyDown: (event: React.KeyboardEvent<Element>) => void;\n onSliderPointerDown: () => void;\n focusVisible: { 'data-awsui-focus-visible': true } \| { 'data-awsui-focus-visible'?: undefined };\n paneHeader: JSX.Element;\n panelHeaderId: string;\n wrappedChildren: JSX.Element;\n}\n\ninterface TransitionContentSideProps extends TransitionContentProps {\n topOffset: number;\n toggleRef: React.RefObject<ButtonProps.Ref>;\n}\n\nconst TransitionContentSide = ({\n baseProps,\n isOpen,\n splitPanelRef,\n handleRef,\n topOffset,\n bottomOffset,\n cappedSize,\n isRefresh,\n onToggle,\n i18nStrings,\n relativeSize,\n onKeyDown,\n onSliderPointerDown,\n focusVisible,\n toggleRef,\n paneHeader,\n panelHeaderId,\n wrappedChildren,\n}: TransitionContentSideProps) => {\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles.root, styles['position-side'], {\n [styles['drawer-closed']]: !isOpen,\n })}\n style={{\n width: isOpen ? cappedSize : undefined,\n maxWidth: isRefresh ? '100%' : undefined,\n }}\n ref={splitPanelRef}\n >\n <div\n className={clsx(styles['drawer-content-side'], {\n [styles.refresh]: isRefresh,\n })}\n style={{\n top: topOffset,\n bottom: bottomOffset,\n }}\n onClick={() => !isOpen && onToggle()}\n aria-labelledby={panelHeaderId}\n role=\"region\"\n >\n {isOpen ? (\n <div className={styles['slider-wrapper-side']}>\n <div\n role=\"slider\"\n tabIndex={0}\n aria-label={i18nStrings.resizeHandleAriaLabel}\n aria-valuemax={100}\n aria-valuemin={0}\n aria-valuenow={relativeSize}\n className={clsx(styles.slider, styles['slider-side'])}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n ref={handleRef}\n {...focusVisible}\n >\n <ResizeHandler className={clsx(styles['slider-icon'], styles['slider-icon-side'])} />\n </div>\n </div>\n ) : (\n <InternalButton\n className={clsx(styles['open-button'], styles['open-button-side'])}\n iconName=\"angle-left\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18nStrings.openButtonAriaLabel}\n ariaExpanded={isOpen}\n ref={isRefresh ? null : toggleRef}\n />\n )}\n <div className={styles['content-side']} aria-hidden={!isOpen}>\n <div className={clsx(styles['pane-header-wrapper-side'])}>{paneHeader}</div>\n <hr className={styles['header-divider']} />\n <div className={clsx(styles['pane-content-wrapper-side'])}>{wrappedChildren}</div>\n </div>\n </div>\n </div>\n );\n};\n\ninterface TransitionContentBottomProps extends TransitionContentProps {\n isMobile: boolean;\n disableContentPaddings?: boolean;\n state: TransitionStatus;\n leftOffset: number;\n rightOffset: number;\n transitioningElementRef: React.Ref<any>;\n centeredMaxWidthClasses: string;\n splitPanelHeaderRef?: React.Ref<any>;\n appLayoutMaxWidth: React.CSSProperties \| undefined;\n}\n\nconst TransitionContentBottom = ({\n baseProps,\n isOpen,\n splitPanelRef,\n handleRef,\n bottomOffset,\n cappedSize,\n isRefresh,\n onToggle,\n i18nStrings,\n relativeSize,\n onKeyDown,\n onSliderPointerDown,\n focusVisible,\n paneHeader,\n wrappedChildren,\n isMobile,\n disableContentPaddings,\n state,\n leftOffset,\n rightOffset,\n transitioningElementRef,\n centeredMaxWidthClasses,\n splitPanelHeaderRef,\n appLayoutMaxWidth,\n panelHeaderId,\n}: TransitionContentBottomProps) => {\n const transitionContentBottomRef = useMergeRefs(splitPanelRef \|\| null, transitioningElementRef);\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.root, styles.drawer, styles['position-bottom'], {\n [styles['drawer-closed']]: !isOpen,\n [styles['drawer-mobile']]: isMobile,\n [styles['drawer-disable-content-paddings']]: disableContentPaddings,\n [styles.animating]: isRefresh && (state === 'entering' \|\| state === 'exiting'),\n [styles.refresh]: isRefresh,\n })}\n onClick={() => !isOpen && onToggle()}\n style={{\n bottom: bottomOffset,\n left: leftOffset,\n right: rightOffset,\n height: isOpen ? cappedSize : undefined,\n }}\n ref={transitionContentBottomRef}\n >\n {isOpen && (\n <div className={styles['slider-wrapper-bottom']}>\n <div\n role=\"slider\"\n tabIndex={0}\n aria-label={i18nStrings.resizeHandleAriaLabel}\n aria-valuemax={100}\n aria-valuemin={0}\n aria-valuenow={relativeSize}\n className={clsx(styles.slider, styles['slider-bottom'])}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n ref={handleRef}\n {...focusVisible}\n >\n <ResizeHandler className={clsx(styles['slider-icon'], styles['slider-icon-bottom'])} />\n </div>\n </div>\n )}\n <div className={styles['drawer-content-bottom']} aria-labelledby={panelHeaderId} role=\"region\">\n <div className={clsx(styles['pane-header-wrapper-bottom'], centeredMaxWidthClasses)} ref={splitPanelHeaderRef}>\n {paneHeader}\n </div>\n <div className={clsx(styles['content-bottom'], centeredMaxWidthClasses)} aria-hidden={!isOpen}>\n <div className={clsx({ [styles['content-bottom-max-width']]: isRefresh })} style={appLayoutMaxWidth}>\n {wrappedChildren}\n </div>\n </div>\n </div>\n </div>\n );\n};\n\nexport default function SplitPanel({\n header,\n children,\n hidePreferencesButton = false,\n i18nStrings,\n ...restProps\n}: SplitPanelProps) {\n const { __internalRootRef } = useBaseComponent('SplitPanel');\n const {\n size,\n getMaxWidth,\n getMaxHeight,\n position,\n topOffset,\n bottomOffset,\n leftOffset,\n rightOffset,\n disableContentPaddings,\n contentWidthStyles,\n contentWrapperPaddings,\n isCopy,\n isOpen,\n isMobile,\n isRefresh,\n isForcedPosition,\n splitPanelRef,\n splitPanelHeaderRef,\n lastInteraction,\n onPreferencesChange,\n onResize,\n onToggle,\n reportSize,\n setOpenButtonAriaLabel,\n } = useSplitPanelContext();\n const baseProps = getBaseProps(restProps);\n const focusVisible = useFocusVisible();\n const [isPreferencesOpen, setPreferencesOpen] = useState<boolean>(false);\n const [relativeSize, setRelativeSize] = useState(0);\n const [maxSize, setMaxSize] = useState(size);\n const minSize = position === 'bottom' ? MIN_HEIGHT : MIN_WIDTH;\n const cappedSize = getLimitedValue(minSize, size, maxSize);\n const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;\n\n useEffect(() => {\n setOpenButtonAriaLabel?.(i18nStrings.openButtonAriaLabel);\n }, [setOpenButtonAriaLabel, i18nStrings.openButtonAriaLabel]);\n\n useEffect(() => {\n // effects are called inside out in the components tree\n // wait one frame to allow app-layout to complete its calculations\n const handle = requestAnimationFrame(() => {\n const maxSize = position === 'bottom' ? getMaxHeight() : getMaxWidth();\n setRelativeSize((size / maxSize) * 100);\n setMaxSize(maxSize);\n });\n return () => cancelAnimationFrame(handle);\n }, [size, position, getMaxHeight, getMaxWidth]);\n\n useEffect(() => {\n reportSize(cappedSize);\n }, [reportSize, cappedSize]);\n\n useEffect(() => {\n const handler = () => setMaxSize(position === 'bottom' ? getMaxHeight() : getMaxWidth());\n window.addEventListener('resize', handler);\n return () => window.removeEventListener('resize', handler);\n }, [position, getMaxWidth, getMaxHeight]);\n\n const setSidePanelWidth = (width: number) => {\n const maxWidth = getMaxWidth();\n const size = getLimitedValue(MIN_WIDTH, width, maxWidth);\n\n if (isOpen && maxWidth >= MIN_WIDTH) {\n onResize({ size });\n }\n };\n\n const setBottomPanelHeight = (height: number) => {\n const maxHeight = getMaxHeight();\n const size = getLimitedValue(MIN_HEIGHT, height, maxHeight);\n\n if (isOpen && maxHeight >= MIN_HEIGHT) {\n onResize({ size });\n }\n };\n\n const splitPanelRefObject = useRef<HTMLDivElement>(null);\n const handleRef = useRef<HTMLDivElement>(null);\n\n const sizeControlProps: SizeControlProps = {\n position,\n splitPanelRef: splitPanelRefObject,\n handleRef,\n setSidePanelWidth,\n setBottomPanelHeight,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = useKeyboardEvents(sizeControlProps);\n\n const toggleRef = useRef<ButtonProps.Ref>(null);\n const closeRef = useRef<ButtonProps.Ref>(null);\n const preferencesRef = useRef<ButtonProps.Ref>(null);\n\n useEffectOnUpdate(() => {\n switch (lastInteraction?.type) {\n case 'open':\n return handleRef.current?.focus();\n case 'close':\n return toggleRef.current?.focus();\n case 'position':\n return preferencesRef.current?.focus();\n default:\n return;\n }\n }, [lastInteraction]);\n\n const wrappedChildren = (\n <AppLayoutContext.Provider\n value={{\n stickyOffsetTop: topOffset,\n stickyOffsetBottom: bottomOffset,\n }}\n >\n {children}\n </AppLayoutContext.Provider>\n );\n\n const panelHeaderId = useUniqueId('split-panel-header');\n\n const paneHeader = (\n <div className={styles.header} style={appLayoutMaxWidth}>\n <h2 className={styles['header-text']} id={panelHeaderId}>\n {header}\n </h2>\n <div className={styles['header-actions']}>\n {!hidePreferencesButton && isOpen && (\n <>\n <InternalButton\n className={styles['preferences-button']}\n iconName=\"settings\"\n variant=\"icon\"\n onClick={() => setPreferencesOpen(true)}\n formAction=\"none\"\n ariaLabel={i18nStrings.preferencesTitle}\n ref={preferencesRef}\n />\n <span className={styles.divider} />\n </>\n )}\n\n {isOpen ? (\n <InternalButton\n className={styles['close-button']}\n iconName={isRefresh && position === 'side' ? 'angle-right' : isRefresh ? 'angle-down' : 'close'}\n variant=\"icon\"\n onClick={onToggle}\n formAction=\"none\"\n ariaLabel={i18nStrings.closeButtonAriaLabel}\n ref={closeRef}\n ariaExpanded={isOpen}\n />\n ) : position === 'side' ? null : (\n <InternalButton\n className={styles['open-button']}\n iconName=\"angle-up\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18nStrings.openButtonAriaLabel}\n ref={toggleRef}\n ariaExpanded={isOpen}\n />\n )}\n </div>\n </div>\n );\n\n /\n This effect forces the browser to recalculate the layout\n whenever the split panel might have moved.\n\n This is needed as a workaround for a bug in Safari, which does\n not automatically calculate the new position of the split panel\n _content_ when the split panel moves.\n /\n useLayoutEffect(() => {\n const root = __internalRootRef.current;\n\n if (root) {\n const property = 'transform';\n const temporaryValue = 'translateZ(0)';\n\n const valueBefore = root.style[property];\n root.style[property] = temporaryValue;\n\n // This line forces the browser to recalculate the layout\n void root.offsetHeight;\n\n root.style[property] = valueBefore;\n }\n }, [rightOffset, __internalRootRef]);\n\n const mergedRef = useMergeRefs(splitPanelRef, splitPanelRefObject, __internalRootRef);\n\n /*\n The AppLayout factor moved the circular buttons out of the\n * SplitPanel and into the Tools component. This conditional\n * is still needed for the early return to prevent execution\n * of the following code.\n */\n if (isRefresh && (!isOpen \|\| isCopy) && position === 'side') {\n return <></>;\n }\n\n const centeredMaxWidthClasses = clsx({\n [styles['pane-bottom-center-align']]: isRefresh,\n [styles['pane-bottom-content-nav-padding']]: contentWrapperPaddings?.closedNav,\n [styles['pane-bottom-content-tools-padding']]: contentWrapperPaddings?.closedTools,\n });\n\n return (\n <Transition in={isOpen ?? false}>\n {(state, transitioningElementRef) => (\n <>\n {position === 'side' && (\n <TransitionContentSide\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n handleRef={handleRef}\n topOffset={topOffset}\n bottomOffset={bottomOffset}\n cappedSize={cappedSize}\n isRefresh={isRefresh}\n onToggle={onToggle}\n i18nStrings={i18nStrings}\n relativeSize={relativeSize}\n onKeyDown={onKeyDown}\n onSliderPointerDown={onSliderPointerDown}\n focusVisible={focusVisible}\n toggleRef={toggleRef}\n paneHeader={paneHeader}\n wrappedChildren={wrappedChildren}\n panelHeaderId={panelHeaderId}\n ></TransitionContentSide>\n )}\n\n {position === 'bottom' && (\n <TransitionContentBottom\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n handleRef={handleRef}\n bottomOffset={bottomOffset}\n cappedSize={cappedSize}\n isRefresh={isRefresh}\n onToggle={onToggle}\n i18nStrings={i18nStrings}\n relativeSize={relativeSize}\n onKeyDown={onKeyDown}\n onSliderPointerDown={onSliderPointerDown}\n focusVisible={focusVisible}\n paneHeader={paneHeader}\n wrappedChildren={wrappedChildren}\n isMobile={isMobile}\n disableContentPaddings={disableContentPaddings}\n state={state}\n leftOffset={leftOffset}\n rightOffset={rightOffset}\n transitioningElementRef={transitioningElementRef}\n centeredMaxWidthClasses={centeredMaxWidthClasses}\n splitPanelHeaderRef={splitPanelHeaderRef}\n appLayoutMaxWidth={appLayoutMaxWidth}\n panelHeaderId={panelHeaderId}\n ></TransitionContentBottom>\n )}\n {isPreferencesOpen && (\n <PreferencesModal\n visible={true}\n preferences={{ position }}\n disabledSidePosition={position === 'bottom' && isForcedPosition}\n isRefresh={isRefresh}\n i18nStrings={{\n header: i18nStrings.preferencesTitle,\n confirm: i18nStrings.preferencesConfirm,\n cancel: i18nStrings.preferencesCancel,\n positionLabel: i18nStrings.preferencesPositionLabel,\n positionDescription: i18nStrings.preferencesPositionDescription,\n positionBottom: i18nStrings.preferencesPositionBottom,\n positionSide: i18nStrings.preferencesPositionSide,\n }}\n onConfirm={preferences => {\n onPreferencesChange({ ...preferences });\n setPreferencesOpen(false);\n }}\n onDismiss={() => {\n setPreferencesOpen(false);\n }}\n />\n )}\n </>\n )}\n </Transition>\n );\n}\n\napplyDisplayName(SplitPanel, 'SplitPanel');\n"]}

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

@@ -1,39 +1,39 @@
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_wih1l_r2zh7_97",
-  "tools": "awsui_tools_wih1l_r2zh7_106",
-  "tools-filtering": "awsui_tools-filtering_wih1l_r2zh7_112",
-  "tools-align-right": "awsui_tools-align-right_wih1l_r2zh7_117",
-  "tools-pagination": "awsui_tools-pagination_wih1l_r2zh7_121",
-  "tools-preferences": "awsui_tools-preferences_wih1l_r2zh7_121",
-  "tools-small": "awsui_tools-small_wih1l_r2zh7_127",
-  "table": "awsui_table_wih1l_r2zh7_133",
-  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_r2zh7_139",
-  "wrapper": "awsui_wrapper_wih1l_r2zh7_143",
-  "variant-stacked": "awsui_variant-stacked_wih1l_r2zh7_153",
-  "variant-container": "awsui_variant-container_wih1l_r2zh7_153",
-  "variant-embedded": "awsui_variant-embedded_wih1l_r2zh7_157",
-  "has-header": "awsui_has-header_wih1l_r2zh7_160",
-  "has-footer": "awsui_has-footer_wih1l_r2zh7_163",
-  "cell-merged": "awsui_cell-merged_wih1l_r2zh7_173",
-  "cell-merged-content": "awsui_cell-merged-content_wih1l_r2zh7_177",
-  "empty": "awsui_empty_wih1l_r2zh7_192",
-  "loading": "awsui_loading_wih1l_r2zh7_196",
-  "selection-control": "awsui_selection-control_wih1l_r2zh7_200",
-  "selection-control-header": "awsui_selection-control-header_wih1l_r2zh7_207",
-  "sticky-scrollbar": "awsui_sticky-scrollbar_wih1l_r2zh7_212",
-  "sticky-scrollbar-content": "awsui_sticky-scrollbar-content_wih1l_r2zh7_222",
-  "sticky-scrollbar-visible": "awsui_sticky-scrollbar-visible_wih1l_r2zh7_225",
-  "dark-header": "awsui_dark-header_wih1l_r2zh7_233",
-  "header-secondary": "awsui_header-secondary_wih1l_r2zh7_237",
-  "table-has-header": "awsui_table-has-header_wih1l_r2zh7_256",
-  "header-controls": "awsui_header-controls_wih1l_r2zh7_260",
-  "divider": "awsui_divider_wih1l_r2zh7_274",
-  "footer-wrapper": "awsui_footer-wrapper_wih1l_r2zh7_281",
-  "footer": "awsui_footer_wih1l_r2zh7_281",
-  "thead-active": "awsui_thead-active_wih1l_r2zh7_290",
-  "row": "awsui_row_wih1l_r2zh7_291",
-  "row-selected": "awsui_row-selected_wih1l_r2zh7_292"
+  "root": "awsui_root_wih1l_127ej_97",
+  "tools": "awsui_tools_wih1l_127ej_106",
+  "tools-filtering": "awsui_tools-filtering_wih1l_127ej_112",
+  "tools-align-right": "awsui_tools-align-right_wih1l_127ej_117",
+  "tools-pagination": "awsui_tools-pagination_wih1l_127ej_121",
+  "tools-preferences": "awsui_tools-preferences_wih1l_127ej_121",
+  "tools-small": "awsui_tools-small_wih1l_127ej_127",
+  "table": "awsui_table_wih1l_127ej_133",
+  "table-layout-fixed": "awsui_table-layout-fixed_wih1l_127ej_139",
+  "wrapper": "awsui_wrapper_wih1l_127ej_143",
+  "variant-stacked": "awsui_variant-stacked_wih1l_127ej_151",
+  "variant-container": "awsui_variant-container_wih1l_127ej_151",
+  "variant-embedded": "awsui_variant-embedded_wih1l_127ej_155",
+  "has-header": "awsui_has-header_wih1l_127ej_158",
+  "has-footer": "awsui_has-footer_wih1l_127ej_161",
+  "cell-merged": "awsui_cell-merged_wih1l_127ej_175",
+  "cell-merged-content": "awsui_cell-merged-content_wih1l_127ej_179",
+  "empty": "awsui_empty_wih1l_127ej_194",
+  "loading": "awsui_loading_wih1l_127ej_198",
+  "selection-control": "awsui_selection-control_wih1l_127ej_202",
+  "selection-control-header": "awsui_selection-control-header_wih1l_127ej_209",
+  "sticky-scrollbar": "awsui_sticky-scrollbar_wih1l_127ej_214",
+  "sticky-scrollbar-content": "awsui_sticky-scrollbar-content_wih1l_127ej_224",
+  "sticky-scrollbar-visible": "awsui_sticky-scrollbar-visible_wih1l_127ej_227",
+  "dark-header": "awsui_dark-header_wih1l_127ej_235",
+  "header-secondary": "awsui_header-secondary_wih1l_127ej_239",
+  "table-has-header": "awsui_table-has-header_wih1l_127ej_258",
+  "header-controls": "awsui_header-controls_wih1l_127ej_262",
+  "divider": "awsui_divider_wih1l_127ej_276",
+  "footer-wrapper": "awsui_footer-wrapper_wih1l_127ej_283",
+  "footer": "awsui_footer_wih1l_127ej_283",
+  "thead-active": "awsui_thead-active_wih1l_127ej_292",
+  "row": "awsui_row_wih1l_127ej_293",
+  "row-selected": "awsui_row-selected_wih1l_127ej_294"
 };

package/lib/internal/template/table/styles.scoped.css CHANGED Viewed

@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_root_wih1l_r2zh7_97:not(#\9) {
+.awsui_root_wih1l_127ej_97:not(#\9) {
   font-size: var(--font-body-m-size-sregvd, 14px);
   line-height: var(--font-body-m-line-height-i7xxvv, 22px);
   color: var(--color-text-body-default-7m2b3r, #16191f);
@@ -103,78 +103,80 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   width: 100%;
 }
-.awsui_tools_wih1l_r2zh7_106:not(#\9) {
+.awsui_tools_wih1l_127ej_106:not(#\9) {
   display: flex;
   align-items: flex-start;
   flex-wrap: wrap;
   padding: var(--space-scaled-xs-6859qs, 8px) 0 var(--space-scaled-xxs-95dhkm, 4px);
 }
-.awsui_tools-filtering_wih1l_r2zh7_112:not(#\9) {
+.awsui_tools-filtering_wih1l_127ej_112:not(#\9) {
   flex: 1 1 0%;
   max-width: 100%;
   margin-right: var(--space-l-4vl6xu, 20px);
 }
-.awsui_tools-align-right_wih1l_r2zh7_117:not(#\9) {
+.awsui_tools-align-right_wih1l_127ej_117:not(#\9) {
   display: flex;
   margin-left: auto;
 }
-.awsui_tools-pagination_wih1l_r2zh7_121 + .awsui_tools-preferences_wih1l_r2zh7_121:not(#\9) {
+.awsui_tools-pagination_wih1l_127ej_121 + .awsui_tools-preferences_wih1l_127ej_121:not(#\9) {
   border-left: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
   box-sizing: border-box;
   margin-left: var(--space-xs-rsr2qu, 8px);
   padding-left: var(--space-xs-rsr2qu, 8px);
 }
-.awsui_tools-small_wih1l_r2zh7_127 > .awsui_tools-filtering_wih1l_r2zh7_112:not(#\9) {
+.awsui_tools-small_wih1l_127ej_127 > .awsui_tools-filtering_wih1l_127ej_112:not(#\9) {
   margin-right: 0;
   margin-bottom: var(--space-scaled-xs-6859qs, 8px);
   flex-basis: 100%;
 }
-.awsui_table_wih1l_r2zh7_133:not(#\9) {
+.awsui_table_wih1l_127ej_133:not(#\9) {
   width: 100%;
   border-spacing: 0;
   position: relative;
   box-sizing: border-box;
 }
-.awsui_table-layout-fixed_wih1l_r2zh7_139:not(#\9) {
+.awsui_table-layout-fixed_wih1l_127ej_139:not(#\9) {
   table-layout: fixed;
 }
-.awsui_wrapper_wih1l_r2zh7_143:not(#\9) {
+.awsui_wrapper_wih1l_127ej_143:not(#\9) {
   position: relative;
   box-sizing: border-box;
   width: 100%;
   padding-top: var(--space-table-content-top-su9ka6, 0px);
   padding-bottom: var(--space-table-content-bottom-2l75ve, 0px);
   overflow-x: auto;
-  border-top-right-radius: var(--border-radius-container-1aveko, 0px);
-  border-top-left-radius: var(--border-radius-container-1aveko, 0px);
 }
-.awsui_wrapper_wih1l_r2zh7_143.awsui_variant-stacked_wih1l_r2zh7_153 > .awsui_table_wih1l_r2zh7_133:not(#\9), .awsui_wrapper_wih1l_r2zh7_143.awsui_variant-container_wih1l_r2zh7_153 > .awsui_table_wih1l_r2zh7_133:not(#\9) {
+.awsui_wrapper_wih1l_127ej_143.awsui_variant-stacked_wih1l_127ej_151 > .awsui_table_wih1l_127ej_133:not(#\9), .awsui_wrapper_wih1l_127ej_143.awsui_variant-container_wih1l_127ej_151 > .awsui_table_wih1l_127ej_133:not(#\9) {
   padding-left: var(--space-table-horizontal-njdbej, 0px);
   padding-right: var(--space-table-horizontal-njdbej, 0px);
 }
-.awsui_wrapper_wih1l_r2zh7_143.awsui_variant-embedded_wih1l_r2zh7_157:not(#\9) {
+.awsui_wrapper_wih1l_127ej_143.awsui_variant-embedded_wih1l_127ej_155:not(#\9) {
   padding-bottom: var(--space-table-embedded-content-bottom-7vc5vt, 0px);
 }
-.awsui_wrapper_wih1l_r2zh7_143.awsui_has-header_wih1l_r2zh7_160:not(#\9) {
+.awsui_wrapper_wih1l_127ej_143.awsui_has-header_wih1l_127ej_158:not(#\9) {
   padding-top: 0px;
 }
-.awsui_wrapper_wih1l_r2zh7_143.awsui_has-footer_wih1l_r2zh7_163:not(#\9) {
+.awsui_wrapper_wih1l_127ej_143.awsui_has-footer_wih1l_127ej_161:not(#\9) {
   padding-bottom: 0px;
 }
-.awsui_wrapper_wih1l_r2zh7_143[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_wrapper_wih1l_127ej_143:not(#\9):not(.awsui_has-header_wih1l_127ej_158) {
+  border-top-right-radius: var(--border-radius-container-1aveko, 0px);
+  border-top-left-radius: var(--border-radius-container-1aveko, 0px);
+}
+.awsui_wrapper_wih1l_127ej_143[data-awsui-focus-visible=true]:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: 2px;
   border-radius: var(--border-radius-container-1aveko, 0px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
 }
-.awsui_cell-merged_wih1l_r2zh7_173:not(#\9) {
+.awsui_cell-merged_wih1l_127ej_175:not(#\9) {
   text-align: center;
   padding: 0;
 }
-.awsui_cell-merged-content_wih1l_r2zh7_177:not(#\9) {
+.awsui_cell-merged-content_wih1l_127ej_179:not(#\9) {
   box-sizing: border-box;
   width: 100%;
   padding: var(--space-scaled-m-pv0fmt, 16px) var(--space-l-4vl6xu, 20px) var(--space-scaled-l-t03y3z, 20px);
@@ -182,34 +184,34 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   /* stylelint-enable plugin/no-unsupported-browser-features */
 }
 @supports (position: sticky) {
-  .awsui_cell-merged-content_wih1l_r2zh7_177:not(#\9) {
+  .awsui_cell-merged-content_wih1l_127ej_179:not(#\9) {
     position: sticky;
     left: 0;
     margin: 0 calc(-2 * var(--space-table-horizontal-njdbej, 0px));
   }
 }
-.awsui_empty_wih1l_r2zh7_192:not(#\9) {
+.awsui_empty_wih1l_127ej_194:not(#\9) {
   color: var(--color-text-empty-izapdt, #687078);
 }
-.awsui_loading_wih1l_r2zh7_196:not(#\9) {
+.awsui_loading_wih1l_127ej_198:not(#\9) {
   /* used in test-utils */
 }
-.awsui_selection-control_wih1l_r2zh7_200:not(#\9) {
+.awsui_selection-control_wih1l_127ej_202:not(#\9) {
   position: relative;
   box-sizing: border-box;
   width: 54px;
   max-width: 54px;
   min-width: 54px;
 }
-.awsui_selection-control_wih1l_r2zh7_200.awsui_selection-control-header_wih1l_r2zh7_207:not(#\9) {
+.awsui_selection-control_wih1l_127ej_202.awsui_selection-control-header_wih1l_127ej_209:not(#\9) {
   padding: var(--space-scaled-xs-6859qs, 8px) var(--space-scaled-l-t03y3z, 20px);
   border-left: var(--border-item-width-yvnixs, 1px) solid transparent;
 }
-.awsui_sticky-scrollbar_wih1l_r2zh7_212:not(#\9) {
+.awsui_sticky-scrollbar_wih1l_127ej_214:not(#\9) {
   height: 15px;
   position: fixed;
   display: none;
@@ -219,10 +221,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   bottom: 0;
   width: 100%;
 }
-.awsui_sticky-scrollbar-content_wih1l_r2zh7_222:not(#\9) {
+.awsui_sticky-scrollbar-content_wih1l_127ej_224:not(#\9) {
   height: 15px;
 }
-.awsui_sticky-scrollbar-visible_wih1l_r2zh7_225:not(#\9) {
+.awsui_sticky-scrollbar-visible_wih1l_127ej_227:not(#\9) {
   display: block;
 }
@@ -230,11 +232,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
 The dynamic height dark header needs a background that will cover
 the default white background of the container component.
 */
-.awsui_dark-header_wih1l_r2zh7_233:not(#\9) {
+.awsui_dark-header_wih1l_127ej_235:not(#\9) {
   background-color: var(--color-background-layout-main-q0tbxx, #f2f3f3);
 }
-.awsui_header-secondary_wih1l_r2zh7_237:not(#\9) {
+.awsui_header-secondary_wih1l_127ej_239:not(#\9) {
   overflow: auto;
   -ms-overflow-style: none;
   /* Internet Explorer 10+ */
@@ -245,50 +247,50 @@ the default white background of the container component.
   border-radius: 0;
   background: var(--color-background-table-header-mryayf, #fafafa);
 }
-.awsui_header-secondary_wih1l_r2zh7_237.awsui_variant-stacked_wih1l_r2zh7_153 > .awsui_table_wih1l_r2zh7_133:not(#\9), .awsui_header-secondary_wih1l_r2zh7_237.awsui_variant-container_wih1l_r2zh7_153 > .awsui_table_wih1l_r2zh7_133:not(#\9) {
+.awsui_header-secondary_wih1l_127ej_239.awsui_variant-stacked_wih1l_127ej_151 > .awsui_table_wih1l_127ej_133:not(#\9), .awsui_header-secondary_wih1l_127ej_239.awsui_variant-container_wih1l_127ej_151 > .awsui_table_wih1l_127ej_133:not(#\9) {
   padding-left: var(--space-table-horizontal-njdbej, 0px);
   padding-right: var(--space-table-horizontal-njdbej, 0px);
 }
-.awsui_header-secondary_wih1l_r2zh7_237:not(#\9)::-webkit-scrollbar {
+.awsui_header-secondary_wih1l_127ej_239:not(#\9)::-webkit-scrollbar {
   display: none;
   /* Safari and Chrome */
 }
-.awsui_header-secondary_wih1l_r2zh7_237.awsui_table-has-header_wih1l_r2zh7_256:not(#\9) {
+.awsui_header-secondary_wih1l_127ej_239.awsui_table-has-header_wih1l_127ej_258:not(#\9) {
   border-top: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-container-divider-z203b8, #eaeded);
 }
-.awsui_header-controls_wih1l_r2zh7_260:not(#\9) {
+.awsui_header-controls_wih1l_127ej_262:not(#\9) {
   padding-top: var(--space-container-header-vertical-0bd19u, 12px);
   padding-bottom: var(--space-container-header-vertical-0bd19u, 12px);
 }
-.awsui_header-controls_wih1l_r2zh7_260.awsui_variant-stacked_wih1l_r2zh7_153:not(#\9), .awsui_header-controls_wih1l_r2zh7_260.awsui_variant-container_wih1l_r2zh7_153:not(#\9) {
+.awsui_header-controls_wih1l_127ej_262.awsui_variant-stacked_wih1l_127ej_151:not(#\9), .awsui_header-controls_wih1l_127ej_262.awsui_variant-container_wih1l_127ej_151:not(#\9) {
   padding-left: calc(var(--space-table-horizontal-njdbej, 0px) + var(--space-table-header-horizontal-4u689g, 20px));
   padding-right: calc(var(--space-table-horizontal-njdbej, 0px) + var(--space-table-header-horizontal-4u689g, 20px));
 }
-.awsui_header-controls_wih1l_r2zh7_260.awsui_variant-embedded_wih1l_r2zh7_157:not(#\9) {
+.awsui_header-controls_wih1l_127ej_262.awsui_variant-embedded_wih1l_127ej_155:not(#\9) {
   padding-left: var(--space-table-header-horizontal-4u689g, 20px);
   padding-right: var(--space-table-header-horizontal-4u689g, 20px);
   padding-top: var(--space-table-embedded-header-top-1yxc8d, 12px);
 }
-.awsui_divider_wih1l_r2zh7_274:not(#\9) {
+.awsui_divider_wih1l_127ej_276:not(#\9) {
   border: none;
   margin: 0;
   height: 0;
   border-top: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
 }
-.awsui_footer-wrapper_wih1l_r2zh7_281.awsui_variant-stacked_wih1l_r2zh7_153:not(#\9), .awsui_footer-wrapper_wih1l_r2zh7_281.awsui_variant-container_wih1l_r2zh7_153:not(#\9) {
+.awsui_footer-wrapper_wih1l_127ej_283.awsui_variant-stacked_wih1l_127ej_151:not(#\9), .awsui_footer-wrapper_wih1l_127ej_283.awsui_variant-container_wih1l_127ej_151:not(#\9) {
   padding-left: var(--space-table-horizontal-njdbej, 0px);
   padding-right: var(--space-table-horizontal-njdbej, 0px);
 }
-.awsui_footer_wih1l_r2zh7_281:not(#\9) {
+.awsui_footer_wih1l_127ej_283:not(#\9) {
   padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-table-footer-horizontal-m6qo87, 20px);
 }
-.awsui_thead-active_wih1l_r2zh7_290:not(#\9),
-.awsui_row_wih1l_r2zh7_291:not(#\9),
-.awsui_row-selected_wih1l_r2zh7_292:not(#\9) {
+.awsui_thead-active_wih1l_127ej_292:not(#\9),
+.awsui_row_wih1l_127ej_293:not(#\9),
+.awsui_row-selected_wih1l_127ej_294:not(#\9) {
   /* used in test-utils */
 }