xtreme-ui 0.0.12 → 0.0.13

package/dist/components/base/Button/Button.js

@@ -0,0 +1,51 @@
+"use client";
+import { jsxs as R, jsx as t } from "react/jsx-runtime";
+import { forwardRef as w, useRef as C } from "react";
+import j from "clsx";
+import z from "lodash/throttle.js";
+import { mergeRefs as I } from "../../../utils/function/mergeRefs.js";
+import { Icon as L } from "../Icon/Icon.js";
+import { ProgressBar as P } from "../ProgressBar/ProgressBar.js";
+import e from "./button.module.scss.js";
+import { EButtonTypes as p } from "./types.js";
+const d = 100;
+let y;
+const $ = w((B, N) => {
+  const {
+    className: T,
+    label: o,
+    type: i = "primary",
+    size: c = "default",
+    disabled: b = !1,
+    loading: m = !1,
+    icon: r,
+    iconType: g,
+    iconPosition: a = "left",
+    onClick: s
+  } = B, l = C(null), h = z(() => {
+    var n;
+    clearTimeout(y), (n = l.current) == null || n.classList.add(e.clicked), y = window.setTimeout(() => {
+      var f;
+      (f = l.current) == null || f.classList.remove(e.clicked);
+    }, 600 + d);
+  }, d), k = (n) => {
+    s == null || s(n), i.includes(p.link) || h();
+  }, u = () => r ? /* @__PURE__ */ t(L, { className: e.icon, code: r, type: g, size: c }) : null, x = j(
+    e.button,
+    e[`${i}Type`],
+    e[`${c}Size`],
+    !o && e.iconOnly,
+    m && e.loading,
+    T
+  );
+  return !o && !r ? null : /* @__PURE__ */ R("button", { className: x, ref: I([l, N]), onClick: k, disabled: b, children: [
+    i.includes(p.link) && /* @__PURE__ */ t(P, { className: e.underline, intermediate: m }),
+    a === "left" && /* @__PURE__ */ t(u, {}),
+    o && /* @__PURE__ */ t("span", { className: e.label, children: o }),
+    a === "right" && /* @__PURE__ */ t(u, {})
+  ] });
+});
+$.displayName = "Button";
+export {
+  $ as Button
+};

package/dist/components/base/Button/button.module.scss.js

@@ -0,0 +1,44 @@
+"use client";
+const e = "_button_6uqr8_1", n = "_label_6uqr8_17", r = "_icon_6uqr8_23", _ = "_underline_6uqr8_26", i = "_primaryType_6uqr8_49", o = "_primaryDangerType_6uqr8_49", c = "_secondaryType_6uqr8_54", l = "_secondaryDangerType_6uqr8_54", a = "_linkType_6uqr8_59", p = "_linkDangerType_6uqr8_59", y = "_miniSize_6uqr8_88", s = "_iconOnly_6uqr8_99", t = "_defaultSize_6uqr8_106", u = "_largeSize_6uqr8_124", d = "_clicked_6uqr8_157", q = "_ripple_6uqr8_1", T = "_loading_6uqr8_166", g = "_barberPole_6uqr8_1", b = "_spin_6uqr8_1", k = {
+  button: e,
+  label: n,
+  icon: r,
+  underline: _,
+  primaryType: i,
+  primaryDangerType: o,
+  secondaryType: c,
+  secondaryDangerType: l,
+  linkType: a,
+  linkDangerType: p,
+  miniSize: y,
+  iconOnly: s,
+  defaultSize: t,
+  largeSize: u,
+  clicked: d,
+  ripple: q,
+  loading: T,
+  barberPole: g,
+  spin: b
+};
+export {
+  g as barberPole,
+  e as button,
+  d as clicked,
+  k as default,
+  t as defaultSize,
+  r as icon,
+  s as iconOnly,
+  n as label,
+  u as largeSize,
+  p as linkDangerType,
+  a as linkType,
+  T as loading,
+  y as miniSize,
+  o as primaryDangerType,
+  i as primaryType,
+  q as ripple,
+  l as secondaryDangerType,
+  c as secondaryType,
+  b as spin,
+  _ as underline
+};

package/dist/components/base/Button/types.js

@@ -0,0 +1,5 @@
+"use client";
+var a = /* @__PURE__ */ ((r) => (r.primary = "primary", r.primaryDanger = "primaryDanger", r.secondary = "secondary", r.secondaryDanger = "secondaryDanger", r.link = "link", r.linkDanger = "linkDanger", r))(a || {});
+export {
+  a as EButtonTypes
+};

package/dist/components/base/Icon/Icon.js

@@ -0,0 +1,19 @@
+"use client";
+import { jsx as p } from "react/jsx-runtime";
+import { forwardRef as a } from "react";
+import f from "clsx";
+import { unicodeToString as l } from "../../../utils/function/string.js";
+import e from "./icon.module.scss.js";
+import { EIconSize as d } from "./types.js";
+const x = a((i, n) => {
+  const { className: r, code: c, type: t = "light", size: o } = i, s = o ? `${typeof o == "number" ? o : d[o]}px` : void 0, m = f(
+    e.icon,
+    t && e[t],
+    r
+  );
+  return /* @__PURE__ */ p("span", { className: m, ref: n, style: { "--iconSize": s }, "data-content": l(c) });
+});
+x.displayName = "Icon";
+export {
+  x as Icon
+};

package/dist/components/base/Icon/icon.module.scss.js

@@ -0,0 +1,26 @@
+"use client";
+const n = "_icon_awnbf_2", a = "_thin_awnbf_25", _ = "_light_awnbf_29", o = "_regular_awnbf_33", s = "_solid_awnbf_37", t = "_duotone_awnbf_41", r = "_sharpSolid_awnbf_52", i = "_sharpRegular_awnbf_56", h = "_sharpLight_awnbf_60", l = "_brand_awnbf_64", c = {
+  icon: n,
+  thin: a,
+  light: _,
+  regular: o,
+  solid: s,
+  duotone: t,
+  sharpSolid: r,
+  sharpRegular: i,
+  sharpLight: h,
+  brand: l
+};
+export {
+  l as brand,
+  c as default,
+  t as duotone,
+  n as icon,
+  _ as light,
+  o as regular,
+  h as sharpLight,
+  i as sharpRegular,
+  r as sharpSolid,
+  s as solid,
+  a as thin
+};

package/dist/components/base/Icon/types.js

@@ -0,0 +1,5 @@
+"use client";
+var a = /* @__PURE__ */ ((r) => (r[r.mini = 12] = "mini", r[r.default = 18] = "default", r[r.large = 24] = "large", r))(a || {});
+export {
+  a as EIconSize
+};

package/dist/components/base/ProgressBar/ProgressBar.js

@@ -0,0 +1,17 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import p from "clsx";
+import s from "./progressbar.module.scss.js";
+const c = n((o, t) => {
+  const { className: a, progress: m = 100, intermediate: r = !1 } = o, i = r ? 150 : Math.min(Math.max(m, 0), 100), l = p(
+    s.progressBar,
+    r && s.intermediate,
+    a
+  );
+  return /* @__PURE__ */ e("div", { className: l, ref: t, children: /* @__PURE__ */ e("span", { className: s.progress, style: { width: `${i}%` } }) });
+});
+c.displayName = "ProgressBar";
+export {
+  c as ProgressBar
+};

package/dist/components/base/ProgressBar/progressbar.module.scss.js

@@ -0,0 +1,14 @@
+"use client";
+const e = "_progressBar_luf46_1", r = "_progress_luf46_1", s = "_intermediate_luf46_31", o = "_barberPole_luf46_1", t = {
+  progressBar: e,
+  progress: r,
+  intermediate: s,
+  barberPole: o
+};
+export {
+  o as barberPole,
+  t as default,
+  s as intermediate,
+  r as progress,
+  e as progressBar
+};

package/dist/components/base/Textfield/Textfield.js

