@lightsparkdev/ui 1.0.10 → 1.0.12

package/dist/chunk-WRZUCCQD.cjs

@@ -1,36 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }// src/components/typography/renderTypography.tsx
-
-
-
-
-var _react = require('react'); var _react2 = _interopRequireDefault(_react);
-var typographyMapModulePromise = Promise.resolve().then(() => _interopRequireWildcard(require("./components/typography/typographyMap.cjs")));
-var renderTypography = (typographyType, typographyProps) => {
-  return _react2.default.createElement(RenderTypographyLoader, {
-    typographyType,
-    typographyProps
-  });
-};
-function RenderTypographyLoader({
-  typographyType,
-  typographyProps
-}) {
-  const typographyMap = _react.useRef.call(void 0, null);
-  const [ready, setReady] = _react.useState.call(void 0, false);
-  _react.useEffect.call(void 0, () => {
-    void typographyMapModulePromise.then((typographyMapModule) => {
-      typographyMap.current = typographyMapModule.typographyMap;
-      setReady(true);
-    });
-  }, []);
-  if (!ready || !typographyMap.current) {
-    return null;
-  }
-  const TypographyComponent = typographyMap.current[typographyType];
-  const { children } = typographyProps;
-  return _react2.default.createElement(TypographyComponent, typographyProps, children);
-}
-
-
-
-exports.renderTypography = renderTypography;

package/dist/chunk-WTFNCHBK.cjs

@@ -1,30 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/Trash.tsx
-var _jsxruntime = require('@emotion/react/jsx-runtime');
-function Trash() {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    "svg",
-    {
-      width: "100%",
-      viewBox: "0 0 12 12",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          "path",
-          {
-            d: "M0.5 2.85714H11.5M4.07143 11.5H7.92857C8.79647 11.5 9.5 10.7965 9.5 9.92857L9.92857 2.07143C9.92857 1.20355 9.22504 0.5 8.35714 0.5H3.64286C2.77498 0.5 2.07143 1.20355 2.07143 2.07143L2.5 9.92857C2.5 10.7965 3.20355 11.5 4.07143 11.5Z",
-            stroke: "currentColor",
-            strokeLinecap: "round",
-            strokeLinejoin: "round"
-          }
-        ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M5 5V9", stroke: "currentColor", strokeLinecap: "round" }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "path", { d: "M7 5V9", stroke: "currentColor", strokeLinecap: "round" })
-      ]
-    }
-  );
-}
-
-
-
-exports.Trash = Trash;

package/dist/chunk-WW5RAKEC.cjs

@@ -1,27 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/Dollar.tsx
-var _jsxruntime = require('@emotion/react/jsx-runtime');
-function Dollar() {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "svg",
-    {
-      width: "100%",
-      viewBox: "0 0 10 13",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "path",
-        {
-          d: "M7.90922 2.61607H5.00156M5.00156 2.61607H3.57422C2.26039 2.61607 1.19531 3.48552 1.19531 4.55804C1.19531 5.63055 2.26039 6.5 3.57422 6.5H5.00156M5.00156 2.61607V1.0625M5.00156 2.61607V6.5M5.00156 6.5H6.42891C7.74274 6.5 8.80781 7.36945 8.80781 8.44196C8.80781 9.51448 7.74274 10.3839 6.42891 10.3839H5.00156M5.00156 6.5V10.3839M5.00156 10.3839H1.61833M5.00156 10.3839V11.9375",
-          stroke: "currentColor",
-          strokeWidth: "1.125",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    }
-  );
-}
-
-
-
-exports.Dollar = Dollar;

package/dist/chunk-WY2D7I5O.js

@@ -1,49 +0,0 @@
-import {
-  typographyStyles
-} from "./chunk-X5SBSJ3Z.js";
-import {
-  applyTypography
-} from "./chunk-R4JQUMCP.js";
-import {
-  toReactNodesBase
-} from "./chunk-DILTUDQN.js";
-
-// src/components/typography/Title.tsx
-import styled from "@emotion/styled";
-import { jsx } from "@emotion/react/jsx-runtime";
-var Title = ({
-  block = false,
-  children,
-  color,
-  content,
-  display,
-  hideOverflow = false,
-  id,
-  size = "Medium"
-}) => {
-  let reactNodes = children || null;
-  if (content) {
-    reactNodes = toReactNodesBase(content);
-  }
-  return /* @__PURE__ */ jsx(
-    StyledTitle,
-    {
-      size,
-      colorProp: color,
-      block,
-      id,
-      hideOverflow,
-      displayProp: display,
-      children: reactNodes
-    }
-  );
-};
-var StyledTitle = styled.span`
-  ${({ theme, size, colorProp }) => applyTypography(theme, "Title", size, colorProp)}
-  ${typographyStyles}
-`;
-
-export {
-  Title,
-  StyledTitle
-};

