@doyourjob/gravity-ui-page-constructor 5.31.16

package/build/esm/editor/components/CodeEditor/CodeEditor.js

@@ -0,0 +1,32 @@
+import React, { useCallback, useContext, useState } from 'react';
+import { ChevronsCollapseUpRight, ChevronsExpandUpRight } from '@gravity-ui/icons';
+import { Button, Icon } from '@gravity-ui/uikit';
+import debounce from 'lodash/debounce';
+import MonacoEditor from 'react-monaco-editor';
+import { Theme } from '../../../models';
+import { block } from '../../../utils';
+import { EditorContext } from '../../context';
+import { parseCode } from '../../utils/code';
+import { options } from './constants';
+import './CodeEditor.css';
+const b = block('code-editor');
+const ON_CHANGE_DEBOUNCE_TIMEOUT = 300;
+export const CodeEditor = React.memo(({ onChange, validator, fullscreenModeOn, onFullscreenModeOnUpdate, code }) => {
+    const [message, setMessage] = useState(() => validator(code));
+    const { theme = Theme.Light } = useContext(EditorContext);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    const onChangeWithValidation = useCallback(debounce((newCode) => {
+        const validationResult = validator(newCode);
+        setMessage(validationResult);
+        onChange(parseCode(newCode));
+    }, ON_CHANGE_DEBOUNCE_TIMEOUT), [onChange, validator]);
+    return (React.createElement("div", { className: b({ fullscreen: fullscreenModeOn }) },
+        React.createElement("div", { className: b('header') },
+            React.createElement(Button, { view: "flat-secondary", onClick: () => onFullscreenModeOnUpdate(!fullscreenModeOn) },
+                React.createElement(Icon, { data: fullscreenModeOn ? ChevronsCollapseUpRight : ChevronsExpandUpRight, size: 16 }))),
+        React.createElement("div", { className: b('code') },
+            React.createElement(MonacoEditor, { key: String(fullscreenModeOn), defaultValue: code, value: code, language: "yaml", options: options, onChange: onChangeWithValidation, theme: theme === Theme.Dark ? 'vs-dark' : 'vs' })),
+        React.createElement("div", { className: b('footer') }, message && (React.createElement("div", { className: b('message-container') },
+            React.createElement("div", { className: b('message', { status: message.status }) }, message.text))))));
+});
+CodeEditor.displayName = 'CodeEditor';

package/build/esm/editor/components/CodeEditor/constants.d.ts

@@ -0,0 +1,2 @@
+import { monaco } from 'react-monaco-editor';
+export declare const options: monaco.editor.IStandaloneEditorConstructionOptions;

package/build/esm/editor/components/CodeEditor/constants.js

@@ -0,0 +1,17 @@
+export const options = {
+    wordWrap: 'on',
+    renderLineHighlight: 'none',
+    selectOnLineNumbers: true,
+    renderWhitespace: 'all',
+    automaticLayout: true,
+    minimap: {
+        enabled: false,
+    },
+    overviewRulerLanes: 0,
+    hideCursorInOverviewRuler: true,
+    scrollbar: {
+        vertical: 'hidden',
+    },
+    overviewRulerBorder: false,
+    readOnly: false,
+};

package/build/esm/editor/components/ControlPanel/ControlPanel.css

@@ -0,0 +1,32 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-control-panel {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  width: 100%;
+  height: var(--pc-editor-header-height);
+  padding: 8px 20px;
+  background-color: var(--g-color-base-background);
+  border: 1px var(--g-color-line-generic);
+  border-style: solid none;
+}
+.pc-control-panel__icon {
+  display: flex;
+  align-items: center;
+}
+.pc-control-panel__radio-button .g-radio-button__option {
+  display: flex;
+  align-items: center;
+}
+.pc-control-panel__switch-container {
+  display: flex;
+  align-items: center;
+  place-self: center;
+  gap: 12px;
+}
+.pc-control-panel__theme-switch {
+  place-self: center end;
+  display: flex;
+  gap: 12px;
+  align-items: center;
+}

package/build/esm/editor/components/ControlPanel/ControlPanel.d.ts

@@ -0,0 +1,13 @@
+import { ClassNameProps, Theme } from '../../../models';
+import { EditModeItem, ViewModeItem } from '../../types';
+import './ControlPanel.css';
+export interface ControlPanelProps extends ClassNameProps {
+    viewMode?: ViewModeItem;
+    editMode?: EditModeItem;
+    onViewModeChange: (viewMode: ViewModeItem) => void;
+    onEditModeChange: (editMode: EditModeItem) => void;
+    theme: Theme;
+    onThemeChange: (theme: Theme) => void;
+}
+declare const ControlPanel: ({ viewMode, editMode, onViewModeChange, onEditModeChange, className, theme, onThemeChange, }: ControlPanelProps) => JSX.Element;
+export default ControlPanel;

package/build/esm/editor/components/ControlPanel/ControlPanel.js

@@ -0,0 +1,42 @@
+import React from 'react';
+import { Code, Display, Eye, Smartphone, SquareDashedText } from '@gravity-ui/icons';
+import { RadioButton, Select } from '@gravity-ui/uikit';
+import { Theme, themeNames } from '../../../models';
+import { block } from '../../../utils';
+import { Tablet } from '../../icons/Tablet';
+import { EditModeItem, ViewModeItem } from '../../types';
+import { i18n } from './i18n';
+import './ControlPanel.css';
+const ICON_SIZE = 14;
+const b = block('control-panel');
+const ControlPanelViewModeIcons = {
+    [ViewModeItem.Desktop]: Display,
+    [ViewModeItem.Tablet]: Tablet,
+    [ViewModeItem.Mobile]: Smartphone,
+};
+const ControlPanelEditModeIcons = {
+    [EditModeItem.View]: Eye,
+    [EditModeItem.Form]: SquareDashedText,
+    [EditModeItem.Code]: Code,
+};
+const ControlPanel = ({ viewMode = ViewModeItem.Desktop, editMode = EditModeItem.Form, onViewModeChange, onEditModeChange, className, theme, onThemeChange, }) => (React.createElement("div", { className: b(null, className) },
+    React.createElement("div", { className: b('switch-container') },
+        React.createElement("span", null, i18n('edit_mode')),
+        React.createElement(RadioButton, { className: b('radio-button'), value: editMode, onUpdate: (value) => onEditModeChange(value) }, Object.values(EditModeItem).map((item) => {
+            const Icon = ControlPanelEditModeIcons[item];
+            return (React.createElement(RadioButton.Option, { key: item, value: item },
+                React.createElement("span", { className: b('icon') },
+                    React.createElement(Icon, { width: ICON_SIZE, height: ICON_SIZE }))));
+        }))),
+    React.createElement("div", { className: b('switch-container') },
+        React.createElement("span", null, i18n('view_mode')),
+        React.createElement(RadioButton, { className: b('radio-button'), value: viewMode, onUpdate: (value) => onViewModeChange(value) }, Object.values(ViewModeItem).map((item) => {
+            const Icon = ControlPanelViewModeIcons[item];
+            return (React.createElement(RadioButton.Option, { key: item, value: item },
+                React.createElement("span", { className: b('icon') },
+                    React.createElement(Icon, { width: ICON_SIZE, height: ICON_SIZE }))));
+        }))),
+    React.createElement("div", { className: b('switch-container') },
+        React.createElement("span", null, i18n('theme')),
+        React.createElement(Select, { value: [theme], onUpdate: (value) => onThemeChange(value[0]) }, Object.values(Theme).map((item) => (React.createElement(Select.Option, { key: item, value: item }, themeNames[item])))))));
+export default ControlPanel;

