cakeinpanic-ui 1.0.0

package/dist/cjs/loaders/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.js","sources":["../../../src/loaders/Loader.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef } from 'react'\nimport { LoaderProps, LoaderSize } from './types.js'\nimport {\n  LoaderStyle,\n  LoaderCircleBgStyle,\n  LoaderCircleFgStyle,\n} from './LoaderStyles.js'\n\nexport const Loader = forwardRef(\n  (\n    { size = 'medium', thickness = 3, color = 'primary', ...rest }: LoaderProps,\n    ref?: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const pxSize = LoaderSize[size]\n    const center = pxSize / 2\n    const radius = pxSize / 2 - thickness / 2\n\n    return (\n      <LoaderStyle $size={pxSize} $color={color} {...rest} ref={ref}>\n        <svg width={pxSize} height={pxSize} viewBox={`0 0 ${pxSize} ${pxSize}`}>\n          <LoaderCircleBgStyle\n            $thickness={thickness}\n            cx={center}\n            cy={center}\n            r={radius}\n          />\n          <LoaderCircleFgStyle\n            $thickness={thickness}\n            cx={center}\n            cy={center}\n            r={radius}\n          />\n        </svg>\n      </LoaderStyle>\n    )\n  },\n)\nLoader.displayName = 'Loader'\n"],"names":["Loader","forwardRef","_ref","ref","size","thickness","color","rest","pxSize","LoaderSize","center","radius","_jsx","LoaderStyle","$size","$color","children","_jsxs","width","height","viewBox","LoaderCircleBgStyle","$thickness","cx","cy","r","LoaderCircleFgStyle","displayName"],"mappings":";;;;;;;;;AAQO,MAAMA,MAAM,gBAAGC,gBAAU,CAC9B,CAAAC,IAAA,EAEEC,GAAkC,KAC/B;EAAA,IAFH;AAAEC,IAAAA,IAAI,GAAG,QAAQ;AAAEC,IAAAA,SAAS,GAAG,CAAC;AAAEC,IAAAA,KAAK,GAAG,SAAS;IAAE,GAAGC,IAAAA;AAAkB,GAAC,GAAAL,IAAA,CAAA;AAG3E,EAAA,MAAMM,MAAM,GAAGC,gBAAU,CAACL,IAAI,CAAC,CAAA;AAC/B,EAAA,MAAMM,MAAM,GAAGF,MAAM,GAAG,CAAC,CAAA;EACzB,MAAMG,MAAM,GAAGH,MAAM,GAAG,CAAC,GAAGH,SAAS,GAAG,CAAC,CAAA;EAEzC,oBACEO,cAAA,CAACC,wBAAW,EAAA;AAACC,IAAAA,KAAK,EAAEN,MAAO;AAACO,IAAAA,MAAM,EAAET,KAAM;AAAA,IAAA,GAAKC,IAAI;AAAEJ,IAAAA,GAAG,EAAEA,GAAI;AAAAa,IAAAA,QAAA,eAC5DC,eAAA,CAAA,KAAA,EAAA;AAAKC,MAAAA,KAAK,EAAEV,MAAO;AAACW,MAAAA,MAAM,EAAEX,MAAO;AAACY,MAAAA,OAAO,EAAE,CAAA,IAAA,EAAOZ,MAAM,CAAA,CAAA,EAAIA,MAAM,CAAG,CAAA;MAAAQ,QAAA,EAAA,cACrEJ,cAAA,CAACS,gCAAmB,EAAA;AAClBC,QAAAA,UAAU,EAAEjB,SAAU;AACtBkB,QAAAA,EAAE,EAAEb,MAAO;AACXc,QAAAA,EAAE,EAAEd,MAAO;AACXe,QAAAA,CAAC,EAAEd,MAAAA;AAAO,OACX,CAAC,eACFC,cAAA,CAACc,gCAAmB,EAAA;AAClBJ,QAAAA,UAAU,EAAEjB,SAAU;AACtBkB,QAAAA,EAAE,EAAEb,MAAO;AACXc,QAAAA,EAAE,EAAEd,MAAO;AACXe,QAAAA,CAAC,EAAEd,MAAAA;AAAO,OACX,CAAC,CAAA;KACC,CAAA;AAAC,GACK,CAAC,CAAA;AAElB,CACF,EAAC;AACDX,MAAM,CAAC2B,WAAW,GAAG,QAAQ;;;;"}

package/dist/cjs/loaders/LoaderStyles.js

@@ -0,0 +1,54 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponentsWrapper = require('../utils/styled-components-wrapper.js');
+const _styled = require('styled-components');
+
+const rotation = _styled.keyframes`
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+`;
+const LoaderStyle = styledComponentsWrapper.default.div`
+  margin: 0;
+  padding: 0;
+  line-height: 0;
+  width: ${props => props.$size}px;
+  height: ${props => props.$size}px;
+  color: ${_ref => {
+  let {
+    $color
+  } = _ref;
+  return `var(--lido-color-${$color})`;
+}};
+`;
+const LoaderCircleBgStyle = styledComponentsWrapper.default.circle`
+  fill: none;
+  stroke: currentcolor;
+  stroke-width: ${props => props.$thickness};
+  opacity: 0.2;
+`;
+const LoaderCircleFgStyle = styledComponentsWrapper.default.circle`
+  fill: none;
+  stroke: currentcolor;
+  stroke-linecap: round;
+  stroke-width: ${props => props.$thickness};
+  stroke-dasharray: ${props => {
+  const circumference = 2 * props.r * Math.PI;
+  const filledPart = 0.25;
+  return `${circumference * filledPart} ${circumference * (1 - filledPart)}`;
+}};
+  transform: rotate(0deg);
+  transform-origin: 50% 50%;
+  animation: ${rotation} 1.4s linear infinite;
+`;
+
+exports.LoaderCircleBgStyle = LoaderCircleBgStyle;
+exports.LoaderCircleFgStyle = LoaderCircleFgStyle;
+exports.LoaderStyle = LoaderStyle;
+exports.rotation = rotation;
+//# sourceMappingURL=LoaderStyles.js.map

