@cloudscape-design/components-themeable 3.0.1 → 3.0.4

package/internal/template/app-layout/visual-refresh/split-panel.js

@@ -1,120 +0,0 @@
-import { __assign } from "tslib";
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// SPDX-License-Identifier: Apache-2.0
-import React, { useContext, useRef, useState } from 'react';
-import clsx from 'clsx';
-import { AppLayoutContext } from './context';
-import { SplitPanelContext, } from '../../internal/context/split-panel-context';
-import styles from './styles.css.js';
-import { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update';
-import { Transition } from '../../internal/components/transition';
-import { useObservedElement } from '../utils/use-observed-element';
-import customCssProps from '../../internal/generated/custom-css-properties';
-/**
- * If there is no Split Panel in the AppLayout context then the SplitPanel
- * will pass through the AppLayout children without the context.
- */
-function SplitPanel(_a) {
-    var children = _a.children;
-    var _b = useContext(AppLayoutContext), handleSplitPanelClick = _b.handleSplitPanelClick, handleSplitPanelPreferencesChange = _b.handleSplitPanelPreferencesChange, handleSplitPanelResize = _b.handleSplitPanelResize, isMobile = _b.isMobile, isSplitPanelForcedPosition = _b.isSplitPanelForcedPosition, isSplitPanelOpen = _b.isSplitPanelOpen, setSplitPanelReportedSize = _b.setSplitPanelReportedSize, splitPanelPosition = _b.splitPanelPosition, splitPanelSize = _b.splitPanelSize;
-    var _c = useState(undefined), openButtonAriaLabel = _c[0], setOpenButtonAriaLabel = _c[1];
-    var _d = useState(), splitPanelLastInteraction = _d[0], setSplitPanelLastInteraction = _d[1];
-    useEffectOnUpdate(function () { return setSplitPanelLastInteraction(isSplitPanelOpen ? { type: 'open' } : { type: 'close' }); }, [isSplitPanelOpen]);
-    useEffectOnUpdate(function () { return setSplitPanelLastInteraction({ type: 'position' }); }, [splitPanelPosition]);
-    var splitPanelRef = useRef(null);
-    var splitPanelHeaderRef = useRef(null);
-    var context = {
-        bottomOffset: 0,
-        getMaxHeight: function () { return document.documentElement.clientHeight - 250; },
-        getMaxWidth: function () { return document.documentElement.clientWidth; },
-        getHeader: function () { return splitPanelHeaderRef.current; },
-        isForcedPosition: isSplitPanelForcedPosition,
-        isMobile: isMobile,
-        isOpen: isSplitPanelOpen,
-        isRefresh: true,
-        leftOffset: 0,
-        onPreferencesChange: handleSplitPanelPreferencesChange,
-        onResize: handleSplitPanelResize,
-        onToggle: handleSplitPanelClick,
-        position: splitPanelPosition,
-        reportSize: setSplitPanelReportedSize,
-        rightOffset: 0,
-        size: splitPanelSize || 0,
-        splitPanelRef: splitPanelRef,
-        splitPanelHeaderRef: splitPanelHeaderRef,
-        topOffset: 0,
-        openButtonAriaLabel: openButtonAriaLabel,
-        setOpenButtonAriaLabel: setOpenButtonAriaLabel,
-        lastInteraction: splitPanelLastInteraction
-    };
-    return React.createElement(SplitPanelContext.Provider, { value: __assign({}, context) }, children);
-}
-/**
- * This is the render function for the SplitPanel when it is in bottom position.
- * The Split Panel container will be another row entry in the grid definition in
- * the Layout component. The start and finish columns will be variable based
- * on the the presence and state of the Navigation and Tools components.
- */
-function SplitPanelBottom() {
-    var _a = useContext(AppLayoutContext), disableBodyScroll = _a.disableBodyScroll, isNavigationOpen = _a.isNavigationOpen, isSplitPanelOpen = _a.isSplitPanelOpen, isToolsOpen = _a.isToolsOpen, splitPanel = _a.splitPanel, splitPanelReportedSize = _a.splitPanelReportedSize;
-    var _b = useContext(SplitPanelContext), splitPanelPosition = _b.position, getHeader = _b.getHeader;
-    var headerHeight = useObservedElement(getHeader);
-    if (!splitPanel) {
-        return null;
-    }
-    return (React.createElement(Transition, { "in": isSplitPanelOpen !== null && isSplitPanelOpen !== void 0 ? isSplitPanelOpen : false, exit: false }, function (state, transitionEventsRef) {
-        var _a, _b;
-        return (React.createElement("section", { className: clsx(styles['split-panel-bottom'], styles["position-".concat(splitPanelPosition)], (_a = {},
-                _a[styles.animating] = state === 'entering',
-                _a[styles['disable-body-scroll']] = disableBodyScroll,
-                _a[styles['is-navigation-open']] = isNavigationOpen,
-                _a[styles['is-split-panel-open']] = isSplitPanelOpen,
-                _a[styles['is-tools-open']] = isToolsOpen,
-                _a)), ref: transitionEventsRef, style: (_b = {},
-                _b[customCssProps.splitPanelReportedSize] = "".concat(splitPanelReportedSize, "px"),
-                _b[customCssProps.splitPanelReportedHeaderSize] = "".concat(headerHeight, "px"),
-                _b) },
-            React.createElement(SplitPanel, null),
-            splitPanelPosition === 'bottom' && splitPanel));
-    }));
-}
-/**
- * This is the render function for the SplitPanel when it is side position.
- * The Split Panel will not be within the grid defined in the Layout component
- * but instead a direct child of the Tools component. The width constraints
- * for this position are computed in the Tools component.
- */
-function SplitPanelSide() {
-    var _a = useContext(AppLayoutContext), isSplitPanelOpen = _a.isSplitPanelOpen, splitPanel = _a.splitPanel, splitPanelMaxWidth = _a.splitPanelMaxWidth, splitPanelMinWidth = _a.splitPanelMinWidth, splitPanelReportedSize = _a.splitPanelReportedSize;
-    var splitPanelPosition = useContext(SplitPanelContext).position;
-    if (!splitPanel) {
-        return null;
-    }
-    return (React.createElement(Transition, { "in": isSplitPanelOpen !== null && isSplitPanelOpen !== void 0 ? isSplitPanelOpen : false, exit: false }, function (state, transitionEventsRef) {
-        var _a, _b;
-        return (React.createElement("section", { "aria-hidden": !isSplitPanelOpen || splitPanelPosition === 'bottom' ? true : false, className: clsx(styles['split-panel-side'], styles["position-".concat(splitPanelPosition)], (_a = {},
-                _a[styles.animating] = state === 'entering',
-                _a[styles['is-split-panel-open']] = isSplitPanelOpen,
-                _a)), ref: transitionEventsRef, style: (_b = {},
-                _b[customCssProps.splitPanelMaxWidth] = "".concat(splitPanelMaxWidth, "px"),
-                _b[customCssProps.splitPanelMinWidth] = "".concat(splitPanelMinWidth, "px"),
-                _b[customCssProps.splitPanelReportedHeaderSize] = "".concat(splitPanelReportedSize, "px"),
-                _b) },
-            React.createElement("div", { className: clsx(styles['animated-content']) }, splitPanelPosition === 'side' && splitPanel)));
-    }));
-}
-/**
- * This logic will determine what the Split Panel position should be. It reconciles the possibility
- * of being in forced position with the current selected position in the settings.
- */
-export function getSplitPanelPosition(isSplitPanelForcedPosition, splitPanelPreferences) {
-    var splitPanelPosition = 'bottom';
-    if (!isSplitPanelForcedPosition && (splitPanelPreferences === null || splitPanelPreferences === void 0 ? void 0 : splitPanelPreferences.position) === 'side') {
-        splitPanelPosition = 'side';
-    }
-    return splitPanelPosition;
-}
-SplitPanel.Bottom = SplitPanelBottom;
-SplitPanel.Side = SplitPanelSide;
-export default SplitPanel;
-//# sourceMappingURL=split-panel.js.map

package/internal/template/app-layout/visual-refresh/split-panel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"split-panel.js","sourceRoot":"","sources":["../../../../src/app-layout/visual-refresh/split-panel.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, { useContext, useRef, useState } from 'react';\nimport clsx from 'clsx';\nimport { AppLayoutContext } from './context';\nimport {\n  SplitPanelContext,\n  SplitPanelContextProps,\n  SplitPanelLastInteraction,\n} from '../../internal/context/split-panel-context';\nimport styles from './styles.css.js';\nimport { AppLayoutProps } from '../interfaces';\nimport { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update';\nimport { Transition } from '../../internal/components/transition';\nimport { useObservedElement } from '../utils/use-observed-element';\nimport customCssProps from '../../internal/generated/custom-css-properties';\n\n/**\n * If there is no Split Panel in the AppLayout context then the SplitPanel\n * will pass through the AppLayout children without the context.\n */\nfunction SplitPanel({ children }: React.PropsWithChildren<unknown>) {\n  const {\n    handleSplitPanelClick,\n    handleSplitPanelPreferencesChange,\n    handleSplitPanelResize,\n    isMobile,\n    isSplitPanelForcedPosition,\n    isSplitPanelOpen,\n    setSplitPanelReportedSize,\n    splitPanelPosition,\n    splitPanelSize,\n  } = useContext(AppLayoutContext);\n\n  const [openButtonAriaLabel, setOpenButtonAriaLabel] = useState<undefined | string>(undefined);\n\n  const [splitPanelLastInteraction, setSplitPanelLastInteraction] = useState<undefined | SplitPanelLastInteraction>();\n  useEffectOnUpdate(\n    () => setSplitPanelLastInteraction(isSplitPanelOpen ? { type: 'open' } : { type: 'close' }),\n    [isSplitPanelOpen]\n  );\n  useEffectOnUpdate(() => setSplitPanelLastInteraction({ type: 'position' }), [splitPanelPosition]);\n\n  const splitPanelRef = useRef<HTMLDivElement>(null);\n  const splitPanelHeaderRef = useRef<HTMLDivElement>(null);\n\n  const context: SplitPanelContextProps = {\n    bottomOffset: 0,\n    getMaxHeight: () => document.documentElement.clientHeight - 250,\n    getMaxWidth: () => document.documentElement.clientWidth,\n    getHeader: () => splitPanelHeaderRef.current,\n    isForcedPosition: isSplitPanelForcedPosition,\n    isMobile,\n    isOpen: isSplitPanelOpen,\n    isRefresh: true,\n    leftOffset: 0,\n    onPreferencesChange: handleSplitPanelPreferencesChange,\n    onResize: handleSplitPanelResize,\n    onToggle: handleSplitPanelClick,\n    position: splitPanelPosition,\n    reportSize: setSplitPanelReportedSize,\n    rightOffset: 0,\n    size: splitPanelSize || 0,\n    splitPanelRef,\n    splitPanelHeaderRef,\n    topOffset: 0,\n    openButtonAriaLabel,\n    setOpenButtonAriaLabel,\n    lastInteraction: splitPanelLastInteraction,\n  };\n\n  return <SplitPanelContext.Provider value={{ ...context }}>{children}</SplitPanelContext.Provider>;\n}\n\n/**\n * This is the render function for the SplitPanel when it is in bottom position.\n * The Split Panel container will be another row entry in the grid definition in\n * the Layout component. The start and finish columns will be variable based\n * on the the presence and state of the Navigation and Tools components.\n */\nfunction SplitPanelBottom() {\n  const { disableBodyScroll, isNavigationOpen, isSplitPanelOpen, isToolsOpen, splitPanel, splitPanelReportedSize } =\n    useContext(AppLayoutContext);\n\n  const { position: splitPanelPosition, getHeader } = useContext(SplitPanelContext);\n\n  const headerHeight = useObservedElement(getHeader);\n\n  if (!splitPanel) {\n    return null;\n  }\n\n  return (\n    <Transition in={isSplitPanelOpen ?? false} exit={false}>\n      {(state, transitionEventsRef) => (\n        <section\n          className={clsx(styles['split-panel-bottom'], styles[`position-${splitPanelPosition}`], {\n            [styles.animating]: state === 'entering',\n            [styles['disable-body-scroll']]: disableBodyScroll,\n            [styles['is-navigation-open']]: isNavigationOpen,\n            [styles['is-split-panel-open']]: isSplitPanelOpen,\n            [styles['is-tools-open']]: isToolsOpen,\n          })}\n          ref={transitionEventsRef}\n          style={{\n            [customCssProps.splitPanelReportedSize]: `${splitPanelReportedSize}px`,\n            [customCssProps.splitPanelReportedHeaderSize]: `${headerHeight}px`,\n          }}\n        >\n          <SplitPanel></SplitPanel>\n          {splitPanelPosition === 'bottom' && splitPanel}\n        </section>\n      )}\n    </Transition>\n  );\n}\n\n/**\n * This is the render function for the SplitPanel when it is side position.\n * The Split Panel will not be within the grid defined in the Layout component\n * but instead a direct child of the Tools component. The width constraints\n * for this position are computed in the Tools component.\n */\nfunction SplitPanelSide() {\n  const { isSplitPanelOpen, splitPanel, splitPanelMaxWidth, splitPanelMinWidth, splitPanelReportedSize } =\n    useContext(AppLayoutContext);\n\n  const { position: splitPanelPosition } = useContext(SplitPanelContext);\n\n  if (!splitPanel) {\n    return null;\n  }\n\n  return (\n    <Transition in={isSplitPanelOpen ?? false} exit={false}>\n      {(state, transitionEventsRef) => (\n        <section\n          aria-hidden={!isSplitPanelOpen || splitPanelPosition === 'bottom' ? true : false}\n          className={clsx(styles['split-panel-side'], styles[`position-${splitPanelPosition}`], {\n            [styles.animating]: state === 'entering',\n            [styles['is-split-panel-open']]: isSplitPanelOpen,\n          })}\n          ref={transitionEventsRef}\n          style={{\n            [customCssProps.splitPanelMaxWidth]: `${splitPanelMaxWidth}px`,\n            [customCssProps.splitPanelMinWidth]: `${splitPanelMinWidth}px`,\n            [customCssProps.splitPanelReportedHeaderSize]: `${splitPanelReportedSize}px`,\n          }}\n        >\n          <div className={clsx(styles['animated-content'])}>{splitPanelPosition === 'side' && splitPanel}</div>\n        </section>\n      )}\n    </Transition>\n  );\n}\n\n/**\n * This logic will determine what the Split Panel position should be. It reconciles the possibility\n * of being in forced position with the current selected position in the settings.\n */\nexport function getSplitPanelPosition(\n  isSplitPanelForcedPosition: boolean,\n  splitPanelPreferences: AppLayoutProps.SplitPanelPreferences | undefined\n) {\n  let splitPanelPosition: AppLayoutProps.SplitPanelPosition = 'bottom';\n\n  if (!isSplitPanelForcedPosition && splitPanelPreferences?.position === 'side') {\n    splitPanelPosition = 'side';\n  }\n\n  return splitPanelPosition;\n}\nSplitPanel.Bottom = SplitPanelBottom;\nSplitPanel.Side = SplitPanelSide;\n\nexport default SplitPanel;\n"]}