@@ -0,0 +1,65 @@
+"use client";
+import { jsxs as h, jsx as a } from "react/jsx-runtime";
+import { forwardRef as N, useMemo as y } from "react";
+import T from "clsx";
+import { Icon as w } from "../Icon/Icon.js";
+import e from "./textfield.module.scss.js";
+const C = N((m, f) => {
+  const {
+    className: u,
+    type: t = "text",
+    textarea: r,
+    placeholder: p,
+    autoComplete: n = "off",
+    autoFocus: c,
+    icon: o,
+    iconType: d = "regular",
+    value: s,
+    onChange: i
+  } = m, l = y(() => {
+    if (r === !0)
+      return null;
+    if (o)
+      return o;
+    if (t === "number")
+      return "23";
+    if (t === "search")
+      return "f002";
+    if (t === "password")
+      return "f30d";
+  }, [r, o, t]), x = T(
+    e.textfield,
+    l && e.withIcon,
+    r && e.textarea,
+    s && e.hasValue,
+    u
+  );
+  return /* @__PURE__ */ h("div", { className: x, ref: f, children: [
+    !!l && !r && /* @__PURE__ */ a(w, { className: e.icon, code: l, type: d }),
+    r ? /* @__PURE__ */ a(
+      "textarea",
+      {
+        className: e.input,
+        autoFocus: c,
+        autoComplete: n,
+        value: s,
+        onChange: i
+      }
+    ) : /* @__PURE__ */ a(
+      "input",
+      {
+        className: e.input,
+        type: t,
+        autoFocus: c,
+        autoComplete: n,
+        value: s,
+        onChange: i
+      }
+    ),
+    /* @__PURE__ */ a("span", { className: e.placeholder, children: p })
+  ] });
+});
+C.displayName = "Textfield";
+export {
+  C as Textfield
+};

package/dist/components/base/Textfield/textfield.module.scss.js

@@ -0,0 +1,20 @@
+"use client";
+const t = "_textfield_7y99a_1", e = "_icon_7y99a_27", a = "_input_7y99a_36", _ = "_placeholder_7y99a_49", c = "_withIcon_7y99a_73", n = "_textarea_7y99a_83", o = "_hasValue_7y99a_92", l = {
+  textfield: t,
+  icon: e,
+  input: a,
+  placeholder: _,
+  withIcon: c,
+  textarea: n,
+  hasValue: o
+};
+export {
+  l as default,
+  o as hasValue,
+  e as icon,
+  a as input,
+  _ as placeholder,
+  n as textarea,
+  t as textfield,
+  c as withIcon
+};

package/dist/components/layout/Navigation/Navigation.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsxs as r, jsx as s } from "react/jsx-runtime";
+import { forwardRef as n } from "react";
+import c from "clsx";
+import a from "./navigation.module.scss.js";
+const m = n((i, o) => {
+  const { className: t, Routes: e } = i, l = c(
+    a.navigation,
+    t
+  );
+  return /* @__PURE__ */ r("section", { className: l, ref: o, role: "navigation", children: [
+    /* @__PURE__ */ s("div", { className: a.brand, children: "🎲 XtremeUI" }),
+    /* @__PURE__ */ s("div", { className: a.routeList, children: !!e && /* @__PURE__ */ s(
+      e,
+      {
+        className: a.route,
+        activeClassName: a.active,
+        iconClassName: a.icon,
+        labelClassName: a.label
+      }
+    ) })
+  ] });
+});
+m.displayName = "Navigation";
+export {
+  m as Navigation
+};

package/dist/components/layout/Navigation/navigation.module.scss.js

@@ -0,0 +1,20 @@
+"use client";
+const t = "_navigation_zrgjp_1", n = "_brand_zrgjp_9", o = "_routeList_zrgjp_18", _ = "_route_zrgjp_18", a = "_icon_zrgjp_59", e = "_label_zrgjp_65", r = "_active_zrgjp_77", i = {
+  navigation: t,
+  brand: n,
+  routeList: o,
+  route: _,
+  icon: a,
+  label: e,
+  active: r
+};
+export {
+  r as active,
+  n as brand,
+  i as default,
+  a as icon,
+  e as label,
+  t as navigation,
+  _ as route,
+  o as routeList
+};

package/dist/components/layout/Sider/Sider.js

@@ -0,0 +1,33 @@
+"use client";
+import { jsxs as f, jsx as i } from "react/jsx-runtime";
+import { forwardRef as h } from "react";
+import S from "clsx";
+import e from "./sider.module.scss.js";
+const p = h((s, t) => {
+  const {
+    className: d,
+    children: n,
+    leftSider: o,
+    showMiniLeftSider: l = !0,
+    rightSider: c,
+    showMiniRightSider: a = !1,
+    open: r = "closed"
+    // setOpen,
+  } = s, m = S(
+    e.sider,
+    r === "left" && e.leftOpen,
+    l && e.miniLeftSider,
+    r === "right" && e.rightOpen,
+    a && e.miniRightSider,
+    d
+  );
+  return /* @__PURE__ */ f("section", { className: m, ref: t, role: "sider", children: [
+    /* @__PURE__ */ i("div", { className: e.leftSiderContainer, children: o }),
+    /* @__PURE__ */ i("div", { className: e.rightSiderContainer, children: c }),
+    /* @__PURE__ */ i("div", { className: e.content, children: n })
+  ] });
+});
+p.displayName = "Sider";
+export {
+  p as Sider
+};

package/dist/components/layout/Sider/sider.module.scss.js

@@ -0,0 +1,22 @@
+"use client";
+const e = "_sider_9guyz_1", i = "_leftSiderContainer_9guyz_13", t = "_rightSiderContainer_9guyz_20", n = "_content_9guyz_27", r = "_miniLeftSider_9guyz_37", _ = "_miniRightSider_9guyz_44", o = "_leftOpen_9guyz_51", g = "_rightOpen_9guyz_57", d = {
+  sider: e,
+  leftSiderContainer: i,
+  rightSiderContainer: t,
+  content: n,
+  miniLeftSider: r,
+  miniRightSider: _,
+  leftOpen: o,
+  rightOpen: g
+};
+export {
+  n as content,
+  d as default,
+  o as leftOpen,
+  i as leftSiderContainer,
+  r as miniLeftSider,
+  _ as miniRightSider,
+  g as rightOpen,
+  t as rightSiderContainer,
+  e as sider
+};

package/dist/index.js

@@ -0,0 +1,35 @@
+"use client";
+import "./styles/index.scss.js";
+import { dom as t, elementObserver as s, getCssProperty as p, getCssPropertyPx as m, getCssPropertyVh as f, getCssPropertyVw as i, isClient as n, setCssProperty as x, waitForElement as g } from "./utils/helper/domHelper.js";
+import { mergeRefs as C } from "./utils/function/mergeRefs.js";
+import { safeStringFromCodePoint as a, unicodeToString as d } from "./utils/function/string.js";
+import { Button as c } from "./components/base/Button/Button.js";
+import { EButtonTypes as S } from "./components/base/Button/types.js";
+import { Icon as E } from "./components/base/Icon/Icon.js";
+import { EIconSize as v } from "./components/base/Icon/types.js";
+import { ProgressBar as F } from "./components/base/ProgressBar/ProgressBar.js";
+import { Textfield as V } from "./components/base/Textfield/Textfield.js";
+import { Sider as h } from "./components/layout/Sider/Sider.js";
+import { Navigation as N } from "./components/layout/Navigation/Navigation.js";
+export {
+  c as Button,
+  S as EButtonTypes,
+  v as EIconSize,
+  E as Icon,
+  N as Navigation,
+  F as ProgressBar,
+  h as Sider,
+  V as Textfield,
+  t as dom,
+  s as elementObserver,
+  p as getCssProperty,
+  m as getCssPropertyPx,
+  f as getCssPropertyVh,
+  i as getCssPropertyVw,
+  n as isClient,
+  C as mergeRefs,
+  a as safeStringFromCodePoint,
+  x as setCssProperty,
+  d as unicodeToString,
+  g as waitForElement
+};

package/dist/style.css