package/dist/cjs/loaders/LoaderStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoaderStyles.js","sources":["../../../src/loaders/LoaderStyles.tsx"],"sourcesContent":["import styled, { keyframes } from '../utils/styled-components-wrapper.js'\nimport { LoaderColors } from './types.js'\n\nexport const rotation = keyframes`\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n`\n\nexport const LoaderStyle = styled.div<{\n  $size: number\n  $color: LoaderColors\n}>`\n  margin: 0;\n  padding: 0;\n  line-height: 0;\n  width: ${(props) => props.$size}px;\n  height: ${(props) => props.$size}px;\n  color: ${({ $color }) => `var(--lido-color-${$color})`};\n`\n\nexport const LoaderCircleBgStyle = styled.circle<{ $thickness: number }>`\n  fill: none;\n  stroke: currentcolor;\n  stroke-width: ${(props) => props.$thickness};\n  opacity: 0.2;\n`\n\nexport const LoaderCircleFgStyle = styled.circle<{\n  $thickness: number\n  r: number\n}>`\n  fill: none;\n  stroke: currentcolor;\n  stroke-linecap: round;\n  stroke-width: ${(props) => props.$thickness};\n  stroke-dasharray: ${(props) => {\n    const circumference = 2 * props.r * Math.PI\n    const filledPart = 0.25\n\n    return `${circumference * filledPart} ${circumference * (1 - filledPart)}`\n  }};\n  transform: rotate(0deg);\n  transform-origin: 50% 50%;\n  animation: ${rotation} 1.4s linear infinite;\n`\n"],"names":["rotation","keyframes","LoaderStyle","styled","div","props","$size","_ref","$color","LoaderCircleBgStyle","circle","$thickness","LoaderCircleFgStyle","circumference","r","Math","PI","filledPart"],"mappings":";;;;;;;AAGO,MAAMA,QAAQ,GAAGC,iBAAS,CAAA;AACjC;AACA;AACA;AACA;AACA;AACA;AACA,EAAC;AAEYC,MAAAA,WAAW,GAAGC,+BAAM,CAACC,GAGhC,CAAA;AACF;AACA;AACA;AACA,SAAA,EAAYC,KAAK,IAAKA,KAAK,CAACC,KAAK,CAAA;AACjC,UAAA,EAAaD,KAAK,IAAKA,KAAK,CAACC,KAAK,CAAA;AAClC,SAAA,EAAWC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,MAAAA;AAAO,GAAC,GAAAD,IAAA,CAAA;EAAA,OAAK,CAAA,iBAAA,EAAoBC,MAAM,CAAG,CAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AACxD,EAAC;AAEYC,MAAAA,mBAAmB,GAAGN,+BAAM,CAACO,MAA8B,CAAA;AACxE;AACA;AACA,gBAAA,EAAmBL,KAAK,IAAKA,KAAK,CAACM,UAAU,CAAA;AAC7C;AACA,EAAC;AAEYC,MAAAA,mBAAmB,GAAGT,+BAAM,CAACO,MAGxC,CAAA;AACF;AACA;AACA;AACA,gBAAA,EAAmBL,KAAK,IAAKA,KAAK,CAACM,UAAU,CAAA;AAC7C,oBAAA,EAAuBN,KAAK,IAAK;EAC7B,MAAMQ,aAAa,GAAG,CAAC,GAAGR,KAAK,CAACS,CAAC,GAAGC,IAAI,CAACC,EAAE,CAAA;EAC3C,MAAMC,UAAU,GAAG,IAAI,CAAA;EAEvB,OAAO,CAAA,EAAGJ,aAAa,GAAGI,UAAU,CAAA,CAAA,EAAIJ,aAAa,IAAI,CAAC,GAAGI,UAAU,CAAC,CAAE,CAAA,CAAA;AAC5E,CAAC,CAAA;AACH;AACA;AACA,aAAA,EAAejB,QAAQ,CAAA;AACvB;;;;;;;"}

package/dist/cjs/loaders/types.js

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+let LoaderSize = /*#__PURE__*/function (LoaderSize) {
+  LoaderSize[LoaderSize["small"] = 18] = "small";
+  LoaderSize[LoaderSize["medium"] = 24] = "medium";
+  LoaderSize[LoaderSize["large"] = 64] = "large";
+  return LoaderSize;
+}({});
+let LoaderColor = /*#__PURE__*/function (LoaderColor) {
+  LoaderColor[LoaderColor["primary"] = 0] = "primary";
+  LoaderColor[LoaderColor["secondary"] = 1] = "secondary";
+  LoaderColor[LoaderColor["foreground"] = 2] = "foreground";
+  LoaderColor[LoaderColor["success"] = 3] = "success";
+  return LoaderColor;
+}({});
+let InlineLoaderColor = /*#__PURE__*/function (InlineLoaderColor) {
+  InlineLoaderColor[InlineLoaderColor["text"] = 0] = "text";
+  InlineLoaderColor[InlineLoaderColor["secondary"] = 1] = "secondary";
+  InlineLoaderColor[InlineLoaderColor["foreground"] = 2] = "foreground";
+  return InlineLoaderColor;
+}({});
+
+exports.InlineLoaderColor = InlineLoaderColor;
+exports.LoaderColor = LoaderColor;
+exports.LoaderSize = LoaderSize;
+//# sourceMappingURL=types.js.map

package/dist/cjs/loaders/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../src/loaders/types.ts"],"sourcesContent":["import { LidoComponentProps } from '../utils/index.js'\nexport type { Theme } from '../theme/index.js'\n\nexport enum LoaderSize {\n  small = 18,\n  medium = 24,\n  large = 64,\n}\nexport type LoaderSizes = keyof typeof LoaderSize\n\nexport enum LoaderColor {\n  primary,\n  secondary,\n  foreground,\n  success,\n}\nexport type LoaderColors = keyof typeof LoaderColor\n\nexport type LoaderProps = LidoComponentProps<\n  'div',\n  {\n    size?: LoaderSizes\n    color?: LoaderColors\n    thickness?: number\n  }\n>\n\nexport enum InlineLoaderColor {\n  text,\n  secondary,\n  foreground,\n}\nexport type InlineLoaderColors = keyof typeof InlineLoaderColor\nexport type InlineLoaderProps = LidoComponentProps<\n  'div',\n  {\n    color?: InlineLoaderColors\n  }\n>\n"],"names":["LoaderSize","LoaderColor","InlineLoaderColor"],"mappings":";;;;AAGYA,IAAAA,UAAU,0BAAVA,UAAU,EAAA;AAAVA,EAAAA,UAAU,CAAVA,UAAU,CAAA,OAAA,CAAA,GAAA,EAAA,CAAA,GAAA,OAAA,CAAA;AAAVA,EAAAA,UAAU,CAAVA,UAAU,CAAA,QAAA,CAAA,GAAA,EAAA,CAAA,GAAA,QAAA,CAAA;AAAVA,EAAAA,UAAU,CAAVA,UAAU,CAAA,OAAA,CAAA,GAAA,EAAA,CAAA,GAAA,OAAA,CAAA;AAAA,EAAA,OAAVA,UAAU,CAAA;AAAA,CAAA,CAAA,EAAA,EAAA;AAOVC,IAAAA,WAAW,0BAAXA,WAAW,EAAA;AAAXA,EAAAA,WAAW,CAAXA,WAAW,CAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,SAAA,CAAA;AAAXA,EAAAA,WAAW,CAAXA,WAAW,CAAA,WAAA,CAAA,GAAA,CAAA,CAAA,GAAA,WAAA,CAAA;AAAXA,EAAAA,WAAW,CAAXA,WAAW,CAAA,YAAA,CAAA,GAAA,CAAA,CAAA,GAAA,YAAA,CAAA;AAAXA,EAAAA,WAAW,CAAXA,WAAW,CAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,SAAA,CAAA;AAAA,EAAA,OAAXA,WAAW,CAAA;AAAA,CAAA,CAAA,EAAA,EAAA;AAiBXC,IAAAA,iBAAiB,0BAAjBA,iBAAiB,EAAA;AAAjBA,EAAAA,iBAAiB,CAAjBA,iBAAiB,CAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,MAAA,CAAA;AAAjBA,EAAAA,iBAAiB,CAAjBA,iBAAiB,CAAA,WAAA,CAAA,GAAA,CAAA,CAAA,GAAA,WAAA,CAAA;AAAjBA,EAAAA,iBAAiB,CAAjBA,iBAAiB,CAAA,YAAA,CAAA,GAAA,CAAA,CAAA,GAAA,YAAA,CAAA;AAAA,EAAA,OAAjBA,iBAAiB,CAAA;AAAA,CAAA,CAAA,EAAA;;;;;;"}