package/dist/chunk-WZJTXJM5.js

@@ -1,23 +0,0 @@
-import {
-  standardFocusOutline
-} from "./chunk-YZM4ALKD.js";
-
-// src/components/UnstyledButton.tsx
-import styled from "@emotion/styled";
-var UnstyledButton = styled.button`
-  ${standardFocusOutline}
-  font-family: ${({ theme }) => theme.typography.fontFamilies.main};
-  appearance: none;
-  background: transparent;
-  border: none;
-  padding: 0;
-  cursor: ${({ disabled }) => disabled ? "not-allowed" : "pointer"};
-  /* needed in Safari for some reason */
-  font-size: 1rem;
-  color: inherit;
-  font-weight: inherit;
-`;
-
-export {
-  UnstyledButton
-};

package/dist/chunk-X5SBSJ3Z.js

@@ -1,21 +0,0 @@
-// src/components/typography/typographyStyles.tsx
-import { css } from "@emotion/react";
-var typographyStyles = ({
-  /* theme, size, colorProp, */
-  block: blockProp,
-  hideOverflow,
-  displayProp
-}) => {
-  const displayValue = blockProp || hideOverflow ? "block" : displayProp || null;
-  return css`
-    /* Margins should always be set in parent style contexts eg Article: */
-    margin: 0;
-
-    ${displayValue ? `display: ${displayValue};` : ""}
-    ${hideOverflow ? "overflow: hidden; text-overflow: ellipsis; white-space: nowrap;" : ""}
-  `;
-};
-
-export {
-  typographyStyles
-};

package/dist/chunk-XB2OTOVK.cjs

@@ -1,27 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/icons/Roadmap.tsx
-var _jsxruntime = require('@emotion/react/jsx-runtime');
-function Roadmap() {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    "svg",
-    {
-      width: "16",
-      height: "16",
-      viewBox: "0 0 16 16",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "path",
-        {
-          d: "M4.66667 7.99996H11.3333M7.33333 11.3333H14M2 4.66663H8.66667",
-          stroke: "black",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    }
-  );
-}
-
-
-
-exports.Roadmap = Roadmap;

package/dist/chunk-XBKRPEVT.js

