@functionalui/functionalui 0.2.6 → 0.2.8

package/dist/InputText-DnR7KYJS.js

@@ -0,0 +1,246 @@
+"use client";
+import { jsxs as L, jsx as e } from "react/jsx-runtime";
+import { C as f } from "./component-CGEZuC_0.js";
+import { F as tt } from "./component-JelkpADf.js";
+import { C as b, a as ot } from "./generics-D33J7ILI.js";
+import { C as et, f as rt, c as st } from "./generics-C-WSPclF.js";
+import { S as nt } from "./values-B5r2bYNJ.js";
+import { c as z, a as s, I as D, e as S, h as m, f as it, g as y, b as I } from "./icons-B8R1UT86.js";
+import { useState as B, useRef as at, useEffect as W, useCallback as k } from "react";
+import { u as dt } from "./useCombinedRef-COuiqHjO.js";
+import { L as lt } from "./LabelText-WYEq5keJ.js";
+import { U as F } from "./UIcon-Cc5PX9WJ.js";
+import { S as M } from "./generics-BrMr2-Gs.js";
+import { T as ft } from "./component-BbiEBU5H.js";
+const ut = ({ inputHelper: t }) => {
+  const [n, o] = B(!1);
+  return /* @__PURE__ */ L(
+    f,
+    {
+      style: {
+        position: "absolute",
+        top: "50%",
+        right: -10,
+        transform: "translateY(-25%)"
+      },
+      onMouseEnter: () => o(!0),
+      onMouseLeave: () => o(!1),
+      children: [
+        /* @__PURE__ */ e(
+          F,
+          {
+            name: "info",
+            size: M.Size2,
+            colorLight: b.Primary5,
+            colorDark: b.Primary5
+          }
+        ),
+        /* @__PURE__ */ e(f, { style: { position: "relative", pointerEvents: "none" }, children: /* @__PURE__ */ e(lt, { labelName: t, hover: n, x: 0, y: 0 }) })
+      ]
+    }
+  );
+}, pt = "_inputtext_rg89u_1", ct = "_showHidePassword_rg89u_41", X = {
+  inputtext: pt,
+  showHidePassword: ct
+}, mt = ({ isShow: t, handleShowHideText: n }) => /* @__PURE__ */ e(
+  f,
+  {
+    className: X.showHidePassword,
+    style: {
+      position: "absolute",
+      bottom: ".75rem",
+      left: "88%",
+      zIndex: 4,
+      cursor: "pointer"
+    },
+    onClick: () => n(),
+    children: /* @__PURE__ */ e(
+      F,
+      {
+        name: t ? z.EyeOff : z.Eye,
+        size: M.Size3,
+        colorLight: b.Primary5,
+        colorDark: b.Primary5,
+        cursor: et.Pointer
+      }
+    )
+  }
+), bt = ({
+  id: t,
+  label: n,
+  size: o,
+  labelTextColor: i,
+  inputColor: r
+}) => /* @__PURE__ */ e(
+  f,
+  {
+    paddingLeft: s[o].paddings.left,
+    paddingBottom: s[o].paddings.bottom,
+    children: /* @__PURE__ */ e("label", { htmlFor: t, children: /* @__PURE__ */ e(
+      ft,
+      {
+        fontWeight: rt.Size3,
+        paletteColor: i && typeof i == "boolean" ? D[r].labelColor : b.Grey10,
+        fontSize: s[o].font.size,
+        children: n
+      }
+    ) })
+  }
+), Lt = ({
+  // required
+  id: t,
+  name: n,
+  type: o = m.Text,
+  value: i,
+  modes: r = S.Default,
+  label: g,
+  // optional properties
+  focus: u,
+  required: T,
+  width: p,
+  fullWidth: x,
+  helperText: c,
+  placeholder: h = "Insert text",
+  // other types property
+  step: j,
+  min: A,
+  // methods
+  handleChange: P,
+  handleFocus: _,
+  handleBlur: H,
+  handleCheck: C,
+  // styling
+  size: a = it.Default,
+  inputStyle: w = y.Default,
+  inputColor: v = ot.Primarys,
+  // customizations
+  labelTextColor: G = !0,
+  transparent: N,
+  ref: Y,
+  ...V
+}) => {
+  const d = at(null), Z = dt(d, Y);
+  W(() => {
+    if (r !== S.Disabled) {
+      if (u) {
+        d.current && d.current.focus();
+        return;
+      }
+      i !== "" && d.current && d.current.value;
+    }
+  }, [u, r, i]);
+  const [q, R] = B(o), [E, J] = B(!1), K = () => {
+    J((l) => !l);
+  };
+  W(() => {
+    o === m.Password && R(E ? m.Text : m.Password);
+  }, [E]);
+  const Q = (l) => {
+    P && P(l);
+  }, $ = k(
+    async (l) => {
+      l.preventDefault();
+      const U = l.target.value.trim();
+      if (!(!U || U !== "")) {
+        H && H(), C && await C();
+        return;
+      }
+    },
+    [H, C]
+  ), O = k(() => {
+    if (r !== S.Disabled)
+      return d.current && d.current.focus(), _ && _(), !0;
+  }, [_, r]);
+  return /* @__PURE__ */ L(
+    f,
+    {
+      style: {
+        width: x ? "100%" : p || 350,
+        position: "relative"
+        // to label
+      },
+      children: [
+        !N && /* @__PURE__ */ e(
+          bt,
+          {
+            id: t,
+            label: g,
+            inputColor: v,
+            size: a,
+            labelTextColor: G
+          }
+        ),
+        /* @__PURE__ */ L(
+          f,
+          {
+            boxSizing: st.BorderBox,
+            ...gt(w, N),
+            borderColor: D[v].borderColor,
+            paddingLeft: s[a].paddings.left,
+            paddingRight: s[a].paddings.right,
+            paddingTop: s[a].paddings.top,
+            paddingBottom: s[a].paddings.bottom,
+            style: {
+              // position: "relative",
+              // width: fullWidth ? "100%" : width ? width : 350,
+              paddingTop: w !== y.Outlined ? 1 : "",
+              paddingBottom: w !== y.Outlined ? nt[s[a].paddings.bottom] : "",
+              // display: size === InputTextSizes.Small ? "flex" : "block",
+              display: w !== y.Outlined ? "flex" : "block",
+              cursor: "text"
+            },
+            onClick: () => O(),
+            children: [
+              /* @__PURE__ */ e(
+                tt,
+                {
+                  ref: Z,
+                  type: q,
+                  required: T,
+                  disabled: r !== S.Disabled ? void 0 : !0,
+                  fontSize: s[a].font.size,
+                  fontWeight: s[a].font.weight,
+                  color: D[v].fontColor,
+                  placeholder: h,
+                  id: t,
+                  name: n,
+                  value: i,
+                  min: A,
+                  step: j,
+                  onChange: P ? Q : void 0,
+                  onFocus: O,
+                  onBlur: $,
+                  className: X.inputtext,
+                  ...V
+                }
+              ),
+              o === m.Password && /* @__PURE__ */ e(
+                mt,
+                {
+                  isShow: E,
+                  handleShowHideText: K
+                }
+              ),
+              c && /* @__PURE__ */ e(ut, { inputHelper: c })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}, gt = (t, n = !1) => {
+  var o, i, r, g, u, T, p, x, c, h;
+  return n ? {} : {
+    // default
+    borderBottomStyle: (r = (i = (o = I[t]) == null ? void 0 : o.borders) == null ? void 0 : i.bottom) == null ? void 0 : r.style,
+    borderWidth: (u = (g = I[t]) == null ? void 0 : g.borders) == null ? void 0 : u.width,
+    // outline
+    borderRadius: (p = (T = I[t]) == null ? void 0 : T.borders) == null ? void 0 : p.radius,
+    borderStyle: (h = (c = (x = I[t]) == null ? void 0 : x.borders) == null ? void 0 : c.borders) == null ? void 0 : h.style
+    // filled
+    // borderRadius: undefined,
+  };
+};
+export {
+  Lt as I
+};

package/dist/InsetGroup-BHxpHwpd.js

@@ -0,0 +1,105 @@
+"use client";
+import { jsx as i } from "react/jsx-runtime";
+import { L as R } from "./component-CLzFHaNK.js";
+import { S as l, R as p } from "./generics-C-WSPclF.js";
+import { h as b, b as x } from "./classes-CVxy1f4M.js";
+import { useState as z, useEffect as C } from "react";
+import { u } from "./react-spring_web.modern-DUf5COpz.js";
+import { C as y } from "./component-CGEZuC_0.js";
+import { T as I } from "./component-BbiEBU5H.js";
+import { a as m } from "./generics-D33J7ILI.js";
+import { a as d, c as f } from "./values-CSE3dLnv.js";
+const L = ({
+  text: e,
+  // value,
+  idx: s,
+  // id,
+  handleSelectInset: c,
+  isSelected: o,
+  // rgbBg,
+  insetColor: a = m.Primarys,
+  borderTopLeftRadius: h,
+  borderTopRightRadius: S,
+  borderBottomLeftRadius: n,
+  borderBottomRightRadius: g
+}) => {
+  const r = u({
+    // backgroundColor: isSelected ? rgbBg ? rgbBg : "rgb(255,255,255)" : "rgb(222,226,230)",
+    backgroundColor: o ? d[f[a][0] + 3] : d[f[m.Greys][0] + 2],
+    // color: isSelected ? "rgb(25,25,25)" : "rgb(134,142,150)",
+    color: o ? d[f[m.Greys][1] - 1] : d[f[m.Greys][1] - 4],
+    boxShadow: o ? "inset 0 0px 0 hsla(0, 0%, 0%, 0), inset 0 0px 0px hsla(0, 0%, 0%, 0)" : "inset 0 -2px 0 hsla(0, 0%, 100%, .055), inset 0 2px 2px hsla(0, 0%, 0%, 0.1)"
+    // boxShadow: isSelected ? "inset 0 0px 0 hsla(0, 0%, 0%, 0)" : "inset 0 -2px 0 hsla(0, 0%, 100%, .15)",
+    // config: {
+    //   ...config.molasses,
+    // }
+  }), t = u({
+    // scale: isSelected ? 1 : 0.9,
+    fontWeight: o ? 500 : 300
+  });
+  return /* @__PURE__ */ i(
+    y,
+    {
+      style: { ...r, cursor: "pointer" },
+      paddingTop: l.Size1,
+      paddingBottom: l.Size1,
+      paddingLeft: l.Size2,
+      paddingRight: l.Size2,
+      borderTopLeftRadius: h,
+      borderTopRightRadius: S,
+      borderBottomLeftRadius: n,
+      borderBottomRightRadius: g,
+      onClick: () => c(s),
+      children: /* @__PURE__ */ i(y, { style: t, children: /* @__PURE__ */ i(
+        I,
+        {
+          style: {
+            color: "inherit",
+            transform: "translateY(-1px)",
+            display: "inline-block"
+          },
+          children: e
+        }
+      ) })
+    }
+  );
+}, j = ({
+  options: e = [],
+  // id, value, text
+  valueIndex: s = 0,
+  id: c,
+  setInput: o,
+  setSelect: a,
+  insetColor: h
+}) => {
+  const [S, n] = z(s);
+  C(() => {
+    typeof s == "number" && n(s);
+  }, [s]);
+  const g = (r) => {
+    n(r), o && o((t) => ({
+      ...t,
+      [c]: e[r]
+    })), a && a(e[r]);
+  };
+  return /* @__PURE__ */ i(R, { display: x.Flex, flexAlignItem: b.Center, children: e.map((r, t) => /* @__PURE__ */ i(
+    L,
+    {
+      text: r.text,
+      value: r.value,
+      idx: t,
+      id: r.id,
+      handleSelectInset: g,
+      isSelected: t === S,
+      insetColor: h,
+      borderTopLeftRadius: t === 0 ? p.Size4 : void 0,
+      borderTopRightRadius: t === e.length - 1 ? p.Size4 : void 0,
+      borderBottomLeftRadius: t === 0 ? p.Size4 : void 0,
+      borderBottomRightRadius: t === e.length - 1 ? p.Size4 : void 0
+    },
+    t
+  )) });
+};
+export {
+  j as I
+};

package/dist/InsetGroup-CGACEEbB.cjs

@@ -0,0 +1 @@
+"use client";"use strict";const a=require("react/jsx-runtime"),y=require("./component-B1mkowwk.cjs"),r=require("./generics-9F1CmKPb.cjs"),R=require("./classes-HsjFV5aN.cjs"),h=require("react"),C=require("./react-spring_web.modern-W3Nkoq_6.cjs"),m=require("./component-D-EEi7NI.cjs"),x=require("./component-Bh3EPTN0.cjs"),u=require("./generics-DE1oV0MV.cjs"),t=require("./values-C40_Fyfk.cjs"),f=({text:o,idx:i,handleSelectInset:d,isSelected:n,insetColor:l=u.ColorSets.Primarys,borderTopLeftRadius:p,borderTopRightRadius:S,borderBottomLeftRadius:c,borderBottomRightRadius:g})=>{const s=C.useSpring({backgroundColor:n?t.COLOR_VALUES[t.ColorRanges[l][0]+3]:t.COLOR_VALUES[t.ColorRanges[u.ColorSets.Greys][0]+2],color:n?t.COLOR_VALUES[t.ColorRanges[u.ColorSets.Greys][1]-1]:t.COLOR_VALUES[t.ColorRanges[u.ColorSets.Greys][1]-4],boxShadow:n?"inset 0 0px 0 hsla(0, 0%, 0%, 0), inset 0 0px 0px hsla(0, 0%, 0%, 0)":"inset 0 -2px 0 hsla(0, 0%, 100%, .055), inset 0 2px 2px hsla(0, 0%, 0%, 0.1)"}),e=C.useSpring({fontWeight:n?500:300});return a.jsx(m.Container,{style:{...s,cursor:"pointer"},paddingTop:r.Spacings.Size1,paddingBottom:r.Spacings.Size1,paddingLeft:r.Spacings.Size2,paddingRight:r.Spacings.Size2,borderTopLeftRadius:p,borderTopRightRadius:S,borderBottomLeftRadius:c,borderBottomRightRadius:g,onClick:()=>d(i),children:a.jsx(m.Container,{style:e,children:a.jsx(x.Text_Span,{style:{color:"inherit",transform:"translateY(-1px)",display:"inline-block"},children:o})})})},L=({options:o=[],valueIndex:i=0,id:d,setInput:n,setSelect:l,insetColor:p})=>{const[S,c]=h.useState(i);h.useEffect(()=>{typeof i=="number"&&c(i)},[i]);const g=s=>{c(s),n&&n(e=>({...e,[d]:o[s]})),l&&l(o[s])};return a.jsx(y.Layout,{display:R.Displays.Flex,flexAlignItem:R.FlexAlignItems.Center,children:o.map((s,e)=>a.jsx(f,{text:s.text,value:s.value,idx:e,id:s.id,handleSelectInset:g,isSelected:e===S,insetColor:p,borderTopLeftRadius:e===0?r.Radiuses.Size4:void 0,borderTopRightRadius:e===o.length-1?r.Radiuses.Size4:void 0,borderBottomLeftRadius:e===0?r.Radiuses.Size4:void 0,borderBottomRightRadius:e===o.length-1?r.Radiuses.Size4:void 0},e))})};exports.InsetGroup=L;

package/dist/{LabelText-D7QIWtWj.js → LabelText-WYEq5keJ.js}

@@ -1,7 +1,7 @@
 import { jsx as n } from "react/jsx-runtime";
-import { u as o } from "./react-spring_web.modern-DgQDaJ06.js";
-import { C as e } from "./component-C1Gs4nVu.js";
-import { T as f } from "./component-D0wwK4KY.js";
+import { u as o } from "./react-spring_web.modern-DUf5COpz.js";
+import { C as e } from "./component-CGEZuC_0.js";
+import { T as f } from "./component-D-bBH8nL.js";
 import { u } from "./web-B_p0FWHf.js";
 const y = ({
   labelName: m = "",

package/dist/LoadingSpinner-BC0eMoVW.js

@@ -0,0 +1,101 @@
+"use client";
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { d as s, a as z } from "./react-spring_web.modern-DUf5COpz.js";
+import { S as i } from "./generics-BrMr2-Gs.js";
+const n = {
+  [i.Size1]: { containerSize: 8, size: 4 },
+  [i.Size2]: { containerSize: 12, size: 8 },
+  [i.Size3]: { containerSize: 16, size: 12 },
+  [i.Size4]: { containerSize: 20, size: 16 },
+  [i.Size5]: { containerSize: 24, size: 20 },
+  [i.Size6]: { containerSize: 28, size: 24 },
+  [i.Size7]: { containerSize: 32, size: 28 },
+  [i.Size8]: { containerSize: 36, size: 32 },
+  [i.Size9]: { containerSize: 44, size: 40 },
+  [i.Size10]: { containerSize: 52, size: 48 },
+  [i.Size11]: { containerSize: 60, size: 54 },
+  [i.Size12]: { containerSize: 68, size: 64 },
+  [i.Size13]: { containerSize: 76, size: 72 },
+  [i.Size14]: { containerSize: 84, size: 80 },
+  [i.Size15]: { containerSize: 92, size: 88 }
+};
+function S({ size: t = i.Size3 }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: "image-container",
+      style: {
+        width: `${n[t].containerSize}px`,
+        height: `${n[t].containerSize}px`
+      },
+      children: /* @__PURE__ */ e(
+        "svg",
+        {
+          className: "text-zinc-300",
+          viewBox: "0 0 2400 2400",
+          width: n[t].size,
+          height: n[t].size,
+          children: /* @__PURE__ */ c(
+            "g",
+            {
+              strokeWidth: 200,
+              strokeLinecap: "round",
+              stroke: "currentColor",
+              fill: "none",
+              children: [
+                /* @__PURE__ */ e("path", { d: "M1200 600L1200 100" }),
+                /* @__PURE__ */ e("path", { opacity: 0.5, d: "M1200 2300L1200 1800" }),
+                /* @__PURE__ */ e("path", { opacity: 0.917, d: "M900 680.4L650 247.4" }),
+                /* @__PURE__ */ e("path", { opacity: 0.417, d: "M1750 2152.6L1500 1719.6" }),
+                /* @__PURE__ */ e("path", { opacity: 0.833, d: "M680.4 900L247.4 650" }),
+                /* @__PURE__ */ e("path", { opacity: 0.333, d: "M2152.6 1750L1719.6 1500" }),
+                /* @__PURE__ */ e("path", { opacity: 0.75, d: "M600 1200L100 1200" }),
+                /* @__PURE__ */ e("path", { opacity: 0.25, d: "M2300 1200L1800 1200" }),
+                /* @__PURE__ */ e("path", { opacity: 0.667, d: "M680.4 1500L247.4 1750" }),
+                /* @__PURE__ */ e("path", { opacity: 0.167, d: "M2152.6 650L1719.6 900" }),
+                /* @__PURE__ */ e("path", { opacity: 0.583, d: "M900 1719.6L650 2152.6" }),
+                /* @__PURE__ */ e("path", { opacity: 0.083, d: "M1750 247.4L1500 680.4" }),
+                /* @__PURE__ */ e(
+                  "animateTransform",
+                  {
+                    attributeName: "transform",
+                    attributeType: "XML",
+                    type: "rotate",
+                    keyTimes: "0;0.08333;0.16667;0.25;0.33333;0.41667;0.5;0.58333;0.66667;0.75;0.83333;0.91667",
+                    values: "0 1199 1199;30 1199 1199;60 1199 1199;90 1199 1199;120 1199 1199;150 1199 1199;180 1199 1199;210 1199 1199;240 1199 1199;270 1199 1199;300 1199 1199;330 1199 1199",
+                    dur: "0.83333s",
+                    begin: "0s",
+                    repeatCount: "indefinite",
+                    calcMode: "discrete"
+                  }
+                )
+              ]
+            }
+          )
+        }
+      )
+    }
+  );
+}
+const y = ({ isLoading: t, size: a = i.Size3 }) => s(t, {
+  from: { opacity: 0, scale: 0.6, height: 0 },
+  enter: { opacity: 1, scale: 1, height: 30 },
+  leave: { opacity: 0, scale: 0.6, height: 0 }
+})(
+  (o, r) => r && /* @__PURE__ */ e(
+    z.div,
+    {
+      style: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        ...o
+      },
+      children: /* @__PURE__ */ e(S, { size: a })
+    }
+  )
+);
+export {
+  y as L,
+  S
+};

package/dist/LoadingSpinner-DykDI5-W.cjs

@@ -0,0 +1 @@
+"use client";"use strict";const i=require("react/jsx-runtime"),s=require("./react-spring_web.modern-W3Nkoq_6.cjs"),e=require("./generics-nyvJhwQE.cjs"),t={[e.Sizings.Size1]:{containerSize:8,size:4},[e.Sizings.Size2]:{containerSize:12,size:8},[e.Sizings.Size3]:{containerSize:16,size:12},[e.Sizings.Size4]:{containerSize:20,size:16},[e.Sizings.Size5]:{containerSize:24,size:20},[e.Sizings.Size6]:{containerSize:28,size:24},[e.Sizings.Size7]:{containerSize:32,size:28},[e.Sizings.Size8]:{containerSize:36,size:32},[e.Sizings.Size9]:{containerSize:44,size:40},[e.Sizings.Size10]:{containerSize:52,size:48},[e.Sizings.Size11]:{containerSize:60,size:54},[e.Sizings.Size12]:{containerSize:68,size:64},[e.Sizings.Size13]:{containerSize:76,size:72},[e.Sizings.Size14]:{containerSize:84,size:80},[e.Sizings.Size15]:{containerSize:92,size:88}};function a({size:n=e.Sizings.Size3}){return i.jsx("div",{className:"image-container",style:{width:`${t[n].containerSize}px`,height:`${t[n].containerSize}px`},children:i.jsx("svg",{className:"text-zinc-300",viewBox:"0 0 2400 2400",width:t[n].size,height:t[n].size,children:i.jsxs("g",{strokeWidth:200,strokeLinecap:"round",stroke:"currentColor",fill:"none",children:[i.jsx("path",{d:"M1200 600L1200 100"}),i.jsx("path",{opacity:.5,d:"M1200 2300L1200 1800"}),i.jsx("path",{opacity:.917,d:"M900 680.4L650 247.4"}),i.jsx("path",{opacity:.417,d:"M1750 2152.6L1500 1719.6"}),i.jsx("path",{opacity:.833,d:"M680.4 900L247.4 650"}),i.jsx("path",{opacity:.333,d:"M2152.6 1750L1719.6 1500"}),i.jsx("path",{opacity:.75,d:"M600 1200L100 1200"}),i.jsx("path",{opacity:.25,d:"M2300 1200L1800 1200"}),i.jsx("path",{opacity:.667,d:"M680.4 1500L247.4 1750"}),i.jsx("path",{opacity:.167,d:"M2152.6 650L1719.6 900"}),i.jsx("path",{opacity:.583,d:"M900 1719.6L650 2152.6"}),i.jsx("path",{opacity:.083,d:"M1750 247.4L1500 680.4"}),i.jsx("animateTransform",{attributeName:"transform",attributeType:"XML",type:"rotate",keyTimes:"0;0.08333;0.16667;0.25;0.33333;0.41667;0.5;0.58333;0.66667;0.75;0.83333;0.91667",values:"0 1199 1199;30 1199 1199;60 1199 1199;90 1199 1199;120 1199 1199;150 1199 1199;180 1199 1199;210 1199 1199;240 1199 1199;270 1199 1199;300 1199 1199;330 1199 1199",dur:"0.83333s",begin:"0s",repeatCount:"indefinite",calcMode:"discrete"})]})})})}const o=({isLoading:n,size:z=e.Sizings.Size3})=>s.useTransition(n,{from:{opacity:0,scale:.6,height:0},enter:{opacity:1,scale:1,height:30},leave:{opacity:0,scale:.6,height:0}})((r,c)=>c&&i.jsx(s.animated.div,{style:{display:"flex",justifyContent:"center",alignItems:"center",...r},children:i.jsx(a,{size:z})}));exports.LoadingSpinner=o;exports.Spinner=a;

package/dist/{Modal-DXLyt-j4.js → Modal-Di5ye0Cr.js}

@@ -1,15 +1,15 @@
 "use client";
 import { jsx as _, jsxs as gt } from "react/jsx-runtime";
-import { L as _t } from "./component-DRXQXr2G.js";
+import { L as _t } from "./component-CLzFHaNK.js";
 import { h as yt, j as vt, b as bt } from "./classes-CVxy1f4M.js";
 import { M as R } from "./types-Dyu7oUOO.js";
 import P, { useEffect as tt, useState as wt } from "react";
-import { S as Et } from "./SpringEnterOffsetBy-DMSIQgV3.js";
+import { S as Et } from "./SpringEnterOffsetBy-BKglENgZ.js";
 import { P as Tt } from "./types-DamZRbFt.js";
 import { createPortal as St } from "react-dom";
 import { P as At } from "./types-DgSz2H9f.js";
-import { d as et, u as Dt } from "./react-spring_web.modern-DgQDaJ06.js";
-import { C as V } from "./component-C1Gs4nVu.js";
+import { d as et, u as Dt } from "./react-spring_web.modern-DUf5COpz.js";
+import { C as V } from "./component-CGEZuC_0.js";
 import { a as It, C as Ot, b as kt } from "./values-CSE3dLnv.js";
 import { u as xt } from "./useClickOutsideDOM-CBmttEFU.js";
 function Ct(s, t = () => {

package/dist/NotificationSystem-B5NXsG0a.js

@@ -0,0 +1,158 @@
+"use client";
+import { jsx as i, jsxs as p, Fragment as w } from "react/jsx-runtime";
+import { d as I } from "./react-spring_web.modern-DUf5COpz.js";
+import { C as r } from "./component-CGEZuC_0.js";
+import { u as M } from "./GlobalEventContext-DUmT3Vay.js";
+import { G as v } from "./GlobalEventPortal-GjfUDr2B.js";
+import { U as x } from "./UIcon-Cc5PX9WJ.js";
+import { L as z } from "./component-CLzFHaNK.js";
+import { T as F } from "./component-D-bBH8nL.js";
+import { C as R } from "./generics-D33J7ILI.js";
+import { b as A, S as d, R as E, d as T } from "./generics-C-WSPclF.js";
+import { h as b, i as L, b as C } from "./classes-CVxy1f4M.js";
+import { S } from "./generics-BrMr2-Gs.js";
+import { useMemo as y, useState as _, useEffect as D } from "react";
+const G = "_message_1i7cn_1", N = "_life_1i7cn_12", u = {
+  message: G,
+  life: N
+}, P = () => {
+  const { globalEventRef: a } = M();
+  return /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
+    $,
+    {
+      children: (l) => {
+        a.current = l;
+      }
+    }
+  ) });
+};
+let W = 0;
+function $({
+  config: a = { tension: 125, friction: 20, precision: 0.1 },
+  timeout: l = 3e3,
+  children: c
+}) {
+  const s = y(() => /* @__PURE__ */ new WeakMap(), []), m = y(() => /* @__PURE__ */ new WeakMap(), []), [g, n] = _([]), h = I(g, {
+    from: { opacity: 0, height: 0, life: "100%", y: 0 },
+    keys: (t) => t.key,
+    enter: (t) => async (o, e) => {
+      m.set(t, e), await o({
+        opacity: 1,
+        height: s.get(t).offsetHeight + 10,
+        y: 30
+      }), await o({ life: "0%" });
+    },
+    leave: [{ opacity: 0, y: 50 }, { height: 0 }],
+    onRest: (t, o, e) => {
+      n(
+        (f) => f.filter((k) => k.key !== e.key)
+      );
+    },
+    config: (t, o, e) => (f) => e === "enter" && f === "life" ? { duration: t.type.isTimeout ? l : 1e3 * 60 * 60 * 24 } : a
+  });
+  return D(() => {
+    c(
+      (t, o, e) => {
+        n((f) => [
+          ...f,
+          { key: W++, msg: t, type: o, customAction: e }
+        ]);
+      }
+    );
+  }, [c]), /* @__PURE__ */ i(
+    z,
+    {
+      display: C.Flex,
+      flexDirection: L.Column,
+      flexAlignItem: b.FlexEnd,
+      style: { position: "fixed", zIndex: 1e3, bottom: "30px", right: "30px" },
+      children: h(({ life: t, ...o }, e) => /* @__PURE__ */ i(
+        j,
+        {
+          style: o,
+          refMap: s,
+          cancelMap: m,
+          type: e.type,
+          msg: e.msg,
+          life: t,
+          item: e,
+          customAction: e.customAction
+        }
+      ))
+    }
+  );
+}
+const j = ({
+  style: a,
+  refMap: l,
+  cancelMap: c,
+  type: s,
+  msg: m,
+  life: g,
+  item: n,
+  customAction: h
+}) => {
+  const [t, o] = _(!1);
+  return /* @__PURE__ */ i(
+    r,
+    {
+      style: a,
+      className: t ? `${u.message} disabled` : u.message,
+      children: /* @__PURE__ */ i("div", { ref: (e) => e && l.set(n, e), children: /* @__PURE__ */ i(
+        r,
+        {
+          bgColor: R.Secondary2,
+          borderRadius: E.Size4,
+          padding: d.Size3,
+          boxShadow: A.Size5,
+          style: { borderBottom: "none" },
+          children: /* @__PURE__ */ p(
+            z,
+            {
+              display: C.Flex,
+              flexAlignItem: b.Center,
+              style: { position: "relative", minWidth: "200px" },
+              children: [
+                /* @__PURE__ */ i(r, { marginRight: d.Size2, children: /* @__PURE__ */ i(
+                  x,
+                  {
+                    name: s.icon,
+                    size: S.Size6,
+                    colorLight: s.color,
+                    colorDark: s.color,
+                    withMargin: !1
+                  }
+                ) }),
+                /* @__PURE__ */ i(F, { fontSize: T.Size4, children: m || s.default }),
+                /* @__PURE__ */ p(r, { marginLeft: d.Auto, paddingLeft: d.Size3, children: [
+                  h && /* @__PURE__ */ i(r, { marginRight: d.Size3, children: h }),
+                  /* @__PURE__ */ i(
+                    x,
+                    {
+                      name: "x-circle",
+                      size: S.Size4,
+                      iconAction: () => {
+                        t || (c.has(n) && g.get() !== "0%" && c.get(n)(), o(!0));
+                      },
+                      withMargin: !1
+                    }
+                  )
+                ] }),
+                (s == null ? void 0 : s.isTimeout) && /* @__PURE__ */ i(
+                  r,
+                  {
+                    className: `${u.life} ${s.classname}`,
+                    style: { right: g, transform: "translateY(8px)" }
+                  }
+                )
+              ]
+            }
+          )
+        }
+      ) })
+    }
+  );
+}, ie = () => /* @__PURE__ */ i(w, { children: /* @__PURE__ */ i(P, {}) });
+export {
+  ie as N
+};

package/dist/NotificationSystem-D4ydo2Lk.cjs

@@ -0,0 +1 @@
+"use client";"use strict";const e=require("react/jsx-runtime"),b=require("./react-spring_web.modern-W3Nkoq_6.cjs"),a=require("./component-D-EEi7NI.cjs"),C=require("./GlobalEventContext-D9ug9s1O.cjs"),q=require("./GlobalEventPortal-BIdCGd-m.cjs"),p=require("./UIcon-B5rpDmHC.cjs"),j=require("./component-B1mkowwk.cjs"),_=require("./component-JigdcRMd.cjs"),I=require("./generics-DE1oV0MV.cjs"),o=require("./generics-9F1CmKPb.cjs"),m=require("./classes-HsjFV5aN.cjs"),y=require("./generics-nyvJhwQE.cjs"),d=require("react"),v="_message_1i7cn_1",w="_life_1i7cn_12",S={message:v,life:w},M=()=>{const{globalEventRef:c}=C.useGlobalEventContext();return e.jsx(q.GlobalEventPortal,{children:e.jsx(E,{children:l=>{c.current=l}})})};let k=0;function E({config:c={tension:125,friction:20,precision:.1},timeout:l=3e3,children:g}){const i=d.useMemo(()=>new WeakMap,[]),u=d.useMemo(()=>new WeakMap,[]),[f,r]=d.useState([]),h=b.useTransition(f,{from:{opacity:0,height:0,life:"100%",y:0},keys:s=>s.key,enter:s=>async(t,n)=>{u.set(s,n),await t({opacity:1,height:i.get(s).offsetHeight+10,y:30}),await t({life:"0%"})},leave:[{opacity:0,y:50},{height:0}],onRest:(s,t,n)=>{r(x=>x.filter(z=>z.key!==n.key))},config:(s,t,n)=>x=>n==="enter"&&x==="life"?{duration:s.type.isTimeout?l:1e3*60*60*24}:c});return d.useEffect(()=>{g((s,t,n)=>{r(x=>[...x,{key:k++,msg:s,type:t,customAction:n}])})},[g]),e.jsx(j.Layout,{display:m.Displays.Flex,flexDirection:m.FlexDirections.Column,flexAlignItem:m.FlexAlignItems.FlexEnd,style:{position:"fixed",zIndex:1e3,bottom:"30px",right:"30px"},children:h(({life:s,...t},n)=>e.jsx(F,{style:t,refMap:i,cancelMap:u,type:n.type,msg:n.msg,life:s,item:n,customAction:n.customAction}))})}const F=({style:c,refMap:l,cancelMap:g,type:i,msg:u,life:f,item:r,customAction:h})=>{const[s,t]=d.useState(!1);return e.jsx(a.Container,{style:c,className:s?`${S.message} disabled`:S.message,children:e.jsx("div",{ref:n=>n&&l.set(r,n),children:e.jsx(a.Container,{bgColor:I.ColorPalettes.Secondary2,borderRadius:o.Radiuses.Size4,padding:o.Spacings.Size3,boxShadow:o.BoxShadows.Size5,style:{borderBottom:"none"},children:e.jsxs(j.Layout,{display:m.Displays.Flex,flexAlignItem:m.FlexAlignItems.Center,style:{position:"relative",minWidth:"200px"},children:[e.jsx(a.Container,{marginRight:o.Spacings.Size2,children:e.jsx(p.UIcon,{name:i.icon,size:y.Sizings.Size6,colorLight:i.color,colorDark:i.color,withMargin:!1})}),e.jsx(_.Text_P,{fontSize:o.FontSizes.Size4,children:u||i.default}),e.jsxs(a.Container,{marginLeft:o.Spacings.Auto,paddingLeft:o.Spacings.Size3,children:[h&&e.jsx(a.Container,{marginRight:o.Spacings.Size3,children:h}),e.jsx(p.UIcon,{name:"x-circle",size:y.Sizings.Size4,iconAction:()=>{s||(g.has(r)&&f.get()!=="0%"&&g.get(r)(),t(!0))},withMargin:!1})]}),(i==null?void 0:i.isTimeout)&&e.jsx(a.Container,{className:`${S.life} ${i.classname}`,style:{right:f,transform:"translateY(8px)"}})]})})})})},A=()=>e.jsx(e.Fragment,{children:e.jsx(M,{})});exports.NotificationSystem=A;