abrplus-ui-kit 1.0.7 → 1.0.8

package/dist/index-CzPs2mPX.js

@@ -0,0 +1,478 @@
+import { jsxs as w, jsx as e } from "react/jsx-runtime";
+import { F as _, T as v, I as m, a as N, R as g, L as z } from "./index-BRLLsEKX.js";
+import { c as u, A as I } from "./colors-BW-NR0oP.js";
+import { twMerge as p } from "tailwind-merge";
+function S(c) {
+  return c.slice(0, 1).toLowerCase() + c.slice(1);
+}
+function j(c) {
+  const i = Object.assign({}, { ...c });
+  return new Proxy(i, {
+    get(t, h) {
+      const r = Object.freeze({
+        ...t,
+        [Symbol.toPrimitive]() {
+          return "Error: Attempted to render object as a JSX";
+        }
+      });
+      if (h in r)
+        return r[h];
+      const a = S(h);
+      return a in r ? r[a] : null;
+    }
+  });
+}
+const A = ({ title: c, iconName: i }) => /* @__PURE__ */ w(_, { align: "center", gap: 8, children: [
+  /* @__PURE__ */ e(v, { size: 14, color: u.white_ff, children: c }),
+  i && /* @__PURE__ */ e(m, { name: i })
+] }), X = ({ children: c, title: i, iconName: t, ...h }) => /* @__PURE__ */ e(
+  N,
+  {
+    title: typeof i == "string" ? /* @__PURE__ */ e(A, { title: i, iconName: t }) : i,
+    ...h,
+    children: c
+  }
+), n = {
+  block: "text-[16px]",
+  medium: "text-[16px]",
+  small: "text-[12px]"
+}, x = (c) => ({
+  start: {
+    block: `pe-4 ${c ? "ps-3" : "ps-4"} `,
+    medium: `pe-4 ${c ? "ps-3" : "ps-4"} `,
+    small: "pe-3 ps-[8px]"
+  },
+  end: {
+    block: "ps-4 pe-3",
+    medium: "ps-4 pe-3",
+    small: "ps-4 pe-3"
+  }
+}), y = "flex relative select-none w-fit appearance-none flex-row items-center  justify-center gap-2 whitespace-nowrap rounded text-center outline-none", $ = ({
+  style: c,
+  height: i,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  ...f
+}) => {
+  const o = I.config().getAppName(), k = () => (a || l) && o ? o === "home" || o === "sandbox" || o === "bi" || o === "storybook" ? u.sales.action_light_2 : u[o].action_light_2 : u.white_ff, T = () => {
+    if (!o) return;
+    const C = {
+      bi: p("bg-sales-action hover:bg-sales-action-light-1 active:bg-sales-action-dark-1"),
+      call: p("bg-call-action hover:bg-call-action-light-1 active:bg-call-action-dark-1"),
+      club: p("bg-club-action hover:bg-club-action-light-1 active:bg-club-action-dark-1"),
+      marketing: p(
+        "bg-marketing-action hover:bg-marketing-action-light-1 active:bg-marketing-action-dark-1"
+      ),
+      sales: p("bg-sales-action hover:bg-sales-action-light-1 active:bg-sales-action-dark-1"),
+      team: p("bg-team-action hover:bg-team-action-light-1 active:bg-team-action-dark-1"),
+      rayan: p("bg-rayan-action hover:bg-rayan-action-light-1 active:bg-rayan-action-dark-1")
+    };
+    return C?.[o] || C.sales;
+  };
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: {
+        height: i || 34,
+        ...c
+      },
+      className: p(
+        "bg-repo disabled:bg-light-6 ",
+        T(),
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        y,
+        t === "block" && "w-full",
+        (a || l) && "cursor-not-allowed border-light-6",
+        d
+      ),
+      disabled: a || l,
+      ...f,
+      children: [
+        /* @__PURE__ */ e(g, { when: l, children: /* @__PURE__ */ e(_, { className: "absolute", children: /* @__PURE__ */ e(z, { isLoading: !0, size: 16 }) }) }),
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: k() }) }),
+        /* @__PURE__ */ e(
+          v,
+          {
+            lang: b,
+            weight: "medium",
+            className: n[t || "block"],
+            color: k(),
+            children: h
+          }
+        ),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: k() }) })
+      ]
+    }
+  );
+}, F = ({
+  style: c,
+  height: i = 34,
+  iconName: t,
+  disabled: h,
+  className: r,
+  iconPosition: a = "start",
+  iconProps: d,
+  color: s,
+  ...l
+}) => /* @__PURE__ */ e(
+  "button",
+  {
+    style: {
+      height: i,
+      ...c
+    },
+    className: p(
+      y,
+      "h-[34px] w-[34px] p-4",
+      "bg-light-1  border-primary-light-3 border",
+      "hover:bg-white-ff hover:border-primary-light-2",
+      "active:bg-light-6 active:border-primary-light-2",
+      "disabled:text-primary-light-2 disabled:bg-light-6 disabled:border-light-6",
+      h && "border-light-6 cursor-not-allowed",
+      r
+    ),
+    disabled: h,
+    ...l,
+    children: d?.renderIcon ? d.renderIcon : /* @__PURE__ */ e(
+      m,
+      {
+        name: t,
+        color: h ? u.primary_light_3 : s ?? u.primary,
+        ...d
+      }
+    )
+  }
+), O = ({
+  style: c,
+  height: i,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  variant: f = "outline",
+  // Default variant
+  ...o
+}) => {
+  const k = () => a || l ? u.primary_light_2 : f === "contain" ? u.white_ff : u.negative, B = f === "contain" ? "bg-negative hover:bg-negative-light-1 active:bg-negative-dark-1 disabled:bg-light-6 border-transparent" : "hover:bg-negative-light-1 active:bg-negative-dark-1 [&_p]:hover:!text-white-ff [&_*]:hover:fill-white-ff disabled:bg-light-6 bg-transparent border-negative hover:border-negative-light-1 active:border-negative-dark-1 disabled:light-6 border-[2px] border-solid";
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: {
+        height: i || 34,
+        ...c
+      },
+      className: p(
+        y,
+        B,
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        (a || l) && "cursor-not-allowed",
+        d
+      ),
+      disabled: a || l,
+      ...o,
+      children: [
+        /* @__PURE__ */ e(g, { when: l, children: /* @__PURE__ */ e(_, { className: "absolute", children: /* @__PURE__ */ e(z, { isLoading: !0, size: 16 }) }) }),
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(
+          m,
+          {
+            name: r,
+            className: p(n[t || "block"]),
+            color: k()
+          }
+        ) }),
+        /* @__PURE__ */ e(v, { weight: "medium", size: 16, color: k(), lang: b, children: h }),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: k() }) })
+      ]
+    }
+  );
+}, Q = ({
+  style: c,
+  height: i = 34,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  textSize: f,
+  ...o
+}) => {
+  const k = () => a || l ? u.primary_light_2 : u.white_ff;
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: { height: i, ...c },
+      className: p(
+        "bg-primary hover:bg-primary-light-1 active:bg-primary-dark-1 disabled:bg-light-6",
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        y,
+        t === "block" && "w-full",
+        (a || l) && "cursor-not-allowed border-light-6",
+        d
+      ),
+      disabled: a || l,
+      ...o,
+      children: [
+        /* @__PURE__ */ e(g, { when: l, children: /* @__PURE__ */ e(_, { className: "absolute", children: /* @__PURE__ */ e(z, { isLoading: !0, size: 16 }) }) }),
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: k() }) }),
+        /* @__PURE__ */ e(
+          v,
+          {
+            lang: b,
+            weight: "medium",
+            className: p(
+              "text-white-ff",
+              (a || l) && "text-primary-light-2",
+              n[t || "block"]
+            ),
+            size: f,
+            children: h
+          }
+        ),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: k() }) })
+      ]
+    }
+  );
+}, R = ({
+  style: c,
+  height: i = 34,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  ...f
+}) => {
+  const o = () => a || l ? u.primary_light_2 : u.primary;
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: { height: i, ...c },
+      className: p(
+        "bg-transparent hover:bg-primary-light-1 active:bg-primary-dark-1 disabled:bg-light-6 [&_p]:text-primary [&_p]:hover:text-white-ff [&_svg]:hover:!fill-white-ff",
+        "border-[2px] border-solid border-primary hover:border-primary-light-1 active:border-primary-dark-1 disabled:bg-light-6",
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        y,
+        (a || l) && "cursor-not-allowed",
+        d
+      ),
+      disabled: a || l,
+      ...f,
+      children: [
+        /* @__PURE__ */ e(g, { when: l, children: /* @__PURE__ */ e(_, { className: "absolute", children: /* @__PURE__ */ e(z, { isLoading: !0, size: 16 }) }) }),
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: o() }) }),
+        /* @__PURE__ */ e(v, { lang: b, weight: "medium", className: n[t || "block"], children: h }),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: o() }) })
+      ]
+    }
+  );
+}, D = ({
+  style: c,
+  height: i,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  ...f
+}) => {
+  const o = () => a || l ? u.primary_light_2 : u.primary;
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: {
+        height: i || 34,
+        ...c
+      },
+      className: p(
+        "hover:bg-light-6 active:bg-light-7 disabled:light-6 bg-transparent",
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        y,
+        (a || l) && "cursor-not-allowed ",
+        d
+      ),
+      disabled: a || l,
+      ...f,
+      children: [
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: o() }) }),
+        /* @__PURE__ */ e(
+          v,
+          {
+            lang: b,
+            weight: "medium",
+            className: n[t || "block"],
+            color: o(),
+            children: h
+          }
+        ),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: o() }) })
+      ]
+    }
+  );
+}, E = ({
+  style: c,
+  height: i,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  ...f
+}) => {
+  const o = () => a || l ? u.primary_light_2 : u.primary_dark_1;
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: {
+        height: i || 34,
+        ...c
+      },
+      className: p(
+        "bg-light-1 hover:bg-white-ff active:light-6 disabled:light-6",
+        "border-primary-light-3 hover:border-primary-light-2 active:bg-primary-light-2 disabled:light-6 border-[1px] border-solid",
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        y,
+        (a || l) && "cursor-not-allowed",
+        d
+      ),
+      disabled: a || l,
+      ...f,
+      children: [
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: o() }) }),
+        /* @__PURE__ */ e(
+          v,
+          {
+            lang: b,
+            weight: "medium",
+            className: n[t || "block"],
+            color: o(),
+            children: h
+          }
+        ),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(m, { name: r, className: n[t || "block"], color: o() }) })
+      ]
+    }
+  );
+}, J = ({
+  style: c,
+  height: i = 34,
+  mode: t,
+  children: h,
+  iconName: r,
+  disabled: a,
+  className: d,
+  iconPosition: s = "start",
+  isLoading: l,
+  lang: b = "fa",
+  underline: f,
+  textProps: o,
+  startIconSize: k,
+  endIconSize: T,
+  ...C
+}) => {
+  const B = () => a || l ? u.primary_light_2 : u.black;
+  return /* @__PURE__ */ w(
+    "button",
+    {
+      lang: b,
+      style: { height: i, ...c },
+      className: p(
+        "disabled:bg-light-6 border-none hover:bg-none focus:bg-none",
+        x(!!r)[s][t || "block"],
+        n[t || "block"],
+        y,
+        t === "block" && "w-full",
+        (a || l) && "border-light-6 cursor-not-allowed",
+        d
+      ),
+      disabled: a || l,
+      ...C,
+      children: [
+        /* @__PURE__ */ e(g, { when: l, children: /* @__PURE__ */ e(_, { className: "absolute", children: /* @__PURE__ */ e(z, { isLoading: !0, size: 16 }) }) }),
+        /* @__PURE__ */ e(g, { when: s === "start", children: r && /* @__PURE__ */ e(
+          m,
+          {
+            size: k,
+            name: r,
+            className: n[t || "block"],
+            color: B()
+          }
+        ) }),
+        /* @__PURE__ */ e(
+          v,
+          {
+            lang: b,
+            weight: "medium",
+            className: p(
+              (a || l) && "text-primary-light-2",
+              n[t || "block"],
+              f && "underline"
+            ),
+            ...o,
+            children: h
+          }
+        ),
+        /* @__PURE__ */ e(g, { when: s === "end", children: r && /* @__PURE__ */ e(
+          m,
+          {
+            size: T,
+            name: r,
+            className: n[t || "block"],
+            color: B()
+          }
+        ) })
+      ]
+    }
+  );
+}, q = j({
+  Primary: Q,
+  Secondary: R,
+  Tertiary: E,
+  SecondaryQuiet: D,
+  Icon: F,
+  Negative: O,
+  Action: $,
+  Text: J
+});
+export {
+  q as B,
+  F as I,
+  X as T,
+  y as a,
+  j as b,
+  n as f,
+  x as p
+};

