welcome-ui 8.3.0 → 9.0.0-alpha.0

package/dist/theme.mjs

@@ -1,1846 +0,0 @@
-"use client";
-import { css as S, rpxTransformers as M, defaultTheme as u } from "@xstyled/styled-components";
-import { g as N } from "./_commonjsHelpers-CXJ7dpIk.mjs";
-import { h as m } from "./hex-to-rgba-BIDK-3ab.mjs";
-var f, D;
-function $() {
-  if (D) return f;
-  D = 1;
-  function o(r) {
-    return r != null && typeof r == "object" && r["@@functional/placeholder"] === !0;
-  }
-  return f = o, f;
-}
-var x, T;
-function H() {
-  if (T) return x;
-  T = 1;
-  var o = /* @__PURE__ */ $();
-  function r(e) {
-    return function i(n) {
-      return arguments.length === 0 || o(n) ? i : e.apply(this, arguments);
-    };
-  }
-  return x = r, x;
-}
-var C, R;
-function q() {
-  if (R) return C;
-  R = 1;
-  var o = /* @__PURE__ */ H(), r = /* @__PURE__ */ $();
-  function e(i) {
-    return function n(l, d) {
-      switch (arguments.length) {
-        case 0:
-          return n;
-        case 1:
-          return r(l) ? n : o(function(a) {
-            return i(l, a);
-          });
-        default:
-          return r(l) && r(d) ? n : r(l) ? o(function(a) {
-            return i(a, d);
-          }) : r(d) ? o(function(a) {
-            return i(l, a);
-          }) : i(l, d);
-      }
-    };
-  }
-  return C = e, C;
-}
-var y, _;
-function O() {
-  if (_) return y;
-  _ = 1;
-  var o = /* @__PURE__ */ H(), r = /* @__PURE__ */ q(), e = /* @__PURE__ */ $();
-  function i(n) {
-    return function l(d, a, s) {
-      switch (arguments.length) {
-        case 0:
-          return l;
-        case 1:
-          return e(d) ? l : r(function(t, c) {
-            return n(d, t, c);
-          });
-        case 2:
-          return e(d) && e(a) ? l : e(d) ? r(function(t, c) {
-            return n(t, a, c);
-          }) : e(a) ? r(function(t, c) {
-            return n(d, t, c);
-          }) : o(function(t) {
-            return n(d, a, t);
-          });
-        default:
-          return e(d) && e(a) && e(s) ? l : e(d) && e(a) ? r(function(t, c) {
-            return n(t, c, s);
-          }) : e(d) && e(s) ? r(function(t, c) {
-            return n(t, a, c);
-          }) : e(a) && e(s) ? r(function(t, c) {
-            return n(d, t, c);
-          }) : e(d) ? o(function(t) {
-            return n(t, a, s);
-          }) : e(a) ? o(function(t) {
-            return n(d, t, s);
-          }) : e(s) ? o(function(t) {
-            return n(d, a, t);
-          }) : n(d, a, s);
-      }
-    };
-  }
-  return y = i, y;
-}
-var k, z;
-function K() {
-  if (z) return k;
-  z = 1;
-  function o(r) {
-    return Object.prototype.toString.call(r) === "[object Object]";
-  }
-  return k = o, k;
-}
-var F, B;
-function G() {
-  if (B) return F;
-  B = 1;
-  function o(r, e) {
-    return Object.prototype.hasOwnProperty.call(e, r);
-  }
-  return F = o, F;
-}
-var v, A;
-function Y() {
-  if (A) return v;
-  A = 1;
-  var o = /* @__PURE__ */ O(), r = /* @__PURE__ */ G(), e = /* @__PURE__ */ o(function(n, l, d) {
-    var a = {}, s;
-    l = l || {}, d = d || {};
-    for (s in l)
-      r(s, l) && (a[s] = r(s, d) ? n(s, l[s], d[s]) : l[s]);
-    for (s in d)
-      r(s, d) && !r(s, a) && (a[s] = d[s]);
-    return a;
-  });
-  return v = e, v;
-}
-var w, E;
-function J() {
-  if (E) return w;
-  E = 1;
-  var o = /* @__PURE__ */ O(), r = /* @__PURE__ */ K(), e = /* @__PURE__ */ Y(), i = /* @__PURE__ */ o(function n(l, d, a) {
-    return e(function(s, t, c) {
-      return r(t) && r(c) ? n(l, t, c) : l(s, t, c);
-    }, d, a);
-  });
-  return w = i, w;
-}
-var W, L;
-function X() {
-  if (L) return W;
-  L = 1;
-  var o = /* @__PURE__ */ q(), r = /* @__PURE__ */ J(), e = /* @__PURE__ */ o(function(n, l) {
-    return r(function(d, a, s) {
-      return s;
-    }, n, l);
-  });
-  return W = e, W;
-}
-var Z = /* @__PURE__ */ X();
-const I = /* @__PURE__ */ N(Z), Q = (o) => {
-  const { borderWidths: r, colors: e, fontSizes: i, radii: n, space: l, texts: d, transitions: a } = o;
-  return {
-    content: {
-      fontSize: i.sm
-    },
-    icon: {
-      color: e["neutral-90"]
-    },
-    padding: l.lg,
-    title: d.h5,
-    wrapper: {
-      backgroundColor: e["neutral-10"],
-      border: `${r.sm} solid ${e["neutral-30"]}`,
-      borderRadius: n.md,
-      transition: a.medium
-    }
-  };
-}, V = (o) => {
-  const { borderWidths: r, colors: e, fontSizes: i, fontWeights: n, radii: l, space: d } = o, a = (s) => ({
-    backgroundColor: e[`${s}-10`],
-    borderColor: e[`${s}-10`],
-    color: e[`${s}-90`]
-  });
-  return {
-    ai: {
-      backgroundColor: e["violet-10"],
-      borderColor: e["violet-10"],
-      color: e["violet-90"]
-    },
-    beige: {
-      backgroundColor: e["beige-20"],
-      borderColor: e["beige-20"],
-      color: e["beige-80"]
-    },
-    danger: a("red"),
-    default: {
-      backgroundColor: e["neutral-10"],
-      borderColor: e["neutral-30"],
-      borderRadius: l.lg,
-      borderStyle: "solid",
-      borderWidth: r.sm,
-      color: e["neutral-80"],
-      fontSize: i.sm
-    },
-    info: a("blue"),
-    sizes: {
-      md: {
-        padding: d.xl
-      },
-      sm: {
-        padding: d.lg
-      }
-    },
-    success: a("green"),
-    title: {
-      default: {
-        color: e["neutral-90"],
-        fontWeight: n.medium
-      },
-      sizes: {
-        md: {
-          marginBottom: d.sm
-        },
-        sm: {
-          marginBottom: d.xs
-        }
-      }
-    },
-    warning: a("orange")
-  };
-}, rr = (o) => {
-  const { colors: r, fontWeights: e, toRem: i } = o;
-  return {
-    sizes: {
-      lg: i(40),
-      md: i(30),
-      sm: i(20),
-      xl: i(50),
-      xxl: i(60)
-    },
-    text: {
-      color: r["neutral-90"],
-      fontWeight: e.bold
-    }
-  };
-}, er = (o) => {
-  const { colors: r, fontWeights: e, space: i, texts: n, toRem: l } = o;
-  return {
-    default: {
-      ...n.xs,
-      fontWeight: e.medium
-    },
-    disabled: {
-      default: {
-        backgroundColor: r["beige-20"],
-        color: r["beige-40"]
-      },
-      primary: {
-        backgroundColor: r["primary-50"],
-        color: r["primary-80"]
-      }
-    },
-    sizes: {
-      md: {
-        borderRadius: l(14),
-        height: l(20),
-        padding: i.xs
-      },
-      sm: {
-        borderRadius: l(14),
-        height: l(16),
-        padding: i.xxs
-      }
-    },
-    variants: {
-      default: {
-        backgroundColor: r["beige-30"],
-        color: r["beige-70"]
-      },
-      primary: {
-        backgroundColor: r["primary-40"],
-        color: r["neutral-90"]
-      }
-    }
-  };
-}, or = (o) => {
-  const { colors: r, space: e, texts: i } = o;
-  return {
-    item: {
-      active: {
-        color: r["neutral-70"]
-      },
-      default: {
-        color: r["neutral-50"],
-        textDecoration: "none"
-      },
-      hover: {
-        color: r["neutral-70"]
-      }
-    },
-    list: {
-      ...i["subtitle-sm"],
-      padding: `${e.sm} 0`
-    },
-    separator: {
-      color: r["neutral-50"],
-      padding: `0 ${e.xs}`
-    }
-  };
-}, tr = (o) => {
-  const { colors: r, focus: e, fontWeights: i, radii: n, space: l, texts: d, toRem: a } = o, s = {
-    ...d.xs,
-    borderRadius: n.md,
-    color: r["neutral-10"],
-    fontWeight: i.bold,
-    letterSpacing: 0
-  };
-  return {
-    active: {
-      ai: {
-        ghost: {
-          backgroundColor: r["violet-30"]
-        },
-        primary: {
-          backgroundColor: r["violet-40"],
-          borderColor: r["violet-40"]
-        },
-        tertiary: {
-          backgroundColor: r["violet-30"]
-        }
-      },
-      danger: {
-        ghost: {
-          backgroundColor: r["red-20"]
-        },
-        primary: {
-          backgroundColor: r["red-50"],
-          borderColor: r["red-50"]
-        },
-        tertiary: {
-          backgroundColor: r["red-20"]
-        }
-      },
-      ghost: {
-        backgroundColor: m(r["neutral-90"], 0.4)
-      },
-      primary: {
-        backgroundColor: r["primary-10"],
-        borderColor: r["primary-10"]
-      },
-      secondary: {
-        backgroundColor: r["neutral-50"],
-        borderColor: r["neutral-50"]
-      },
-      tertiary: {
-        backgroundColor: m(r["neutral-90"], 0.4)
-      }
-    },
-    ai: {
-      ghost: {
-        backgroundColor: r["neutral-10"],
-        borderColor: "transparent",
-        color: r["violet-70"]
-      },
-      primary: {
-        backgroundColor: r["violet-70"],
-        borderColor: "transparent",
-        color: r["neutral-10"]
-      },
-      tertiary: {
-        backgroundColor: "neutral-10",
-        borderColor: r["violet-70"],
-        color: r["violet-70"]
-      }
-    },
-    danger: {
-      ghost: {
-        backgroundColor: "transparent",
-        borderColor: "transparent",
-        color: r["red-80"]
-      },
-      primary: {
-        backgroundColor: r["red-70"],
-        borderColor: r["red-70"],
-        color: r["neutral-10"]
-      },
-      tertiary: {
-        backgroundColor: "transparent",
-        borderColor: r["red-80"],
-        color: r["red-80"]
-      }
-    },
-    disabled: {
-      ...s,
-      "&:focus": { ...e(r["beige-10"]) },
-      backgroundColor: r["beige-40"],
-      borderColor: r["beige-40"],
-      color: r["beige-70"]
-    },
-    focus: {
-      ai: {
-        ghost: { ...e(r["violet-50"]) },
-        primary: { ...e(r["violet-50"]) },
-        tertiary: { ...e(r["violet-50"]) }
-      },
-      danger: {
-        ghost: { ...e(r["red-40"]) },
-        primary: { ...e(r["red-40"]) },
-        tertiary: { ...e(r["red-40"]) }
-      },
-      ghost: { ...e(r["neutral-40"]) },
-      primary: { ...e(r["primary-20"]) },
-      secondary: { ...e(r["neutral-40"]) },
-      tertiary: { ...e(r["neutral-40"]) }
-    },
-    ghost: {
-      ...s,
-      backgroundColor: "transparent",
-      borderColor: "transparent",
-      color: r["neutral-90"]
-    },
-    hover: {
-      ai: {
-        ghost: {
-          backgroundColor: r["violet-10"]
-        },
-        primary: {
-          backgroundColor: r["violet-60"],
-          borderColor: "transparent"
-        },
-        tertiary: {
-          backgroundColor: r["violet-10"]
-        }
-      },
-      danger: {
-        ghost: {
-          backgroundColor: r["red-10"]
-        },
-        primary: {
-          backgroundColor: r["red-60"],
-          borderColor: r["red-60"]
-        },
-        tertiary: {
-          backgroundColor: r["red-10"]
-        }
-      },
-      ghost: {
-        backgroundColor: m(r["neutral-90"], 0.1)
-      },
-      primary: {
-        backgroundColor: r["primary-30"],
-        borderColor: r["primary-30"]
-      },
-      secondary: {
-        backgroundColor: r["neutral-70"],
-        borderColor: "transparent"
-      },
-      tertiary: {
-        backgroundColor: m(r["neutral-90"], 0.1)
-      }
-    },
-    icon: {
-      default: {
-        lg: a(16),
-        md: a(16),
-        sm: a(16),
-        xs: a(12)
-      },
-      only: {
-        lg: a(24),
-        md: a(16),
-        sm: a(16),
-        xs: a(16)
-      }
-    },
-    primary: {
-      ...s,
-      backgroundColor: r["primary-40"],
-      borderColor: r["primary-40"],
-      color: o.colors["neutral-90"]
-    },
-    secondary: {
-      ...s,
-      backgroundColor: r["neutral-90"],
-      borderColor: r["neutral-90"]
-    },
-    sizes: {
-      lg: {
-        ...d.sm,
-        fontWeight: i.bold,
-        height: a(48),
-        padding: `${l.md} ${l.xl}`
-      },
-      md: {
-        ...d.sm,
-        fontWeight: i.bold,
-        height: a(40),
-        padding: `${l.sm} ${l.lg}`
-      },
-      sm: {
-        height: a(32),
-        padding: `${l.sm} ${l.md}`
-      },
-      xs: {
-        height: a(24),
-        padding: `${l.xs} ${l.sm}`
-      }
-    },
-    tertiary: {
-      ...s,
-      backgroundColor: "transparent",
-      borderColor: r["neutral-90"],
-      color: r["neutral-90"]
-    }
-  };
-}, nr = (o) => {
-  const { borderWidths: r, colors: e } = o;
-  return {
-    default: {
-      backgroundColor: e["neutral-10"],
-      borderColor: e["neutral-30"],
-      borderStyle: "solid",
-      borderWidth: r.sm
-    }
-  };
-}, ir = (o) => {
-  const { colors: r, radii: e, toRem: i } = o;
-  return {
-    checked: {
-      backgroundColor: r["primary-40"],
-      borderColor: r["primary-40"],
-      color: r["neutral-90"]
-    },
-    default: {
-      borderRadius: e.sm,
-      flexShrink: 0,
-      height: i(16),
-      width: i(16)
-    },
-    disabled: {
-      borderColor: r["beige-60"]
-    }
-  };
-}, ar = (o) => {
-  const { colors: r, fontWeights: e } = o;
-  return {
-    item: {
-      selected: {
-        backgroundColor: r["primary-40"],
-        color: r["neutral-90"],
-        fontWeight: e.bold,
-        outline: "none"
-      },
-      today: {
-        color: r["neutral-90"],
-        fontWeight: e.bold
-      }
-    }
-  };
-}, lr = (o) => {
-  const { colors: r, space: e, toRem: i } = o;
-  return {
-    backdrop: {
-      backgroundColor: r.overlay,
-      zIndex: 999
-    },
-    closeButton: {},
-    content: {
-      padding: `${e.xl}`
-    },
-    default: {
-      zIndex: 999
-    },
-    footer: {
-      backgroundColor: r["neutral-10"],
-      padding: `${e.xl}`
-    },
-    sizes: {
-      horizontal: {
-        lg: { width: i(680) },
-        md: { width: i(550) },
-        sm: { width: i(400) }
-      },
-      vertical: {
-        lg: { height: i(680) },
-        md: { height: i(550) },
-        sm: { height: i(400) }
-      }
-    },
-    title: {
-      backgroundColor: r["neutral-10"],
-      margin: 0,
-      padding: `${e.xl} ${e["5xl"]} ${e.xl} ${e.xl}`
-    }
-  };
-}, dr = (o) => {
-  const { colors: r, fontSizes: e, radii: i, toRem: n } = o, l = r["beige-30"];
-  return {
-    inner: {
-      borderRadius: i.md,
-      fontSize: e.sm,
-      minWidth: n(130)
-    },
-    item: {
-      "&:focus": {
-        backgroundColor: r["beige-30"],
-        color: r["neutral-90"]
-      },
-      "&:hover": {
-        backgroundColor: r["beige-30"],
-        color: r["neutral-90"]
-      },
-      "&[disabled]": {
-        backgroundColor: "transparent",
-        color: r["beige-40"],
-        cursor: "not-allowed"
-      },
-      backgroundColor: "transparent",
-      color: r["beige-70"]
-    },
-    separator: {
-      backgroundColor: l
-    }
-  };
-}, sr = (o) => {
-  const { colors: r, toRem: e } = o;
-  return {
-    default: {
-      borderStyle: "dashed",
-      minHeight: e(200)
-    },
-    disabled: {
-      backgroundColor: r["beige-30"]
-    },
-    dragAccept: {},
-    dragReject: {}
-  };
-}, cr = (o) => {
-  const { colors: r, texts: e } = o;
-  return {
-    danger: {
-      color: r["red-70"]
-    },
-    default: {
-      ...e.xs,
-      color: r["neutral-60"]
-    },
-    success: {
-      color: r["green-70"]
-    },
-    warning: {
-      color: r["orange-70"]
-    }
-  };
-}, gr = ({ toRem: o }) => ({
-  lg: o(32),
-  md: o(24),
-  sm: o(16),
-  xl: o(48),
-  xs: o(12),
-  xxl: o(64)
-}), ur = (o) => {
-  const { colors: r, fontSizes: e, fontWeights: i } = o;
-  return {
-    color: r["neutral-60"],
-    fontSize: e.sm,
-    fontWeight: i.medium
-  };
-}, br = (o) => {
-  const { colors: r, fontWeights: e, icons: i, space: n, transitions: l } = o;
-  return {
-    default: {
-      color: r["neutral-90"],
-      fontWeight: e.medium,
-      transition: l.medium
-    },
-    disabled: {
-      backgroundImage: `linear-gradient(0deg, ${r["neutral-30"]}, ${r["neutral-30"]} 100%)`,
-      color: r["neutral-50"]
-    },
-    primary: {
-      default: {},
-      hover: {}
-    },
-    secondary: {
-      default: {
-        backgroundImage: `linear-gradient(0deg, ${r["neutral-90"]}, ${r["neutral-90"]} 100%)`
-      },
-      hover: {
-        color: r["neutral-10"]
-      }
-    },
-    withExternalLink: {
-      backgroundSize: `calc(100% - ${i.sm} - ${n.sm}) 50%`
-    }
-  };
-}, mr = ({ toRem: o }) => ({
-  lg: o(20),
-  md: o(15),
-  sm: o(10),
-  xs: o(8)
-}), hr = (o) => {
-  const { colors: r, radii: e, space: i, toRem: n } = o;
-  return {
-    backdrop: {
-      backgroundColor: r.overlay,
-      zIndex: 999
-    },
-    body: {
-      color: r["neutral-90"],
-      paddingBottom: i.xxl,
-      paddingLeft: i.xxl,
-      paddingRight: i["3xl"]
-    },
-    cover: {},
-    default: {
-      borderRadius: e.md,
-      zIndex: 999
-    },
-    footer: {
-      backgroundColor: r["neutral-10"],
-      borderBottomLeftRadius: e.md,
-      borderBottomRightRadius: e.md,
-      borderTop: `solid ${r["neutral-30"]}`,
-      children: {
-        paddingBottom: i.xl,
-        paddingLeft: i.xxl,
-        paddingRight: i.xxl,
-        paddingTop: i.lg
-      },
-      information: {
-        backgroundColor: r["beige-20"],
-        paddingBottom: i.xxl,
-        paddingLeft: i.xxl,
-        paddingRight: i.xxl,
-        paddingTop: i.xl
-      }
-    },
-    gutter: n(32),
-    header: {
-      backgroundColor: r["neutral-10"],
-      borderTopLeftRadius: e.md,
-      borderTopRightRadius: e.md,
-      paddingBottom: i.xxl,
-      paddingLeft: i.xxl,
-      paddingRight: i["3xl"],
-      paddingTop: i.xxl,
-      subtitle: {
-        color: r["neutral-70"],
-        margin: 0,
-        variant: "sm"
-      }
-    },
-    sizes: {
-      auto: {},
-      lg: {
-        width: n(730)
-      },
-      md: {
-        width: n(600)
-      },
-      sm: {
-        width: n(450)
-      },
-      xs: {
-        width: n(320)
-      }
-    }
-  };
-}, pr = (o) => {
-  const { colors: r, focus: e, fontSizes: i, fontWeights: n, toRem: l } = o;
-  return {
-    active: {
-      "&:hover, &:focus": {
-        backgroundColor: r["neutral-90"]
-      },
-      backgroundColor: r["neutral-90"],
-      color: r["neutral-10"]
-    },
-    default: {
-      color: r["neutral-90"],
-      fontSize: i.xs,
-      fontWeight: n.bold,
-      height: l(32),
-      width: l(32)
-    },
-    disabled: {
-      backgroundColor: r["beige-40"],
-      color: r["beige-70"]
-    },
-    item: {
-      "&:focus": { ...e(r["neutral-60"]) },
-      "&:hover, &:focus": {
-        backgroundColor: r["neutral-30"]
-      }
-    }
-  };
-}, fr = (o) => {
-  const { borderWidths: r, colors: e, space: i, texts: n, toRem: l } = o;
-  return {
-    content: {
-      display: "block",
-      padding: i.md
-    },
-    default: {
-      ...n.sm,
-      backgroundColor: e["neutral-90"],
-      color: e["neutral-10"],
-      maxWidth: l(700),
-      zIndex: 1
-    },
-    title: {
-      ...n.h6,
-      borderBottomColor: e["neutral-70"],
-      borderBottomStyle: "solid",
-      borderBottomWidth: r.sm,
-      color: e["neutral-10"],
-      padding: `${i.md} ${i.md} ${i.xs}`
-    }
-  };
-}, xr = (o) => {
-  const { colors: r, toRem: e } = o;
-  return {
-    checked: {
-      borderColor: r["primary-40"],
-      color: r["neutral-90"]
-    },
-    checkedCenteredColor: {
-      default: r["primary-40"],
-      disabled: r["beige-60"]
-    },
-    default: {
-      height: e(16),
-      width: e(16)
-    }
-  };
-}, Cr = (o) => {
-  const { colors: r } = o;
-  return {
-    checked: {
-      "&:hover": {
-        backgroundColor: r["primary-30"]
-      },
-      backgroundColor: r["primary-40"],
-      borderColor: r["primary-40"],
-      color: o.colors["neutral-90"]
-    },
-    default: {
-      "&:hover": {
-        backgroundColor: r["beige-30"]
-      }
-    }
-  };
-}, yr = (o) => {
-  const { borderWidths: r, colors: e } = o;
-  return {
-    default: {
-      backgroundColor: e["beige-40"],
-      backgroundImage: `linear-gradient(${e["primary-40"]}, ${e["primary-40"]})`
-    },
-    disabled: {
-      backgroundImage: `linear-gradient(${e["beige-60"]}, ${e["beige-60"]})`
-    },
-    focused: {
-      disabled: {
-        outline: "none"
-      },
-      outline: `${r.md} solid ${e["primary-40"]}`
-    },
-    output: {
-      tooltip: {
-        backgroundColor: e["neutral-90"],
-        border: `${r.sm} solid ${e["neutral-70"]}}`,
-        color: e["neutral-10"]
-      }
-    },
-    rangeInput: {
-      disabled: {
-        backgroundColor: e["beige-60"]
-      }
-    },
-    selector: {
-      backgroundColor: e["neutral-90"],
-      border: `${r.md} solid`,
-      borderRadius: "50%",
-      disabled: {
-        backgroundColor: e["beige-60"]
-      }
-    }
-  };
-}, kr = (o) => {
-  const { colors: r } = o;
-  return {
-    navigation: {
-      bullet: {
-        active: { backgroundColor: r["primary-40"] },
-        default: { backgroundColor: r["beige-40"] }
-      }
-    }
-  };
-}, Fr = (o) => {
-  const { borderWidths: r, colors: e, fontWeights: i, space: n } = o;
-  return {
-    td: {
-      padding: n.xl,
-      textAlign: "left"
-    },
-    th: {
-      borderBottomColor: e["neutral-90"],
-      borderBottomStyle: "solid",
-      borderBottomWidth: r.sm,
-      color: e["neutral-60"],
-      fontWeight: i.medium,
-      textAlign: "left"
-    },
-    tr: {
-      clickable: {
-        cursor: "pointer"
-      },
-      danger: {
-        backgroundColor: e["red-10"],
-        color: e["red-70"]
-      },
-      default: {
-        borderBottomColor: e["neutral-30"],
-        borderBottomStyle: "solid",
-        borderBottomWidth: r.sm
-      },
-      info: {
-        backgroundColor: e["blue-10"],
-        color: e["blue-70"]
-      },
-      success: {
-        backgroundColor: e["green-10"],
-        color: e["green-70"]
-      },
-      warning: {
-        backgroundColor: e["orange-10"],
-        color: e["orange-80"]
-      }
-    }
-  };
-}, vr = (o) => {
-  const { borderWidths: r, colors: e, fontSizes: i, fontWeights: n, lineHeights: l, space: d } = o;
-  return {
-    activeBar: {
-      horizontal: {
-        background: e["primary-40"],
-        height: r.md
-      },
-      vertical: {
-        background: e["primary-40"],
-        width: r.md
-      }
-    },
-    badge: {
-      maxHeight: d.lg
-    },
-    icon: {
-      maxHeight: d.lg,
-      maxWidth: d.lg
-    },
-    item: {
-      active: {
-        color: e["neutral-90"]
-      },
-      default: {
-        color: e["neutral-70"],
-        fontWeight: n.medium,
-        lineHeight: l.md,
-        textDecoration: "none"
-      },
-      disabled: {
-        color: e["neutral-50"]
-      },
-      focus: {
-        color: e["neutral-90"]
-      },
-      size: {
-        md: {
-          fontSize: i.md
-        },
-        sm: {
-          fontSize: i.sm
-        }
-      }
-    },
-    panel: {
-      horizontal: {
-        "&:focus": {
-          outline: "none"
-        },
-        marginTop: d.xl
-      },
-      vertical: {
-        "&:focus": {
-          outline: "none"
-        }
-      }
-    },
-    tabsBorder: {
-      horizontal: {
-        boxShadow: `inset 0 -${r.sm} 0 ${e["neutral-30"]}`
-      },
-      vertical: {
-        boxShadow: `inset -${r.sm} 0 0 ${e["neutral-30"]}`
-      }
-    }
-  };
-}, wr = (o) => {
-  const { colors: r, fontSizes: e, fontWeights: i, radii: n, space: l, toRem: d } = o, a = {
-    md: d(32),
-    sm: d(24),
-    xs: d(20)
-  }, s = (g) => ({
-    backgroundColor: r[`${g}-10`],
-    color: r[`${g}-90`]
-  }), t = (g) => ({
-    backgroundColor: r[`${g}-20`]
-  }), c = (g) => ({
-    backgroundColor: r[`${g}-${g === "green" ? "30" : "40"}`],
-    color: r["neutral-90"]
-  }), b = (g) => ({
-    backgroundColor: r[`${g}-${g === "green" ? "40" : "50"}`]
-  });
-  return {
-    default: {
-      borderRadius: n.md,
-      fontWeight: i.medium
-    },
-    hover: {
-      ai: {
-        backgroundColor: r["violet-30"]
-      },
-      blue: b("blue"),
-      danger: t("red"),
-      default: {
-        backgroundColor: r["beige-30"]
-      },
-      green: b("green"),
-      info: t("blue"),
-      orange: b("orange"),
-      pink: b("pink"),
-      primary: {
-        backgroundColor: r["primary-50"]
-      },
-      success: t("green"),
-      teal: b("teal"),
-      violet: b("violet"),
-      warning: t("orange")
-    },
-    icon: {
-      md: d(16),
-      sm: d(12),
-      xs: d(12)
-    },
-    shape: {
-      md: {
-        height: a.md,
-        width: a.md
-      },
-      sm: {
-        height: a.sm,
-        width: a.sm
-      },
-      xs: {
-        height: a.xs,
-        width: a.xs
-      }
-    },
-    sizes: {
-      md: {
-        fontSize: e.sm,
-        gap: l.sm,
-        height: a.md,
-        padding: `${l.xs} ${l.sm}`
-      },
-      sm: {
-        fontSize: e.xs,
-        gap: l.xs,
-        height: a.sm,
-        padding: `${l.xs} ${l.sm}`
-      },
-      xs: {
-        borderRadius: n.sm,
-        fontSize: e.xs,
-        gap: l.xs,
-        height: a.xs,
-        padding: `${l.xxs} ${l.xs}`
-      }
-    },
-    variants: {
-      ai: {
-        backgroundColor: r["violet-20"],
-        color: r["violet-90"]
-      },
-      blue: c("blue"),
-      danger: s("red"),
-      default: {
-        backgroundColor: r["beige-20"],
-        color: r["beige-90"]
-      },
-      green: c("green"),
-      info: s("blue"),
-      orange: c("orange"),
-      pink: c("pink"),
-      primary: {
-        backgroundColor: r["primary-40"],
-        color: o.colors["neutral-90"]
-      },
-      success: s("green"),
-      teal: c("teal"),
-      violet: c("violet"),
-      warning: s("orange")
-    }
-  };
-}, Wr = (o) => {
-  const { space: r, toRem: e } = o;
-  return {
-    minHeight: e(130),
-    padding: r.md
-  };
-}, $r = (o, r) => {
-  const { toEm: e, toRem: i } = r, n = i;
-  return {
-    h0: n(65),
-    h1: n(45),
-    h2: n(36),
-    h3: n(26),
-    h4: n(20),
-    h5: n(16),
-    h6: n(14),
-    lg: n(18),
-    md: n(16),
-    sm: n(14),
-    "subtitle-md": n(13),
-    "subtitle-sm": n(11),
-    xs: n(12)
-  };
-}, Sr = ({
-  defaultLineHeight: o,
-  toRem: r
-}) => ({
-  h0: r(72),
-  h1: r(48),
-  h2: r(40),
-  h3: r(32),
-  h4: r(24),
-  h5: r(18),
-  h6: r(16),
-  html: o,
-  lg: r(24),
-  md: r(18),
-  sm: r(18),
-  "subtitle-md": o,
-  "subtitle-sm": o,
-  xs: r(14)
-}), Dr = {
-  bold: 600,
-  medium: 500,
-  regular: 400
-}, Tr = ({
-  defaultLetterSpacing: o,
-  toRem: r
-}) => ({
-  h0: r(-1.7),
-  h1: r(-1.2),
-  h2: r(-1),
-  h3: r(-0.9),
-  h4: r(-0.6),
-  h5: r(-0.5),
-  h6: r(-0.5),
-  html: o,
-  lg: o,
-  md: o,
-  sm: o,
-  "subtitle-md": r(-0.2),
-  "subtitle-sm": r(-0.2),
-  xs: r(-0.2)
-}), Rr = (o) => {
-  const { fontWeights: r } = o;
-  return {
-    h0: r.bold,
-    h1: r.bold,
-    h2: r.bold,
-    h3: r.bold,
-    h4: r.bold,
-    h5: r.bold,
-    h6: r.bold,
-    lg: r.regular,
-    md: r.regular,
-    sm: r.regular,
-    "subtitle-md": r.bold,
-    "subtitle-sm": r.medium,
-    xs: r.regular
-  };
-}, _r = (o) => {
-  const { fonts: r } = o;
-  return {
-    h0: r.headings,
-    h1: r.headings,
-    h2: r.headings,
-    h3: r.headings,
-    h4: r.headings,
-    h5: r.headings,
-    h6: r.headings,
-    "subtitle-md": r.headings,
-    "subtitle-sm": r.headings
-  };
-}, zr = () => ({
-  "subtitle-md": "uppercase",
-  "subtitle-sm": "uppercase"
-}), Br = (o) => {
-  const { colors: r } = o;
-  return {
-    h0: r["neutral-90"],
-    h1: r["neutral-90"],
-    h2: r["neutral-90"],
-    h3: r["neutral-90"],
-    h4: r["neutral-90"],
-    h5: r["neutral-90"],
-    h6: r["neutral-90"]
-  };
-}, U = (o) => {
-  const {
-    fontSizes: r,
-    letterSpacings: e,
-    lineHeights: i,
-    textsFontColors: n,
-    textsFontFamily: l,
-    textsFontWeights: d,
-    textsTextTransform: a
-  } = o;
-  return Object.keys(r).reduce((s, t) => ({
-    ...s,
-    [t]: {
-      color: n[t],
-      fontFamily: l[t] || void 0,
-      fontSize: r[t],
-      fontWeight: d[t],
-      letterSpacing: e[t] || void 0,
-      lineHeight: i[t] || i.lg,
-      textTransform: a[t] || void 0
-    }
-  }), {});
-}, Ar = (o, r, e) => ({
-  headings: [r, "sans-serif"].join(", "),
-  icons: e,
-  texts: [o, "sans-serif"].join(", ")
-}), Er = (o) => {
-  const { borderWidths: r, colors: e, fontWeights: i, radii: n, space: l } = o;
-  return {
-    bottom: {
-      paddingBottom: l.lg
-    },
-    default: {
-      paddingLeft: l.sm,
-      paddingRight: l.sm
-    },
-    growls: {
-      default: {
-        ...U(o).sm,
-        borderRadius: n.lg,
-        borderStyle: "solid",
-        borderWidth: r.sm,
-        maxWidth: 340
-      },
-      title: {
-        color: e["neutral-90"],
-        fontWeight: i.bold
-      }
-    },
-    snackbar: {
-      default: {
-        borderRadius: n.lg
-      },
-      separator: {
-        danger: {
-          borderLeftColor: e["red-20"]
-        },
-        default: {
-          borderLeft: "1px solid",
-          borderLeftColor: e["neutral-30"]
-        },
-        info: {
-          borderLeftColor: e["blue-30"]
-        },
-        success: {
-          borderLeftColor: e["green-30"]
-        },
-        warning: {
-          borderLeftColor: e["orange-20"]
-        }
-      }
-    },
-    top: {
-      paddingTop: l.lg
-    }
-  };
-}, Lr = "0.32rem !important", Ir = "0.12rem ! important", Hr = (o) => {
-  const { borderWidths: r, colors: e, focus: i, toRem: n } = o;
-  return {
-    after: {
-      checked: {
-        backgroundColor: e["neutral-10"],
-        borderColor: e["neutral-10"]
-      },
-      default: {
-        backgroundColor: e["neutral-10"],
-        borderColor: e["neutral-50"],
-        borderRadius: "50%",
-        borderStyle: "solid",
-        borderWidth: r.sm
-      },
-      disabled: {
-        backgroundColor: e["beige-60"],
-        borderColor: "transparent"
-      },
-      sizes: {
-        md: {
-          height: n(20),
-          width: n(20)
-        },
-        sm: {
-          height: n(16),
-          width: n(16)
-        },
-        xs: {
-          height: n(12),
-          width: n(12)
-        }
-      }
-    },
-    icon: {
-      position: {
-        md: {
-          left: "4px",
-          right: "4px"
-        },
-        sm: {
-          left: "4px",
-          right: "4px"
-        },
-        xs: {
-          left: "2px",
-          right: "2px"
-        }
-      },
-      sizes: {
-        md: {
-          fontSize: n(16),
-          height: n(16),
-          width: n(16)
-        },
-        sm: {
-          fontSize: n(12),
-          height: n(12),
-          width: n(12)
-        },
-        xs: {
-          fontSize: n(10),
-          height: n(10),
-          width: n(10)
-        }
-      }
-    },
-    item: {
-      checked: {
-        backgroundColor: e["primary-40"],
-        borderColor: e["primary-40"]
-      },
-      default: {
-        "&:focus": {
-          borderColor: e["primary-30"],
-          ...i(e["primary-30"])
-        },
-        backgroundColor: e["neutral-10"],
-        borderColor: e["neutral-30"],
-        borderRadius: n(16),
-        borderStyle: "solid",
-        borderWidth: r.sm
-      },
-      disabled: {
-        backgroundColor: e["beige-40"],
-        borderColor: e["beige-60"]
-      },
-      sizes: {
-        md: {
-          height: n(24),
-          marginTop: "0 !important",
-          width: n(44)
-        },
-        sm: {
-          height: n(20),
-          marginTop: Ir,
-          width: n(36)
-        },
-        xs: {
-          height: n(16),
-          marginTop: Lr,
-          width: n(28)
-        }
-      }
-    }
-  };
-}, qr = (o) => {
-  const { borderWidths: r, colors: e, fontSizes: i, fontWeights: n, radii: l, space: d, toRem: a } = o;
-  return {
-    backgroundColor: e["neutral-90"],
-    border: `${r.sm} solid ${e["neutral-60"]}`,
-    borderRadius: l.md,
-    boxSizing: "border-box",
-    color: e["neutral-10"],
-    fontSize: i.sm,
-    fontWeight: n.medium,
-    maxWidth: a(200),
-    padding: `${d.xs} ${d.sm}`
-  };
-}, Or = (o) => {
-  const { colors: r } = o;
-  return {
-    ai: {
-      color: r["violet-70"]
-    },
-    danger: {
-      color: r["red-70"]
-    },
-    default: {
-      color: r["neutral-90"]
-    },
-    info: {
-      color: r["blue-60"]
-    },
-    success: {
-      color: r["green-60"]
-    },
-    warning: {
-      color: r["orange-60"]
-    }
-  };
-}, Ur = {
-  sm: "1px",
-  md: "2px",
-  lg: "3px"
-}, Pr = {
-  "beige-10": "#FBF9F7",
-  "beige-20": "#F6F3EF",
-  "beige-30": "#EAE4DE",
-  "beige-40": "#D2CBC3",
-  "beige-50": "#A7A096",
-  "beige-60": "#605B55",
-  "beige-70": "#4D4944",
-  "beige-80": "#33302D",
-  "beige-90": "#1E1C1A",
-  "blue-10": "#E0F5FF",
-  "blue-20": "#BBEAFF",
-  "blue-30": "#9BDEF7",
-  "blue-40": "#55C3E9",
-  // brand
-  "blue-50": "#27A5D0",
-  "blue-60": "#057AA3",
-  "blue-70": "#025A79",
-  "blue-80": "#013C50",
-  "blue-90": "#00202B",
-  "green-10": "#EAFFD4",
-  "green-20": "#D6F6B4",
-  "green-30": "#BADE94",
-  // brand
-  "green-40": "#9FC873",
-  "green-50": "#83AD57",
-  "green-60": "#5A8034",
-  "green-70": "#40611F",
-  "green-80": "#2A4210",
-  "green-90": "#142603",
-  "neutral-10": "#FFFFFF",
-  "neutral-20": "#F3F3F3",
-  "neutral-30": "#DEDEDE",
-  "neutral-40": "#BDBDBD",
-  "neutral-50": "#989898",
-  "neutral-60": "#585858",
-  "neutral-70": "#444444",
-  "neutral-80": "#212121",
-  "neutral-90": "#000000",
-  "orange-10": "#FFEBCE",
-  "orange-20": "#FFD495",
-  "orange-30": "#FFBB59",
-  "orange-40": "#FF9F14",
-  "orange-50": "#DB860A",
-  "orange-60": "#A6670A",
-  "orange-70": "#824F06",
-  "orange-80": "#573607",
-  "orange-90": "#382303",
-  "pink-10": "#FFEAF5",
-  "pink-20": "#FFD5EB",
-  "pink-30": "#FEB7DC",
-  "pink-40": "#F696C8",
-  // brand
-  "pink-50": "#E468A8",
-  "pink-60": "#C24887",
-  "pink-70": "#972962",
-  "pink-80": "#6D1142",
-  "pink-90": "#3C0725",
-  "red-10": "#FBDEDC",
-  "red-20": "#FCC7C3",
-  "red-30": "#FDB3AE",
-  "red-40": "#FF9490",
-  "red-50": "#FF6165",
-  "red-60": "#E1003A",
-  "red-70": "#A80029",
-  "red-80": "#75001A",
-  "red-90": "#450101",
-  "red-orange-10": "#FFDED0",
-  "red-orange-20": "#FFC9B2",
-  "red-orange-30": "#FFB595",
-  "red-orange-40": "#FF9868",
-  // brand
-  "red-orange-50": "#E67B49",
-  "red-orange-60": "#C45927",
-  "red-orange-70": "#9F4217",
-  "red-orange-80": "#6D2605",
-  "red-orange-90": "#451701",
-  "teal-10": "#D5FFFA",
-  "teal-20": "#AAF4EB",
-  "teal-30": "#6DE1D2",
-  "teal-40": "#00C7AE",
-  // brand
-  "teal-50": "#01AA95",
-  "teal-60": "#008070",
-  "teal-70": "#00544A",
-  "teal-80": "#003D35",
-  "teal-90": "#00211D",
-  "violet-10": "#F2F2FF",
-  "violet-20": "#E0E0FF",
-  "violet-30": "#C9C9FF",
-  "violet-40": "#ACACFF",
-  // brand
-  "violet-50": "#9080F0",
-  "violet-60": "#7958D6",
-  "violet-70": "#593CAC",
-  "violet-80": "#422A86",
-  "violet-90": "#1F0E51",
-  "yellow-10": "#FFF8D9",
-  "yellow-20": "#FFF1B2",
-  "yellow-30": "#FFE166",
-  "yellow-40": "#FFCD00",
-  "yellow-50": "#E5B800",
-  "yellow-60": "#B69200",
-  "yellow-70": "#846A01",
-  "yellow-80": "#604D00",
-  "yellow-90": "#423500"
-}, P = (o) => ({
-  ...o,
-  overlay: "rgba(0, 0, 0, 0.55)",
-  "primary-10": o["yellow-10"],
-  "primary-20": o["yellow-20"],
-  "primary-30": o["yellow-30"],
-  "primary-40": o["yellow-40"],
-  "primary-50": o["yellow-50"],
-  "primary-60": o["yellow-60"],
-  "primary-70": o["yellow-70"],
-  "primary-80": o["yellow-80"],
-  "primary-90": o["yellow-90"],
-  "secondary-blue": o["blue-40"],
-  "secondary-green": o["green-30"],
-  "secondary-orange": o["red-orange-40"],
-  "secondary-pink": o["pink-40"],
-  "secondary-teal": o["teal-40"],
-  "secondary-violet": o["violet-40"]
-}), p = P(Pr), jr = Object.keys(p).reduce((o, r) => {
-  if (r.startsWith("secondary-") || r === "overlay") return o;
-  const e = 100 - Number(r.slice(-2)), i = r.slice(0, r.length - 2);
-  return {
-    ...o,
-    [r]: p[`${i}${e}`]
-  };
-}, {}), Mr = {
-  ...p,
-  ...P(jr)
-}, ue = {
-  colors: Mr
-}, Nr = (o) => {
-  const { borderWidths: r, colors: e, focus: i, fontSizes: n, fontWeights: l, radii: d, space: a, toRem: s } = o;
-  return {
-    checkableField: {
-      checked: {
-        color: "neutral-90"
-        // not hex color, only color from browser because is on a content svg
-      },
-      disabled: {
-        opacity: 0.4
-      }
-    },
-    checkablelabel: {
-      checked: {
-        "-webkit-text-stroke": "0.04em",
-        color: e["neutral-90"]
-      },
-      default: {}
-    },
-    default: {
-      backgroundColor: e["neutral-10"],
-      borderColor: e["neutral-30"],
-      borderRadius: d.md,
-      borderStyle: "solid",
-      borderWidth: r.sm,
-      color: e["neutral-90"],
-      fontSize: n.sm,
-      fontWeight: l.regular,
-      /* Can't use 16 because that's a valid line-height value (16em) */
-      lineHeight: "1rem",
-      outline: "none"
-    },
-    disabled: {
-      backgroundColor: e["beige-40"],
-      color: e["beige-70"],
-      cursor: "not-allowed"
-    },
-    fieldset: {
-      "border-width": "0"
-    },
-    focused: {
-      danger: { ...i(e["red-30"]) },
-      default: {
-        ...i(e["primary-20"]),
-        borderColor: e["primary-40"]
-      },
-      success: { ...i(e["green-30"]) },
-      warning: { ...i(e["orange-20"]) }
-    },
-    hover: {
-      default: {
-        borderColor: e["neutral-40"]
-      },
-      transparency: {
-        borderColor: e["neutral-20"]
-      }
-    },
-    iconPlacement: {
-      lg: {
-        left: s(12),
-        right: s(12)
-      },
-      md: {
-        left: s(12),
-        right: s(12)
-      },
-      sm: {
-        left: s(12),
-        right: s(12)
-      },
-      xs: {
-        left: s(8),
-        right: s(8)
-      }
-    },
-    placeholder: {
-      color: e["neutral-50"]
-    },
-    select: {
-      default: {
-        borderRadius: d.md,
-        maxHeight: s(155)
-      },
-      disabled: {
-        color: e["beige-60"],
-        cursor: "not-allowed"
-      },
-      existing: {
-        color: e["beige-40"],
-        cursor: "not-allowed"
-      },
-      highlighted: {
-        backgroundColor: e["beige-20"],
-        cursor: "default"
-      },
-      selected: {
-        color: e["neutral-90"],
-        fontWeight: l.bold
-      },
-      selectedAndHighlighted: {
-        backgroundImage: "linear-gradient(0deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.08) 100%)"
-      }
-    },
-    sizes: {
-      lg: {
-        height: s(48),
-        paddingBottom: a.lg,
-        paddingLeft: a.md,
-        paddingRight: a.md,
-        paddingTop: a.lg
-      },
-      md: {
-        height: s(40),
-        paddingBottom: a.md,
-        paddingLeft: a.md,
-        paddingRight: a.md,
-        paddingTop: a.md
-      },
-      sm: {
-        height: s(32),
-        paddingBottom: a.sm,
-        paddingLeft: a.md,
-        paddingRight: a.md,
-        paddingTop: a.sm
-      },
-      xs: {
-        height: s(24),
-        paddingBottom: a.xs,
-        paddingLeft: a.sm,
-        paddingRight: a.sm,
-        paddingTop: a.xs
-      }
-    },
-    variants: {
-      danger: {
-        borderColor: e["red-70"]
-      },
-      success: {
-        borderColor: e["green-60"]
-      },
-      warning: {
-        borderColor: e["orange-60"]
-      }
-    }
-  };
-}, Kr = ({ colors: o }) => {
-  function r(e = o["primary-40"]) {
-    return {
-      boxShadow: `0 0 0 2px ${e}`
-    };
-  }
-  return r;
-}, Gr = "f19d0de47a5f6f7446d37111f075c0901835bf12", Yr = (o) => ({
-  "welcome-font": [
-    {
-      url: `${o.fontsUrl}/welcome-font-regular`,
-      weight: "400"
-    },
-    {
-      url: `${o.fontsUrl}/welcome-font-medium`,
-      weight: "500"
-    },
-    {
-      url: `${o.fontsUrl}/welcome-font-bold`,
-      weight: "600"
-    },
-    {
-      style: "italic",
-      url: `${o.fontsUrl}/welcome-font-regular-italic`,
-      weight: "400"
-    },
-    {
-      style: "italic",
-      url: `${o.fontsUrl}/welcome-font-medium-italic`,
-      weight: "500"
-    },
-    {
-      style: "italic",
-      url: `${o.fontsUrl}/welcome-font-bold-italic`,
-      weight: "600"
-    }
-  ],
-  "welcome-icon-font": [
-    {
-      display: "block",
-      url: `${o.fontsUrl}/icon-font/${Gr}/welcome-icon-font`
-    }
-  ],
-  "work-sans": [
-    {
-      isVariable: !0,
-      stretch: "75% 125%",
-      url: `${o.fontsUrl}/work-sans-variable`,
-      weight: "100 1000"
-    }
-  ]
-}), Jr = (o) => ({
-  none: "0",
-  sm: o.toRem(2),
-  md: o.toRem(4),
-  lg: o.toRem(8),
-  xl: o.toRem(16),
-  xxl: o.toRem(24),
-  full: "100%"
-}), Xr = {
-  xs: 0,
-  sm: 480,
-  md: 736,
-  lg: 980,
-  xl: 1280,
-  xxl: 1440,
-  "3xl": 1620,
-  "4xl": 1920
-}, Zr = (o) => ({
-  backgroundColor: o.colors["primary-40"],
-  color: o.colors["neutral-90"]
-}), Qr = {
-  sm: "1px 2px 4px 0 rgba(0,0,0,0.05)",
-  md: "3px 4px 10px 0 rgba(0,0,0,0.07)"
-}, Vr = (o) => ({
-  xxs: o.toRem(2),
-  xs: o.toRem(4),
-  sm: o.toRem(8),
-  md: o.toRem(12),
-  lg: o.toRem(16),
-  xl: o.toRem(24),
-  xxl: o.toRem(32),
-  "3xl": o.toRem(48),
-  "4xl": o.toRem(64),
-  "5xl": o.toRem(96),
-  "6xl": o.toRem(128),
-  "7xl": o.toRem(192)
-}), h = {
-  primary: "ease",
-  secondary: "linear",
-  tertiary: "cubic-bezier(0.41, 0.094, 0.54, 0.07)"
-}, re = {
-  fast: `100ms ${h.secondary}`,
-  medium: `300ms ${h.primary}`,
-  slow: `500ms ${h.tertiary}`
-}, ee = ({ colors: o }) => ({
-  default: S`
-      background-image: linear-gradient(
-        0deg,
-        ${o["primary-40"]},
-        ${o["primary-40"]} 100%
-      );
-      background-repeat: no-repeat;
-      background-size: 100% 50%;
-      background-position-y: calc(200% - 2px);
-      transition:
-        background-position-y 250ms,
-        background-size 250ms,
-        color 250ms;
-    `,
-  hover: S`
-      opacity: 1;
-      background-position-y: 100%;
-      background-size: 100% 100%;
-    `
-}), oe = "work-sans", te = 16, ne = "-0.019rem", ie = 1.15, ae = "https://cdn.welcome-ui.com/fonts", le = "welcome-font", de = "welcome-icon-font", be = (o = {}) => {
-  const {
-    defaultFontFamily: r = oe,
-    defaultFontSize: e = te,
-    defaultLetterSpacing: i = ne,
-    defaultLineHeight: n = ie,
-    fontsUrl: l = ae,
-    headingFontFamily: d = le,
-    iconFontFamily: a = de,
-    ...s
-  } = o;
-  let t = {};
-  return t.transformers = { ...M }, t.toEm = (c) => `${c / e}em`, t.toRem = (c) => `${c / e}rem`, t.toPx = (c) => `${c * e}px`, t.colors = p, t.fontsUrl = l, t.fontFaces = Yr(t), t.fontSizes = $r("rem", t), t.defaultLineHeight = n, t.defaultLetterSpacing = i, t.lineHeights = Sr(t), t.fontWeights = Dr, t.letterSpacings = Tr(t), t.fonts = Ar(r, d, a), t.borderWidths = Ur, t.screens = Xr, t.space = Vr(t), t.inset = t.space, t.radii = Jr(t), t.transitions = re, t.timingFunction = h, t.shadows = Qr, t = I(t, s), t.selection = Zr(t), t.underline = ee(t), t.focus = Kr(t), t.textsFontWeights = Rr(t), t.textsFontFamily = _r(t), t.textsFontColors = Br(t), t.textsTextTransform = zr(), t.texts = U(t), t.defaultFields = Nr(t), t.icons = gr(t), t.accordions = Q(t), t.alerts = V(t), t.avatars = rr(t), t.badges = er(t), t.breadcrumbs = or(t), t.buttons = tr(t), t.cards = nr(t), t.checkboxes = ir(t), t.dateTimePickerCommon = ar(t), t.drawers = lr(t), t.dropdownMenu = dr(t), t.fileDrops = sr(t), t.hints = cr(t), t.labels = ur(t), t.links = br(t), t.loaders = mr(t), t.modals = hr(t), t.paginations = pr(t), t.popovers = fr(t), t.radios = xr(t), t.radiosTab = Cr(t), t.sliders = yr(t), t.swipers = kr(t), t.tables = Fr(t), t.tabs = vr(t), t.tags = wr(t), t.textareas = Wr(t), t.toasts = Er(t), t.toggles = Hr(t), t.tooltips = qr(t), t.variantIcon = Or(t), t.states = u.states, t.durations = u.durations, t.gridTemplateColumns = u.gridTemplateColumns, t.gridTemplateRows = u.gridTemplateRows, t.ringWidths = u.ringWidths, t.borders = u.borders, t.transitionProperties = u.transitionProperties, t.timingFunctions = u.timingFunctions, t.animations = u.animations, t.xstyled = u.xstyled, t = I(t, s), t;
-};
-export {
-  be as createTheme,
-  ue as darkTheme
-};