package/internal/template/code-editor/preferences-modal.js

@@ -1,39 +0,0 @@
-import { __spreadArray } from "tslib";
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// SPDX-License-Identifier: Apache-2.0
-import React, { useState } from 'react';
-import InternalBox from '../box/internal';
-import { InternalButton } from '../button/internal';
-import InternalCheckbox from '../checkbox/internal';
-import InternalColumnLayout from '../column-layout/internal';
-import InternalFormField from '../form-field/internal';
-import InternalModal from '../modal/internal';
-import InternalSelect from '../select/internal';
-import InternalSpaceBetween from '../space-between/internal';
-import { FormFieldDomContext } from '../internal/context/form-field-context';
-import { LightThemes, DarkThemes } from './ace-themes';
-export default (function (props) {
-    var _a, _b, _c, _d;
-    var _e = useState((_b = (_a = props.preferences) === null || _a === void 0 ? void 0 : _a.wrapLines) !== null && _b !== void 0 ? _b : true), wrapLines = _e[0], setWrapLines = _e[1];
-    var _f = useState((_d = (_c = props.preferences) === null || _c === void 0 ? void 0 : _c.theme) !== null && _d !== void 0 ? _d : props.defaultTheme), theme = _f[0], setTheme = _f[1];
-    var _g = useState(function () { return __spreadArray(__spreadArray([], LightThemes, true), DarkThemes, true).filter(function (t) { return t.value === theme; })[0]; }), selectedThemeOption = _g[0], setSelectedThemeOption = _g[1];
-    var onThemeSelected = function (e) {
-        setTheme(e.detail.selectedOption.value);
-        setSelectedThemeOption(e.detail.selectedOption);
-    };
-    return (React.createElement(FormFieldDomContext.RootProvider, { value: {} },
-        React.createElement(InternalModal, { size: "medium", visible: true, onDismiss: props.onDismiss, header: props.i18nStrings.header, closeAriaLabel: props.i18nStrings.cancel, footer: React.createElement(InternalBox, { float: "right" },
-                React.createElement(InternalSpaceBetween, { direction: "horizontal", size: "xs" },
-                    React.createElement(InternalButton, { onClick: props.onDismiss }, props.i18nStrings.cancel),
-                    React.createElement(InternalButton, { onClick: function () { return props.onConfirm({ wrapLines: wrapLines, theme: theme }); }, variant: "primary" }, props.i18nStrings.confirm))) },
-            React.createElement(InternalColumnLayout, { columns: 2, variant: "text-grid" },
-                React.createElement("div", null,
-                    React.createElement(InternalCheckbox, { checked: wrapLines, onChange: function (e) { return setWrapLines(e.detail.checked); } }, props.i18nStrings.wrapLines)),
-                React.createElement("div", null,
-                    React.createElement(InternalFormField, { label: props.i18nStrings.theme },
-                        React.createElement(InternalSelect, { selectedOption: selectedThemeOption, onChange: onThemeSelected, options: [
-                                { label: props.i18nStrings.lightThemes, options: LightThemes },
-                                { label: props.i18nStrings.darkThemes, options: DarkThemes },
-                            ], filteringType: "auto" })))))));
-});
-//# sourceMappingURL=preferences-modal.js.map