@@ -1,38 +0,0 @@
-// src/icons/WarningSign.tsx
-import { jsx, jsxs } from "@emotion/react/jsx-runtime";
-function WarningSign() {
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "100%",
-      viewBox: "0 0 12 12",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: [
-        /* @__PURE__ */ jsxs("g", { clipPath: "url(#clip0_3679_43594)", children: [
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: "M1.23392 10.8195L1.52049 10.4097L1.23392 10.8195C1.40632 10.94 1.59783 10.9728 1.74858 10.9866C1.89495 11 2.07532 11 2.27188 11L2.29247 11H9.70362L9.72422 11C9.92078 11 10.1011 11 10.2475 10.9866C10.3983 10.9728 10.5898 10.94 10.7622 10.8195L10.4756 10.4097L10.7622 10.8195C10.9876 10.6618 11.1381 10.4183 11.1783 10.1462C11.209 9.93805 11.1527 9.75208 11.0977 9.61107C11.0442 9.47415 10.9635 9.31281 10.8756 9.13699L10.8664 9.11862L7.1608 1.70747L7.16096 1.7074L7.15786 1.7016L7.15094 1.68775C7.04427 1.47437 6.94927 1.28435 6.86007 1.14036C6.77215 0.998424 6.64092 0.816166 6.42657 0.714504C6.15537 0.585877 5.84073 0.585877 5.56952 0.714504C5.35517 0.816167 5.22394 0.998426 5.13602 1.14036C5.04682 1.28436 4.95182 1.47439 4.84514 1.68777L4.83529 1.70748L1.12972 9.11862L1.12051 9.13704C1.03259 9.31284 0.951915 9.47416 0.898437 9.61107C0.843361 9.75208 0.787055 9.93805 0.817803 10.1462C0.858007 10.4183 1.00852 10.6618 1.23392 10.8195Z",
-              stroke: "currentColor"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              d: "M6 8.5V8.48633M6 4V6.75",
-              stroke: "currentColor",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx("defs", { children: /* @__PURE__ */ jsx("clipPath", { id: "clip0_3679_43594", children: /* @__PURE__ */ jsx("rect", { width: "12", height: "12", fill: "white" }) }) })
-      ]
-    }
-  );
-}
-
-export {
-  WarningSign
-};

package/dist/chunk-XF2X7TOO.cjs

@@ -1,53 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
-
-var _chunkSZNCRT6Tcjs = require('./chunk-SZNCRT6T.cjs');
-
-
-var _chunkJPRA3J5Ccjs = require('./chunk-JPRA3J5C.cjs');
-
-
-var _chunk4WKQPWLIcjs = require('./chunk-4WKQPWLI.cjs');
-
-
-var _chunkJMIYMECJcjs = require('./chunk-JMIYMECJ.cjs');
-
-
-var _chunk7PRNB5U5cjs = require('./chunk-7PRNB5U5.cjs');
-
-// src/components/SatoshiInputLabel.tsx
-var _jsxruntime = require('@emotion/react/jsx-runtime');
-function SatoshiInputLabel({
-  text,
-  availableSats,
-  showTooltip = true
-}) {
-  const availableSatsTooltipNode = showTooltip ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJPRA3J5Ccjs.Label, { style: { display: "inline-flex", margin: "0 0 0 3px" }, children: [
-    "available",
-    " ",
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkSZNCRT6Tcjs.InfoIconTooltip,
-      {
-        id: "available-balance-tooltip",
-        content: [
-          "Your available balance may differ from your total balance due to operational funds being held on the Lightning Network. ",
-          _chunk4WKQPWLIcjs.link.call(void 0, {
-            text: "Learn more",
-            externalLink: "https://docs.lightspark.com/lightspark-sdk/api-reference/types/Balances"
-          })
-        ]
-      }
-    )
-  ] }) : null;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkJPRA3J5Ccjs.Label, { children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: text }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { children: availableSats !== void 0 && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJMIYMECJcjs.Icon, { name: "Satoshi", width: 8, mr: 4, verticalAlign: -2 }),
-      _chunk7PRNB5U5cjs.addCommasToDigits.call(void 0, Math.floor(availableSats)),
-      availableSatsTooltipNode
-    ] }) })
-  ] });
-}
-
-
-
-exports.SatoshiInputLabel = SatoshiInputLabel;

package/dist/chunk-XHLHQC5Q.js

@@ -1,37 +0,0 @@
-// src/icons/Person.tsx
-import { jsx, jsxs } from "@emotion/react/jsx-runtime";
-function Person() {
-  return /* @__PURE__ */ jsxs(
-    "svg",
-    {
-      width: "100%",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: [
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M15.7485 6.5C15.7485 8.57107 14.0696 10.25 11.9985 10.25C9.92747 10.25 8.24854 8.57107 8.24854 6.5C8.24854 4.42893 9.92747 2.75 11.9985 2.75C14.0696 2.75 15.7485 4.42893 15.7485 6.5Z",
-            stroke: "currentColor",
-            strokeWidth: "1.5",
-            strokeLinejoin: "round"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "path",
-          {
-            d: "M11.9985 13.25C8.20293 13.25 5.43245 15.7735 4.67009 19.1657C4.54089 19.7406 5.0077 20.25 5.59696 20.25H18.4001C18.9894 20.25 19.4562 19.7406 19.327 19.1657C18.5646 15.7735 15.7941 13.25 11.9985 13.25Z",
-            stroke: "currentColor",
-            strokeWidth: "1.5",
-            strokeLinejoin: "round"
-          }
-        )
-      ]
-    }
-  );
-}
-
-export {
-  Person
-};

package/dist/chunk-XHLL5XVN.cjs