package/build/esm/editor/components/ControlPanel/i18n/en.json

@@ -0,0 +1,5 @@
+{
+  "view_mode": "View mode",
+  "edit_mode": "Edit mode",
+  "theme": "Theme"
+}

package/build/esm/editor/components/ControlPanel/i18n/index.d.ts

@@ -0,0 +1 @@
+export declare const i18n: (key: "theme" | "view_mode" | "edit_mode", params?: import("@gravity-ui/i18n").Params | undefined) => string;

package/build/esm/editor/components/ControlPanel/i18n/index.js

@@ -0,0 +1,5 @@
+import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
+import { NAMESPACE } from '../../../../utils/cn';
+import en from './en.json';
+import ru from './ru.json';
+export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}ControlPanel`);

package/build/esm/editor/components/ControlPanel/i18n/ru.json

@@ -0,0 +1,5 @@
+{
+  "view_mode": "Режим просмотра",
+  "edit_mode": "Режим редактирования",
+  "theme": "Тема"
+}

package/build/esm/editor/components/DeviceEmulation/DeviceEmulation.d.ts

@@ -0,0 +1,7 @@
+import { PropsWithChildren } from 'react';
+import { ViewModeItem } from '../../types';
+export interface DeviceEmulationProps extends PropsWithChildren {
+    mode: ViewModeItem;
+}
+declare const DeviceEmulation: ({ children, mode }: DeviceEmulationProps) => JSX.Element;
+export default DeviceEmulation;

package/build/esm/editor/components/DeviceEmulation/DeviceEmulation.js

@@ -0,0 +1,7 @@
+import React, { Fragment } from 'react';
+import DeviceEmulationMobile from './DeviceEmulationMobile/DeviceEmulationMobile';
+import { isMobileDevice, mobileDevices } from './utils';
+const DeviceEmulation = ({ children, mode }) => (React.createElement(Fragment, null,
+    !isMobileDevice(mode) && children,
+    mobileDevices.map((device) => (React.createElement(DeviceEmulationMobile, { key: device, device: device, active: mode === device }, children)))));
+export default DeviceEmulation;

package/build/esm/editor/components/DeviceEmulation/DeviceEmulationMobile/DeviceEmulationMobile.css

@@ -0,0 +1,33 @@
+.pc-device-emulation-mobile {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  opacity: 0;
+  pointer-events: none;
+}
+.pc-device-emulation-mobile_active {
+  opacity: 1;
+  pointer-events: all;
+}
+.pc-device-emulation-mobile__frame {
+  border: none;
+}
+.pc-device-emulation-mobile__frame_device_mobile {
+  width: 390px;
+  height: 844px;
+}
+.pc-device-emulation-mobile__frame_device_tablet {
+  width: 768px;
+  height: 1024px;
+}
+
+.pc-device-emulation-mobile__frame {
+  margin: 0;
+}
+
+.pc-device-emulation-mobile__container {
+  overflow: auto;
+}

package/build/esm/editor/components/DeviceEmulation/DeviceEmulationMobile/DeviceEmulationMobile.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren } from 'react';
+import { MobileDevice } from '../utils';
+import './DeviceEmulationMobile.css';
+interface DeviceEmulationMobileProps extends PropsWithChildren {
+    device: MobileDevice;
+    active: boolean;
+}
+declare const DeviceEmulationMobile: ({ device, active }: DeviceEmulationMobileProps) => JSX.Element;
+export default DeviceEmulationMobile;

package/build/esm/editor/components/DeviceEmulation/DeviceEmulationMobile/DeviceEmulationMobile.js

@@ -0,0 +1,40 @@
+import { __rest } from "tslib";
+import React, { useContext, useEffect, useRef } from 'react';
+import { block } from '../../../../utils';
+import { EditorContext } from '../../../context';
+import { DeviceIframe } from '../../../widget';
+import './DeviceEmulationMobile.css';
+const b = block('device-emulation-mobile');
+const DeviceEmulationMobile = ({ device, active }) => {
+    const _a = useContext(EditorContext), { deviceEmulationSettings } = _a, initialData = __rest(_a, ["deviceEmulationSettings"]);
+    const containerRef = useRef(null);
+    const deviceIframeRef = useRef(null);
+    useEffect(() => {
+        let iframe;
+        if (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) {
+            iframe = new DeviceIframe(containerRef === null || containerRef === void 0 ? void 0 : containerRef.current, {
+                initialData,
+                className: b('frame', { device }),
+                settings: deviceEmulationSettings,
+            });
+            deviceIframeRef.current = iframe;
+        }
+        return () => {
+            iframe === null || iframe === void 0 ? void 0 : iframe.destroy();
+        };
+        // render iframe only once, then update it's data with postMessage
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [device]);
+    useEffect(() => {
+        if (deviceIframeRef.current) {
+            deviceIframeRef.current.onActivenessUpdate(active);
+        }
+    }, [active]);
+    useEffect(() => {
+        if (deviceIframeRef.current && initialData) {
+            deviceIframeRef.current.onDataUpdate(initialData);
+        }
+    }, [initialData]);
+    return React.createElement("div", { className: b({ active, device }), ref: containerRef });
+};
+export default DeviceEmulationMobile;

package/build/esm/editor/components/DeviceEmulation/utils.d.ts

@@ -0,0 +1,4 @@
+import { ViewModeItem } from '../../types';
+export type MobileDevice = ViewModeItem.Mobile | ViewModeItem.Tablet;
+export declare const mobileDevices: readonly [ViewModeItem.Tablet, ViewModeItem.Mobile];
+export declare const isMobileDevice: (mode: ViewModeItem) => mode is MobileDevice;

package/build/esm/editor/components/DeviceEmulation/utils.js

@@ -0,0 +1,3 @@
+import { ViewModeItem } from '../../types';
+export const mobileDevices = [ViewModeItem.Tablet, ViewModeItem.Mobile];
+export const isMobileDevice = (mode) => [ViewModeItem.Tablet, ViewModeItem.Mobile].includes(mode);

package/build/esm/editor/components/EditBlock/EditBlock.css

@@ -0,0 +1,65 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-edit-block {
+  cursor: pointer;
+  position: relative;
+  z-index: 10;
+}
+.pc-edit-block_active {
+  z-index: 11;
+}
+.pc-edit-block_active .pc-edit-block__controls {
+  border: 4px solid var(--pc-editor-base-color);
+}
+.pc-edit-block__controls {
+  position: absolute;
+  width: calc(100% + 96px);
+  height: calc(100% + 48px);
+  top: -48px;
+  left: -48px;
+  border-radius: var(--pc-border-radius);
+  z-index: 10;
+}
+.pc-edit-block__controls_isHeader {
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+}
+.pc-edit-block__controls_reset-paddings {
+  top: 0;
+  height: 100%;
+}
+.pc-edit-block__controls-content {
+  display: flex;
+  position: absolute;
+  bottom: -40px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.pc-edit-block__control {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  border: none;
+  outline: none;
+  color: inherit;
+  background: none;
+  cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  transition: transform 0.2s;
+  width: 48px;
+  height: 32px;
+  border-radius: 8px;
+  color: var(--pc-editor-control-icon-color);
+  background-color: var(--pc-editor-control-color);
+}
+.pc-edit-block__control:hover {
+  transform: scale(1.1);
+}
+.pc-edit-block__control:not(:first-child) {
+  margin-left: 4px;
+}

package/build/esm/editor/components/EditBlock/EditBlock.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { EditBlockProps } from '../../types';
+import './EditBlock.css';
+export declare enum EditBlockControls {
+    Up = "up",
+    Down = "down",
+    Copy = "copy",
+    Delete = "delete"
+}
+export type EditBlockActions = {
+    [key in EditBlockControls]?: () => void;
+};
+declare const _default: React.MemoExoticComponent<({ actions, isActive, onSelect, isHeader, children, resetPaddings, }: EditBlockProps) => JSX.Element>;
+export default _default;

package/build/esm/editor/components/EditBlock/EditBlock.js

@@ -0,0 +1,48 @@
+import React, { useEffect, useMemo, useRef } from 'react';
+import { ChevronDown, ChevronUp, Copy as CopyIcon, TrashBin } from '@gravity-ui/icons';
+import { useActionHandlers } from '@gravity-ui/uikit';
+import { block } from '../../../utils';
+import './EditBlock.css';
+const b = block('edit-block');
+export var EditBlockControls;
+(function (EditBlockControls) {
+    EditBlockControls["Up"] = "up";
+    EditBlockControls["Down"] = "down";
+    EditBlockControls["Copy"] = "copy";
+    EditBlockControls["Delete"] = "delete";
+})(EditBlockControls || (EditBlockControls = {}));
+const actionsOrder = [
+    EditBlockControls.Up,
+    EditBlockControls.Down,
+    EditBlockControls.Copy,
+    EditBlockControls.Delete,
+];
+const editBlockControlsIcons = {
+    [EditBlockControls.Up]: ChevronUp,
+    [EditBlockControls.Down]: ChevronDown,
+    [EditBlockControls.Copy]: CopyIcon,
+    [EditBlockControls.Delete]: TrashBin,
+};
+const EditBlock = ({ actions, isActive, onSelect, isHeader, children, resetPaddings, }) => {
+    const ref = useRef(null);
+    const stopPropagationProps = useMemo(() => ({ onClick: (e) => e.stopPropagation() }), []);
+    const { onKeyDown } = useActionHandlers(onSelect);
+    useEffect(() => {
+        if (isActive && ref.current) {
+            //TODO: add behavior 'smooth' after addiiton of dynamic form layout open/close managing support
+            ref.current.scrollIntoView({ block: 'center' });
+        }
+    }, [isActive]);
+    return (React.createElement("div", { className: b({ active: isActive }), onClick: onSelect, onKeyDown: onKeyDown, ref: ref, role: "button", "aria-current": isActive, tabIndex: 0 },
+        React.createElement("div", { className: b('controls', {
+                active: isActive,
+                isHeader,
+                'reset-paddings': resetPaddings,
+            }) }, isActive && (React.createElement("div", Object.assign({ className: b('controls-content') }, stopPropagationProps), actionsOrder.map((action) => {
+            const Icon = editBlockControlsIcons[action];
+            return actions[action] ? (React.createElement("button", { key: action, className: b('control'), onClick: actions[action] },
+                React.createElement(Icon, null))) : null;
+        })))),
+        children));
+};
+export default React.memo(EditBlock);

package/build/esm/editor/components/ErrorBoundary/ErrorBoundary.css

@@ -0,0 +1,27 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+.pc-error-boundary__container {
+  display: flex;
+  width: 100%;
+  padding: 32px;
+  background-color: var(--g-color-base-background);
+  border-radius: var(--pc-border-radius);
+  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.06), 0px 4px 24px rgba(0, 0, 0, 0.06);
+}
+.pc-error-boundary__header {
+  margin-top: 0;
+}
+.pc-error-boundary__error {
+  display: block;
+  color: var(--g-color-text-danger);
+  max-height: 160px;
+  overflow: auto;
+}
+.pc-error-boundary__image {
+  flex: 0 0 auto;
+  width: 200px;
+  height: 200px;
+  background-repeat: no-repeat;
+  background-size: contain;
+  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MDAiIGhlaWdodD0iNDAwIj48c3R5bGU+LnN0MHtmaWxsOiNlY2YyZjl9LnN0MXtmaWxsOm5vbmU7c3Ryb2tlOiMyZWU1YzA7c3Ryb2tlLXdpZHRoOjQ7c3Ryb2tlLWxpbmVjYXA6cm91bmQ7c3Ryb2tlLWxpbmVqb2luOnJvdW5kO3N0cm9rZS1taXRlcmxpbWl0OjEwfS5zdDJ7ZmlsbDojMDA3Y2U5fS5zdDN7ZmlsbDojMDAyMzZifS5zdDR7ZmlsbDojMDBlNmM1fS5zdDExe2ZpbGw6I2ZmNDY0NX0uc3QxNXtmaWxsOm5vbmU7c3Ryb2tlOiMyZWU1YzA7c3Ryb2tlLXdpZHRoOjMuNzI1MjtzdHJva2UtbGluZWpvaW46cm91bmQ7c3Ryb2tlLW1pdGVybGltaXQ6MTB9LnN0MTUsLnN0MTZ7c3Ryb2tlLWxpbmVjYXA6cm91bmR9LnN0MTYsLnN0MTd7ZmlsbDpub25lO3N0cm9rZTojMDA3Y2U5O3N0cm9rZS13aWR0aDo0O3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoxMH0uc3QxOHtmaWxsOiNmYzB9PC9zdHlsZT48cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTMxLjcgMjkzLjdoMjM1LjJWMTc5LjRjMC05LjEtNy40LTE2LjUtMTYuNS0xNi41SDEzMS43djEzMC44eiIvPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xODguMyAyOTUuNEg3MS43VjU1LjJjMC0xMi41IDEwLjEtMTcuNyAyMi42LTE3LjdoOTR2MjU3Ljl6TTIzMS4zIDI0Ny4zaDg5Ljh2LTIyMGMwLTEwLjQtOC41LTE0LjgtMTguOS0xNC44aC03MC45djIzNC44eiIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0yODQuNiAxNDkuOWgxMi43YzYuOSAwIDEyLjQgNi4yIDEyLjQgMTMuN3Y1OS41TTI4NC42IDE5Ni45aDYuNGMzLjUgMCA2LjMgMi4yIDYuMyA5Ljd2NjMuNSIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0yODQuNiAxMTYuN0gzMDVjOS40IDAgMTcgNy42IDE3IDE3djkwLjEiLz48cGF0aCBjbGFzcz0ic3QxIiBkPSJNMjg0LjYgODcuNmgyNi42YzEyLjYgMCAyMi44IDEwLjIgMjIuOCAyMi44djEyMy4xTTE3Ni40IDY2LjRoMTA3Ljl2MTA3LjlIMTc2LjR6TTE3Ni40IDE3NC4zaDEwNy45djEwNy45SDE3Ni40eiIvPjxwYXRoIGNsYXNzPSJzdDE1IiBkPSJNMjIxLjkgNzkuMWg0OS40TTIyMS45IDg3LjZoMzAuOE0yMjEuOSA5Ni4yaDQ5LjQiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTAiIGN5PSI3OS4xIiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTguNiIgY3k9Ijc5LjEiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjIwNy4yIiBjeT0iNzkuMSIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTkwIiBjeT0iODcuNiIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTk4LjYiIGN5PSI4Ny42IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9Ijg3LjYiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5MCIgY3k9Ijk2LjIiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iOTYuMiIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMjA3LjIiIGN5PSI5Ni4yIiByPSIyLjEiLz48cGF0aCBjbGFzcz0ic3QxNSIgZD0iTTIyMS45IDExMS4zaDQ5LjRNMjIxLjkgMTE5LjloNDkuNE0yMjEuOSAxMjguNWg0MS40Ii8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTkwIiBjeT0iMTExLjMiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iMTExLjMiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjIwNy4yIiBjeT0iMTExLjMiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5MCIgY3k9IjExOS45IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTguNiIgY3k9IjExOS45IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9IjExOS45IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTAiIGN5PSIxMjguNSIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTk4LjYiIGN5PSIxMjguNSIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMjA3LjIiIGN5PSIxMjguNSIgcj0iMi4xIi8+PHBhdGggY2xhc3M9InN0MTUiIGQ9Ik0yMjEuOSAxNDMuNWg0OS40TTIyMS45IDE1Mi4xaDQ5LjRNMjIxLjkgMTYwLjdoNDkuNCIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5MCIgY3k9IjE0My41IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTguNiIgY3k9IjE0My41IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9IjE0My41IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTAiIGN5PSIxNTIuMSIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTk4LjYiIGN5PSIxNTIuMSIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMjA3LjIiIGN5PSIxNTIuMSIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTkwIiBjeT0iMTYwLjciIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iMTYwLjciIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjIwNy4yIiBjeT0iMTYwLjciIHI9IjIuMSIvPjxnPjxwYXRoIGNsYXNzPSJzdDE1IiBkPSJNMjIxLjkgMTg3LjRoNDkuNE0yMjEuOSAxOTUuOWgzMC44TTIyMS45IDIwNC41aDQ5LjQiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTAiIGN5PSIxODcuNCIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTk4LjYiIGN5PSIxODcuNCIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMjA3LjIiIGN5PSIxODcuNCIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTkwIiBjeT0iMTk1LjkiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iMTk1LjkiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjIwNy4yIiBjeT0iMTk1LjkiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5MCIgY3k9IjIwNC41IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTguNiIgY3k9IjIwNC41IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9IjIwNC41IiByPSIyLjEiLz48cGF0aCBjbGFzcz0ic3QxNSIgZD0iTTIyMS45IDIxOS42aDQ5LjRNMjIxLjkgMjI4LjJoNDkuNE0yMjEuOSAyMzYuOGg0MS40Ii8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTkwIiBjeT0iMjE5LjYiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iMjE5LjYiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjIwNy4yIiBjeT0iMjE5LjYiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5MCIgY3k9IjIyOC4yIiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTguNiIgY3k9IjIyOC4yIiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9IjIyOC4yIiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTAiIGN5PSIyMzYuOCIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTk4LjYiIGN5PSIyMzYuOCIgcj0iMi4xIi8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMjA3LjIiIGN5PSIyMzYuOCIgcj0iMi4xIi8+PHBhdGggY2xhc3M9InN0MTUiIGQ9Ik0yMjEuOSAyNTEuOGg0OS40TTIyMS45IDI2MC40aDQ5LjRNMjIxLjkgMjY5aDE0Ii8+PGNpcmNsZSBjbGFzcz0ic3Q0IiBjeD0iMTkwIiBjeT0iMjUxLjgiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iMjUxLjgiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjIwNy4yIiBjeT0iMjUxLjgiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5MCIgY3k9IjI2MC40IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTguNiIgY3k9IjI2MC40IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9IjI2MC40IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIxOTAiIGN5PSIyNjkiIHI9IjIuMSIvPjxjaXJjbGUgY2xhc3M9InN0NCIgY3g9IjE5OC42IiBjeT0iMjY5IiByPSIyLjEiLz48Y2lyY2xlIGNsYXNzPSJzdDQiIGN4PSIyMDcuMiIgY3k9IjI2OSIgcj0iMi4xIi8+PC9nPjxnPjxwYXRoIGNsYXNzPSJzdDMiIGQ9Ik03Mi44IDE3My4xYy03LjMgMi45LTI3LjkgMTQuNC0yNy45IDI3LjUgMCAzLjcgMi4yIDguMSAxNyA2LjIgMjcuMS0zLjUgNzcuOS0xLjggNzcuOS0xLjhsNTcuOS00LjYtMTI0LjktMjcuM3oiLz48cGF0aCBjbGFzcz0ic3QyIiBkPSJNNDcuMiAyMDQuNWw1NS4xLTcuN2MxLjQtLjIgMi42LTIuNSAyLjYtNVY3NC4zYzAtMi41LTIuNy0zLjUtNC4yLTMuMWwtNTMuNSAxOGMtMS4yLjQtMi4yIDIuNi0yLjIgNXYxMDYuNWMtLjEgMi4zLjkgNCAyLjIgMy44eiIvPjxwYXRoIGNsYXNzPSJzdDMiIGQ9Ik0xOTcuOCAyMDAuM2wtOTUuNS0zLjdjLTIuNS0uMS00LjUtMi4yLTQuNS00LjZWNzVjMC0yLjUgMi00LjIgNC41LTMuOUwxOTcuOCA4M2MyLjEuMyAzLjkgMi4zIDMuOSA0LjZ2MTA4LjhjMCAyLjItMS43IDQtMy45IDMuOXoiLz48cGF0aCBjbGFzcz0ic3QxNyIgZD0iTTk3LjkgMTEyLjZsMTAzLjggMTAuNSIvPjxwYXRoIGNsYXNzPSJzdDE2IiBkPSJNMTEzLjMgODUuNmw3NS45IDkuMU0xMTMuMyAxMzAuNWw3NS45IDcuMU0xMTMuMyAxNzIuN2w3NS45IDQuMiIvPjxwYXRoIGNsYXNzPSJzdDE3IiBkPSJNOTYuMSAxNTUuNmwxMDUuNiA3LjJNOTYuMSAxOTUuM2wxMDUuNiAzLjYiLz48L2c+PGc+PHBhdGggY2xhc3M9InN0MiIgZD0iTTQ3LjIgMzI0LjZsNTUuNCA2LjFjMS40LjEgMi42LTEuOSAyLjYtNC40VjIwNS41YzAtMi41LTEuMi00LjUtMi42LTQuNGwtNTUuNCA3LjRjLTEuMi4xLTIuMyAyLjEtMi4zIDQuNHYxMDcuMmMwIDIuNCAxIDQuNCAyLjMgNC41eiIvPjxwYXRoIGNsYXNzPSJzdDMiIGQ9Ik0xOTguOCAzMjYuNWwtOTYuMSA0LjJjLTIuNS4xLTQuNS0xLjktNC41LTQuNFYyMDUuNWMwLTIuNSAyLTQuNSA0LjUtNC40bDk2LjEgNC4yYzIuMi4xIDMuOSAyLjEgMy45IDQuNFYzMjJjLjEgMi40LTEuNyA0LjQtMy45IDQuNXoiLz48cGF0aCBjbGFzcz0ic3QxNyIgZD0iTTk4LjIgMjQ0LjNsMTA0LjYgMi4xTTk2LjQgMjg4LjlsMTA2LjQtMS41Ii8+PHBhdGggY2xhc3M9InN0MTYiIGQ9Ik0xMTMuMyAyMTQuN2w3Ni4xIDNNMTEzLjMgMjU5LjZsNzYuMS45TTExMy4zIDMwMS43bDc2LjEtMiIvPjwvZz48Zz48cGF0aCBjbGFzcz0ic3QyIiBkPSJNMTUxIDMzNi40bDcwIDcuN2MxLjguMSAzLjMtMi40IDMuMy01LjZWMTg2YzAtMy4yLTEuNS01LjctMy4zLTUuNmwtNzAgOS4zYy0xLjYuMS0yLjggMi42LTIuOCA1LjZ2MTM1LjRjMCAzLjEgMS4zIDUuNiAyLjggNS43eiIvPjxwYXRoIGNsYXNzPSJzdDMiIGQ9Ik0zNDIuNSAzMzguOGwtMTIxLjMgNS4zYy0zLjEuMS01LjctMi40LTUuNy01LjZWMTg2YzAtMy4yIDIuNS01LjcgNS43LTUuNmwxMjEuMyA1LjNjMi43LjEgNC45IDIuNiA0LjkgNS42djE0MS44YzAgMy4xLTIuMiA1LjYtNC45IDUuN3oiLz48cGF0aCBjbGFzcz0ic3QxNyIgZD0iTTIxNS41IDIzNS4xbDEzMS45IDIuNk0yMTMuMiAyOTEuM2wxMzQuMi0xLjgiLz48cGF0aCBjbGFzcz0ic3QxMSIgZD0iTTIzNC4zIDE5OC40YzAgMS44LTEuMyAzLjMtMyAzLjItMS43LS4xLTMtMS43LTMtMy41czEuNC0zLjMgMy0zLjJjMS42LjEgMyAxLjcgMyAzLjV6Ii8+PHBhdGggY2xhc3M9InN0MTgiIGQ9Ik0yNDggMTk5LjJjMCAxLjgtMS4zIDMuMi0zIDMuMi0xLjYtLjEtMy0xLjYtMy0zLjVzMS4zLTMuMyAzLTMuMmMxLjcuMSAzIDEuNiAzIDMuNXpNMjYxLjQgMTk5LjljMCAxLjgtMS4zIDMuMi0yLjkgMy4xLTEuNi0uMS0yLjktMS42LTIuOS0zLjQgMC0xLjggMS4zLTMuMiAyLjktMy4xIDEuNi4xIDIuOSAxLjYgMi45IDMuNHoiLz48cGF0aCBjbGFzcz0ic3QyIiBkPSJNMjc0LjYgMjAwLjZjMCAxLjgtMS4zIDMuMi0yLjggMy4xLTEuNi0uMS0yLjgtMS42LTIuOC0zLjRzMS4zLTMuMiAyLjgtMy4xYzEuNS4xIDIuOCAxLjYgMi44IDMuNHpNMjg3LjUgMjAxLjNjMCAxLjgtMS4yIDMuMi0yLjggMy4xLTEuNS0uMS0yLjgtMS42LTIuOC0zLjRzMS4zLTMuMiAyLjgtMy4xYzEuNS4yIDIuOCAxLjcgMi44IDMuNHpNMzAwLjEgMjAyYzAgMS44LTEuMiAzLjEtMi43IDMtMS41LS4xLTIuNy0xLjYtMi43LTMuMyAwLTEuOCAxLjItMy4xIDIuNy0zIDEuNS4xIDIuNyAxLjYgMi43IDMuM3pNMzEyLjUgMjAyLjdjMCAxLjctMS4yIDMuMS0yLjcgMy0xLjUtLjEtMi43LTEuNi0yLjctMy4zIDAtMS44IDEuMi0zLjEgMi43LTMgMS41LjEgMi43IDEuNiAyLjcgMy4zek0zMjQuNyAyMDMuNGMwIDEuNy0xLjIgMy4xLTIuNiAzLTEuNS0uMS0yLjYtMS41LTIuNi0zLjMgMC0xLjcgMS4yLTMuMSAyLjYtMyAxLjQuMSAyLjYgMS42IDIuNiAzLjN6TTMzNi42IDIwNC4xYzAgMS43LTEuMiAzLTIuNiAzLTEuNC0uMS0yLjYtMS41LTIuNi0zLjIgMC0xLjcgMS4yLTMgMi42LTMgMS41IDAgMi42IDEuNCAyLjYgMy4yeiIvPjxnPjxwYXRoIGNsYXNzPSJzdDExIiBkPSJNMjM0LjMgMjUzLjhjMCAxLjgtMS4zIDMuMy0zIDMuM3MtMy0xLjUtMy0zLjQgMS40LTMuMyAzLTMuMyAzIDEuNSAzIDMuNHpNMjQ4IDI1My45YzAgMS44LTEuMyAzLjMtMyAzLjMtMS42IDAtMy0xLjUtMy0zLjRzMS4zLTMuMyAzLTMuM2MxLjcuMSAzIDEuNiAzIDMuNHoiLz48cGF0aCBjbGFzcz0ic3QxOCIgZD0iTTI2MS40IDI1NC4xYzAgMS44LTEuMyAzLjMtMi45IDMuMi0xLjYgMC0yLjktMS41LTIuOS0zLjNzMS4zLTMuMyAyLjktMy4yYzEuNiAwIDIuOSAxLjUgMi45IDMuM3pNMjc0LjYgMjU0LjNjMCAxLjgtMS4zIDMuMi0yLjggMy4yLTEuNiAwLTIuOC0xLjUtMi44LTMuM3MxLjMtMy4yIDIuOC0zLjJjMS41LjEgMi44IDEuNSAyLjggMy4zek0yODcuNSAyNTQuNWMwIDEuOC0xLjIgMy4yLTIuOCAzLjItMS41IDAtMi44LTEuNS0yLjgtMy4zczEuMy0zLjIgMi44LTMuMmMxLjUuMSAyLjggMS41IDIuOCAzLjN6Ii8+PHBhdGggY2xhc3M9InN0MiIgZD0iTTMwMC4xIDI1NC43YzAgMS44LTEuMiAzLjItMi43IDMuMi0xLjUgMC0yLjctMS41LTIuNy0zLjIgMC0xLjggMS4yLTMuMiAyLjctMy4yIDEuNSAwIDIuNyAxLjQgMi43IDMuMnpNMzEyLjUgMjU0LjljMCAxLjctMS4yIDMuMS0yLjcgMy4xLTEuNSAwLTIuNy0xLjQtMi43LTMuMnMxLjItMy4xIDIuNy0zLjFjMS41IDAgMi43IDEuNCAyLjcgMy4yek0zMjQuNyAyNTVjMCAxLjctMS4yIDMuMS0yLjYgMy4xLTEuNSAwLTIuNi0xLjQtMi42LTMuMiAwLTEuNyAxLjItMy4xIDIuNi0zLjEgMS40LjEgMi42IDEuNSAyLjYgMy4yek0zMzYuNiAyNTUuMmMwIDEuNy0xLjIgMy4xLTIuNiAzLjEtMS40IDAtMi42LTEuNC0yLjYtMy4xIDAtMS43IDEuMi0zLjEgMi42LTMuMSAxLjUgMCAyLjYgMS40IDIuNiAzLjF6Ii8+PC9nPjxnPjxwYXRoIGNsYXNzPSJzdDExIiBkPSJNMjM0LjMgMzA5LjFjMCAxLjgtMS4zIDMuNC0zIDMuNHMtMy0xLjQtMy0zLjMgMS40LTMuNCAzLTMuNCAzIDEuNCAzIDMuM3oiLz48cGF0aCBjbGFzcz0ic3QxOCIgZD0iTTI0OCAzMDguN2MwIDEuOC0xLjMgMy40LTMgMy40LTEuNiAwLTMtMS40LTMtMy4yIDAtMS44IDEuMy0zLjQgMy0zLjQgMS43LS4xIDMgMS40IDMgMy4yek0yNjEuNCAzMDguNGMwIDEuOC0xLjMgMy4zLTIuOSAzLjQtMS42IDAtMi45LTEuNC0yLjktMy4yIDAtMS44IDEuMy0zLjMgMi45LTMuNCAxLjYtLjEgMi45IDEuNCAyLjkgMy4yek0yNzQuNiAzMDhjMCAxLjgtMS4zIDMuMy0yLjggMy4zLTEuNiAwLTIuOC0xLjQtMi44LTMuMnMxLjMtMy4zIDIuOC0zLjNjMS41IDAgMi44IDEuNCAyLjggMy4yeiIvPjxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yODcuNSAzMDcuN2MwIDEuOC0xLjIgMy4zLTIuOCAzLjMtMS41IDAtMi44LTEuNC0yLjgtMy4xIDAtMS44IDEuMy0zLjMgMi44LTMuMyAxLjUtLjEgMi44IDEuMyAyLjggMy4xek0zMDAuMSAzMDcuM2MwIDEuOC0xLjIgMy4yLTIuNyAzLjMtMS41IDAtMi43LTEuNC0yLjctMy4xIDAtMS44IDEuMi0zLjIgMi43LTMuMyAxLjUgMCAyLjcgMS40IDIuNyAzLjF6TTMxMi41IDMwN2MwIDEuNy0xLjIgMy4yLTIuNyAzLjItMS41IDAtMi43LTEuMy0yLjctMy4xczEuMi0zLjIgMi43LTMuMmMxLjUgMCAyLjcgMS40IDIuNyAzLjF6TTMyNC43IDMwNi43YzAgMS43LTEuMiAzLjItMi42IDMuMi0xLjUgMC0yLjYtMS4zLTIuNi0zLjFzMS4yLTMuMiAyLjYtMy4yYzEuNCAwIDIuNiAxLjMgMi42IDMuMXpNMzM2LjYgMzA2LjNjMCAxLjctMS4yIDMuMS0yLjYgMy4yLTEuNCAwLTIuNi0xLjMtMi42LTNzMS4yLTMuMSAyLjYtMy4yYzEuNSAwIDIuNiAxLjMgMi42IDN6Ii8+PC9nPjwvZz48Zz48cGF0aCBjbGFzcz0ic3QzIiBkPSJNNTkuNCAxMDNjMCAxLjggMS40IDMuMiAzLjEgMi45IDEuNy0uMiAzLjEtMS45IDMuMS0zLjhzLTEuNC0zLjItMy4xLTIuOWMtMS43LjItMy4xIDEuOS0zLjEgMy44ek01OS40IDE0MC41YzAgMS44IDEuNCAzLjIgMy4xIDIuOSAxLjctLjIgMy4xLTEuOSAzLjEtMy44cy0xLjQtMy4yLTMuMS0yLjljLTEuNy4zLTMuMSAyLTMuMSAzLjh6TTU5LjQgMTc4LjFjMCAxLjggMS40IDMuMiAzLjEgMi45IDEuNy0uMiAzLjEtMS45IDMuMS0zLjhzLTEuNC0zLjItMy4xLTIuOWMtMS43LjMtMy4xIDItMy4xIDMuOHoiLz48L2c+PGc+PHBhdGggY2xhc3M9InN0MyIgZD0iTTU5LjQgMjI4LjdjMCAxLjggMS40IDMuMiAzLjEgMi45IDEuNy0uMiAzLjEtMS45IDMuMS0zLjhzLTEuNC0zLjItMy4xLTIuOWMtMS43LjMtMy4xIDItMy4xIDMuOHpNNTkuNCAyNjYuM2MwIDEuOCAxLjQgMy4yIDMuMSAyLjkgMS43LS4yIDMuMS0xLjkgMy4xLTMuOHMtMS40LTMuMi0zLjEtMi45Yy0xLjcuMy0zLjEgMi0zLjEgMy44ek01OS40IDMwMy45YzAgMS44IDEuNCAzLjIgMy4xIDIuOSAxLjctLjIgMy4xLTEuOSAzLjEtMy44cy0xLjQtMy4yLTMuMS0yLjljLTEuNy4zLTMuMSAxLjktMy4xIDMuOHoiLz48L2c+PGc+PHBhdGggY2xhc3M9InN0MyIgZD0iTTE2Mi4zIDIxMy44YzAgMi40IDEuOCA0LjEgNCAzLjggMi4yLS4zIDQuMS0yLjUgNC4xLTQuOXMtMS44LTQuMS00LjEtMy44Yy0yLjIuMy00IDIuNS00IDQuOXpNMTYyLjMgMjYzLjFjMCAyLjQgMS44IDQuMSA0IDMuOCAyLjItLjMgNC4xLTIuNSA0LjEtNC45cy0xLjgtNC4xLTQuMS0zLjhjLTIuMi4zLTQgMi41LTQgNC45ek0xNjIuMyAzMTIuNGMwIDIuNCAxLjggNC4xIDQgMy44IDIuMi0uMyA0LjEtMi41IDQuMS00LjkgMC0yLjQtMS44LTQuMS00LjEtMy44LTIuMi4zLTQgMi41LTQgNC45eiIvPjwvZz48Zz48cGF0aCBjbGFzcz0ic3QxIiBkPSJNNjEuNyAxMDIuNmwtMjItMS43Yy0zLjktLjMtNy4yIDIuOC03LjIgNi43djIwNi41Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTYxLjcgMTQwLjFsLTIyLTEuN2MtMy45LS4zLTcuMiAyLjgtNy4yIDYuN3Y5MS44Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTYxLjcgMTc3LjlsLTIyLS44Yy0zLjktLjMtNy4yIDIuOC03LjIgNi43djc2LjEiLz48cGF0aCBjbGFzcz0ic3QxIiBkPSJNNjEuNyAyMjcuOWwtMjIgLjFjLTMuOS0uMy03LjIgMi44LTcuMiA2Ljd2NzYuMSIvPjxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik02MS43IDI2NS44bC0yMiAuMWMtMy45LS4zLTcuMiAyLjgtNy4yIDYuN3Y0OC45Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTYxLjcgMzAzLjdsLTIyIC4xYy0zLjktLjMtNy4yIDIuOC03LjIgNi43djE2Ii8+PHBhdGggY2xhc3M9InN0MSIgZD0iTTMyLjUgMzI0LjF2NS43YzAgMy4zLjIgNi41IDMuMSA3LjIgMi44LjcgODMuOCAxMy41IDkwLjUgMTQuNCA2LjcuOSA4LjYtMi40IDguNi01LjlWMjIzLjljMC01LjggNC43LTEwLjUgMTAuNS0xMC42bDIwLjMtLjIiLz48cGF0aCBjbGFzcz0ic3QxIiBkPSJNMTM0LjYgMzAyLjZ2LTI5LjJjMC01LjggNC43LTEwLjUgMTAuNS0xMC42bDIwLjMtLjJNMTM0LjYgMzM4LjJWMzIzYzAtNS44IDQuNy0xMC41IDEwLjUtMTAuNmwyMC4zLS4yIi8+PC9nPjwvc3ZnPgo=");
+}

package/build/esm/editor/components/ErrorBoundary/ErrorBoundary.d.ts

@@ -0,0 +1,14 @@
+import React, { ErrorInfo, PropsWithChildren } from 'react';
+import { BlockDecorationProps } from '../../../models';
+import './ErrorBoundary.css';
+interface ErrorBoundaryProps extends PropsWithChildren, Partial<BlockDecorationProps> {
+}
+interface ErrorBoundaryState {
+    error?: string;
+}
+export declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    state: ErrorBoundaryState;
+    componentDidCatch(error: Error, info: ErrorInfo): void;
+    render(): string | number | boolean | React.ReactFragment | JSX.Element | null | undefined;
+}
+export {};

package/build/esm/editor/components/ErrorBoundary/ErrorBoundary.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { block } from '../../../utils';
+import { getBlockId } from '../../utils';
+import { i18n } from './i18n';
+import './ErrorBoundary.css';
+const b = block('error-boundary');
+export class ErrorBoundary extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.state = {};
+    }
+    componentDidCatch(error, info) {
+        this.setState({ error: `${error.message} ${info === null || info === void 0 ? void 0 : info.componentStack}` });
+    }
+    render() {
+        const { type, index } = this.props;
+        const { error } = this.state;
+        const header = type
+            ? i18n('error-block-header', { id: getBlockId({ type, index }) })
+            : i18n('error-page-header');
+        if (this.state.error) {
+            return (React.createElement("div", { className: b() },
+                React.createElement("div", { className: b('container') },
+                    React.createElement("div", { className: b('image') }),
+                    React.createElement("div", { className: b('content') },
+                        React.createElement("h2", { className: b('header') }, header),
+                        React.createElement("code", { className: b('error') }, error)))));
+        }
+        return this.props.children;
+    }
+}

package/build/esm/editor/components/ErrorBoundary/i18n/en.json

@@ -0,0 +1,4 @@
+{
+  "error-block-header": "An error occurred in {{id}}",
+  "error-page-header": "An error occurred"
+}

package/build/esm/editor/components/ErrorBoundary/i18n/index.d.ts

@@ -0,0 +1 @@
+export declare const i18n: (key: "error-block-header" | "error-page-header", params?: import("@gravity-ui/i18n").Params | undefined) => string;

package/build/esm/editor/components/ErrorBoundary/i18n/index.js

@@ -0,0 +1,5 @@
+import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
+import { NAMESPACE } from '../../../../utils/cn';
+import en from './en.json';
+import ru from './ru.json';
+export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}ErrorBoundary`);