package/internal/template/code-editor/preferences-modal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"preferences-modal.js","sourceRoot":"","sources":["../../../src/code-editor/preferences-modal.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 } from 'react';\n\nimport InternalBox from '../box/internal';\nimport { InternalButton } from '../button/internal';\nimport InternalCheckbox from '../checkbox/internal';\nimport InternalColumnLayout from '../column-layout/internal';\nimport InternalFormField from '../form-field/internal';\nimport InternalModal from '../modal/internal';\nimport { SelectProps } from '../select/interfaces';\nimport InternalSelect from '../select/internal';\nimport InternalSpaceBetween from '../space-between/internal';\nimport { FormFieldDomContext } from '../internal/context/form-field-context';\nimport { NonCancelableCustomEvent } from '../internal/events';\nimport { LightThemes, DarkThemes } from './ace-themes';\nimport { CodeEditorProps } from './interfaces';\n\ninterface PreferencesModali18nStrings {\n  header: string;\n  cancel: string;\n  confirm: string;\n  wrapLines: string;\n  theme: string;\n  lightThemes: string;\n  darkThemes: string;\n}\n\ninterface PreferencesModalProps {\n  preferences?: Partial<CodeEditorProps.Preferences>;\n\n  i18nStrings: PreferencesModali18nStrings;\n\n  defaultTheme: CodeEditorProps.Theme;\n\n  onConfirm: (preferences: CodeEditorProps.Preferences) => void;\n  onDismiss: () => void;\n}\n\nexport default (props: PreferencesModalProps) => {\n  const [wrapLines, setWrapLines] = useState<boolean>(props.preferences?.wrapLines ?? true);\n  const [theme, setTheme] = useState<CodeEditorProps.Theme>(props.preferences?.theme ?? props.defaultTheme);\n  const [selectedThemeOption, setSelectedThemeOption] = useState<SelectProps.Option>(\n    () => [...LightThemes, ...DarkThemes].filter(t => t.value === theme)[0]\n  );\n\n  const onThemeSelected = (e: NonCancelableCustomEvent<SelectProps.ChangeDetail>) => {\n    setTheme(e.detail.selectedOption.value as CodeEditorProps.Theme);\n    setSelectedThemeOption(e.detail.selectedOption);\n  };\n\n  return (\n    <FormFieldDomContext.RootProvider value={{}}>\n      <InternalModal\n        size=\"medium\"\n        visible={true}\n        onDismiss={props.onDismiss}\n        header={props.i18nStrings.header}\n        closeAriaLabel={props.i18nStrings.cancel}\n        footer={\n          <InternalBox float=\"right\">\n            <InternalSpaceBetween direction=\"horizontal\" size=\"xs\">\n              <InternalButton onClick={props.onDismiss}>{props.i18nStrings.cancel}</InternalButton>\n              <InternalButton onClick={() => props.onConfirm({ wrapLines, theme })} variant=\"primary\">\n                {props.i18nStrings.confirm}\n              </InternalButton>\n            </InternalSpaceBetween>\n          </InternalBox>\n        }\n      >\n        <InternalColumnLayout columns={2} variant=\"text-grid\">\n          <div>\n            <InternalCheckbox checked={wrapLines} onChange={e => setWrapLines(e.detail.checked)}>\n              {props.i18nStrings.wrapLines}\n            </InternalCheckbox>\n          </div>\n          <div>\n            <InternalFormField label={props.i18nStrings.theme}>\n              <InternalSelect\n                selectedOption={selectedThemeOption}\n                onChange={onThemeSelected}\n                options={[\n                  { label: props.i18nStrings.lightThemes, options: LightThemes },\n                  { label: props.i18nStrings.darkThemes, options: DarkThemes },\n                ]}\n                filteringType=\"auto\"\n              />\n            </InternalFormField>\n          </div>\n        </InternalColumnLayout>\n      </InternalModal>\n    </FormFieldDomContext.RootProvider>\n  );\n};\n"]}