@@ -1 +1 @@
-@import"https://fonts.googleapis.com/css2?family=Montserrat&display=swap";@font-face{font-family:FontAwesome;font-style:normal;font-weight:100;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-thin-100.woff2) format("woff2")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:300;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-light-300.woff2) format("woff2")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:400;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-regular-400.woff2) format("woff2")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:900;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-solid-900.woff2) format("woff2")}@font-face{font-family:FontAwesomeDuotone;font-style:normal;font-weight:900;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-duotone-900.woff2) format("woff2")}@font-face{font-family:FontAwesomeSharp;font-style:normal;font-weight:300;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-sharp-light-300.woff2) format("woff2")}@font-face{font-family:FontAwesomeSharp;font-style:normal;font-weight:400;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-sharp-regular-400.woff2) format("woff2")}@font-face{font-family:FontAwesomeSharp;font-style:normal;font-weight:900;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-sharp-solid-900.woff2) format("woff2")}@font-face{font-family:FontAwesomeBrand;font-style:normal;font-weight:400;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-brands-400.woff2) format("woff2")}body{--colorAlertErrorRGB: 255 65 54;--colorAlertWarningRGB: 255 220 0;--colorAlertSuccessRGB: 46 204 64;--colorBorderPrimary: #ABB0BB;--colorContentPrimary: #383838;--colorContentSecondary: #666;--colorContentTertiary: #E6E6E6;--colorBackgroundPrimary: #FFF;--colorBackgroundSecondary: #F6F6F6;--colorBackgroundTertiary: #EEE;--colorShadow: rgb(100 100 100 / 40%);--gradientBrand: linear-gradient(320deg, rgb(var(--colorBrandPrimaryRgb)), rgb(var(--colorBrandSecondaryRgb)));--cubicBezierPrimary: cubic-bezier(.23, 1, .32, 1);--siderWidth: 300px;--siderWidthMini: 60px;scroll-behavior:smooth}body.red{--colorBrandPrimaryRgb: 249 34 75;--colorBrandSecondaryRgb: 255 68 68;--colorBrandAccentRgb: 255 56 83}body.pink{--colorBrandPrimaryRgb: 252 33 105;--colorBrandSecondaryRgb: 226 33 255;--colorBrandAccentRgb: 255 85 136}body.orange{--colorBrandPrimaryRgb: 255 127 34;--colorBrandSecondaryRgb: 255 65 65;--colorBrandAccentRgb: 255 108 103}body.blue{--colorBrandPrimaryRgb: 34 252 176;--colorBrandSecondaryRgb: 33 129 250;--colorBrandAccentRgb: 33 149 243}body.violet{--colorBrandPrimaryRgb: 63 0 230;--colorBrandSecondaryRgb: 150 44 255;--colorBrandAccentRgb: 127 81 255}body.black{--colorBrandPrimaryRgb: 22 20 28;--colorBrandSecondaryRgb: 9 8 11;--colorBrandAccentRgb: 40 39 44}body.dark{--colorContentPrimary: #A1A1A1;--colorContentSecondary: #636363;--colorContentTertiary: #383838;--colorBackgroundPrimary: #111;--colorBackgroundSecondary: #222;--colorBackgroundTertiary: #333}body ::selection{color:#fff;background:rgb(var(--colorBrandAccentRgb))}*{font-family:Montserrat,sans-serif;font-weight:500;box-sizing:border-box}._icon_awnbf_2{position:relative;width:var(--iconSize);height:var(--iconSize);font-size:var(--iconSize);display:flex;justify-content:center;align-items:center;font-variant:normal;line-height:1;text-rendering:auto;-webkit-user-select:none;user-select:none;z-index:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;transition:all .4s var(--cubicBezierPrimary)}._icon_awnbf_2:before{position:absolute;display:block;color:inherit;content:attr(data-content)}._icon_awnbf_2._thin_awnbf_25{font-family:FontAwesome;font-weight:100}._icon_awnbf_2._light_awnbf_29{font-family:FontAwesome;font-weight:300}._icon_awnbf_2._regular_awnbf_33{font-family:FontAwesome;font-weight:400}._icon_awnbf_2._solid_awnbf_37{font-family:FontAwesome;font-weight:900}._icon_awnbf_2._duotone_awnbf_41{font-family:FontAwesomeDuotone;font-weight:900}._icon_awnbf_2._duotone_awnbf_41:after{position:absolute;display:block;color:inherit;content:attr(data-content) attr(data-content);opacity:.3}._icon_awnbf_2._sharpSolid_awnbf_52{font-family:FontAwesomeSharp;font-weight:900}._icon_awnbf_2._sharpRegular_awnbf_56{font-family:FontAwesomeSharp;font-weight:400}._icon_awnbf_2._sharpLight_awnbf_60{font-family:FontAwesomeSharp;font-weight:300}._icon_awnbf_2._brand_awnbf_64{font-family:FontAwesomeBrand;font-weight:400}._progressBar_luf46_1{position:relative;width:100%;height:3px;display:flex;justify-content:flex-start;align-items:center;border-radius:9999px;overflow:hidden}._progressBar_luf46_1:before{content:"";position:absolute;left:0;width:100%;height:1px;border-radius:9999px;opacity:.3;background:var(--colorBorderPrimary);transition:all .5s var(--cubicBezierPrimary)}._progressBar_luf46_1>._progress_luf46_1{position:absolute;width:100%;height:3px;display:block;background:var(--gradientBrand);border-radius:9999px;transition:all .5s var(--cubicBezierPrimary)}._progressBar_luf46_1._intermediate_luf46_31{border-radius:9999px}._progressBar_luf46_1._intermediate_luf46_31:before{height:100%;background:rgb(var(--colorBrandAccentRgb))}._progressBar_luf46_1._intermediate_luf46_31>._progress_luf46_1{width:150%;background-image:repeating-linear-gradient(60deg,transparent,transparent .5rem,rgb(var(--colorBrandAccentRgb)) .5rem,rgb(var(--colorBrandAccentRgb)) 1.5rem);animation:_barberPole_luf46_1 .2s infinite linear}@keyframes _barberPole_luf46_1{0%{transform:translate(-1.75rem)}to{transform:translate(0)}}._button_6uqr8_1{--duration: .6s;--themeColor: var(--colorBrandAccentRgb);--maxRippleSize: 100px 40px;position:relative;display:flex;justify-content:center;align-items:center;border:none;box-shadow:0 0 0 0 rgb(var(--themeColor)/0%);border-radius:9999px;cursor:pointer;-webkit-user-select:none;user-select:none;overflow:hidden;transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1 ._label_6uqr8_17{margin:0;text-transform:uppercase;z-index:1;transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1 ._icon_6uqr8_23{transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1 ._underline_6uqr8_26{position:absolute;width:100%;left:0;bottom:0}._button_6uqr8_1 ._underline_6uqr8_26>span{width:20%!important}._button_6uqr8_1:before{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--themeColor));filter:contrast(1.2) brightness(.8);clip-path:circle(0% at 50% 50%);border-radius:9999px;z-index:0;opacity:0;transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1._primaryType_6uqr8_49,._button_6uqr8_1._primaryDangerType_6uqr8_49{background:rgb(var(--themeColor));box-shadow:0 0 0 2px rgb(var(--themeColor)/40%);color:#fff}._button_6uqr8_1._secondaryType_6uqr8_54,._button_6uqr8_1._secondaryDangerType_6uqr8_54{background:var(--colorBackgroundTertiary);box-shadow:0 0 0 2px rgb(var(--colorBackgroundTertiary)/40%);color:rgb(var(--themeColor))}._button_6uqr8_1._linkType_6uqr8_59,._button_6uqr8_1._linkDangerType_6uqr8_59{background:none;box-shadow:none!important;border-radius:unset;color:var(--colorContentPrimary);overflow:unset}._button_6uqr8_1._linkType_6uqr8_59 ._label_6uqr8_17,._button_6uqr8_1._linkDangerType_6uqr8_59 ._label_6uqr8_17{letter-spacing:unset;text-transform:unset}._button_6uqr8_1._linkType_6uqr8_59:before,._button_6uqr8_1._linkDangerType_6uqr8_59:before{display:none}._button_6uqr8_1._linkType_6uqr8_59:hover,._button_6uqr8_1._linkDangerType_6uqr8_59:hover{color:rgb(var(--themeColor))}._button_6uqr8_1._linkType_6uqr8_59:hover ._label_6uqr8_17,._button_6uqr8_1._linkDangerType_6uqr8_59:hover ._label_6uqr8_17{filter:contrast(.8) brightness(1.2)}._button_6uqr8_1._linkType_6uqr8_59:active ._label_6uqr8_17,._button_6uqr8_1._linkDangerType_6uqr8_59:active ._label_6uqr8_17{filter:contrast(1.2) brightness(.8)}._button_6uqr8_1._primaryDangerType_6uqr8_49,._button_6uqr8_1._secondaryDangerType_6uqr8_54,._button_6uqr8_1._linkDangerType_6uqr8_59{--themeColor: var(--colorAlertErrorRGB)}._button_6uqr8_1._primaryDangerType_6uqr8_49 ._underline_6uqr8_26 span,._button_6uqr8_1._secondaryDangerType_6uqr8_54 ._underline_6uqr8_26 span,._button_6uqr8_1._linkDangerType_6uqr8_59 ._underline_6uqr8_26 span{background:rgb(var(--themeColor))}._button_6uqr8_1._miniSize_6uqr8_88{--maxRippleSize: 80px 40px;line-height:16px;padding:8px 16px;gap:8px}._button_6uqr8_1._miniSize_6uqr8_88 ._label_6uqr8_17{font-size:12px;font-variation-settings:"wdth" 75,"wght" 400;letter-spacing:2px}._button_6uqr8_1._miniSize_6uqr8_88._iconOnly_6uqr8_99{padding:0}._button_6uqr8_1._miniSize_6uqr8_88._iconOnly_6uqr8_99 ._icon_6uqr8_23{width:32px;height:32px}._button_6uqr8_1._defaultSize_6uqr8_106{--maxRippleSize: 100px 50px;line-height:20px;padding:12px 24px;gap:10px}._button_6uqr8_1._defaultSize_6uqr8_106 ._label_6uqr8_17{font-size:16px;font-variation-settings:"wdth" 75,"wght" 500;letter-spacing:2px}._button_6uqr8_1._defaultSize_6uqr8_106._iconOnly_6uqr8_99{padding:0}._button_6uqr8_1._defaultSize_6uqr8_106._iconOnly_6uqr8_99 ._icon_6uqr8_23{width:44px;height:44px}._button_6uqr8_1._largeSize_6uqr8_124{--maxRippleSize: 150px 75px;line-height:28px;padding:16px 32px;gap:14px}._button_6uqr8_1._largeSize_6uqr8_124 ._label_6uqr8_17{font-size:22px;font-variation-settings:"wdth" 75,"wght" 600;letter-spacing:4px}._button_6uqr8_1._largeSize_6uqr8_124._iconOnly_6uqr8_99{padding:0}._button_6uqr8_1._largeSize_6uqr8_124._iconOnly_6uqr8_99 ._icon_6uqr8_23{width:60px;height:60px}._button_6uqr8_1:hover{box-shadow:0 0 0 5px rgb(var(--themeColor)/50%);transition:all var(--duration) var(--cubicBezierPrimary);color:#fff}._button_6uqr8_1:hover ._underline_6uqr8_26 span{width:100%!important}._button_6uqr8_1:hover:before{clip-path:circle(100% at 50% 50%);opacity:1}._button_6uqr8_1:active{box-shadow:0 0 0 7px rgb(var(--themeColor)/50%)}._button_6uqr8_1._clicked_6uqr8_157{box-shadow:0 0 0 0 rgb(var(--themeColor)/0%);animation:_ripple_6uqr8_1 var(--duration) linear;color:#fff}._button_6uqr8_1._clicked_6uqr8_157:before{clip-path:circle(100% at 50% 50%);opacity:1}._button_6uqr8_1._loading_6uqr8_166{--loaderColor: rgb(var(--themeColor));pointer-events:none;background:rgb(var(--themeColor)/80%)}._button_6uqr8_1._loading_6uqr8_166._secondaryType_6uqr8_54,._button_6uqr8_1._loading_6uqr8_166._secondaryDangerType_6uqr8_54{--loaderColor: var(--colorBackgroundPrimary);background:var(--colorBackgroundTertiary)}._button_6uqr8_1._loading_6uqr8_166._linkType_6uqr8_59,._button_6uqr8_1._loading_6uqr8_166._linkDangerType_6uqr8_59{background:none}._button_6uqr8_1._loading_6uqr8_166._linkType_6uqr8_59 ._underline_6uqr8_26>span,._button_6uqr8_1._loading_6uqr8_166._linkDangerType_6uqr8_59 ._underline_6uqr8_26>span{width:150%!important}._button_6uqr8_1._loading_6uqr8_166._linkType_6uqr8_59:after,._button_6uqr8_1._loading_6uqr8_166._linkDangerType_6uqr8_59:after{display:none}._button_6uqr8_1._loading_6uqr8_166:after{content:"";position:absolute;display:block;width:150%;height:100%;z-index:0;border-radius:9999px;background-image:repeating-linear-gradient(60deg,transparent,transparent .75rem,var(--loaderColor) .75rem,var(--loaderColor) 1.5rem);animation:_barberPole_6uqr8_1 .25s infinite linear}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99{background:transparent;box-shadow:0 0 0 0 rgb(var(--themeColor)/0%);overflow:unset}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99._secondaryType_6uqr8_54,._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99._secondaryDangerType_6uqr8_54{color:#fff}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99:before{clip-path:circle(45% at 50% 50%);opacity:1}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99:after{width:100%;background:none;border:2px solid rgb(var(--themeColor));border-top-color:transparent;border-bottom-color:transparent;animation:_spin_6uqr8_1 .25s infinite linear}._button_6uqr8_1:disabled{background:rgb(var(--themeColor)/20%);color:rgb(var(--themeColor)/75%);pointer-events:none;filter:grayscale(1)}._button_6uqr8_1:disabled._secondaryType_6uqr8_54,._button_6uqr8_1:disabled._secondaryDangerType_6uqr8_54{background:rgb(var(--themeColor)/5%)}._button_6uqr8_1:disabled._linkType_6uqr8_59{background:none}._button_6uqr8_1:disabled._linkType_6uqr8_59 ._underline_6uqr8_26:before{width:0%}._button_6uqr8_1:disabled._linkType_6uqr8_59 ._underline_6uqr8_26 span{width:0%}@keyframes _ripple_6uqr8_1{0%{box-shadow:0 0 0 7px rgb(var(--themeColor)/50%)}to{box-shadow:0 0 var(--maxRippleSize) rgb(var(--themeColor)/0%)}}@keyframes _barberPole_6uqr8_1{0%{transform:translate(-1.75rem)}to{transform:translate(0)}}@keyframes _spin_6uqr8_1{0%{transform:rotate(0)}to{transform:rotate(180deg)}}._textfield_7y99a_1{--duration: .6s;position:relative;width:400px;display:flex;justify-content:center;align-items:center;border-radius:20px;box-shadow:0 0 0 1px rgb(var(--colorBrandAccentRgb)/50%);background:var(--colorBackgroundSecondary);color:rgb(var(--colorContentPrimary));transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1:before{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb));clip-path:circle(0% at 20px 50%);border-radius:9999px;z-index:0;opacity:0;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1 ._icon_7y99a_27{position:absolute;left:0;width:40px;height:40px;color:rgb(var(--colorBrandAccentRgb)/100%);pointer-events:none;transition:all 0s}._textfield_7y99a_1 ._input_7y99a_36{width:100%;height:40px;outline:none;border:none;background:transparent;padding:10px 20px;font-size:16px;z-index:1;color:rgb(var(--colorContentPrimary));font-variation-settings:"wdth" 75,"wght" 400;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1 ._placeholder_7y99a_49{position:absolute;left:0;display:flex;align-items:center;color:var(--colorContentSecondary);transform:translate(14px);transform-origin:0 50%;line-height:20px;padding:0 8px;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1 ._placeholder_7y99a_49:before{content:"";position:absolute;left:0;display:block;width:100%;height:50%;background:var(--colorBackgroundPrimary);scale:0;z-index:-1;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1._withIcon_7y99a_73:before{clip-path:circle(15px at 20px 50%);opacity:.4}._textfield_7y99a_1._withIcon_7y99a_73 ._input_7y99a_36{padding:10px 20px 10px 44px}._textfield_7y99a_1._withIcon_7y99a_73 ._placeholder_7y99a_49{transform:translate(36px)}._textfield_7y99a_1._textarea_7y99a_83 ._input_7y99a_36{height:200px;padding:16px 20px;resize:none}._textfield_7y99a_1._textarea_7y99a_83 ._placeholder_7y99a_49{top:0;transform:translate(20px,16px)}._textfield_7y99a_1._hasValue_7y99a_92 ._placeholder_7y99a_49{transform:translate(24px,-28px);scale:.75;font-weight:900;color:rgb(var(--colorBrandAccentRgb)/100%)}._textfield_7y99a_1._hasValue_7y99a_92 ._placeholder_7y99a_49:before{scale:1}._textfield_7y99a_1._hasValue_7y99a_92._withIcon_7y99a_73 ._placeholder_7y99a_49{transform:translate(52px,-28px)}._textfield_7y99a_1._hasValue_7y99a_92._textarea_7y99a_83 ._placeholder_7y99a_49{transform:translate(24px,-14px)}._textfield_7y99a_1:focus-within{box-shadow:0 0 0 2px rgb(var(--colorBrandAccentRgb)/50%);background:var(--colorBackgroundPrimary)}._textfield_7y99a_1:focus-within ._placeholder_7y99a_49{transform:translate(24px,-28px);scale:.75;font-weight:900;color:rgb(var(--colorBrandAccentRgb)/100%)}._textfield_7y99a_1:focus-within ._placeholder_7y99a_49:before{scale:1}._textfield_7y99a_1:focus-within._withIcon_7y99a_73 ._placeholder_7y99a_49{transform:translate(52px,-28px)}._textfield_7y99a_1:focus-within._textarea_7y99a_83 ._placeholder_7y99a_49{transform:translate(24px,-14px)}._textfield_7y99a_1:focus-within._withIcon_7y99a_73:before{clip-path:circle(17px at 20px 50%);opacity:.8}._textfield_7y99a_1:focus-within._withIcon_7y99a_73 ._icon_7y99a_27{color:#fff;font-weight:900}._sider_9guyz_1{--duration: .6s;--paddingLeft: 0px;--paddingRight: 0px;--borderRadius: 36px;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb)/90%);padding:0 var(--paddingRight) 0 var(--paddingLeft);overflow:hidden;transition:padding var(--duration) ease}._sider_9guyz_1 ._leftSiderContainer_9guyz_13{position:fixed;left:0;width:var(--siderWidth);height:100%;z-index:0}._sider_9guyz_1 ._rightSiderContainer_9guyz_20{position:fixed;right:0;width:var(--siderWidth);height:100%;z-index:1}._sider_9guyz_1 ._content_9guyz_27{position:relative;width:100%;height:100%;background:var(--colorBackgroundPrimary);box-shadow:0 0 50px 2px #0000003d;border-radius:0;z-index:2;transition:all var(--duration) var(--cubicBezierPrimary)}._sider_9guyz_1._miniLeftSider_9guyz_37{--paddingLeft: var(--siderWidthMini)}._sider_9guyz_1._miniLeftSider_9guyz_37 ._content_9guyz_27{border-top-left-radius:var(--borderRadius);border-bottom-left-radius:var(--borderRadius)}._sider_9guyz_1._miniRightSider_9guyz_44{--paddingRight: var(--siderWidthMini)}._sider_9guyz_1._miniRightSider_9guyz_44 ._content_9guyz_27{border-top-right-radius:var(--borderRadius);border-bottom-right-radius:var(--borderRadius)}._sider_9guyz_1._leftOpen_9guyz_51 ._content_9guyz_27{border-radius:36px;transform:translate(calc(var(--siderWidth) - var(--paddingLeft)));transform-origin:left center;scale:.95}._sider_9guyz_1._rightOpen_9guyz_57 ._content_9guyz_27{border-radius:36px;transform:translate(calc((var(--siderWidth) - var(--paddingRight)) * -1));transform-origin:right center;scale:.95}._navigation_zrgjp_1{--duration: .4s;width:calc(var(--siderWidth) + 16px);height:100%;display:flex;flex-direction:column;padding:16px 0 28px}._navigation_zrgjp_1 ._brand_zrgjp_9{font-size:32px;color:#fff;padding:24px 8px;font-variation-settings:"wdth" 75,"wght" 400;text-transform:capitalize;-webkit-user-select:none;user-select:none;cursor:pointer}._navigation_zrgjp_1 ._routeList_zrgjp_18{width:100%;display:flex;flex-direction:column;flex:1;-webkit-user-select:none;user-select:none;cursor:pointer}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18{position:relative;display:flex;align-items:center;gap:2px;text-decoration:none;color:#fff;transition:all var(--duration) var(--cubicBezierPrimary)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:before{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb)/0%);filter:contrast(2) brightness(.75);z-index:0;transition:all var(--duration) var(--cubicBezierPrimary)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:after{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb));clip-path:circle(0% at calc(var(--siderWidthMini) / 2) 50%);filter:contrast(2) brightness(.75);z-index:0;opacity:.4;transition:all var(--duration) var(--cubicBezierPrimary)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18 ._icon_zrgjp_59{width:var(--siderWidthMini);height:var(--siderWidthMini);font-size:calc(var(--siderWidthMini) - 40px);color:#fff}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18 ._label_zrgjp_65{font-size:16px;font-variation-settings:"wdth" 75,"wght" 400;text-transform:capitalize;z-index:1}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:last-of-type{margin-top:auto}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:hover:before{background:rgb(var(--colorBrandAccentRgb)/30%)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18._active_zrgjp_77:after{clip-path:circle(var(--siderWidth) at calc(var(--siderWidthMini) / 2) 50%);opacity:1;transition:all var(--duration) ease-in-out}
+@import"https://fonts.googleapis.com/css2?family=Montserrat&display=swap";@font-face{font-family:FontAwesome;font-style:normal;font-weight:100;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-thin-100.woff2) format("woff2")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:300;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-light-300.woff2) format("woff2")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:400;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-regular-400.woff2) format("woff2")}@font-face{font-family:FontAwesome;font-style:normal;font-weight:900;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-solid-900.woff2) format("woff2")}@font-face{font-family:FontAwesomeDuotone;font-style:normal;font-weight:900;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-duotone-900.woff2) format("woff2")}@font-face{font-family:FontAwesomeSharp;font-style:normal;font-weight:300;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-sharp-light-300.woff2) format("woff2")}@font-face{font-family:FontAwesomeSharp;font-style:normal;font-weight:400;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-sharp-regular-400.woff2) format("woff2")}@font-face{font-family:FontAwesomeSharp;font-style:normal;font-weight:900;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-sharp-solid-900.woff2) format("woff2")}@font-face{font-family:FontAwesomeBrand;font-style:normal;font-weight:400;font-display:block;src:url(https://cdn.jsdelivr.net/gh/itzzjarvis/Assets/fonts/fontAwesome/fa-brands-400.woff2) format("woff2")}body{--colorAlertErrorRGB: 255 65 54;--colorAlertWarningRGB: 255 220 0;--colorAlertSuccessRGB: 46 204 64;--colorBorderPrimary: #ABB0BB;--colorContentPrimary: #383838;--colorContentSecondary: #666;--colorContentTertiary: #E6E6E6;--colorBackgroundPrimary: #FFF;--colorBackgroundSecondary: #F6F6F6;--colorBackgroundTertiary: #EEE;--colorShadow: rgb(100 100 100 / 40%);--gradientBrand: linear-gradient(320deg, rgb(var(--colorBrandPrimaryRgb)), rgb(var(--colorBrandSecondaryRgb)));--cubicBezierPrimary: cubic-bezier(.23, 1, .32, 1);--siderWidth: 300px;--siderWidthMini: 60px;scroll-behavior:smooth}body.red{--colorBrandPrimaryRgb: 249 34 75;--colorBrandSecondaryRgb: 255 68 68;--colorBrandAccentRgb: 255 56 83}body.pink{--colorBrandPrimaryRgb: 252 33 105;--colorBrandSecondaryRgb: 226 33 255;--colorBrandAccentRgb: 255 85 136}body.orange{--colorBrandPrimaryRgb: 255 127 34;--colorBrandSecondaryRgb: 255 65 65;--colorBrandAccentRgb: 255 108 103}body.blue{--colorBrandPrimaryRgb: 34 252 176;--colorBrandSecondaryRgb: 33 129 250;--colorBrandAccentRgb: 33 149 243}body.violet{--colorBrandPrimaryRgb: 63 0 230;--colorBrandSecondaryRgb: 150 44 255;--colorBrandAccentRgb: 127 81 255}body.black{--colorBrandPrimaryRgb: 22 20 28;--colorBrandSecondaryRgb: 9 8 11;--colorBrandAccentRgb: 40 39 44}body.dark{--colorContentPrimary: #A1A1A1;--colorContentSecondary: #636363;--colorContentTertiary: #383838;--colorBackgroundPrimary: #111;--colorBackgroundSecondary: #222;--colorBackgroundTertiary: #333}body ::selection{color:#fff;background:rgb(var(--colorBrandAccentRgb))}*{font-family:Montserrat,sans-serif;font-weight:500;box-sizing:border-box}._button_6uqr8_1{--duration: .6s;--themeColor: var(--colorBrandAccentRgb);--maxRippleSize: 100px 40px;position:relative;display:flex;justify-content:center;align-items:center;border:none;box-shadow:0 0 0 0 rgb(var(--themeColor)/0%);border-radius:9999px;cursor:pointer;-webkit-user-select:none;user-select:none;overflow:hidden;transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1 ._label_6uqr8_17{margin:0;text-transform:uppercase;z-index:1;transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1 ._icon_6uqr8_23{transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1 ._underline_6uqr8_26{position:absolute;width:100%;left:0;bottom:0}._button_6uqr8_1 ._underline_6uqr8_26>span{width:20%!important}._button_6uqr8_1:before{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--themeColor));filter:contrast(1.2) brightness(.8);clip-path:circle(0% at 50% 50%);border-radius:9999px;z-index:0;opacity:0;transition:all var(--duration) var(--cubicBezierPrimary)}._button_6uqr8_1._primaryType_6uqr8_49,._button_6uqr8_1._primaryDangerType_6uqr8_49{background:rgb(var(--themeColor));box-shadow:0 0 0 2px rgb(var(--themeColor)/40%);color:#fff}._button_6uqr8_1._secondaryType_6uqr8_54,._button_6uqr8_1._secondaryDangerType_6uqr8_54{background:var(--colorBackgroundTertiary);box-shadow:0 0 0 2px rgb(var(--colorBackgroundTertiary)/40%);color:rgb(var(--themeColor))}._button_6uqr8_1._linkType_6uqr8_59,._button_6uqr8_1._linkDangerType_6uqr8_59{background:none;box-shadow:none!important;border-radius:unset;color:var(--colorContentPrimary);overflow:unset}._button_6uqr8_1._linkType_6uqr8_59 ._label_6uqr8_17,._button_6uqr8_1._linkDangerType_6uqr8_59 ._label_6uqr8_17{letter-spacing:unset;text-transform:unset}._button_6uqr8_1._linkType_6uqr8_59:before,._button_6uqr8_1._linkDangerType_6uqr8_59:before{display:none}._button_6uqr8_1._linkType_6uqr8_59:hover,._button_6uqr8_1._linkDangerType_6uqr8_59:hover{color:rgb(var(--themeColor))}._button_6uqr8_1._linkType_6uqr8_59:hover ._label_6uqr8_17,._button_6uqr8_1._linkDangerType_6uqr8_59:hover ._label_6uqr8_17{filter:contrast(.8) brightness(1.2)}._button_6uqr8_1._linkType_6uqr8_59:active ._label_6uqr8_17,._button_6uqr8_1._linkDangerType_6uqr8_59:active ._label_6uqr8_17{filter:contrast(1.2) brightness(.8)}._button_6uqr8_1._primaryDangerType_6uqr8_49,._button_6uqr8_1._secondaryDangerType_6uqr8_54,._button_6uqr8_1._linkDangerType_6uqr8_59{--themeColor: var(--colorAlertErrorRGB)}._button_6uqr8_1._primaryDangerType_6uqr8_49 ._underline_6uqr8_26 span,._button_6uqr8_1._secondaryDangerType_6uqr8_54 ._underline_6uqr8_26 span,._button_6uqr8_1._linkDangerType_6uqr8_59 ._underline_6uqr8_26 span{background:rgb(var(--themeColor))}._button_6uqr8_1._miniSize_6uqr8_88{--maxRippleSize: 80px 40px;line-height:16px;padding:8px 16px;gap:8px}._button_6uqr8_1._miniSize_6uqr8_88 ._label_6uqr8_17{font-size:12px;font-variation-settings:"wdth" 75,"wght" 400;letter-spacing:2px}._button_6uqr8_1._miniSize_6uqr8_88._iconOnly_6uqr8_99{padding:0}._button_6uqr8_1._miniSize_6uqr8_88._iconOnly_6uqr8_99 ._icon_6uqr8_23{width:32px;height:32px}._button_6uqr8_1._defaultSize_6uqr8_106{--maxRippleSize: 100px 50px;line-height:20px;padding:12px 24px;gap:10px}._button_6uqr8_1._defaultSize_6uqr8_106 ._label_6uqr8_17{font-size:16px;font-variation-settings:"wdth" 75,"wght" 500;letter-spacing:2px}._button_6uqr8_1._defaultSize_6uqr8_106._iconOnly_6uqr8_99{padding:0}._button_6uqr8_1._defaultSize_6uqr8_106._iconOnly_6uqr8_99 ._icon_6uqr8_23{width:44px;height:44px}._button_6uqr8_1._largeSize_6uqr8_124{--maxRippleSize: 150px 75px;line-height:28px;padding:16px 32px;gap:14px}._button_6uqr8_1._largeSize_6uqr8_124 ._label_6uqr8_17{font-size:22px;font-variation-settings:"wdth" 75,"wght" 600;letter-spacing:4px}._button_6uqr8_1._largeSize_6uqr8_124._iconOnly_6uqr8_99{padding:0}._button_6uqr8_1._largeSize_6uqr8_124._iconOnly_6uqr8_99 ._icon_6uqr8_23{width:60px;height:60px}._button_6uqr8_1:hover{box-shadow:0 0 0 5px rgb(var(--themeColor)/50%);transition:all var(--duration) var(--cubicBezierPrimary);color:#fff}._button_6uqr8_1:hover ._underline_6uqr8_26 span{width:100%!important}._button_6uqr8_1:hover:before{clip-path:circle(100% at 50% 50%);opacity:1}._button_6uqr8_1:active{box-shadow:0 0 0 7px rgb(var(--themeColor)/50%)}._button_6uqr8_1._clicked_6uqr8_157{box-shadow:0 0 0 0 rgb(var(--themeColor)/0%);animation:_ripple_6uqr8_1 var(--duration) linear;color:#fff}._button_6uqr8_1._clicked_6uqr8_157:before{clip-path:circle(100% at 50% 50%);opacity:1}._button_6uqr8_1._loading_6uqr8_166{--loaderColor: rgb(var(--themeColor));pointer-events:none;background:rgb(var(--themeColor)/80%)}._button_6uqr8_1._loading_6uqr8_166._secondaryType_6uqr8_54,._button_6uqr8_1._loading_6uqr8_166._secondaryDangerType_6uqr8_54{--loaderColor: var(--colorBackgroundPrimary);background:var(--colorBackgroundTertiary)}._button_6uqr8_1._loading_6uqr8_166._linkType_6uqr8_59,._button_6uqr8_1._loading_6uqr8_166._linkDangerType_6uqr8_59{background:none}._button_6uqr8_1._loading_6uqr8_166._linkType_6uqr8_59 ._underline_6uqr8_26>span,._button_6uqr8_1._loading_6uqr8_166._linkDangerType_6uqr8_59 ._underline_6uqr8_26>span{width:150%!important}._button_6uqr8_1._loading_6uqr8_166._linkType_6uqr8_59:after,._button_6uqr8_1._loading_6uqr8_166._linkDangerType_6uqr8_59:after{display:none}._button_6uqr8_1._loading_6uqr8_166:after{content:"";position:absolute;display:block;width:150%;height:100%;z-index:0;border-radius:9999px;background-image:repeating-linear-gradient(60deg,transparent,transparent .75rem,var(--loaderColor) .75rem,var(--loaderColor) 1.5rem);animation:_barberPole_6uqr8_1 .25s infinite linear}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99{background:transparent;box-shadow:0 0 0 0 rgb(var(--themeColor)/0%);overflow:unset}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99._secondaryType_6uqr8_54,._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99._secondaryDangerType_6uqr8_54{color:#fff}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99:before{clip-path:circle(45% at 50% 50%);opacity:1}._button_6uqr8_1._loading_6uqr8_166._iconOnly_6uqr8_99:after{width:100%;background:none;border:2px solid rgb(var(--themeColor));border-top-color:transparent;border-bottom-color:transparent;animation:_spin_6uqr8_1 .25s infinite linear}._button_6uqr8_1:disabled{background:rgb(var(--themeColor)/20%);color:rgb(var(--themeColor)/75%);pointer-events:none;filter:grayscale(1)}._button_6uqr8_1:disabled._secondaryType_6uqr8_54,._button_6uqr8_1:disabled._secondaryDangerType_6uqr8_54{background:rgb(var(--themeColor)/5%)}._button_6uqr8_1:disabled._linkType_6uqr8_59{background:none}._button_6uqr8_1:disabled._linkType_6uqr8_59 ._underline_6uqr8_26:before{width:0%}._button_6uqr8_1:disabled._linkType_6uqr8_59 ._underline_6uqr8_26 span{width:0%}@keyframes _ripple_6uqr8_1{0%{box-shadow:0 0 0 7px rgb(var(--themeColor)/50%)}to{box-shadow:0 0 var(--maxRippleSize) rgb(var(--themeColor)/0%)}}@keyframes _barberPole_6uqr8_1{0%{transform:translate(-1.75rem)}to{transform:translate(0)}}@keyframes _spin_6uqr8_1{0%{transform:rotate(0)}to{transform:rotate(180deg)}}._icon_awnbf_2{position:relative;width:var(--iconSize);height:var(--iconSize);font-size:var(--iconSize);display:flex;justify-content:center;align-items:center;font-variant:normal;line-height:1;text-rendering:auto;-webkit-user-select:none;user-select:none;z-index:1;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;transition:all .4s var(--cubicBezierPrimary)}._icon_awnbf_2:before{position:absolute;display:block;color:inherit;content:attr(data-content)}._icon_awnbf_2._thin_awnbf_25{font-family:FontAwesome;font-weight:100}._icon_awnbf_2._light_awnbf_29{font-family:FontAwesome;font-weight:300}._icon_awnbf_2._regular_awnbf_33{font-family:FontAwesome;font-weight:400}._icon_awnbf_2._solid_awnbf_37{font-family:FontAwesome;font-weight:900}._icon_awnbf_2._duotone_awnbf_41{font-family:FontAwesomeDuotone;font-weight:900}._icon_awnbf_2._duotone_awnbf_41:after{position:absolute;display:block;color:inherit;content:attr(data-content) attr(data-content);opacity:.3}._icon_awnbf_2._sharpSolid_awnbf_52{font-family:FontAwesomeSharp;font-weight:900}._icon_awnbf_2._sharpRegular_awnbf_56{font-family:FontAwesomeSharp;font-weight:400}._icon_awnbf_2._sharpLight_awnbf_60{font-family:FontAwesomeSharp;font-weight:300}._icon_awnbf_2._brand_awnbf_64{font-family:FontAwesomeBrand;font-weight:400}._progressBar_luf46_1{position:relative;width:100%;height:3px;display:flex;justify-content:flex-start;align-items:center;border-radius:9999px;overflow:hidden}._progressBar_luf46_1:before{content:"";position:absolute;left:0;width:100%;height:1px;border-radius:9999px;opacity:.3;background:var(--colorBorderPrimary);transition:all .5s var(--cubicBezierPrimary)}._progressBar_luf46_1>._progress_luf46_1{position:absolute;width:100%;height:3px;display:block;background:var(--gradientBrand);border-radius:9999px;transition:all .5s var(--cubicBezierPrimary)}._progressBar_luf46_1._intermediate_luf46_31{border-radius:9999px}._progressBar_luf46_1._intermediate_luf46_31:before{height:100%;background:rgb(var(--colorBrandAccentRgb))}._progressBar_luf46_1._intermediate_luf46_31>._progress_luf46_1{width:150%;background-image:repeating-linear-gradient(60deg,transparent,transparent .5rem,rgb(var(--colorBrandAccentRgb)) .5rem,rgb(var(--colorBrandAccentRgb)) 1.5rem);animation:_barberPole_luf46_1 .2s infinite linear}@keyframes _barberPole_luf46_1{0%{transform:translate(-1.75rem)}to{transform:translate(0)}}._textfield_7y99a_1{--duration: .6s;position:relative;width:400px;display:flex;justify-content:center;align-items:center;border-radius:20px;box-shadow:0 0 0 1px rgb(var(--colorBrandAccentRgb)/50%);background:var(--colorBackgroundSecondary);color:rgb(var(--colorContentPrimary));transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1:before{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb));clip-path:circle(0% at 20px 50%);border-radius:9999px;z-index:0;opacity:0;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1 ._icon_7y99a_27{position:absolute;left:0;width:40px;height:40px;color:rgb(var(--colorBrandAccentRgb)/100%);pointer-events:none;transition:all 0s}._textfield_7y99a_1 ._input_7y99a_36{width:100%;height:40px;outline:none;border:none;background:transparent;padding:10px 20px;font-size:16px;z-index:1;color:rgb(var(--colorContentPrimary));font-variation-settings:"wdth" 75,"wght" 400;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1 ._placeholder_7y99a_49{position:absolute;left:0;display:flex;align-items:center;color:var(--colorContentSecondary);transform:translate(14px);transform-origin:0 50%;line-height:20px;padding:0 8px;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1 ._placeholder_7y99a_49:before{content:"";position:absolute;left:0;display:block;width:100%;height:50%;background:var(--colorBackgroundPrimary);scale:0;z-index:-1;transition:all var(--duration) var(--cubicBezierPrimary)}._textfield_7y99a_1._withIcon_7y99a_73:before{clip-path:circle(15px at 20px 50%);opacity:.4}._textfield_7y99a_1._withIcon_7y99a_73 ._input_7y99a_36{padding:10px 20px 10px 44px}._textfield_7y99a_1._withIcon_7y99a_73 ._placeholder_7y99a_49{transform:translate(36px)}._textfield_7y99a_1._textarea_7y99a_83 ._input_7y99a_36{height:200px;padding:16px 20px;resize:none}._textfield_7y99a_1._textarea_7y99a_83 ._placeholder_7y99a_49{top:0;transform:translate(20px,16px)}._textfield_7y99a_1._hasValue_7y99a_92 ._placeholder_7y99a_49{transform:translate(24px,-28px);scale:.75;font-weight:900;color:rgb(var(--colorBrandAccentRgb)/100%)}._textfield_7y99a_1._hasValue_7y99a_92 ._placeholder_7y99a_49:before{scale:1}._textfield_7y99a_1._hasValue_7y99a_92._withIcon_7y99a_73 ._placeholder_7y99a_49{transform:translate(52px,-28px)}._textfield_7y99a_1._hasValue_7y99a_92._textarea_7y99a_83 ._placeholder_7y99a_49{transform:translate(24px,-14px)}._textfield_7y99a_1:focus-within{box-shadow:0 0 0 2px rgb(var(--colorBrandAccentRgb)/50%);background:var(--colorBackgroundPrimary)}._textfield_7y99a_1:focus-within ._placeholder_7y99a_49{transform:translate(24px,-28px);scale:.75;font-weight:900;color:rgb(var(--colorBrandAccentRgb)/100%)}._textfield_7y99a_1:focus-within ._placeholder_7y99a_49:before{scale:1}._textfield_7y99a_1:focus-within._withIcon_7y99a_73 ._placeholder_7y99a_49{transform:translate(52px,-28px)}._textfield_7y99a_1:focus-within._textarea_7y99a_83 ._placeholder_7y99a_49{transform:translate(24px,-14px)}._textfield_7y99a_1:focus-within._withIcon_7y99a_73:before{clip-path:circle(17px at 20px 50%);opacity:.8}._textfield_7y99a_1:focus-within._withIcon_7y99a_73 ._icon_7y99a_27{color:#fff;font-weight:900}._sider_9guyz_1{--duration: .6s;--paddingLeft: 0px;--paddingRight: 0px;--borderRadius: 36px;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb)/90%);padding:0 var(--paddingRight) 0 var(--paddingLeft);overflow:hidden;transition:padding var(--duration) ease}._sider_9guyz_1 ._leftSiderContainer_9guyz_13{position:fixed;left:0;width:var(--siderWidth);height:100%;z-index:0}._sider_9guyz_1 ._rightSiderContainer_9guyz_20{position:fixed;right:0;width:var(--siderWidth);height:100%;z-index:1}._sider_9guyz_1 ._content_9guyz_27{position:relative;width:100%;height:100%;background:var(--colorBackgroundPrimary);box-shadow:0 0 50px 2px #0000003d;border-radius:0;z-index:2;transition:all var(--duration) var(--cubicBezierPrimary)}._sider_9guyz_1._miniLeftSider_9guyz_37{--paddingLeft: var(--siderWidthMini)}._sider_9guyz_1._miniLeftSider_9guyz_37 ._content_9guyz_27{border-top-left-radius:var(--borderRadius);border-bottom-left-radius:var(--borderRadius)}._sider_9guyz_1._miniRightSider_9guyz_44{--paddingRight: var(--siderWidthMini)}._sider_9guyz_1._miniRightSider_9guyz_44 ._content_9guyz_27{border-top-right-radius:var(--borderRadius);border-bottom-right-radius:var(--borderRadius)}._sider_9guyz_1._leftOpen_9guyz_51 ._content_9guyz_27{border-radius:36px;transform:translate(calc(var(--siderWidth) - var(--paddingLeft)));transform-origin:left center;scale:.95}._sider_9guyz_1._rightOpen_9guyz_57 ._content_9guyz_27{border-radius:36px;transform:translate(calc((var(--siderWidth) - var(--paddingRight)) * -1));transform-origin:right center;scale:.95}._navigation_zrgjp_1{--duration: .4s;width:calc(var(--siderWidth) + 16px);height:100%;display:flex;flex-direction:column;padding:16px 0 28px}._navigation_zrgjp_1 ._brand_zrgjp_9{font-size:32px;color:#fff;padding:24px 8px;font-variation-settings:"wdth" 75,"wght" 400;text-transform:capitalize;-webkit-user-select:none;user-select:none;cursor:pointer}._navigation_zrgjp_1 ._routeList_zrgjp_18{width:100%;display:flex;flex-direction:column;flex:1;-webkit-user-select:none;user-select:none;cursor:pointer}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18{position:relative;display:flex;align-items:center;gap:2px;text-decoration:none;color:#fff;transition:all var(--duration) var(--cubicBezierPrimary)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:before{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb)/0%);filter:contrast(2) brightness(.75);z-index:0;transition:all var(--duration) var(--cubicBezierPrimary)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:after{content:"";position:absolute;display:block;width:100%;height:100%;background:rgb(var(--colorBrandAccentRgb));clip-path:circle(0% at calc(var(--siderWidthMini) / 2) 50%);filter:contrast(2) brightness(.75);z-index:0;opacity:.4;transition:all var(--duration) var(--cubicBezierPrimary)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18 ._icon_zrgjp_59{width:var(--siderWidthMini);height:var(--siderWidthMini);font-size:calc(var(--siderWidthMini) - 40px);color:#fff}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18 ._label_zrgjp_65{font-size:16px;font-variation-settings:"wdth" 75,"wght" 400;text-transform:capitalize;z-index:1}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:last-of-type{margin-top:auto}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18:hover:before{background:rgb(var(--colorBrandAccentRgb)/30%)}._navigation_zrgjp_1 ._routeList_zrgjp_18 ._route_zrgjp_18._active_zrgjp_77:after{clip-path:circle(var(--siderWidth) at calc(var(--siderWidthMini) / 2) 50%);opacity:1;transition:all var(--duration) ease-in-out}

package/dist/styles/index.scss.js

@@ -0,0 +1,5 @@
+"use client";
+const e = "";
+export {
+  e as default
+};

package/dist/utils/function/mergeRefs.js

@@ -0,0 +1,9 @@
+"use client";
+const c = (t) => (n) => {
+  t.forEach((e) => {
+    typeof e == "function" ? e(n) : e != null && (e.current = n);
+  });
+};
+export {
+  c as mergeRefs
+};

package/dist/utils/function/string.js

@@ -0,0 +1,6 @@
+"use client";
+const t = (r) => isNaN(r) || r < 0 || r > 1114111 || Math.floor(r) !== r ? "" : String.fromCodePoint(r), n = (r) => t(parseInt(`0x${r}`, 16));
+export {
+  t as safeStringFromCodePoint,
+  n as unicodeToString
+};

package/dist/utils/helper/domHelper.js

@@ -0,0 +1,38 @@
+"use client";
+const s = typeof window < "u", r = s ? window : void 0, c = (n, e) => s ? getComputedStyle((e == null ? void 0 : e.current) || document.documentElement).getPropertyValue(n) : "", v = (n, e) => parseInt(c(n, e).replace(/px/g, "")), g = (n, e) => {
+  const t = parseInt(c(n, e).replace(/vh/g, ""));
+  return [((r == null ? void 0 : r.innerHeight) ?? 0) * t / 100, t];
+}, h = (n, e) => {
+  const t = parseInt(c(n, e).replace(/vw/g, ""));
+  return [((r == null ? void 0 : r.innerWidth) ?? 0) * t / 100, t];
+}, b = (n, e, t) => s ? ((t == null ? void 0 : t.current) || document.documentElement).style.setProperty(n, e) : "", w = (n) => new Promise((e) => {
+  let t = document.querySelector(n);
+  if (t)
+    return e(t);
+  const o = new MutationObserver(() => {
+    t = document.querySelector(n), t && (e(t), o.disconnect());
+  });
+  o.observe(document.body, { childList: !0, subtree: !0 });
+}), P = (n, e) => {
+  var t;
+  (t = e == null ? void 0 : e.forEach) == null || t.call(e, (o) => {
+    let u;
+    new MutationObserver((i) => {
+      var a;
+      document.querySelector(o) && (u = document.querySelector(o)), (a = i == null ? void 0 : i.forEach) == null || a.call(i, (d) => {
+        d.type === "childList" && (Array.from(d.addedNodes).indexOf(u) > -1 && n(u, "added", d), Array.from(d.removedNodes).indexOf(u) > -1 && n(u, "removed", d));
+      });
+    }).observe(document.body, { childList: !0, subtree: !0 });
+  });
+};
+export {
+  r as dom,
+  P as elementObserver,
+  c as getCssProperty,
+  v as getCssPropertyPx,
+  g as getCssPropertyVh,
+  h as getCssPropertyVw,
+  s as isClient,
+  b as setCssProperty,
+  w as waitForElement
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "xtreme-ui",
-	"version": "0.0.12",
+	"version": "0.0.13",
 	"type": "module",
 	"description": "Collection of reusable components that can be used in web projects",
 	"main": "dist/index.umd.js",