package/build/esm/editor/components/ErrorBoundary/i18n/ru.json

@@ -0,0 +1,4 @@
+{
+  "error-block-header": "Ошибка в блоке {{id}}",
+  "error-page-header": "Ошибка"
+}

package/build/esm/editor/components/Layout/Layout.css

@@ -0,0 +1,50 @@
+/* use this for style redefinitions to awoid problems with
+unpredictable css rules order in build */
+body {
+  --pc-editor-header-height: 48px;
+  --pc-editor-code-header-height: 36px;
+  --pc-editor-divider-width: 12px;
+  --pc-editor-left-column-width: calc(400px + var(--pc-editor-divider-width));
+  --pc-editor-base-color: var(--g-color-base-brand);
+  --pc-editor-control-color: var(--g-color-base-brand);
+  --pc-editor-control-icon-color: var(--g-color-text-dark-primary);
+}
+
+.pc-editor-layout__left, .pc-editor-layout__right {
+  --g-scrollbar-width: 0;
+  height: calc(100vh - var(--pc-editor-header-height));
+  max-height: calc(100vh - var(--pc-editor-header-height));
+  overflow-y: auto;
+}
+
+.pc-editor-layout {
+  position: relative;
+}
+.pc-editor-layout__container {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  z-index: 1;
+}
+.pc-editor-layout__left {
+  flex: 0 0 auto;
+  padding: 24px;
+  width: var(--pc-editor-left-column-width);
+  border-right: var(--pc-editor-divider-width) solid var(--g-color-line-generic);
+  overflow-x: auto;
+}
+.pc-editor-layout__left_closed {
+  display: none;
+}
+.pc-editor-layout__right {
+  position: relative;
+  width: 100%;
+}
+.pc-editor-layout__right_editing {
+  padding-bottom: 200px;
+}
+.pc-editor-layout__arrow-toggle {
+  padding: 12px;
+  cursor: pointer;
+  border-right: 1px solid var(--g-color-line-generic);
+}