package/dist/cjs/main-menu/MainMenu.js

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const MainMenuStyles = require('./MainMenuStyles.js');
+const jsxRuntime = require('react/jsx-runtime');
+
+const MainMenu = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    children,
+    ...rest
+  } = _ref;
+  return /*#__PURE__*/jsxRuntime.jsx(MainMenuStyles.Nav, {
+    ref: ref,
+    ...rest,
+    children: children
+  });
+});
+MainMenu.displayName = 'MainMenu';
+
+exports.MainMenu = MainMenu;
+//# sourceMappingURL=MainMenu.js.map

package/dist/cjs/main-menu/MainMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainMenu.js","sources":["../../../src/main-menu/MainMenu.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef } from 'react'\nimport { MainMenuProps } from './types.js'\nimport { Nav } from './MainMenuStyles.js'\n\nexport const MainMenu = forwardRef(\n  (\n    { children, ...rest }: MainMenuProps,\n    ref?: ForwardedRef<HTMLDivElement>,\n  ) => {\n    return (\n      <Nav ref={ref} {...rest}>\n        {children}\n      </Nav>\n    )\n  },\n)\nMainMenu.displayName = 'MainMenu'\n"],"names":["MainMenu","forwardRef","_ref","ref","children","rest","_jsx","Nav","displayName"],"mappings":";;;;;;;;AAIO,MAAMA,QAAQ,gBAAGC,gBAAU,CAChC,CAAAC,IAAA,EAEEC,GAAkC,KAC/B;EAAA,IAFH;IAAEC,QAAQ;IAAE,GAAGC,IAAAA;AAAoB,GAAC,GAAAH,IAAA,CAAA;EAGpC,oBACEI,cAAA,CAACC,kBAAG,EAAA;AAACJ,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GAAKE,IAAI;AAAAD,IAAAA,QAAA,EACpBA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEV,CACF,EAAC;AACDJ,QAAQ,CAACQ,WAAW,GAAG,UAAU;;;;"}

package/dist/cjs/main-menu/MainMenuItem.js

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const MainMenuItemStyles = require('./MainMenuItemStyles.js');
+const jsxRuntime = require('react/jsx-runtime');
+
+const MainMenuItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    icon,
+    children,
+    active,
+    ...restProps
+  } = _ref;
+  return /*#__PURE__*/jsxRuntime.jsxs(MainMenuItemStyles.NavLink, {
+    ref: ref,
+    active: Boolean(active),
+    ...restProps,
+    children: [icon, /*#__PURE__*/jsxRuntime.jsx("span", {
+      children: children
+    })]
+  });
+});
+MainMenuItem.displayName = 'MainMenuItem';
+
+exports.MainMenuItem = MainMenuItem;
+//# sourceMappingURL=MainMenuItem.js.map

package/dist/cjs/main-menu/MainMenuItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainMenuItem.js","sources":["../../../src/main-menu/MainMenuItem.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef } from 'react'\nimport { MainMenuItemProps } from './types.js'\nimport { NavLink } from './MainMenuItemStyles.js'\n\nexport const MainMenuItem = forwardRef(\n  (\n    { icon, children, active, ...restProps }: MainMenuItemProps,\n    ref?: ForwardedRef<HTMLDivElement>,\n  ) => {\n    return (\n      <NavLink ref={ref} active={Boolean(active)} {...restProps}>\n        {icon}\n        <span>{children}</span>\n      </NavLink>\n    )\n  },\n)\nMainMenuItem.displayName = 'MainMenuItem'\n"],"names":["MainMenuItem","forwardRef","_ref","ref","icon","children","active","restProps","_jsxs","NavLink","Boolean","_jsx","displayName"],"mappings":";;;;;;;;AAIO,MAAMA,YAAY,gBAAGC,gBAAU,CACpC,CAAAC,IAAA,EAEEC,GAAkC,KAC/B;EAAA,IAFH;IAAEC,IAAI;IAAEC,QAAQ;IAAEC,MAAM;IAAE,GAAGC,SAAAA;AAA6B,GAAC,GAAAL,IAAA,CAAA;EAG3D,oBACEM,eAAA,CAACC,0BAAO,EAAA;AAACN,IAAAA,GAAG,EAAEA,GAAI;AAACG,IAAAA,MAAM,EAAEI,OAAO,CAACJ,MAAM,CAAE;AAAA,IAAA,GAAKC,SAAS;IAAAF,QAAA,EAAA,CACtDD,IAAI,eACLO,cAAA,CAAA,MAAA,EAAA;AAAAN,MAAAA,QAAA,EAAOA,QAAAA;AAAQ,KAAO,CAAC,CAAA;AAAA,GAChB,CAAC,CAAA;AAEd,CACF,EAAC;AACDL,YAAY,CAACY,WAAW,GAAG,cAAc;;;;"}

package/dist/cjs/main-menu/MainMenuItemStyles.js

@@ -0,0 +1,67 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponentsWrapper = require('../utils/styled-components-wrapper.js');
+
+const NavLink = styledComponentsWrapper.default.a`
+  cursor: pointer;
+  color: var(--lido-color-secondary);
+  font-size: ${_ref => {
+  let {
+    theme
+  } = _ref;
+  return theme.fontSizesMap.xxxs;
+}}px;
+  line-height: 1.7em;
+  font-weight: 800;
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  opacity: ${props => props.active ? 1 : 0.8};
+
+  :hover {
+    opacity: 1;
+    color: var(--lido-color-secondary);
+  }
+
+  :not(:last-of-type) {
+    margin-right: 32px;
+  }
+
+  svg {
+    fill: var(
+      --lido-color-${_ref2 => {
+  let {
+    active
+  } = _ref2;
+  return active ? `primary` : `secondary`;
+}}
+    );
+  }
+
+  ${_ref3 => {
+  let {
+    theme
+  } = _ref3;
+  return theme.mediaQueries.md;
+}} {
+    flex-direction: column;
+    text-transform: none;
+    font-weight: 500;
+    font-size: ${_ref4 => {
+  let {
+    theme
+  } = _ref4;
+  return theme.fontSizesMap.xxxs;
+}}px;
+    line-height: 1.2em;
+    letter-spacing: 0;
+  }
+`;
+
+exports.NavLink = NavLink;
+//# sourceMappingURL=MainMenuItemStyles.js.map

