@commercetools-frontend/application-components 0.0.0-CRAFT-1791-20251006162610

package/dist/declarations/src/components/modal-pages/tabular-modal-page/tabular-modal-page.d.ts

@@ -0,0 +1,169 @@
+import { ReactElement, ReactNode, SyntheticEvent } from 'react';
+import type { CSSObject } from '@emotion/react';
+import type { TCustomViewSelectorProps } from "../../custom-views/custom-views-selector/types.js";
+type MessageDescriptor = {
+    id: string;
+    description?: string | object;
+    defaultMessage?: string;
+};
+type Label = string | MessageDescriptor;
+type Props = {
+    /**
+     * @deprecated Not used anymore, as the value is controlled via the Stacking Layer System.
+     */
+    level?: number;
+    title: string;
+    isOpen: boolean;
+    /**
+     * These codes are used to configure which Custom Views are available for every tab.
+     */
+    customViewLocatorCodes?: TCustomViewSelectorProps['customViewLocatorCodes'];
+    onClose?: (event: SyntheticEvent) => void;
+    children: ReactNode;
+    zIndex?: number;
+    /**
+     * @deprecated Not used anymore, as the value is controlled via the Stacking Layer System.
+     */
+    baseZIndex?: number;
+    getParentSelector?: () => HTMLElement;
+    shouldDelayOnClose?: boolean;
+    afterOpenStyles?: string | CSSObject;
+    topBarCurrentPathLabel?: string;
+    topBarPreviousPathLabel?: Label;
+    customTitleRow?: ReactNode;
+    tabControls: ReactNode;
+    subtitle?: string | ReactElement;
+    formControls?: ReactNode;
+    hideControls?: boolean;
+};
+declare const TabularModalPage: {
+    ({ hideControls, ...props }: Props): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+    FormPrimaryButton: {
+        ({ label, isDisabled, dataAttributes, ...props }: {
+            iconLeft?: ReactElement<import("@commercetools-uikit/design-system").TIconProps>;
+        } & {
+            label?: string | {
+                id: string;
+                description?: string | object;
+                defaultMessage?: string;
+            };
+            onClick: (event: SyntheticEvent) => void;
+            isDisabled?: boolean;
+            dataAttributes?: {
+                [key: string]: string;
+            };
+            children?: never;
+        }): import("@emotion/react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    FormSecondaryButton: {
+        ({ label, isDisabled, dataAttributes, ...props }: {
+            iconLeft?: ReactElement<import("@commercetools-uikit/design-system").TIconProps>;
+        } & {
+            label?: string | {
+                id: string;
+                description?: string | object;
+                defaultMessage?: string;
+            };
+            onClick: (event: SyntheticEvent) => void;
+            isDisabled?: boolean;
+            dataAttributes?: {
+                [key: string]: string;
+            };
+            children?: never;
+        }): import("@emotion/react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    FormDeleteButton: {
+        ({ label, isDisabled, dataAttributes, ...props }: {
+            label?: string | {
+                id: string;
+                description?: string | object;
+                defaultMessage?: string;
+            };
+            onClick: (event: SyntheticEvent) => void;
+            isDisabled?: boolean;
+            dataAttributes?: {
+                [key: string]: string;
+            };
+            children?: never;
+        }): import("@emotion/react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Intl: {
+        cancel: {
+            id: string;
+            defaultMessage: string;
+        };
+        revert: {
+            id: string;
+            defaultMessage: string;
+        };
+        confirm: {
+            id: string;
+            defaultMessage: string;
+        };
+        save: {
+            id: string;
+            defaultMessage: string;
+        };
+        update: {
+            id: string;
+            defaultMessage: string;
+        };
+        create: {
+            id: string;
+            defaultMessage: string;
+        };
+        delete: {
+            id: string;
+            defaultMessage: string;
+        };
+        add: {
+            id: string;
+            defaultMessage: string;
+        };
+        remove: {
+            id: string;
+            defaultMessage: string;
+        };
+        close: {
+            id: string;
+            defaultMessage: string;
+        };
+        edit: {
+            id: string;
+            defaultMessage: string;
+        };
+        open: {
+            id: string;
+            defaultMessage: string;
+        };
+        activate: {
+            id: string;
+            defaultMessage: string;
+        };
+        deactivate: {
+            id: string;
+            defaultMessage: string;
+        };
+        active: {
+            id: string;
+            defaultMessage: string;
+        };
+        inactive: {
+            id: string;
+            defaultMessage: string;
+        };
+        enable: {
+            id: string;
+            defaultMessage: string;
+        };
+        disable: {
+            id: string;
+            defaultMessage: string;
+        };
+    };
+};
+export default TabularModalPage;

package/dist/declarations/src/components/modal-pages/utils/index.d.ts

@@ -0,0 +1 @@
+export { default as ModalPageTopBar, LargeIconWrapper, } from "./modal-page-top-bar.js";

package/dist/declarations/src/components/modal-pages/utils/modal-page-top-bar.d.ts

@@ -0,0 +1,26 @@
+import { type SyntheticEvent, type ReactElement } from 'react';
+import { type TSecondaryButtonIconProps } from '@commercetools-uikit/secondary-icon-button';
+type TLargeIconWrapperProps = {
+    children: ReactElement<TLargeIconWrapperProps>;
+    size?: TSecondaryButtonIconProps['size'];
+};
+export declare const LargeIconWrapper: (props: TLargeIconWrapperProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+type MessageDescriptor = {
+    id: string;
+    description?: string | object;
+    defaultMessage?: string;
+};
+type Label = string | MessageDescriptor;
+type Props = {
+    color?: 'surface' | 'neutral';
+    currentPathLabel?: string;
+    previousPathLabel?: Label;
+    hidePathLabel?: boolean;
+    onClose: (event: SyntheticEvent) => void;
+    children?: never;
+};
+declare const ModalPageTopBar: {
+    ({ color, previousPathLabel, hidePathLabel, ...props }: Props): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default ModalPageTopBar;

package/dist/declarations/src/components/page-content-containers/page-content-full/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./page-content-full.js";
+export type { TPageContentFull } from "./page-content-full.js";

package/dist/declarations/src/components/page-content-containers/page-content-full/page-content-full.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export type TPageContentFull = {
+    children: ReactNode;
+};
+declare function PageContentFull(props: TPageContentFull): import("@emotion/react/jsx-runtime").JSX.Element;
+export default PageContentFull;

package/dist/declarations/src/components/page-content-containers/page-content-narrow/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./page-content-narrow.js";
+export type { TPageContentNarrow } from "./page-content-narrow.js";

package/dist/declarations/src/components/page-content-containers/page-content-narrow/page-content-narrow.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export type TPageContentNarrow = {
+    children: ReactNode;
+};
+declare function PageContentNarrow(props: TPageContentNarrow): import("@emotion/react/jsx-runtime").JSX.Element;
+export default PageContentNarrow;

package/dist/declarations/src/components/page-content-containers/page-content-wide/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./page-content-wide.js";
+export type { TPageContentWide } from "./page-content-wide.js";

package/dist/declarations/src/components/page-content-containers/page-content-wide/page-content-wide.d.ts

@@ -0,0 +1,9 @@
+import { type ReactNode } from 'react';
+export type TPageContentWide = {
+    columns?: '1' | '1/1' | '2/1';
+    gapSize?: '10' | '20';
+    children: ReactNode;
+    themeParentSelector?: () => HTMLElement | null;
+};
+declare function PageContentWide({ columns, gapSize, ...props }: TPageContentWide): import("@emotion/react/jsx-runtime").JSX.Element;
+export default PageContentWide;

package/dist/declarations/src/components/page-not-found/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./page-not-found.js";

package/dist/declarations/src/components/page-not-found/page-not-found.d.ts

@@ -0,0 +1,5 @@
+declare const PageNotFound: {
+    (): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default PageNotFound;

package/dist/declarations/src/components/page-unauthorized/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./page-unauthorized.js";

package/dist/declarations/src/components/page-unauthorized/page-unauthorized.d.ts

@@ -0,0 +1,5 @@
+export declare const PageUnauthorized: {
+    (): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default PageUnauthorized;

package/dist/declarations/src/components/portals-container/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./portals-container.js";

package/dist/declarations/src/components/portals-container/portals-container.d.ts

@@ -0,0 +1,44 @@
+import { type MutableRefObject } from 'react';
+type TLayoutRefs = {
+    notificationsGlobalRef: MutableRefObject<HTMLDivElement>;
+    notificationsPageRef: MutableRefObject<HTMLDivElement>;
+};
+type TPortalsContainerProps = {
+    /**
+     * The offset value for positioning the container from the top, when opened.
+     * Usually this corresponds to the height of the header section.
+     * Defaults to `0px`.
+     */
+    offsetTop?: string;
+    /**
+     * The offset value for positioning the container from the left, when opened.
+     * Usually this corresponds to the min width of the nav menu.
+     * Defaults to `0px`.
+     */
+    offsetLeft?: string;
+    /**
+     * The offset value for positioning the container from the left, when opened.
+     * The value is only applied when the `.body__menu-open` global class is added to the DOM.
+     * Usually this corresponds to the width of the expanded nav menu.
+     * Defaults to `0px`.
+     */
+    offsetLeftOnExpandedMenu?: string;
+    /**
+     * The CSS selector to apply the `overflow: hidden` style to (preventing scrolling)
+     * when a modal container is open.
+     * Defaults to `main`.
+     */
+    containerSelectorToPreventScrollingOnOpen?: string;
+    /**
+     * The `z-index` value to apply to the portal container..
+     * Defaults to `10000`.
+     */
+    zIndex?: number;
+    /**
+     * The base `z-index` value to apply to each modal container.
+     * Defaults to `1000`.
+     */
+    baseModalZIndex?: number;
+};
+declare const PortalsContainer: import("react").ForwardRefExoticComponent<TPortalsContainerProps & import("react").RefAttributes<TLayoutRefs>>;
+export default PortalsContainer;

package/dist/declarations/src/components/project-stamp/project-stamp.d.ts

@@ -0,0 +1,9 @@
+declare const ProjectStamp: {
+    IsProduction: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    IsSuspended: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    IsExpired: () => import("@emotion/react/jsx-runtime").JSX.Element;
+    WillExpire: (props: {
+        daysLeft: number;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
+};
+export default ProjectStamp;

package/dist/declarations/src/components/public-page-layout/index.d.ts

@@ -0,0 +1,7 @@
+declare const PublicPageLayout: import("react").LazyExoticComponent<import("react").FC<{
+    welcomeMessage?: string;
+    legalMessage?: import("react").ReactNode;
+    contentScale?: "normal" | "wide";
+    children: import("react").ReactNode;
+}>>;
+export default PublicPageLayout;

package/dist/declarations/src/components/tab-header/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./tab-header.js";

package/dist/declarations/src/components/tab-header/tab-header.d.ts

@@ -0,0 +1,36 @@
+import type { ReactNode } from 'react';
+import type { LocationDescriptor } from 'history';
+import { type MessageDescriptor } from 'react-intl';
+export type TTabHeaderProps = {
+    /**
+     * A route path to redirect to when the tab is clicked.
+     */
+    to: string | LocationDescriptor;
+    /**
+     * The label of the tab.
+     * * <br />
+     * Required if `intlMessage` is not provided.
+     */
+    label?: string;
+    /**
+     * The label of the tab, using an `intl` message object.
+     * <br />
+     * Required if `label` is not provided.
+     */
+    intlMessage?: MessageDescriptor & {
+        values?: Record<string, ReactNode>;
+    };
+    /**
+     * If `true`, indicates that the element is in a disabled state.
+     */
+    isDisabled?: boolean;
+    /**
+     * If `true`, marks the tab as active if the link matches exactly the route.
+     */
+    exactPathMatch?: boolean;
+};
+export declare const TabHeader: {
+    ({ isDisabled, exactPathMatch, ...props }: TTabHeaderProps): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default TabHeader;

package/dist/declarations/src/hooks/use-modal-state/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./use-modal-state.js";

package/dist/declarations/src/hooks/use-modal-state/use-modal-state.d.ts

@@ -0,0 +1,6 @@
+declare const useModalState: (isInitiallyOpen?: boolean) => {
+    isModalOpen: boolean;
+    openModal: () => void;
+    closeModal: () => void;
+};
+export default useModalState;

package/dist/declarations/src/index.d.ts

@@ -0,0 +1,35 @@
+export { default as version } from "./version.js";
+export { default as TabHeader } from "./components/tab-header/index.js";
+export { default as InfoDialog } from "./components/dialogs/info-dialog/index.js";
+export { default as ConfirmationDialog } from "./components/dialogs/confirmation-dialog/index.js";
+export { default as FormDialog } from "./components/dialogs/form-dialog/index.js";
+export { default as InfoModalPage } from "./components/modal-pages/info-modal-page/index.js";
+export { default as FormModalPage } from "./components/modal-pages/form-modal-page/index.js";
+export { default as TabularModalPage } from "./components/modal-pages/tabular-modal-page/index.js";
+export { default as CustomFormModalPage } from "./components/modal-pages/custom-form-modal-page/index.js";
+export { ModalPageTopBar } from "./components/modal-pages/utils/index.js";
+export { default as CustomFormDetailPage } from "./components/detail-pages/custom-form-detail-page/index.js";
+export { default as FormDetailPage } from "./components/detail-pages/form-detail-page/index.js";
+export { default as InfoDetailPage } from "./components/detail-pages/info-detail-page/index.js";
+export { default as TabularDetailPage } from "./components/detail-pages/tabular-detail-page/index.js";
+export { default as PublicPageLayout } from "./components/public-page-layout/index.js";
+export { default as FormMainPage } from "./components/main-pages/form-main-page/index.js";
+export { default as CustomFormMainPage } from "./components/main-pages/custom-form-main-page/index.js";
+export { default as InfoMainPage } from "./components/main-pages/info-main-page/index.js";
+export { default as TabularMainPage } from "./components/main-pages/tabular-main-page/index.js";
+export { default as MaintenancePageLayout } from "./components/maintenance-page-layout/index.js";
+export { default as PageNotFound } from "./components/page-not-found/index.js";
+export { default as PageUnauthorized } from "./components/page-unauthorized/index.js";
+export { default as PageContentNarrow } from "./components/page-content-containers/page-content-narrow/index.js";
+export type { TPageContentNarrow } from "./components/page-content-containers/page-content-narrow/index.js";
+export { default as PageContentWide } from "./components/page-content-containers/page-content-wide/index.js";
+export type { TPageContentWide } from "./components/page-content-containers/page-content-wide/index.js";
+export { default as PageContentFull } from "./components/page-content-containers/page-content-full/index.js";
+export type { TPageContentFull } from "./components/page-content-containers/page-content-full/index.js";
+export { default as Drawer } from "./components/drawer/index.js";
+export { default as CustomViewLoader } from "./components/custom-views/custom-view-loader/index.js";
+export { default as CustomViewsSelector } from "./components/custom-views/custom-views-selector/index.js";
+export { default as ProjectStamp } from "./components/project-stamp/project-stamp.js";
+export { default as PortalsContainer } from "./components/portals-container/index.js";
+export { default as useModalState } from "./hooks/use-modal-state/index.js";
+export * from "./theming.js";

package/dist/declarations/src/theming.d.ts

@@ -0,0 +1,15 @@
+export declare const themesOverrides: {
+    default: {
+        marginForCustomViewsSelectorAsTabular: string;
+        marginForPageContent: string;
+        paddingForDetailPageHeader: string;
+        paddingForMainPageHeader: string;
+        paddingForTabularPageHeader: string;
+        backgroundColorForNavbar: "var(--color-primary-10, hsl(240, 66%, 19%))";
+        backgroundColorForNavbarHeader: "var(--color-primary-10, hsl(240, 66%, 19%))";
+        fontColorForTabLabelWhenActive: "var(--color-primary, hsl(240, 64%, 58%))";
+    };
+};
+type DesignTokenOverrides = keyof typeof themesOverrides.default;
+export declare const designTokens: Record<DesignTokenOverrides, string>;
+export {};

package/dist/declarations/src/version.d.ts

@@ -0,0 +1,2 @@
+declare const _default: "__@APPLICATION_KIT_PACKAGE/VERSION_OF_RELEASE__";
+export default _default;

package/dist/public-page-layout-7d1cb99f.esm.js

@@ -0,0 +1,94 @@
+import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/esm/objectWithoutProperties';
+import { css } from '@emotion/react';
+import CommercetoolsLogoSmallSvg from '@commercetools-frontend/assets/logos/commercetools_logo_small.svg';
+import { designTokens } from '@commercetools-uikit/design-system';
+import Spacings from '@commercetools-uikit/spacings';
+import Text from '@commercetools-uikit/text';
+import _styled from '@emotion/styled/base';
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
+
+const Container = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pnp02z2"
+} : {
+  target: "e1pnp02z2",
+  label: "Container"
+})("width:100%;min-height:100vh;display:flex;padding:", designTokens.spacingXl, " 0;justify-content:center;background-size:cover;background-position:center;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInB1YmxpYy1wYWdlLWxheW91dC5zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR21DIiwiZmlsZSI6InB1YmxpYy1wYWdlLWxheW91dC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgYXMgdWlLaXREZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBtaW4taGVpZ2h0OiAxMDB2aDtcbiAgZGlzcGxheTogZmxleDtcbiAgcGFkZGluZzogJHt1aUtpdERlc2lnblRva2Vucy5zcGFjaW5nWGx9IDA7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBiYWNrZ3JvdW5kLXNpemU6IGNvdmVyO1xuICBiYWNrZ3JvdW5kLXBvc2l0aW9uOiBjZW50ZXI7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyQ29sdW1uID0gc3R5bGVkLmRpdmBcbiAgd2lkdGg6IGNhbGMoJHt1aUtpdERlc2lnblRva2Vucy5jb25zdHJhaW50MTZ9IC8gMik7XG5gO1xuZXhwb3J0IGNvbnN0IENvbnRhaW5lckNvbHVtbldpZGUgPSBzdHlsZWQuZGl2YFxuICB3aWR0aDogJHt1aUtpdERlc2lnblRva2Vucy5jb25zdHJhaW50MTV9O1xuYDtcbiJdfQ== */"));
+const ContainerColumn = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pnp02z1"
+} : {
+  target: "e1pnp02z1",
+  label: "ContainerColumn"
+})("width:calc(", designTokens.constraint16, " / 2);" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInB1YmxpYy1wYWdlLWxheW91dC5zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBYXlDIiwiZmlsZSI6InB1YmxpYy1wYWdlLWxheW91dC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgYXMgdWlLaXREZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiAxMDAlO1xuICBtaW4taGVpZ2h0OiAxMDB2aDtcbiAgZGlzcGxheTogZmxleDtcbiAgcGFkZGluZzogJHt1aUtpdERlc2lnblRva2Vucy5zcGFjaW5nWGx9IDA7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICBiYWNrZ3JvdW5kLXNpemU6IGNvdmVyO1xuICBiYWNrZ3JvdW5kLXBvc2l0aW9uOiBjZW50ZXI7XG5gO1xuXG5leHBvcnQgY29uc3QgQ29udGFpbmVyQ29sdW1uID0gc3R5bGVkLmRpdmBcbiAgd2lkdGg6IGNhbGMoJHt1aUtpdERlc2lnblRva2Vucy5jb25zdHJhaW50MTZ9IC8gMik7XG5gO1xuZXhwb3J0IGNvbnN0IENvbnRhaW5lckNvbHVtbldpZGUgPSBzdHlsZWQuZGl2YFxuICB3aWR0aDogJHt1aUtpdERlc2lnblRva2Vucy5jb25zdHJhaW50MTV9O1xuYDtcbiJdfQ== */"));
+const ContainerColumnWide = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "e1pnp02z0"
+} : {
+  target: "e1pnp02z0",
+  label: "ContainerColumnWide"
+})("width:", designTokens.constraint15, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInB1YmxpYy1wYWdlLWxheW91dC5zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0I2QyIsImZpbGUiOiJwdWJsaWMtcGFnZS1sYXlvdXQuc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIGFzIHVpS2l0RGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5cbmV4cG9ydCBjb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICB3aWR0aDogMTAwJTtcbiAgbWluLWhlaWdodDogMTAwdmg7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIHBhZGRpbmc6ICR7dWlLaXREZXNpZ25Ub2tlbnMuc3BhY2luZ1hsfSAwO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYmFja2dyb3VuZC1zaXplOiBjb3ZlcjtcbiAgYmFja2dyb3VuZC1wb3NpdGlvbjogY2VudGVyO1xuYDtcblxuZXhwb3J0IGNvbnN0IENvbnRhaW5lckNvbHVtbiA9IHN0eWxlZC5kaXZgXG4gIHdpZHRoOiBjYWxjKCR7dWlLaXREZXNpZ25Ub2tlbnMuY29uc3RyYWludDE2fSAvIDIpO1xuYDtcbmV4cG9ydCBjb25zdCBDb250YWluZXJDb2x1bW5XaWRlID0gc3R5bGVkLmRpdmBcbiAgd2lkdGg6ICR7dWlLaXREZXNpZ25Ub2tlbnMuY29uc3RyYWludDE1fTtcbmA7XG4iXX0= */"));
+
+const _excluded = ["contentScale"],
+  _excluded2 = ["contentScale"];
+const year = new Date().getUTCFullYear();
+const PublicPageLayoutContent = _ref => {
+  let _ref$contentScale = _ref.contentScale,
+    contentScale = _ref$contentScale === void 0 ? 'normal' : _ref$contentScale,
+    props = _objectWithoutProperties(_ref, _excluded);
+  if (contentScale === 'wide') {
+    return jsx(ContainerColumnWide, {
+      children: props.children
+    });
+  }
+  return jsx(ContainerColumn, {
+    children: props.children
+  });
+};
+const PublicPageLayout = _ref2 => {
+  let _ref2$contentScale = _ref2.contentScale,
+    contentScale = _ref2$contentScale === void 0 ? 'normal' : _ref2$contentScale,
+    props = _objectWithoutProperties(_ref2, _excluded2);
+  return jsx(Container, {
+    children: jsxs(Spacings.Stack, {
+      scale: "xl",
+      alignItems: "center",
+      children: [jsx(ContainerColumn, {
+        children: jsx(Spacings.Inline, {
+          justifyContent: "center",
+          children: jsx("img", {
+            src: CommercetoolsLogoSmallSvg,
+            alt: "commercetools logo"
+          })
+        })
+      }), props.welcomeMessage && jsx(ContainerColumn, {
+        children: jsx(Text.Headline, {
+          as: "h2",
+          children: jsx("div", {
+            css: /*#__PURE__*/css("color:", designTokens.colorSolid, ";text-align:center;" + (process.env.NODE_ENV === "production" ? "" : ";label:PublicPageLayout;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInB1YmxpYy1wYWdlLWxheW91dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0V3QiIsImZpbGUiOiJwdWJsaWMtcGFnZS1sYXlvdXQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRkMsIFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBDb21tZXJjZXRvb2xzTG9nb1NtYWxsU3ZnIGZyb20gJ0Bjb21tZXJjZXRvb2xzLWZyb250ZW5kL2Fzc2V0cy9sb2dvcy9jb21tZXJjZXRvb2xzX2xvZ29fc21hbGwuc3ZnJztcbmltcG9ydCB7IGRlc2lnblRva2VucyBhcyB1aUtpdERlc2lnblRva2VucyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L2Rlc2lnbi1zeXN0ZW0nO1xuaW1wb3J0IFNwYWNpbmdzIGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L3NwYWNpbmdzJztcbmltcG9ydCBUZXh0IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L3RleHQnO1xuaW1wb3J0IHtcbiAgQ29udGFpbmVyLFxuICBDb250YWluZXJDb2x1bW4sXG4gIENvbnRhaW5lckNvbHVtbldpZGUsXG59IGZyb20gJy4vcHVibGljLXBhZ2UtbGF5b3V0LnN0eWxlcyc7XG5cbmNvbnN0IHllYXIgPSBuZXcgRGF0ZSgpLmdldFVUQ0Z1bGxZZWFyKCk7XG5cbnR5cGUgVFByb3BzID0ge1xuICAvKipcbiAgICogVGhlIHRleHQgdG8gYmUgZGlzcGxheWVkIGJlbG93IHRoZSBjb21tZXJjZXRvb2xzIGxvZ28uXG4gICAqL1xuICB3ZWxjb21lTWVzc2FnZT86IHN0cmluZztcbiAgLyoqXG4gICAqIFJlbmRlcnMgYSBub2RlIGJlbG93IHRoZSBjb250ZW50LiBUaGlzIGlzIHVzdWFsbHkgdGhlIHBsYWNlIGZvciByZW5kZXJpbmdcbiAgICogbGlua3MgdG8gdGhlIHByaXZhY3ksIHRlcm1zLCBldGMgcGFnZXMuXG4gICAqL1xuICBsZWdhbE1lc3NhZ2U/OiBSZWFjdE5vZGU7XG4gIC8qKlxuICAgKiBUaGUgYG5vcm1hbGAgc2NhbGUgdXNlcyBhbiBob3Jpem9udGFsIGNvbnRyYWludCBzaXplIG9mIGA4YCAoMzg0cHgpLlxuICAgKiBUaGUgYHdpZGVgIHNjYWxlIHVzZXMgYW4gaG9yaXpvbnRhbCBjb250cmFpbnQgc2l6ZSBvZiBgMTVgICg3NDJweCkuXG4gICAqIFRoZSBgd2lkZWAgc2NhbGUgY2FuIGJlIHVzZWQgZm9yIHJlbmRlcmluZyB0aGUgY29udGVudCBpbiAyIGNvbHVtbnMuXG4gICAqL1xuICBjb250ZW50U2NhbGU/OiAnbm9ybWFsJyB8ICd3aWRlJztcbiAgLyoqXG4gICAqIElmIGBjb250ZW50U2NhbGVgIGlzIGBub3JtYWxgLCB0aGUgY29udGVudCBpcyByZW5kZXJlZCBpbiBvbmUgY29sdW1uLlxuICAgKiBJZiBgY29udGVudFNjYWxlYCBpcyBgd2lkZWAsIHlvdSBuZWVkIHRvIHBhc3MgMiBjaGlsZHJlbiBhcyB0aGV5IHdpbGwgYmUgZGlzcGxheWVkXG4gICAqIGluIHR3byBjb2x1bW5zLlxuICAgKi9cbiAgY2hpbGRyZW46IFJlYWN0Tm9kZTtcbn07XG5cbmNvbnN0IFB1YmxpY1BhZ2VMYXlvdXRDb250ZW50OiBGQzxUUHJvcHM+ID0gKHtcbiAgY29udGVudFNjYWxlID0gJ25vcm1hbCcsXG4gIC4uLnByb3BzXG59KSA9PiB7XG4gIGlmIChjb250ZW50U2NhbGUgPT09ICd3aWRlJykge1xuICAgIHJldHVybiA8Q29udGFpbmVyQ29sdW1uV2lkZT57cHJvcHMuY2hpbGRyZW59PC9Db250YWluZXJDb2x1bW5XaWRlPjtcbiAgfVxuICByZXR1cm4gPENvbnRhaW5lckNvbHVtbj57cHJvcHMuY2hpbGRyZW59PC9Db250YWluZXJDb2x1bW4+O1xufTtcblxuY29uc3QgUHVibGljUGFnZUxheW91dDogRkM8VFByb3BzPiA9ICh7XG4gIGNvbnRlbnRTY2FsZSA9ICdub3JtYWwnLFxuICAuLi5wcm9wc1xufSkgPT4ge1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXI+XG4gICAgICA8U3BhY2luZ3MuU3RhY2sgc2NhbGU9XCJ4bFwiIGFsaWduSXRlbXM9XCJjZW50ZXJcIj5cbiAgICAgICAgPENvbnRhaW5lckNvbHVtbj5cbiAgICAgICAgICA8U3BhY2luZ3MuSW5saW5lIGp1c3RpZnlDb250ZW50PVwiY2VudGVyXCI+XG4gICAgICAgICAgICA8aW1nIHNyYz17Q29tbWVyY2V0b29sc0xvZ29TbWFsbFN2Z30gYWx0PVwiY29tbWVyY2V0b29scyBsb2dvXCIgLz5cbiAgICAgICAgICA8L1NwYWNpbmdzLklubGluZT5cbiAgICAgICAgPC9Db250YWluZXJDb2x1bW4+XG4gICAgICAgIHtwcm9wcy53ZWxjb21lTWVzc2FnZSAmJiAoXG4gICAgICAgICAgPENvbnRhaW5lckNvbHVtbj5cbiAgICAgICAgICAgIDxUZXh0LkhlYWRsaW5lIGFzPVwiaDJcIj5cbiAgICAgICAgICAgICAgPGRpdlxuICAgICAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICAgICAgY29sb3I6ICR7dWlLaXREZXNpZ25Ub2tlbnMuY29sb3JTb2xpZH07XG4gICAgICAgICAgICAgICAgICB0ZXh0LWFsaWduOiBjZW50ZXI7XG4gICAgICAgICAgICAgICAgYH1cbiAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHtwcm9wcy53ZWxjb21lTWVzc2FnZX1cbiAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICA8L1RleHQuSGVhZGxpbmU+XG4gICAgICAgICAgPC9Db250YWluZXJDb2x1bW4+XG4gICAgICAgICl9XG4gICAgICAgIDxTcGFjaW5ncy5TdGFjayBzY2FsZT1cInhsXCI+XG4gICAgICAgICAgPFB1YmxpY1BhZ2VMYXlvdXRDb250ZW50IGNvbnRlbnRTY2FsZT17Y29udGVudFNjYWxlfT5cbiAgICAgICAgICAgIHtwcm9wcy5jaGlsZHJlbn1cbiAgICAgICAgICA8L1B1YmxpY1BhZ2VMYXlvdXRDb250ZW50PlxuICAgICAgICAgIDxQdWJsaWNQYWdlTGF5b3V0Q29udGVudCBjb250ZW50U2NhbGU9e2NvbnRlbnRTY2FsZX0+XG4gICAgICAgICAgICA8U3BhY2luZ3MuU3RhY2tcbiAgICAgICAgICAgICAgc2NhbGU9XCJ4c1wiXG4gICAgICAgICAgICAgIGFsaWduSXRlbXM9e2NvbnRlbnRTY2FsZSA9PT0gJ3dpZGUnID8gJ2NlbnRlcicgOiAnc3RyZXRjaCd9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIHtwcm9wcy5sZWdhbE1lc3NhZ2UgJiYgKFxuICAgICAgICAgICAgICAgIDxUZXh0LkRldGFpbCB0b25lPVwic2Vjb25kYXJ5XCI+e3Byb3BzLmxlZ2FsTWVzc2FnZX08L1RleHQuRGV0YWlsPlxuICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgICB7XG4gICAgICAgICAgICAgICAgPFRleHQuRGV0YWlsIHRvbmU9XCJzZWNvbmRhcnlcIj57YCR7eWVhcn0gwqkgY29tbWVyY2V0b29sc2B9PC9UZXh0LkRldGFpbD5cbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgPC9TcGFjaW5ncy5TdGFjaz5cbiAgICAgICAgICA8L1B1YmxpY1BhZ2VMYXlvdXRDb250ZW50PlxuICAgICAgICA8L1NwYWNpbmdzLlN0YWNrPlxuICAgICAgPC9TcGFjaW5ncy5TdGFjaz5cbiAgICA8L0NvbnRhaW5lcj5cbiAgKTtcbn07XG5QdWJsaWNQYWdlTGF5b3V0LmRpc3BsYXlOYW1lID0gJ1B1YmxpY1BhZ2VMYXlvdXQnO1xuXG5leHBvcnQgZGVmYXVsdCBQdWJsaWNQYWdlTGF5b3V0O1xuIl19 */"),
+            children: props.welcomeMessage
+          })
+        })
+      }), jsxs(Spacings.Stack, {
+        scale: "xl",
+        children: [jsx(PublicPageLayoutContent, {
+          contentScale: contentScale,
+          children: props.children
+        }), jsx(PublicPageLayoutContent, {
+          contentScale: contentScale,
+          children: jsxs(Spacings.Stack, {
+            scale: "xs",
+            alignItems: contentScale === 'wide' ? 'center' : 'stretch',
+            children: [props.legalMessage && jsx(Text.Detail, {
+              tone: "secondary",
+              children: props.legalMessage
+            }), jsx(Text.Detail, {
+              tone: "secondary",
+              children: `${year} © commercetools`
+            })]
+          })
+        })]
+      })]
+    })
+  });
+};
+PublicPageLayout.displayName = 'PublicPageLayout';
+
+export { PublicPageLayout as default };

package/dist/public-page-layout-b182d2dd.cjs.prod.js

@@ -0,0 +1,94 @@
+'use strict';
+
+var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
+var react = require('@emotion/react');
+var CommercetoolsLogoSmallSvg = require('@commercetools-frontend/assets/logos/commercetools_logo_small.svg');
+var designSystem = require('@commercetools-uikit/design-system');
+var Spacings = require('@commercetools-uikit/spacings');
+var Text = require('@commercetools-uikit/text');
+var _styled = require('@emotion/styled/base');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var CommercetoolsLogoSmallSvg__default = /*#__PURE__*/_interopDefault(CommercetoolsLogoSmallSvg);
+var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
+var Text__default = /*#__PURE__*/_interopDefault(Text);
+var _styled__default = /*#__PURE__*/_interopDefault(_styled);
+
+const Container = /*#__PURE__*/_styled__default["default"]("div", {
+  target: "e1pnp02z2"
+} )("width:100%;min-height:100vh;display:flex;padding:", designSystem.designTokens.spacingXl, " 0;justify-content:center;background-size:cover;background-position:center;" + ("" ));
+const ContainerColumn = /*#__PURE__*/_styled__default["default"]("div", {
+  target: "e1pnp02z1"
+} )("width:calc(", designSystem.designTokens.constraint16, " / 2);" + ("" ));
+const ContainerColumnWide = /*#__PURE__*/_styled__default["default"]("div", {
+  target: "e1pnp02z0"
+} )("width:", designSystem.designTokens.constraint15, ";" + ("" ));
+
+const _excluded = ["contentScale"],
+  _excluded2 = ["contentScale"];
+const year = new Date().getUTCFullYear();
+const PublicPageLayoutContent = _ref => {
+  let _ref$contentScale = _ref.contentScale,
+    contentScale = _ref$contentScale === void 0 ? 'normal' : _ref$contentScale,
+    props = _objectWithoutProperties(_ref, _excluded);
+  if (contentScale === 'wide') {
+    return jsxRuntime.jsx(ContainerColumnWide, {
+      children: props.children
+    });
+  }
+  return jsxRuntime.jsx(ContainerColumn, {
+    children: props.children
+  });
+};
+const PublicPageLayout = _ref2 => {
+  let _ref2$contentScale = _ref2.contentScale,
+    contentScale = _ref2$contentScale === void 0 ? 'normal' : _ref2$contentScale,
+    props = _objectWithoutProperties(_ref2, _excluded2);
+  return jsxRuntime.jsx(Container, {
+    children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+      scale: "xl",
+      alignItems: "center",
+      children: [jsxRuntime.jsx(ContainerColumn, {
+        children: jsxRuntime.jsx(Spacings__default["default"].Inline, {
+          justifyContent: "center",
+          children: jsxRuntime.jsx("img", {
+            src: CommercetoolsLogoSmallSvg__default["default"],
+            alt: "commercetools logo"
+          })
+        })
+      }), props.welcomeMessage && jsxRuntime.jsx(ContainerColumn, {
+        children: jsxRuntime.jsx(Text__default["default"].Headline, {
+          as: "h2",
+          children: jsxRuntime.jsx("div", {
+            css: /*#__PURE__*/react.css("color:", designSystem.designTokens.colorSolid, ";text-align:center;" + ("" ), "" ),
+            children: props.welcomeMessage
+          })
+        })
+      }), jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+        scale: "xl",
+        children: [jsxRuntime.jsx(PublicPageLayoutContent, {
+          contentScale: contentScale,
+          children: props.children
+        }), jsxRuntime.jsx(PublicPageLayoutContent, {
+          contentScale: contentScale,
+          children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+            scale: "xs",
+            alignItems: contentScale === 'wide' ? 'center' : 'stretch',
+            children: [props.legalMessage && jsxRuntime.jsx(Text__default["default"].Detail, {
+              tone: "secondary",
+              children: props.legalMessage
+            }), jsxRuntime.jsx(Text__default["default"].Detail, {
+              tone: "secondary",
+              children: `${year} © commercetools`
+            })]
+          })
+        })]
+      })]
+    })
+  });
+};
+PublicPageLayout.displayName = 'PublicPageLayout';
+
+exports["default"] = PublicPageLayout;