package/internal/template/container/styles.css.js

@@ -1,19 +0,0 @@
-
-    import './styles.scoped.css';
-    export default {
-  "root": "awsui_root_14iqq_1asmt_97",
-  "variant-default": "awsui_variant-default_14iqq_1asmt_109",
-  "variant-stacked": "awsui_variant-stacked_14iqq_1asmt_109",
-  "header": "awsui_header_14iqq_1asmt_132",
-  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1asmt_136",
-  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1asmt_140",
-  "header-stuck": "awsui_header-stuck_14iqq_1asmt_146",
-  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1asmt_151",
-  "with-paddings": "awsui_with-paddings_14iqq_1asmt_157",
-  "header-variant-cards": "awsui_header-variant-cards_14iqq_1asmt_160",
-  "dark-header": "awsui_dark-header_14iqq_1asmt_189",
-  "content": "awsui_content_14iqq_1asmt_193",
-  "footer": "awsui_footer_14iqq_1asmt_200",
-  "with-divider": "awsui_with-divider_14iqq_1asmt_203"
-};
-  

package/internal/template/container/styles.scoped.css

@@ -1,258 +0,0 @@
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/* stylelint-disable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
-/* stylelint-enable @cloudscape-design/no-motion-outside-of-mixin, selector-combinator-disallowed-list, selector-pseudo-class-no-unknown, selector-class-pattern */
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/* Style used for links in slots/components that are text heavy, to help links stand out among 
-surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-.awsui_root_14iqq_1asmt_97:not(#\9) {
-  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
-  border-collapse: separate;
-  border-spacing: 0;
-  caption-side: top;
-  cursor: auto;
-  direction: ltr;
-  empty-cells: show;
-  font-family: serif;
-  font-size: medium;
-  font-style: normal;
-  font-variant: normal;
-  font-weight: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-hyphens: none;
-      -ms-hyphens: none;
-          hyphens: none;
-  letter-spacing: normal;
-  list-style: disc outside none;
-  tab-size: 8;
-  text-align: left;
-  text-align-last: auto;
-  text-indent: 0;
-  text-shadow: none;
-  text-transform: none;
-  visibility: visible;
-  white-space: normal;
-  widows: 2;
-  word-spacing: normal;
-  box-sizing: border-box;
-  font-size: 14px;
-  font-size: var(--font-body-m-size-sregvd, 14px);
-  line-height: 22px;
-  line-height: var(--font-body-m-line-height-i7xxvv, 22px);
-  color: #16191f;
-  color: var(--color-text-body-default-7m2b3r, #16191f);
-  font-weight: 400;
-  font-family: "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif;
-  font-family: var(--font-family-base-mylvzb, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
-  display: block;
-  word-wrap: break-word;
-}
-.awsui_root_14iqq_1asmt_97.awsui_variant-default_14iqq_1asmt_109:not(#\9), .awsui_root_14iqq_1asmt_97.awsui_variant-stacked_14iqq_1asmt_109:not(#\9) {
-  box-shadow: 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15);
-  box-shadow: var(--shadow-container-0bkp96, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
-  border-top: 1px solid #eaeded;
-  border-top: var(--border-container-top-width-fs2udu, 1px) solid var(--color-border-container-top-1itxac, #eaeded);
-  border-radius: 0px;
-  border-radius: var(--border-container-radius-gcr27z, 0px);
-  box-sizing: border-box;
-  background-color: #ffffff;
-  background-color: var(--color-background-container-content-o88wxm, #ffffff);
-}
-@media screen and (-ms-high-contrast: active) {
-  .awsui_root_14iqq_1asmt_97.awsui_variant-default_14iqq_1asmt_109:not(#\9), .awsui_root_14iqq_1asmt_97.awsui_variant-stacked_14iqq_1asmt_109:not(#\9) {
-    border: 1px solid #eaeded;
-    border: var(--border-field-width-y6x4sn, 1px) solid var(--color-border-container-top-1itxac, #eaeded);
-  }
-}
-.awsui_root_14iqq_1asmt_97.awsui_variant-stacked_14iqq_1asmt_109:not(#\9):not(:last-child) {
-  border-bottom-right-radius: 0;
-  border-bottom-left-radius: 0;
-}
-.awsui_root_14iqq_1asmt_97.awsui_variant-stacked_14iqq_1asmt_109 + .awsui_root_14iqq_1asmt_97.awsui_variant-stacked_14iqq_1asmt_109:not(#\9) {
-  border-top: 1px solid #eaeded;
-  border-top: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
-  border-top-left-radius: 0;
-  border-top-right-radius: 0;
-  box-shadow: 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15);
-  box-shadow: var(--shadow-container-stacked-j8j87i, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
-}
-
-.awsui_header_14iqq_1asmt_132:not(#\9) {
-  background-color: #fafafa;
-  background-color: var(--color-background-container-header-g9rg0j, #fafafa);
-  border-radius: 0px;
-  border-radius: var(--border-container-radius-gcr27z, 0px);
-}
-.awsui_header-sticky-disabled_14iqq_1asmt_136:not(#\9) {
-  position: relative;
-  z-index: 1;
-}
-.awsui_header-sticky-enabled_14iqq_1asmt_140:not(#\9) {
-  top: 0;
-  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
-  position: sticky;
-  z-index: 800;
-}
-.awsui_header-stuck_14iqq_1asmt_146:not(#\9) {
-  box-shadow: 0px 1px 4px -2px rgba(0, 28, 36, 0.5);
-  box-shadow: var(--shadow-sticky-thyisb, 0px 1px 4px -2px rgba(0, 28, 36, 0.5));
-  border: 0;
-  border-radius: 0;
-}
-.awsui_header-dynamic-height_14iqq_1asmt_151.awsui_header-stuck_14iqq_1asmt_146:not(#\9) {
-  margin-bottom: calc(36px - 22px);
-  margin-bottom: calc(var(--font-heading-xl-line-height-qeciux, 36px) - var(--font-heading-l-line-height-oujdab, 22px));
-}
-.awsui_header_14iqq_1asmt_132:not(#\9):not(:empty) {
-  border-bottom: 1px solid #eaeded;
-  border-bottom: var(--border-container-sticky-width-pybmba, 1px) solid var(--color-border-container-divider-z203b8, #eaeded);
-}
-.awsui_header_14iqq_1asmt_132.awsui_with-paddings_14iqq_1asmt_157:not(#\9) {
-  padding: 12px 20px;
-  padding: var(--space-container-header-vertical-0bd19u, 12px) var(--space-container-horizontal-tlw03i, 20px);
-}
-.awsui_header-variant-cards_14iqq_1asmt_160:not(#\9) {
-  box-shadow: 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15);
-  box-shadow: var(--shadow-container-0bkp96, 0 1px 1px 0 rgba(0, 28, 36, 0.3), 1px 1px 1px 0 rgba(0, 28, 36, 0.15), -1px 1px 1px 0 rgba(0, 28, 36, 0.15));
-  border-top: 1px solid #eaeded;
-  border-top: var(--border-container-top-width-fs2udu, 1px) solid var(--color-border-container-top-1itxac, #eaeded);
-  border-radius: 0px;
-  border-radius: var(--border-container-radius-gcr27z, 0px);
-  box-sizing: border-box;
-}
-@media screen and (-ms-high-contrast: active) {
-  .awsui_header-variant-cards_14iqq_1asmt_160:not(#\9) {
-    border: 1px solid #eaeded;
-    border: var(--border-field-width-y6x4sn, 1px) solid var(--color-border-container-top-1itxac, #eaeded);
-  }
-}
-.awsui_header-variant-cards_14iqq_1asmt_160:not(#\9):not(:empty) {
-  border-bottom: 1px solid #d5dbdb;
-  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
-}
-@supports (--css-variable-support-check: #000) {
-  .awsui_header-variant-cards_14iqq_1asmt_160:not(#\9):not(:empty) {
-    border-bottom: 0;
-  }
-}
-.awsui_header-variant-cards_14iqq_1asmt_160.awsui_header-stuck_14iqq_1asmt_146:not(#\9) {
-  border-top-left-radius: 0;
-  border-top-right-radius: 0;
-}
-
-/*
-The dynamic height dark header needs a background that will cover
-the default white background of the container component.
-*/
-.awsui_dark-header_14iqq_1asmt_189:not(#\9) {
-  background-color: #f2f3f3;
-  background-color: var(--color-background-layout-main-q0tbxx, #f2f3f3);
-}
-
-.awsui_content_14iqq_1asmt_193.awsui_with-paddings_14iqq_1asmt_157:not(#\9) {
-  padding: 20px 20px;
-  padding: var(--space-scaled-l-t03y3z, 20px) var(--space-container-horizontal-tlw03i, 20px);
-}
-.awsui_header_14iqq_1asmt_132 + .awsui_content_14iqq_1asmt_193.awsui_with-paddings_14iqq_1asmt_157:not(#\9) {
-  padding-top: 16px;
-  padding-top: var(--space-container-content-top-u412x3, 16px);
-}
-
-.awsui_footer_14iqq_1asmt_200.awsui_with-paddings_14iqq_1asmt_157:not(#\9) {
-  padding: 12px 20px;
-  padding: var(--space-scaled-s-cu1hzn, 12px) var(--space-container-horizontal-tlw03i, 20px);
-}
-.awsui_footer_14iqq_1asmt_200.awsui_with-divider_14iqq_1asmt_203:not(#\9) {
-  border-top: 1px solid #eaeded;
-  border-top: var(--border-divider-section-width-5a4cv1, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
-}

package/internal/template/container/styles.selectors.js

@@ -1,20 +0,0 @@
-
-    // es-module interop with Babel and Typescript
-    Object.defineProperty(exports, "__esModule", { value: true });
-    module.exports.default = {
-  "root": "awsui_root_14iqq_1asmt_97",
-  "variant-default": "awsui_variant-default_14iqq_1asmt_109",
-  "variant-stacked": "awsui_variant-stacked_14iqq_1asmt_109",
-  "header": "awsui_header_14iqq_1asmt_132",
-  "header-sticky-disabled": "awsui_header-sticky-disabled_14iqq_1asmt_136",
-  "header-sticky-enabled": "awsui_header-sticky-enabled_14iqq_1asmt_140",
-  "header-stuck": "awsui_header-stuck_14iqq_1asmt_146",
-  "header-dynamic-height": "awsui_header-dynamic-height_14iqq_1asmt_151",
-  "with-paddings": "awsui_with-paddings_14iqq_1asmt_157",
-  "header-variant-cards": "awsui_header-variant-cards_14iqq_1asmt_160",
-  "dark-header": "awsui_dark-header_14iqq_1asmt_189",
-  "content": "awsui_content_14iqq_1asmt_193",
-  "footer": "awsui_footer_14iqq_1asmt_200",
-  "with-divider": "awsui_with-divider_14iqq_1asmt_203"
-};
-  

package/internal/template/container/use-sticky-header.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-sticky-header.d.ts","sourceRoot":"","sources":["../../../src/container/use-sticky-header.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,SAAS,EAA6E,MAAM,OAAO,CAAC;AAQ7G,UAAU,wBAAwB;IAChC,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,mBAAmB,mDAA8D,CAAC;AAE/F,eAAO,MAAM,eAAe,YACjB,UAAU,cAAc,CAAC,aACvB,UAAU,cAAc,CAAC;;;;;;;;;;CA8ErC,CAAC;AAEF,wBAAgB,uBAAuB,YAGtC"}

package/internal/template/container/use-sticky-header.js

@@ -1,88 +0,0 @@
-// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
-// SPDX-License-Identifier: Apache-2.0
-import { useState, useLayoutEffect, useCallback, useEffect, createContext, useMemo } from 'react';
-import { useAppLayoutContext } from '../internal/context/app-layout-context';
-import { useMobile } from '../internal/hooks/use-mobile';
-import { supportsStickyPosition } from '../internal/utils/dom';
-import { getOverflowParents } from '../internal/utils/scrollable-containers';
-import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
-import customCssProps from '../internal/generated/custom-css-properties';
-export var StickyHeaderContext = createContext({ isStuck: false });
-export var useStickyHeader = function (rootRef, headerRef, __stickyHeader, __stickyOffset) {
-    var currentRootRef = rootRef.current;
-    var currentHeaderRef = headerRef.current;
-    var totalBorder = useMemo(function () {
-        var containerRootBorder = currentRootRef
-            ? parseInt(getComputedStyle(currentRootRef).getPropertyValue('border-top-width'), 10)
-            : 0;
-        var headerBorder = currentHeaderRef
-            ? parseInt(getComputedStyle(currentHeaderRef).getPropertyValue('border-top-width'), 10)
-            : 0;
-        return containerRootBorder + headerBorder;
-    }, [currentRootRef, currentHeaderRef]);
-    // Having no overflow parents, means that the component uses body scroll.
-    // In that case, we reach into AppLayoutContext in case sticky header needs to be
-    //  offset down by the height of other sticky elements positioned on top of the view.
-    var _a = useState(false), usesBodyScroll = _a[0], setState = _a[1];
-    var _b = useState(false), isStuck = _b[0], setIsStuck = _b[1];
-    useLayoutEffect(function () {
-        var overflowParents = rootRef.current && getOverflowParents(rootRef.current).length;
-        setState(!overflowParents);
-    }, [rootRef]);
-    var stickyOffsetTop = useAppLayoutContext().stickyOffsetTop;
-    var effectiveStickyOffset = __stickyOffset !== null && __stickyOffset !== void 0 ? __stickyOffset : (usesBodyScroll ? stickyOffsetTop : 0);
-    var isSticky = useSupportsStickyHeader() && !!__stickyHeader;
-    var isRefresh = useVisualRefresh(rootRef);
-    /**
-     * The AppLayout refactor removed the need for passing the sticky offset in px all the time through the
-     * AppLayoutDomContext provider because that information already exists on the DOM in a custom property
-     * on the Layout subcomponent. Thus, if the Container header is sticky, we are in Visual Refresh and use
-     * body scroll then we will use that property. When a component is used outside AppLayout, we fall back
-     * to the default offset calculated in AppLayoutDomContext.
-     */
-    var computedOffset = "".concat(effectiveStickyOffset - totalBorder, "px");
-    if (usesBodyScroll && isRefresh) {
-        computedOffset = "var(".concat(customCssProps.offsetTopWithNotifications, ", ").concat(computedOffset, ")");
-    }
-    var stickyStyles = isSticky
-        ? {
-            style: {
-                top: computedOffset
-            }
-        }
-        : {};
-    // "stuck" state, when the header has moved from its original posititon has a
-    // box-shadow, applied here by a "header-stuck" className
-    var checkIfStuck = useCallback(function () {
-        if (rootRef.current && headerRef.current) {
-            var rootTop = rootRef.current.getBoundingClientRect().top;
-            var headerTop = headerRef.current.getBoundingClientRect().top;
-            if (rootTop + totalBorder < headerTop) {
-                setIsStuck(true);
-            }
-            else {
-                setIsStuck(false);
-            }
-        }
-    }, [rootRef, headerRef, totalBorder]);
-    useEffect(function () {
-        if (isSticky) {
-            window.addEventListener('scroll', checkIfStuck, true);
-            window.addEventListener('resize', checkIfStuck);
-            return function () {
-                window.removeEventListener('scroll', checkIfStuck, true);
-                window.removeEventListener('resize', checkIfStuck);
-            };
-        }
-    }, [isSticky, checkIfStuck]);
-    return {
-        isSticky: isSticky,
-        isStuck: isStuck,
-        stickyStyles: stickyStyles
-    };
-};
-export function useSupportsStickyHeader() {
-    var isMobile = useMobile();
-    return supportsStickyPosition() && !isMobile;
-}
-//# sourceMappingURL=use-sticky-header.js.map

package/internal/template/container/use-sticky-header.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-sticky-header.js","sourceRoot":"","sources":["../../../src/container/use-sticky-header.ts"],"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 { RefObject, useState, useLayoutEffect, useCallback, useEffect, createContext, useMemo } from 'react';\nimport { useAppLayoutContext } from '../internal/context/app-layout-context';\nimport { useMobile } from '../internal/hooks/use-mobile';\nimport { supportsStickyPosition } from '../internal/utils/dom';\nimport { getOverflowParents } from '../internal/utils/scrollable-containers';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport customCssProps from '../internal/generated/custom-css-properties';\n\ninterface StickyHeaderContextProps {\n  isStuck: boolean;\n}\n\nexport const StickyHeaderContext = createContext<StickyHeaderContextProps>({ isStuck: false });\n\nexport const useStickyHeader = (\n  rootRef: RefObject<HTMLDivElement>,\n  headerRef: RefObject<HTMLDivElement>,\n  __stickyHeader?: boolean,\n  __stickyOffset?: number\n) => {\n  const currentRootRef = rootRef.current;\n  const currentHeaderRef = headerRef.current;\n  const totalBorder = useMemo(() => {\n    const containerRootBorder = currentRootRef\n      ? parseInt(getComputedStyle(currentRootRef).getPropertyValue('border-top-width'), 10)\n      : 0;\n    const headerBorder = currentHeaderRef\n      ? parseInt(getComputedStyle(currentHeaderRef).getPropertyValue('border-top-width'), 10)\n      : 0;\n    return containerRootBorder + headerBorder;\n  }, [currentRootRef, currentHeaderRef]);\n\n  // Having no overflow parents, means that the component uses body scroll.\n  // In that case, we reach into AppLayoutContext in case sticky header needs to be\n  //  offset down by the height of other sticky elements positioned on top of the view.\n  const [usesBodyScroll, setState] = useState<boolean>(false);\n  const [isStuck, setIsStuck] = useState(false);\n  useLayoutEffect(() => {\n    const overflowParents = rootRef.current && getOverflowParents(rootRef.current).length;\n    setState(!overflowParents);\n  }, [rootRef]);\n  const { stickyOffsetTop } = useAppLayoutContext();\n  const effectiveStickyOffset = __stickyOffset ?? (usesBodyScroll ? stickyOffsetTop : 0);\n  const isSticky = useSupportsStickyHeader() && !!__stickyHeader;\n  const isRefresh = useVisualRefresh(rootRef);\n\n  /**\n   * The AppLayout refactor removed the need for passing the sticky offset in px all the time through the\n   * AppLayoutDomContext provider because that information already exists on the DOM in a custom property\n   * on the Layout subcomponent. Thus, if the Container header is sticky, we are in Visual Refresh and use\n   * body scroll then we will use that property. When a component is used outside AppLayout, we fall back\n   * to the default offset calculated in AppLayoutDomContext.\n   */\n  let computedOffset = `${effectiveStickyOffset - totalBorder}px`;\n  if (usesBodyScroll && isRefresh) {\n    computedOffset = `var(${customCssProps.offsetTopWithNotifications}, ${computedOffset})`;\n  }\n\n  const stickyStyles = isSticky\n    ? {\n        style: {\n          top: computedOffset,\n        },\n      }\n    : {};\n\n  // \"stuck\" state, when the header has moved from its original posititon has a\n  // box-shadow, applied here by a \"header-stuck\" className\n  const checkIfStuck = useCallback(() => {\n    if (rootRef.current && headerRef.current) {\n      const rootTop = rootRef.current.getBoundingClientRect().top;\n      const headerTop = headerRef.current.getBoundingClientRect().top;\n      if (rootTop + totalBorder < headerTop) {\n        setIsStuck(true);\n      } else {\n        setIsStuck(false);\n      }\n    }\n  }, [rootRef, headerRef, totalBorder]);\n  useEffect(() => {\n    if (isSticky) {\n      window.addEventListener('scroll', checkIfStuck, true);\n      window.addEventListener('resize', checkIfStuck);\n      return () => {\n        window.removeEventListener('scroll', checkIfStuck, true);\n        window.removeEventListener('resize', checkIfStuck);\n      };\n    }\n  }, [isSticky, checkIfStuck]);\n  return {\n    isSticky,\n    isStuck,\n    stickyStyles,\n  };\n};\n\nexport function useSupportsStickyHeader() {\n  const isMobile = useMobile();\n  return supportsStickyPosition() && !isMobile;\n}\n"]}