package/dist/cjs/main-menu/MainMenuItemStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainMenuItemStyles.js","sources":["../../../src/main-menu/MainMenuItemStyles.tsx"],"sourcesContent":["import styled from '../utils/styled-components-wrapper.js'\n\nexport const NavLink = styled.a<{ active: boolean }>`\n  cursor: pointer;\n  color: var(--lido-color-secondary);\n  font-size: ${({ theme }) => theme.fontSizesMap.xxxs}px;\n  line-height: 1.7em;\n  font-weight: 800;\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  letter-spacing: 0.04em;\n  opacity: ${(props) => (props.active ? 1 : 0.8)};\n\n  :hover {\n    opacity: 1;\n    color: var(--lido-color-secondary);\n  }\n\n  :not(:last-of-type) {\n    margin-right: 32px;\n  }\n\n  svg {\n    fill: var(\n      --lido-color-${({ active }) => (active ? `primary` : `secondary`)}\n    );\n  }\n\n  ${({ theme }) => theme.mediaQueries.md} {\n    flex-direction: column;\n    text-transform: none;\n    font-weight: 500;\n    font-size: ${({ theme }) => theme.fontSizesMap.xxxs}px;\n    line-height: 1.2em;\n    letter-spacing: 0;\n  }\n`\n"],"names":["NavLink","styled","a","_ref","theme","fontSizesMap","xxxs","props","active","_ref2","_ref3","mediaQueries","md","_ref4"],"mappings":";;;;;;AAEaA,MAAAA,OAAO,GAAGC,+BAAM,CAACC,CAAsB,CAAA;AACpD;AACA;AACA,aAAA,EAAeC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,KAAAA;AAAM,GAAC,GAAAD,IAAA,CAAA;AAAA,EAAA,OAAKC,KAAK,CAACC,YAAY,CAACC,IAAI,CAAA;AAAA,CAAA,CAAA;AACrD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAcC,EAAAA,KAAK,IAAMA,KAAK,CAACC,MAAM,GAAG,CAAC,GAAG,GAAI,CAAA;AAChD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAA,EAAqBC,KAAA,IAAA;EAAA,IAAC;AAAED,IAAAA,MAAAA;AAAO,GAAC,GAAAC,KAAA,CAAA;AAAA,EAAA,OAAMD,MAAM,GAAG,CAAS,OAAA,CAAA,GAAG,CAAW,SAAA,CAAA,CAAA;AAAA,CAAC,CAAA;AACvE;AACA;AACA;AACA,EAAA,EAAIE,KAAA,IAAA;EAAA,IAAC;AAAEN,IAAAA,KAAAA;AAAM,GAAC,GAAAM,KAAA,CAAA;AAAA,EAAA,OAAKN,KAAK,CAACO,YAAY,CAACC,EAAE,CAAA;AAAA,CAAA,CAAA;AACxC;AACA;AACA;AACA,eAAA,EAAiBC,KAAA,IAAA;EAAA,IAAC;AAAET,IAAAA,KAAAA;AAAM,GAAC,GAAAS,KAAA,CAAA;AAAA,EAAA,OAAKT,KAAK,CAACC,YAAY,CAACC,IAAI,CAAA;AAAA,CAAA,CAAA;AACvD;AACA;AACA;AACA;;;;"}

package/dist/cjs/main-menu/MainMenuStyles.js

@@ -0,0 +1,50 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponentsWrapper = require('../utils/styled-components-wrapper.js');
+const _styled = require('styled-components');
+
+const desktopCss = _styled.css`
+  margin: 0 46px;
+  display: flex;
+
+  svg {
+    margin-right: 10px;
+  }
+`;
+const mobileCss = _styled.css`
+  margin: 0;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 8px;
+  background-color: var(--lido-color-foreground);
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  border-top: 1px solid var(--lido-color-border);
+
+  svg {
+    margin-right: 0;
+    margin-bottom: 7px;
+  }
+`;
+const Nav = styledComponentsWrapper.default.div`
+  ${desktopCss}
+  ${_ref => {
+  let {
+    theme
+  } = _ref;
+  return theme.mediaQueries.md;
+}} {
+    ${mobileCss}
+  }
+
+  z-index: 5;
+`;
+
+exports.Nav = Nav;
+exports.desktopCss = desktopCss;
+//# sourceMappingURL=MainMenuStyles.js.map

package/dist/cjs/main-menu/MainMenuStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainMenuStyles.js","sources":["../../../src/main-menu/MainMenuStyles.tsx"],"sourcesContent":["import styled, { css } from '../utils/styled-components-wrapper.js'\n\nexport const desktopCss = css`\n  margin: 0 46px;\n  display: flex;\n\n  svg {\n    margin-right: 10px;\n  }\n`\n\nconst mobileCss = css`\n  margin: 0;\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  padding: 8px;\n  background-color: var(--lido-color-foreground);\n  display: flex;\n  justify-content: space-around;\n  align-items: center;\n  border-top: 1px solid var(--lido-color-border);\n\n  svg {\n    margin-right: 0;\n    margin-bottom: 7px;\n  }\n`\n\nexport const Nav = styled.div`\n  ${desktopCss}\n  ${({ theme }) => theme.mediaQueries.md} {\n    ${mobileCss}\n  }\n\n  z-index: 5;\n`\n"],"names":["desktopCss","css","mobileCss","Nav","styled","div","_ref","theme","mediaQueries","md"],"mappings":";;;;;;;AAEO,MAAMA,UAAU,GAAGC,WAAG,CAAA;AAC7B;AACA;AACA;AACA;AACA;AACA;AACA,EAAC;AAED,MAAMC,SAAS,GAAGD,WAAG,CAAA;AACrB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC,CAAA;AAEYE,MAAAA,GAAG,GAAGC,+BAAM,CAACC,GAAG,CAAA;AAC7B,EAAA,EAAIL,UAAU,CAAA;AACd,EAAA,EAAIM,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,KAAAA;AAAM,GAAC,GAAAD,IAAA,CAAA;AAAA,EAAA,OAAKC,KAAK,CAACC,YAAY,CAACC,EAAE,CAAA;AAAA,CAAA,CAAA;AACxC,IAAA,EAAMP,SAAS,CAAA;AACf;AACA;AACA;AACA;;;;;"}

package/dist/cjs/modal/Modal.js