@@ -1,99 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _chunk4EK5RAZScjs = require('./chunk-4EK5RAZS.cjs');
-
-
-var _chunkWKRK5OVEcjs = require('./chunk-WKRK5OVE.cjs');
-
-
-var _chunkCFG65CGCcjs = require('./chunk-CFG65CGC.cjs');
-
-// src/components/Toggle.tsx
-var _styled = require('@emotion/styled'); var _styled2 = _interopRequireDefault(_styled);
-var _jsxruntime = require('@emotion/react/jsx-runtime');
-var defaultProps = {
-  on: false,
-  ml: 0,
-  mt: 0,
-  mb: 0,
-  disabled: false
-};
-function Toggle({
-  onChange,
-  bg,
-  ml = defaultProps.ml,
-  mt = defaultProps.mt,
-  mb = defaultProps.mb,
-  on = defaultProps.on,
-  disabled = defaultProps.disabled,
-  label,
-  id
-}) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, ToggleContainer, { mb, ml, mt, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      ToggleButton,
-      {
-        bg,
-        isOn: on,
-        onClick: () => onChange(!on),
-        disabled,
-        type: "button",
-        id
-      }
-    ),
-    label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ToggleLabel, { htmlFor: id, children: label })
-  ] });
-}
-var width = 44;
-var circleDim = 20;
-var circleOffset = 2;
-var ToggleButton = _styled2.default.call(void 0, _chunk4EK5RAZScjs.UnstyledButton)`
-  color: ${_chunkCFG65CGCcjs.colors.white};
-  font-weight: 500;
-  border-radius: 44px;
-  width: ${width}px;
-  height: 24px;
-  opacity: ${({ disabled }) => disabled ? 0.3 : 1};
-  background-color: ${({ bg, theme, isOn }) => {
-  if (bg) {
-    return bg;
-  } else if (isOn) {
-    return theme.success;
-  }
-  return _chunkWKRK5OVEcjs.themeOr.call(void 0, theme.c1Neutral, theme.c4Neutral)({ theme });
-}};
-  position: relative;
-  &:after {
-    content: "";
-    display: block;
-    position: absolute;
-    border-radius: 50%;
-    transition: right 0.1s;
-    box-shadow:
-      0 3px 8px 0 rgba(0, 0, 0, 0.15),
-      0 3px 1px 0 rgba(0, 0, 0, 0.06);
-    background-color: ${_chunkCFG65CGCcjs.colors.white};
-    width: ${circleDim}px;
-    height: ${circleDim}px;
-    top: ${circleOffset}px;
-    right: ${({ isOn }) => isOn ? `${circleOffset}px` : `${width - circleDim - circleOffset}px`};
-  }
-`;
-var gap = 12;
-var ToggleContainer = _styled2.default.span`
-  display: flex;
-  margin-bottom: ${({ mb }) => mb}px;
-  margin-top: ${({ mt }) => mt}px;
-  margin-left: ${({ ml }) => ml}px;
-  align-items: center;
-  gap: ${gap}px;
-`;
-var ToggleLabel = _styled2.default.label`
-  width: calc(100% - ${width + gap}px);
-  cursor: pointer;
-`;
-
-
-
-
-exports.Toggle = Toggle; exports.ToggleContainer = ToggleContainer;

package/dist/chunk-XKRDJQOZ.js