package/build/esm/editor/components/Layout/Layout.d.ts

@@ -0,0 +1,17 @@
+import React, { PropsWithChildren } from 'react';
+import { EditModeItem, ViewModeItem } from '../../types';
+import './Layout.css';
+export interface LayoutProps {
+    editMode: EditModeItem;
+    viewMode: ViewModeItem;
+}
+declare const Layout: {
+    ({ children, editMode, viewMode }: PropsWithChildren<LayoutProps>): JSX.Element;
+    Left: React.FC<{
+        children?: React.ReactNode;
+    }>;
+    Right: React.FC<{
+        children?: React.ReactNode;
+    }>;
+};
+export default Layout;

package/build/esm/editor/components/Layout/Layout.js

@@ -0,0 +1,34 @@
+import React, { Children, Fragment } from 'react';
+import { block } from '../../../utils';
+import { EditModeItem } from '../../types';
+import DeviceEmulation from '../DeviceEmulation/DeviceEmulation';
+import './Layout.css';
+const b = block('editor-layout');
+const Left = () => null;
+const Right = () => null;
+// TODO in https://github.com/gravity-ui/page-constructor/issues/884 this component will be disappeared
+const Layout = ({ children, editMode, viewMode }) => {
+    let left, right;
+    const isEditingMode = editMode === EditModeItem.Form;
+    function handleChild(child) {
+        switch (child === null || child === void 0 ? void 0 : child.type) {
+            case Left:
+                left = child === null || child === void 0 ? void 0 : child.props.children;
+                break;
+            case Right:
+                right = child === null || child === void 0 ? void 0 : child.props.children;
+                break;
+        }
+    }
+    if (React.Children.toArray(children).length) {
+        Children.forEach(children, handleChild);
+    }
+    return (React.createElement("div", { className: b('container') },
+        React.createElement(Fragment, null,
+            left && React.createElement("div", { className: b('left') }, left),
+            right && (React.createElement("div", { className: b('right', { editing: isEditingMode }) },
+                React.createElement(DeviceEmulation, { mode: viewMode }, right))))));
+};
+Layout.Left = Left;
+Layout.Right = Right;
+export default Layout;