@@ -0,0 +1,71 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const ModalStyles = require('./ModalStyles.js');
+const ModalOverlay = require('./ModalOverlay.js');
+const jsxRuntime = require('react/jsx-runtime');
+
+const Modal = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    children,
+    title,
+    titleIcon,
+    subtitle,
+    center = false,
+    extra,
+    open,
+    onClose,
+    onBack,
+    windowSize = 'sm',
+    windowProps,
+    ...rest
+  } = _ref;
+  const withTitleIcon = !!titleIcon;
+  const withSubtitle = !!subtitle;
+  const withCloseButton = !!onClose;
+  const withBackButton = !!onBack;
+  const modalHeader = /*#__PURE__*/jsxRuntime.jsxs(ModalStyles.ModalHeaderStyle, {
+    $short: !title,
+    children: [withBackButton && /*#__PURE__*/jsxRuntime.jsx(ModalStyles.ModalBackStyle, {
+      onClick: onBack
+    }), /*#__PURE__*/jsxRuntime.jsxs(ModalStyles.ModalTitleStyle, {
+      $center: center,
+      $withTitleIcon: withTitleIcon,
+      $withCloseButton: withCloseButton,
+      $withBackButton: withBackButton,
+      children: [withTitleIcon && /*#__PURE__*/jsxRuntime.jsx(ModalStyles.ModalTitleIconStyle, {
+        $center: center,
+        children: titleIcon
+      }), /*#__PURE__*/jsxRuntime.jsx(ModalStyles.ModalTitleTextStyle, {
+        children: title
+      })]
+    }), withCloseButton && /*#__PURE__*/jsxRuntime.jsx(ModalStyles.ModalCloseStyle, {
+      onClick: onClose
+    })]
+  });
+  return /*#__PURE__*/jsxRuntime.jsx(ModalOverlay.ModalOverlay, {
+    ref: ref,
+    in: open,
+    onClose: onClose,
+    onBack: onBack,
+    ...rest,
+    children: /*#__PURE__*/jsxRuntime.jsxs(ModalStyles.ModalStyle, {
+      $center: center,
+      $size: windowSize,
+      ...windowProps,
+      children: [/*#__PURE__*/jsxRuntime.jsxs(ModalStyles.ModalBaseStyle, {
+        children: [modalHeader, withSubtitle && /*#__PURE__*/jsxRuntime.jsx(ModalStyles.ModalSubtitleStyle, {
+          children: subtitle
+        }), /*#__PURE__*/jsxRuntime.jsx(ModalStyles.ModalContentStyle, {
+          children: children
+        })]
+      }), extra]
+    })
+  });
+});
+Modal.displayName = 'Modal';
+
+exports.Modal = Modal;
+//# sourceMappingURL=Modal.js.map

package/dist/cjs/modal/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.js","sources":["../../../src/modal/Modal.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef } from 'react'\nimport {\n  ModalStyle,\n  ModalBaseStyle,\n  ModalHeaderStyle,\n  ModalTitleStyle,\n  ModalTitleIconStyle,\n  ModalTitleTextStyle,\n  ModalCloseStyle,\n  ModalContentStyle,\n  ModalBackStyle,\n  ModalSubtitleStyle,\n} from './ModalStyles.js'\nimport { ModalProps } from './types.js'\nimport { ModalOverlay } from './ModalOverlay.js'\n\nexport const Modal = forwardRef(\n  (\n    {\n      children,\n      title,\n      titleIcon,\n      subtitle,\n      center = false,\n      extra,\n      open,\n      onClose,\n      onBack,\n      windowSize = 'sm',\n      windowProps,\n      ...rest\n    }: ModalProps,\n    ref?: ForwardedRef<HTMLDivElement>,\n  ) => {\n    const withTitleIcon = !!titleIcon\n    const withSubtitle = !!subtitle\n    const withCloseButton = !!onClose\n    const withBackButton = !!onBack\n\n    const modalHeader = (\n      <ModalHeaderStyle $short={!title}>\n        {withBackButton && <ModalBackStyle onClick={onBack} />}\n        <ModalTitleStyle\n          $center={center}\n          $withTitleIcon={withTitleIcon}\n          $withCloseButton={withCloseButton}\n          $withBackButton={withBackButton}\n        >\n          {withTitleIcon && (\n            <ModalTitleIconStyle $center={center}>\n              {titleIcon}\n            </ModalTitleIconStyle>\n          )}\n          <ModalTitleTextStyle>{title}</ModalTitleTextStyle>\n        </ModalTitleStyle>\n        {withCloseButton && <ModalCloseStyle onClick={onClose} />}\n      </ModalHeaderStyle>\n    )\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        in={open}\n        onClose={onClose}\n        onBack={onBack}\n        {...rest}\n      >\n        <ModalStyle $center={center} $size={windowSize} {...windowProps}>\n          <ModalBaseStyle>\n            {modalHeader}\n            {withSubtitle && (\n              <ModalSubtitleStyle>{subtitle}</ModalSubtitleStyle>\n            )}\n            <ModalContentStyle>{children}</ModalContentStyle>\n          </ModalBaseStyle>\n          {extra}\n        </ModalStyle>\n      </ModalOverlay>\n    )\n  },\n)\nModal.displayName = 'Modal'\n"],"names":["Modal","forwardRef","_ref","ref","children","title","titleIcon","subtitle","center","extra","open","onClose","onBack","windowSize","windowProps","rest","withTitleIcon","withSubtitle","withCloseButton","withBackButton","modalHeader","_jsxs","ModalHeaderStyle","$short","_jsx","ModalBackStyle","onClick","ModalTitleStyle","$center","$withTitleIcon","$withCloseButton","$withBackButton","ModalTitleIconStyle","ModalTitleTextStyle","ModalCloseStyle","ModalOverlay","in","ModalStyle","$size","ModalBaseStyle","ModalSubtitleStyle","ModalContentStyle","displayName"],"mappings":";;;;;;;;;AAgBO,MAAMA,KAAK,gBAAGC,gBAAU,CAC7B,CAAAC,IAAA,EAeEC,GAAkC,KAC/B;EAAA,IAfH;IACEC,QAAQ;IACRC,KAAK;IACLC,SAAS;IACTC,QAAQ;AACRC,IAAAA,MAAM,GAAG,KAAK;IACdC,KAAK;IACLC,IAAI;IACJC,OAAO;IACPC,MAAM;AACNC,IAAAA,UAAU,GAAG,IAAI;IACjBC,WAAW;IACX,GAAGC,IAAAA;AACO,GAAC,GAAAb,IAAA,CAAA;AAGb,EAAA,MAAMc,aAAa,GAAG,CAAC,CAACV,SAAS,CAAA;AACjC,EAAA,MAAMW,YAAY,GAAG,CAAC,CAACV,QAAQ,CAAA;AAC/B,EAAA,MAAMW,eAAe,GAAG,CAAC,CAACP,OAAO,CAAA;AACjC,EAAA,MAAMQ,cAAc,GAAG,CAAC,CAACP,MAAM,CAAA;AAE/B,EAAA,MAAMQ,WAAW,gBACfC,eAAA,CAACC,4BAAgB,EAAA;IAACC,MAAM,EAAE,CAAClB,KAAM;AAAAD,IAAAA,QAAA,EAC9Be,CAAAA,cAAc,iBAAIK,cAAA,CAACC,0BAAc,EAAA;AAACC,MAAAA,OAAO,EAAEd,MAAAA;AAAO,KAAE,CAAC,eACtDS,eAAA,CAACM,2BAAe,EAAA;AACdC,MAAAA,OAAO,EAAEpB,MAAO;AAChBqB,MAAAA,cAAc,EAAEb,aAAc;AAC9Bc,MAAAA,gBAAgB,EAAEZ,eAAgB;AAClCa,MAAAA,eAAe,EAAEZ,cAAe;AAAAf,MAAAA,QAAA,EAE/BY,CAAAA,aAAa,iBACZQ,cAAA,CAACQ,+BAAmB,EAAA;AAACJ,QAAAA,OAAO,EAAEpB,MAAO;AAAAJ,QAAAA,QAAA,EAClCE,SAAAA;AAAS,OACS,CACtB,eACDkB,cAAA,CAACS,+BAAmB,EAAA;AAAA7B,QAAAA,QAAA,EAAEC,KAAAA;AAAK,OAAsB,CAAC,CAAA;AAAA,KACnC,CAAC,EACjBa,eAAe,iBAAIM,cAAA,CAACU,2BAAe,EAAA;AAACR,MAAAA,OAAO,EAAEf,OAAAA;AAAQ,KAAE,CAAC,CAAA;AAAA,GACzC,CACnB,CAAA;EAED,oBACEa,cAAA,CAACW,yBAAY,EAAA;AACXhC,IAAAA,GAAG,EAAEA,GAAI;AACTiC,IAAAA,EAAE,EAAE1B,IAAK;AACTC,IAAAA,OAAO,EAAEA,OAAQ;AACjBC,IAAAA,MAAM,EAAEA,MAAO;AAAA,IAAA,GACXG,IAAI;IAAAX,QAAA,eAERiB,eAAA,CAACgB,sBAAU,EAAA;AAACT,MAAAA,OAAO,EAAEpB,MAAO;AAAC8B,MAAAA,KAAK,EAAEzB,UAAW;AAAA,MAAA,GAAKC,WAAW;MAAAV,QAAA,EAAA,cAC7DiB,eAAA,CAACkB,0BAAc,EAAA;AAAAnC,QAAAA,QAAA,GACZgB,WAAW,EACXH,YAAY,iBACXO,cAAA,CAACgB,8BAAkB,EAAA;AAAApC,UAAAA,QAAA,EAAEG,QAAAA;AAAQ,SAAqB,CACnD,eACDiB,cAAA,CAACiB,6BAAiB,EAAA;AAAArC,UAAAA,QAAA,EAAEA,QAAAA;AAAQ,SAAoB,CAAC,CAAA;OACnC,CAAC,EAChBK,KAAK,CAAA;KACI,CAAA;AAAC,GACD,CAAC,CAAA;AAEnB,CACF,EAAC;AACDT,KAAK,CAAC0C,WAAW,GAAG,OAAO;;;;"}