@@ -1,218 +0,0 @@
-import {
-  bannerTiming
-} from "./chunk-E3FGOYEJ.js";
-import {
-  useResizeObserver
-} from "./chunk-ZSWFGISK.js";
-import {
-  z
-} from "./chunk-55OQPFLF.js";
-import {
-  toReactNodes
-} from "./chunk-XSMF72UT.js";
-import {
-  Icon
-} from "./chunk-NGSQ2OOV.js";
-import {
-  getColor
-} from "./chunk-O42E7NAG.js";
-import {
-  bp
-} from "./chunk-JSGRNWSB.js";
-import {
-  Link
-} from "./chunk-HJQIDDKT.js";
-import {
-  colors
-} from "./chunk-MN4NUSPL.js";
-
-// src/components/Banner/Banner.tsx
-import styled from "@emotion/styled";
-import { useEffect, useMemo, useState } from "react";
-import { jsx, jsxs } from "@emotion/react/jsx-runtime";
-function Banner({
-  content,
-  to,
-  color,
-  maxMdContentJustify,
-  offsetTop = 0,
-  onHeightChange,
-  right,
-  left,
-  bgProgressDuration,
-  borderProgress,
-  minHeight = 0,
-  hPadding = 0,
-  borderColor
-}) {
-  const [width, setWidth] = useState(70);
-  const resizeProps = useMemo(() => ["height"], []);
-  const { ref, rect } = useResizeObserver(resizeProps);
-  useEffect(() => {
-    if (bgProgressDuration) {
-      setTimeout(() => {
-        setWidth(100);
-      }, 0);
-    }
-  }, [bgProgressDuration]);
-  useEffect(() => {
-    if (onHeightChange && typeof (rect == null ? void 0 : rect.height) === "number") {
-      onHeightChange(rect.height);
-    }
-  }, [onHeightChange, rect == null ? void 0 : rect.height]);
-  let contentNode = null;
-  if (content) {
-    const contentNodes = toReactNodes(content);
-    if (to) {
-      contentNode = /* @__PURE__ */ jsx(Link, { to, children: /* @__PURE__ */ jsxs(BannerFlexInnerContent, { children: [
-        contentNodes,
-        /* @__PURE__ */ jsx(Icon, { name: "ArrowRight", width: 12, ml: 6 })
-      ] }) });
-    } else {
-      contentNode = contentNodes;
-    }
-  }
-  const innerContent = content ? /* @__PURE__ */ jsx(
-    BannerInnerContent,
-    {
-      isVisible: Boolean(content),
-      maxMdContentJustify: maxMdContentJustify || "center",
-      minHeight,
-      children: contentNode
-    }
-  ) : null;
-  return /* @__PURE__ */ jsxs(
-    StyledBanner,
-    {
-      colorProp: color,
-      borderColor,
-      isVisible: Boolean(content),
-      offsetTop,
-      hasSideContent: Boolean(right || left),
-      ref,
-      borderProgress,
-      hPadding,
-      children: [
-        left,
-        innerContent,
-        right,
-        bgProgressDuration && /* @__PURE__ */ jsx(
-          BannerGradientBg,
-          {
-            duration: bgProgressDuration,
-            width,
-            isVisible: Boolean(content)
-          }
-        )
-      ]
-    }
-  );
-}
-var BannerInnerContent = styled.div`
-  z-index: 1;
-  padding: ${({ isVisible }) => isVisible ? `0px 17.5px` : "0px"};
-  text-align: center;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  min-height: ${({ minHeight }) => typeof minHeight === "number" ? `${minHeight}px` : "auto"};
-
-  & > * {
-    position: relative;
-    z-index: 1;
-    width: 100%;
-
-    ${({ maxMdContentJustify }) => bp.maxMd(
-  maxMdContentJustify ? `justify-content: ${maxMdContentJustify};` : ""
-)};
-  }
-`;
-var StyledBanner = styled.div`
-  position: fixed;
-  left: 0;
-
-  width: 100%;
-  z-index: ${z.notificationBanner};
-  color: ${colors.white};
-  font-weight: 500;
-  background-color: ${({ colorProp, theme }) => colorProp ? getColor(theme, colorProp) : "none"};
-  display: flex;
-  justify-content: ${({ hasSideContent }) => hasSideContent ? "space-between" : "center"};
-  align-items: center;
-  padding: ${({ hPadding }) => `0 ${hPadding}px`};
-  ${({ borderColor, theme }) => borderColor ? `border-bottom: 1px solid ${getColor(theme, borderColor)};` : ""}
-
-  ${({ borderProgress }) => {
-  if (typeof borderProgress === "number") {
-    return `
-        &:before {
-          content: "";
-          position: absolute;
-          left: 0;
-          width: 100%;
-          background-color: #C1C5CD;
-          top: 0;
-          height: 4px;
-          ${bp.sm(`
-            height: 2px;
-            top: initial;
-            bottom: 0;
-          `)}
-        }
-        &:after {
-          content: "";
-          position: absolute;
-          bottom: 0;
-          left: 0;
-          width: ${borderProgress}%;
-          background-color: #2B66C2;
-          transition: width 0.3s ease-in;
-          top: 0;
-          height: 4px;
-          ${bp.sm(`
-            height: 2px;
-            top: initial;
-            bottom: 0;
-          `)}
-        }
-      `;
-  }
-  return "";
-}}
-
-  ${bp.sm(`
-    z-index: ${z.smBanner};
-  `)}
-`;
-var BannerGradientBg = styled.div`
-  position: absolute;
-  z-index: 0;
-  top: 0;
-  left: 0;
-  width: ${({ width }) => width}%;
-  height: 100%;
-
-  background: linear-gradient(
-    90deg,
-    #000000 -25.9%,
-    #1b4077 14.55%,
-    #a152c7 82.22%,
-    #3f2e7e 115.32%
-  );
-
-  transition: all ${bannerTiming};
-  height: ${({ isVisible }) => isVisible ? "auto" : "0"}px;
-
-  transition: width ${({ duration }) => duration}s
-    cubic-bezier(0.33, 0.54, 0.47, 0.87);
-`;
-var BannerFlexInnerContent = styled.div`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-`;
-
-export {
-  Banner
-};