package/dist/index-QraJKad8.cjs

@@ -0,0 +1 @@
+"use strict";const r=require("react/jsx-runtime"),d=require("antd"),g=require("tailwind-merge"),f=require("react"),m=require("./index-B1HRk2-g.cjs"),h={components:{Dropdown:{}}},p=({className:e,...t})=>r.jsx(d.ConfigProvider,{theme:h,children:r.jsx(d.Dropdown,{...t,className:g.twMerge("bg-light-7",e)})}),I=({preview:e=!1,width:t,height:o,fallback:c,onError:s,wrapperClassName:i,...u})=>{const[n,l]=f.useState(!1);return r.jsx(m.Flex,{style:{width:t,height:o},align:"center",justify:"center",className:i,children:n&&c?c:r.jsx(d.Image,{preview:e,onError:a=>{l(!0),s?.(a)},width:t,height:o,...u})})},L=e=>document.getElementById(e),S=(e,t)=>{let o;return function(){clearTimeout(o),o=setTimeout(e,t)}},q=({children:e,indicatorColor:t,indicatorSize:o,className:c,hasMore:s,scrollableNodeId:i,onNextPage:u})=>(f.useEffect(()=>{const n=L(i);if(n){const l=()=>{if(s){const{scrollHeight:x,scrollTop:j,clientHeight:w}=n;Math.ceil(j)+w===x&&u()}};l();const a=S(l,1500);return n.addEventListener("scroll",a),()=>n.removeEventListener("scroll",a)}},[s,i]),r.jsxs("div",{className:g.twMerge(c,"w-full"),onClick:n=>n.stopPropagation(),children:[e,s&&r.jsx(m.Flex,{className:"min-h-12",align:"center",justify:"center",children:r.jsx(m.Loading,{isLoading:!0,color:t,size:o})})]}));exports.Dropdown=p;exports.Image=I;exports.InfiniteLoader=q;