package/dist/cjs/modal/ModalButton.js

@@ -0,0 +1,58 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const ModalButtonStyles = require('./ModalButtonStyles.js');
+const jsxRuntime = require('react/jsx-runtime');
+
+const iconSize = {
+  xxs: {
+    width: '16px',
+    height: '16px'
+  },
+  xs: {
+    width: '24px',
+    height: '24px'
+  },
+  sm: {
+    width: '32px',
+    height: '32px'
+  },
+  md: {
+    width: '48px',
+    height: '48px'
+  },
+  lg: {
+    width: '64px',
+    height: '64px'
+  }
+};
+const ModalButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  let {
+    size = 'md',
+    loading = false,
+    children,
+    icon,
+    ...rest
+  } = _ref;
+  const AdaptiveIconProps = icon.props.width || icon.props.height ? icon.props : {
+    ...iconSize[size]
+  };
+  const AdaptiveIcon = /*#__PURE__*/React.cloneElement(icon, AdaptiveIconProps);
+  return /*#__PURE__*/jsxRuntime.jsx(ModalButtonStyles.ModalButtonStyle, {
+    type: "button",
+    size: size,
+    loading: loading,
+    ref: ref,
+    icon: icon,
+    ...rest,
+    children: /*#__PURE__*/jsxRuntime.jsxs(ModalButtonStyles.ModalButtonContentStyle, {
+      children: [children, " ", AdaptiveIcon]
+    })
+  });
+});
+ModalButton.displayName = 'ModalButton';
+
+exports.ModalButton = ModalButton;
+//# sourceMappingURL=ModalButton.js.map

package/dist/cjs/modal/ModalButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalButton.js","sources":["../../../src/modal/ModalButton.tsx"],"sourcesContent":["import { cloneElement, ForwardedRef, forwardRef } from 'react'\nimport {\n  ModalButtonStyle,\n  ModalButtonContentStyle,\n} from './ModalButtonStyles.js'\nimport { ModalButtonIconProps } from './types.js'\n\nconst iconSize = {\n  xxs: {\n    width: '16px',\n    height: '16px',\n  },\n  xs: {\n    width: '24px',\n    height: '24px',\n  },\n  sm: {\n    width: '32px',\n    height: '32px',\n  },\n  md: {\n    width: '48px',\n    height: '48px',\n  },\n  lg: {\n    width: '64px',\n    height: '64px',\n  },\n}\n\nexport const ModalButton = forwardRef(\n  (\n    {\n      size = 'md',\n      loading = false,\n      children,\n      icon,\n      ...rest\n    }: ModalButtonIconProps,\n    ref?: ForwardedRef<HTMLButtonElement>,\n  ) => {\n    const AdaptiveIconProps =\n      icon.props.width || icon.props.height ? icon.props : { ...iconSize[size] }\n    const AdaptiveIcon = cloneElement(icon, AdaptiveIconProps)\n\n    return (\n      <ModalButtonStyle\n        type='button'\n        size={size}\n        loading={loading}\n        ref={ref}\n        icon={icon}\n        {...rest}\n      >\n        <ModalButtonContentStyle>\n          {children} {AdaptiveIcon}\n        </ModalButtonContentStyle>\n      </ModalButtonStyle>\n    )\n  },\n)\nModalButton.displayName = 'ModalButton'\n"],"names":["iconSize","xxs","width","height","xs","sm","md","lg","ModalButton","forwardRef","_ref","ref","size","loading","children","icon","rest","AdaptiveIconProps","props","AdaptiveIcon","cloneElement","_jsx","ModalButtonStyle","type","_jsxs","ModalButtonContentStyle","displayName"],"mappings":";;;;;;;;AAOA,MAAMA,QAAQ,GAAG;AACfC,EAAAA,GAAG,EAAE;AACHC,IAAAA,KAAK,EAAE,MAAM;AACbC,IAAAA,MAAM,EAAE,MAAA;GACT;AACDC,EAAAA,EAAE,EAAE;AACFF,IAAAA,KAAK,EAAE,MAAM;AACbC,IAAAA,MAAM,EAAE,MAAA;GACT;AACDE,EAAAA,EAAE,EAAE;AACFH,IAAAA,KAAK,EAAE,MAAM;AACbC,IAAAA,MAAM,EAAE,MAAA;GACT;AACDG,EAAAA,EAAE,EAAE;AACFJ,IAAAA,KAAK,EAAE,MAAM;AACbC,IAAAA,MAAM,EAAE,MAAA;GACT;AACDI,EAAAA,EAAE,EAAE;AACFL,IAAAA,KAAK,EAAE,MAAM;AACbC,IAAAA,MAAM,EAAE,MAAA;AACV,GAAA;AACF,CAAC,CAAA;AAEM,MAAMK,WAAW,gBAAGC,gBAAU,CACnC,CAAAC,IAAA,EAQEC,GAAqC,KAClC;EAAA,IARH;AACEC,IAAAA,IAAI,GAAG,IAAI;AACXC,IAAAA,OAAO,GAAG,KAAK;IACfC,QAAQ;IACRC,IAAI;IACJ,GAAGC,IAAAA;AACiB,GAAC,GAAAN,IAAA,CAAA;AAGvB,EAAA,MAAMO,iBAAiB,GACrBF,IAAI,CAACG,KAAK,CAAChB,KAAK,IAAIa,IAAI,CAACG,KAAK,CAACf,MAAM,GAAGY,IAAI,CAACG,KAAK,GAAG;IAAE,GAAGlB,QAAQ,CAACY,IAAI,CAAA;GAAG,CAAA;AAC5E,EAAA,MAAMO,YAAY,gBAAGC,kBAAY,CAACL,IAAI,EAAEE,iBAAiB,CAAC,CAAA;EAE1D,oBACEI,cAAA,CAACC,kCAAgB,EAAA;AACfC,IAAAA,IAAI,EAAC,QAAQ;AACbX,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,OAAO,EAAEA,OAAQ;AACjBF,IAAAA,GAAG,EAAEA,GAAI;AACTI,IAAAA,IAAI,EAAEA,IAAK;AAAA,IAAA,GACPC,IAAI;IAAAF,QAAA,eAERU,eAAA,CAACC,yCAAuB,EAAA;AAAAX,MAAAA,QAAA,EACrBA,CAAAA,QAAQ,EAAC,GAAC,EAACK,YAAY,CAAA;KACD,CAAA;AAAC,GACV,CAAC,CAAA;AAEvB,CACF,EAAC;AACDX,WAAW,CAACkB,WAAW,GAAG,aAAa;;;;"}

package/dist/cjs/modal/ModalButtonStyles.js

@@ -0,0 +1,39 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponentsWrapper = require('../utils/styled-components-wrapper.js');
+const Button = require('../button/Button.js');
+require('../button/ButtonIcon.js');
+
+const ModalButtonStyle = styledComponentsWrapper.default(Button.Button)`
+  border: ${_ref => {
+  let {
+    active
+  } = _ref;
+  return active ? `1px solid var(--lido-color-primary)` : `1px solid var(--lido-color-background)`;
+}};
+  background-color: ${_ref2 => {
+  let {
+    active
+  } = _ref2;
+  return active ? 'rgba(0, 163, 255, 0.1);' : `var(--lido-color-background)`;
+}};
+  color: var(--lido-color-text);
+
+  :not(:disabled):hover,
+  :focus-visible {
+    background-color: rgb(0 163 255 / 10%);
+    color: var(--lido-color-text);
+  }
+`;
+const ModalButtonContentStyle = styledComponentsWrapper.default.span`
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+`;
+
+exports.ModalButtonContentStyle = ModalButtonContentStyle;
+exports.ModalButtonStyle = ModalButtonStyle;
+//# sourceMappingURL=ModalButtonStyles.js.map

package/dist/cjs/modal/ModalButtonStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalButtonStyles.js","sources":["../../../src/modal/ModalButtonStyles.tsx"],"sourcesContent":["import styled from '../utils/styled-components-wrapper.js'\nimport { Button } from '../button/index.js'\n\nexport const ModalButtonStyle = styled(Button)`\n  border: ${({ active }) =>\n    active\n      ? `1px solid var(--lido-color-primary)`\n      : `1px solid var(--lido-color-background)`};\n  background-color: ${({ active }) =>\n    active ? 'rgba(0, 163, 255, 0.1);' : `var(--lido-color-background)`};\n  color: var(--lido-color-text);\n\n  :not(:disabled):hover,\n  :focus-visible {\n    background-color: rgb(0 163 255 / 10%);\n    color: var(--lido-color-text);\n  }\n`\n\nexport const ModalButtonContentStyle = styled.span`\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n`\n"],"names":["ModalButtonStyle","styled","Button","_ref","active","_ref2","ModalButtonContentStyle","span"],"mappings":";;;;;;;;MAGaA,gBAAgB,GAAGC,+BAAM,CAACC,aAAM,CAAC,CAAA;AAC9C,UAAA,EAAYC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,MAAAA;AAAO,GAAC,GAAAD,IAAA,CAAA;AAAA,EAAA,OACnBC,MAAM,GACF,CAAqC,mCAAA,CAAA,GACrC,CAAwC,sCAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AAChD,oBAAA,EAAsBC,KAAA,IAAA;EAAA,IAAC;AAAED,IAAAA,MAAAA;AAAO,GAAC,GAAAC,KAAA,CAAA;AAAA,EAAA,OAC7BD,MAAM,GAAG,yBAAyB,GAAG,CAA8B,4BAAA,CAAA,CAAA;AAAA,CAAA,CAAA;AACvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,EAAC;AAEYE,MAAAA,uBAAuB,GAAGL,+BAAM,CAACM,IAAI,CAAA;AAClD;AACA;AACA;AACA;AACA;;;;;"}

package/dist/cjs/modal/ModalExtra.js

@@ -0,0 +1,18 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const ModalExtraStyles = require('./ModalExtraStyles.js');
+const jsxRuntime = require('react/jsx-runtime');
+
+const ModalExtra = /*#__PURE__*/React.forwardRef((props, ref) => {
+  return /*#__PURE__*/jsxRuntime.jsx(ModalExtraStyles.ModalExtraStyle, {
+    ...props,
+    ref: ref
+  });
+});
+ModalExtra.displayName = 'ModalExtra';
+
+exports.ModalExtra = ModalExtra;
+//# sourceMappingURL=ModalExtra.js.map

package/dist/cjs/modal/ModalExtra.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalExtra.js","sources":["../../../src/modal/ModalExtra.tsx"],"sourcesContent":["import { ForwardedRef, forwardRef } from 'react'\nimport { ModalExtraStyle } from './ModalExtraStyles.js'\nimport { ModalExtraProps } from './types.js'\n\nexport const ModalExtra = forwardRef(\n  (props: ModalExtraProps, ref?: ForwardedRef<HTMLDivElement>) => {\n    return <ModalExtraStyle {...props} ref={ref} />\n  },\n)\nModalExtra.displayName = 'ModalExtra'\n"],"names":["ModalExtra","forwardRef","props","ref","_jsx","ModalExtraStyle","displayName"],"mappings":";;;;;;;;AAIO,MAAMA,UAAU,gBAAGC,gBAAU,CAClC,CAACC,KAAsB,EAAEC,GAAkC,KAAK;EAC9D,oBAAOC,cAAA,CAACC,gCAAe,EAAA;AAAA,IAAA,GAAKH,KAAK;AAAEC,IAAAA,GAAG,EAAEA,GAAAA;AAAI,GAAE,CAAC,CAAA;AACjD,CACF,EAAC;AACDH,UAAU,CAACM,WAAW,GAAG,YAAY;;;;"}

package/dist/cjs/modal/ModalExtraStyles.js

@@ -0,0 +1,53 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const styledComponentsWrapper = require('../utils/styled-components-wrapper.js');
+
+const ModalExtraStyle = styledComponentsWrapper.default.div`
+  margin-top: ${_ref => {
+  let {
+    theme
+  } = _ref;
+  return -theme.borderRadiusesMap.xl;
+}}px;
+  color: var(--lido-color-accentContrast);
+  background: var(--lido-color-accent);
+  padding: ${_ref2 => {
+  let {
+    theme
+  } = _ref2;
+  return theme.spaceMap.xxl;
+}}px;
+  padding-top: ${_ref3 => {
+  let {
+    theme
+  } = _ref3;
+  return theme.borderRadiusesMap.xl + theme.spaceMap.xxl;
+}}px;
+  border-bottom-left-radius: inherit;
+  border-bottom-right-radius: inherit;
+
+  ${_ref4 => {
+  let {
+    theme
+  } = _ref4;
+  return theme.mediaQueries.md;
+}} {
+    padding: ${_ref5 => {
+  let {
+    theme
+  } = _ref5;
+  return theme.spaceMap.lg;
+}}px;
+    padding-top: ${_ref6 => {
+  let {
+    theme
+  } = _ref6;
+  return theme.borderRadiusesMap.xl + theme.spaceMap.lg;
+}}px;
+  }
+`;
+
+exports.ModalExtraStyle = ModalExtraStyle;
+//# sourceMappingURL=ModalExtraStyles.js.map

package/dist/cjs/modal/ModalExtraStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalExtraStyles.js","sources":["../../../src/modal/ModalExtraStyles.tsx"],"sourcesContent":["import styled from '../utils/styled-components-wrapper.js'\n\nexport const ModalExtraStyle = styled.div`\n  margin-top: ${({ theme }) => -theme.borderRadiusesMap.xl}px;\n  color: var(--lido-color-accentContrast);\n  background: var(--lido-color-accent);\n  padding: ${({ theme }) => theme.spaceMap.xxl}px;\n  padding-top: ${({ theme }) =>\n    theme.borderRadiusesMap.xl + theme.spaceMap.xxl}px;\n  border-bottom-left-radius: inherit;\n  border-bottom-right-radius: inherit;\n\n  ${({ theme }) => theme.mediaQueries.md} {\n    padding: ${({ theme }) => theme.spaceMap.lg}px;\n    padding-top: ${({ theme }) =>\n      theme.borderRadiusesMap.xl + theme.spaceMap.lg}px;\n  }\n`\n"],"names":["ModalExtraStyle","styled","div","_ref","theme","borderRadiusesMap","xl","_ref2","spaceMap","xxl","_ref3","_ref4","mediaQueries","md","_ref5","lg","_ref6"],"mappings":";;;;;;AAEaA,MAAAA,eAAe,GAAGC,+BAAM,CAACC,GAAG,CAAA;AACzC,cAAA,EAAgBC,IAAA,IAAA;EAAA,IAAC;AAAEC,IAAAA,KAAAA;AAAM,GAAC,GAAAD,IAAA,CAAA;AAAA,EAAA,OAAK,CAACC,KAAK,CAACC,iBAAiB,CAACC,EAAE,CAAA;AAAA,CAAA,CAAA;AAC1D;AACA;AACA,WAAA,EAAaC,KAAA,IAAA;EAAA,IAAC;AAAEH,IAAAA,KAAAA;AAAM,GAAC,GAAAG,KAAA,CAAA;AAAA,EAAA,OAAKH,KAAK,CAACI,QAAQ,CAACC,GAAG,CAAA;AAAA,CAAA,CAAA;AAC9C,eAAA,EAAiBC,KAAA,IAAA;EAAA,IAAC;AAAEN,IAAAA,KAAAA;AAAM,GAAC,GAAAM,KAAA,CAAA;EAAA,OACvBN,KAAK,CAACC,iBAAiB,CAACC,EAAE,GAAGF,KAAK,CAACI,QAAQ,CAACC,GAAG,CAAA;AAAA,CAAA,CAAA;AACnD;AACA;AACA;AACA,EAAA,EAAIE,KAAA,IAAA;EAAA,IAAC;AAAEP,IAAAA,KAAAA;AAAM,GAAC,GAAAO,KAAA,CAAA;AAAA,EAAA,OAAKP,KAAK,CAACQ,YAAY,CAACC,EAAE,CAAA;AAAA,CAAA,CAAA;AACxC,aAAA,EAAeC,KAAA,IAAA;EAAA,IAAC;AAAEV,IAAAA,KAAAA;AAAM,GAAC,GAAAU,KAAA,CAAA;AAAA,EAAA,OAAKV,KAAK,CAACI,QAAQ,CAACO,EAAE,CAAA;AAAA,CAAA,CAAA;AAC/C,iBAAA,EAAmBC,KAAA,IAAA;EAAA,IAAC;AAAEZ,IAAAA,KAAAA;AAAM,GAAC,GAAAY,KAAA,CAAA;EAAA,OACvBZ,KAAK,CAACC,iBAAiB,CAACC,EAAE,GAAGF,KAAK,CAACI,QAAQ,CAACO,EAAE,CAAA;AAAA,CAAA,CAAA;AACpD;AACA;;;;"}

package/dist/cjs/modal/ModalOverlay.js

@@ -0,0 +1,67 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const React = require('react');
+const ReactDOM = require('react-dom');
+require('../utils/styled-components-wrapper.js');
+const useEscape = require('../hooks/useEscape.js');
+const useLockScroll = require('../hooks/useLockScroll.js');
+const useMergeRefs = require('../hooks/useMergeRefs.js');
+require('../theme/cookie-theme-provider.js');
+require('../theme/theme-provider.js');
+const jsxRuntime = require('react/jsx-runtime');
+require('../theme/document-head-contents/element-theme-colors.js');
+const modalRoot = require('../utils/modalRoot.js');
+require('../utils/cookies-client-side.js');
+require('../theme/constants.js');
+require('../theme/utils/set-theme-cookie.js');
+require('../theme/themes.js');
+const withTransition = require('../transition/withTransition.js');
+const ModalOverlayStyles = require('./ModalOverlayStyles.js');
+const useModalFocus = require('./useModalFocus.js');
+const useModalClose = require('./useModalClose.js');
+
+const ModalOverlay = withTransition.withTransition(
+/*#__PURE__*/
+// eslint-disable-next-line react/display-name
+React.forwardRef((_ref, externalRef) => {
+  let {
+    onClose,
+    onBack,
+    duration,
+    transitionStatus,
+    ...rest
+  } = _ref;
+  const closable = !!onClose;
+  useEscape.useEscape(onClose);
+  useLockScroll.useLockScroll();
+  const controlRef = useModalFocus.useModalFocus();
+  const {
+    ref: closeRef,
+    handleClick
+  } = useModalClose.useModalClose(onClose);
+  const mergedRef = useMergeRefs.useMergeRefs([controlRef, closeRef, externalRef]);
+  if (!modalRoot) return null;
+  return /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/jsxRuntime.jsx(ModalOverlayStyles.ModalPortalStyle, {
+    $closable: closable,
+    $duration: duration,
+    $transition: transitionStatus,
+    onClick: handleClick,
+    children: /*#__PURE__*/jsxRuntime.jsx(ModalOverlayStyles.ModalOverflowStyle, {
+      children: /*#__PURE__*/jsxRuntime.jsx(ModalOverlayStyles.ModalContentStyle, {
+        tabIndex: -1,
+        role: "dialog",
+        "aria-modal": "true",
+        ref: mergedRef,
+        $transition: transitionStatus,
+        $duration: duration,
+        ...rest
+      })
+    })
+  }), modalRoot);
+}));
+ModalOverlay.displayName = 'ModalOverlay';
+
+exports.ModalOverlay = ModalOverlay;
+//# sourceMappingURL=ModalOverlay.js.map