@prokodo/ui 0.0.14 → 0.0.15

package/dist/components/accordion/Accordion.js

@@ -1,115 +1,106 @@
-import { j as n } from "../../_virtual/jsx-runtime.js";
-import { useState as C, useCallback as j } from "react";
-import { create as E } from "../../helpers/bem.js";
-import { isNull as N } from "../../helpers/validations.js";
-import w from "./Accordion.module.scss.js";
-import { Headline as S } from "../headline/Headline.js";
-import { Animated as z } from "../animated/Animated.js";
-import { Button as B } from "../button/Button.js";
-import { Icon as H } from "../icon/Icon.js";
-const a = E(w, "Accordion"), D = ({
-  id: f,
-  expanded: y,
-  className: I,
-  variant: $ = "primary",
+import { j as s } from "../../_virtual/jsx-runtime.js";
+import { useState as E, useCallback as u } from "react";
+import S from "../../vendor/hugeicons/minus_sign_icon.js";
+import g from "../../vendor/hugeicons/plus_sign_icon.js";
+import { create as w } from "../../helpers/bem.js";
+import { isNull as f } from "../../helpers/validations.js";
+import B from "./Accordion.module.scss.js";
+import { Headline as H } from "../headline/Headline.js";
+import { Animated as D } from "../animated/Animated.js";
+import { Button as K } from "../button/Button.js";
+const a = w(B, "Accordion"), R = ({
+  id: j,
+  expanded: N,
+  className: $,
+  variant: y = "primary",
   titleOptions: b,
-  iconProps: l,
-  items: v,
+  items: z,
   onChange: m,
-  ...g
+  iconOverride: t,
+  ...I
 }) => {
-  const [d, k] = C(y), p = j(
-    (e, r) => {
-      const t = d === e ? null : e;
-      k(t), m(e, r, t !== null);
+  const [c, k] = E(N), p = u(
+    (e, l) => {
+      const d = c === e ? null : e;
+      k(d), m(e, l, d !== null);
     },
-    [d, m]
-  ), x = j(
-    (e, r, t) => /* @__PURE__ */ n.jsx(
-      H,
-      {
-        className: a("icon", { "is-hidden": !!t }),
-        color: r,
-        name: e,
-        size: "sm",
-        ...l
-      }
-    ),
-    [l]
+    [c, m]
+  ), A = u(
+    (e) => e ? (t == null ? void 0 : t.expanded) ?? /* @__PURE__ */ s.jsx(S, { className: a("icon"), size: 20 }) : (t == null ? void 0 : t.collapsed) ?? /* @__PURE__ */ s.jsx(g, { className: a("icon"), size: 20 }),
+    [t]
   );
-  return /* @__PURE__ */ n.jsx("div", { className: a(void 0, { [$]: !0 }, I), ...g, children: v.map((e, r) => {
+  return /* @__PURE__ */ s.jsx("div", { className: a(void 0, { [y]: !0 }, $), ...I, children: z.map((e, l) => {
     const {
-      className: t,
-      title: A,
-      renderHeader: h,
-      renderContent: u,
-      actions: c
-    } = e, i = `${f}-${e.title}`, s = d === r;
-    return /* @__PURE__ */ n.jsxs(
+      className: d,
+      title: C,
+      renderHeader: x,
+      renderContent: h,
+      actions: i
+    } = e, r = `${j}-${e.title}`, o = c === l;
+    return /* @__PURE__ */ s.jsxs(
       "div",
       {
         className: a(
           "item",
-          { "is-expanded": s },
-          t
+          { "is-expanded": o },
+          d
         ),
         children: [
-          /* @__PURE__ */ n.jsxs(
+          /* @__PURE__ */ s.jsxs(
             "div",
             {
-              "aria-controls": `${i}-content`,
-              "aria-expanded": s,
-              className: a("header", { "is-expanded": s }),
-              id: `${i}-header`,
+              "aria-controls": `${r}-content`,
+              "aria-expanded": o,
+              className: a("header", { "is-expanded": o }),
+              id: `${r}-header`,
               role: "button",
               tabIndex: 0,
-              onClick: (o) => p(r, o),
-              onKeyDown: (o) => {
-                (o.key === "Enter" || o.key === " ") && p(r, o);
+              onClick: (n) => p(l, n),
+              onKeyDown: (n) => {
+                (n.key === "Enter" || n.key === " ") && p(l, n);
               },
               children: [
-                N(h) ? /* @__PURE__ */ n.jsx(
-                  S,
+                f(x) ? /* @__PURE__ */ s.jsx(
+                  H,
                   {
-                    className: a("title", { "is-expanded": s }),
+                    className: a("title", { "is-expanded": o }),
                     size: "sm",
                     type: "h3",
                     ...(e == null ? void 0 : e.titleOptions) ?? b,
-                    children: A
+                    children: C
                   }
-                ) : h,
-                x("PlusSignIcon", "primary", s),
-                x("MinusSignIcon", "white", !s)
+                ) : x,
+                A(o)
               ]
             }
           ),
-          /* @__PURE__ */ n.jsxs(
+          /* @__PURE__ */ s.jsxs(
             "div",
             {
-              "aria-labelledby": `${i}-header`,
-              className: a("content", { "is-expanded": s }),
-              hidden: !s,
-              id: `${i}-content`,
+              "aria-labelledby": `${r}-header`,
+              className: a("content", { "is-expanded": o }),
+              hidden: !o,
+              id: `${r}-content`,
               role: "region",
               children: [
-                !N(u) && /* @__PURE__ */ n.jsx(z, { children: u }),
-                c && c.length > 0 && /* @__PURE__ */ n.jsx("div", { className: a("actions"), children: c.map((o) => /* @__PURE__ */ n.jsx(
-                  B,
+                !f(h) && /* @__PURE__ */ s.jsx(D, { children: h }),
+                i && i.length > 0 && /* @__PURE__ */ s.jsx("div", { className: a("actions"), children: i.map((n) => /* @__PURE__ */ s.jsx(
+                  K,
                   {
-                    ...o
+                    ...n
                   },
-                  `${i}-action-${o.id}`
+                  `${r}-action-${n.id}`
                 )) })
               ]
             }
           )
         ]
       },
-      i
+      r
     );
   }) });
 };
-D.displayName = "Accordion";
+R.displayName = "Accordion";
 export {
-  D as Accordion
+  R as Accordion
 };

package/dist/components/accordion/Accordion.module.scss.js

@@ -8,7 +8,6 @@ const o = "backgroundFill", d = "gradientMove", c = "fadeInKeyframe", r = {
   "prokodo-Accordion__title": "prokodo-Accordion__title",
   "prokodo-Accordion__title--is-expanded": "prokodo-Accordion__title--is-expanded",
   "prokodo-Accordion__icon": "prokodo-Accordion__icon",
-  "prokodo-Accordion__icon--is-hidden": "prokodo-Accordion__icon--is-hidden",
   "prokodo-Accordion__content": "prokodo-Accordion__content",
   "prokodo-Accordion__content--is-expanded": "prokodo-Accordion__content--is-expanded",
   "prokodo-Accordion__actions": "prokodo-Accordion__actions",

package/dist/components/avatar/Avatar.js

@@ -1,78 +1,80 @@
-import { j as m } from "../../_virtual/jsx-runtime.js";
-import { useMemo as d, useCallback as f } from "react";
-import { create as x } from "../../helpers/bem.js";
-import p from "./Avatar.module.scss.js";
-import { Image as h } from "../image/Image.js";
-import { Icon as j, getIconSize as u } from "../icon/Icon.js";
-import { Link as I } from "../link/Link.js";
-const t = x(p, "Avatar"), y = ({
-  className: a,
+import { j as e } from "../../_virtual/jsx-runtime.js";
+import { useMemo as d, useCallback as p } from "react";
+import x from "../../vendor/hugeicons/user_icon.js";
+import { create as h } from "../../helpers/bem.js";
+import j from "./Avatar.module.scss.js";
+import { Image as u } from "../image/Image.js";
+import { getIconSize as I } from "../icon/Icon.js";
+import { Link as N } from "../link/Link.js";
+const t = h(j, "Avatar"), E = ({
+  className: n,
   variant: o = "primary",
   size: s = "sm",
   image: r,
   redirect: i,
-  ...c
+  iconOverride: c,
+  ...l
 }) => {
-  const e = d(
+  const m = d(
     () => ({
       [o]: !!o
     }),
     [o]
-  ), n = d(
+  ), a = d(
     () => ({
       [`has-size-${s}`]: !!s
     }),
     [s]
-  ), l = f(
-    () => /* @__PURE__ */ m.jsx(
+  ), f = p(
+    () => /* @__PURE__ */ e.jsx(
       "div",
       {
-        ...c,
+        ...l,
         tabIndex: -1,
         className: t(
           void 0,
           {
-            ...e,
-            ...n
+            ...m,
+            ...a
           },
-          a
+          n
         ),
-        children: r ? /* @__PURE__ */ m.jsx(
-          h,
+        children: r ? /* @__PURE__ */ e.jsx(
+          u,
           {
             ...r,
             className: t("image", void 0, r.className),
             tabIndex: 0
           }
-        ) : /* @__PURE__ */ m.jsx(
-          j,
+        ) : c ?? /* @__PURE__ */ e.jsx(
+          x,
           {
-            className: t("icon", e),
+            className: t("icon", m),
             name: "UserIcon",
-            size: u(s) * 2,
+            size: I(s) * 2,
             color: ["inherit", "white"].includes(o) ? void 0 : "white"
           }
         )
       }
     ),
-    [n, e, a, r, o, s, c]
+    [a, m, n, r, o, s, c, l]
   );
-  return i ? /* @__PURE__ */ m.jsx(
-    I,
+  return i ? /* @__PURE__ */ e.jsx(
+    N,
     {
       ...i,
       className: t(
         "link",
         {
-          ...e,
-          ...n
+          ...m,
+          ...a
         },
         i.className
       ),
-      children: l()
+      children: f()
     }
-  ) : l();
+  ) : f();
 };
 export {
-  y as Avatar
+  E as Avatar
 };

package/dist/components/button/Button.js

@@ -1,81 +1,86 @@
-import { j as t } from "../../_virtual/jsx-runtime.js";
-import { useId as C, useRef as g, useMemo as v } from "react";
-import { create as w } from "../../helpers/bem.js";
+import { j as o } from "../../_virtual/jsx-runtime.js";
+import { useId as E, useRef as N, useMemo as C, isValidElement as g, cloneElement as w } from "react";
+import { create as z } from "../../helpers/bem.js";
 import { isString as D } from "../../helpers/validations.js";
-import E from "./Button.module.scss.js";
-import { Link as K } from "../link/Link.js";
-import { Loading as L } from "../loading/Loading.js";
-import { Icon as R } from "../icon/Icon.js";
-const l = w(E, "Button"), M = {}, O = {}, H = ({
-  id: d,
-  fullWidth: f,
-  color: i = "primary",
-  iconProps: m = {},
-  loading: x,
-  variant: e = "contained",
+import K from "./Button.module.scss.js";
+import { Link as L } from "../link/Link.js";
+import { Loading as R } from "../loading/Loading.js";
+const m = z(K, "Button"), M = {}, O = {}, H = ({
+  id: u,
+  fullWidth: c,
+  color: l = "primary",
+  icon: t,
+  loading: f,
+  variant: a = "contained",
   className: h,
   contentClassName: y,
-  disabled: a,
-  redirect: u,
-  ...n
+  disabled: i,
+  redirect: s,
+  ...e
 }) => {
-  const I = C(), k = g(null), s = `Button-${I}`, N = e === "outlined", B = m == null ? void 0 : m.name, $ = B && !(n != null && n.title), c = v(
+  const j = E(), I = N(null), x = `Button-${j}`, k = a === "outlined", B = t !== void 0 && !(e != null && e.title), d = C(
     () => ({
-      "icon-only": !!$
+      "icon-only": !!B
     }),
-    [$]
-  ), r = () => /* @__PURE__ */ t.jsxs("span", { ref: k, "aria-labelledby": s, className: l("title"), children: [
-    B && /* @__PURE__ */ t.jsx(R, { className: l("icon", c), ...m }),
-    n == null ? void 0 : n.title
-  ] }), b = () => x ? /* @__PURE__ */ t.jsx(L, { size: "xs" }) : r(), j = () => N ? /* @__PURE__ */ t.jsx("div", { className: l("content", c, y), children: b() }) : b();
-  return u ? /* @__PURE__ */ t.jsx(
-    K,
+    [B]
+  ), v = () => {
+    var n, r;
+    return /* @__PURE__ */ o.jsxs("span", { ref: I, "aria-labelledby": x, className: m("title"), children: [
+      t !== void 0 && g(t) && w(t, {
+        className: m("icon", d, (n = t == null ? void 0 : t.props) == null ? void 0 : n.className),
+        size: ((r = t == null ? void 0 : t.props) == null ? void 0 : r.size) ?? 20
+      }),
+      e == null ? void 0 : e.title
+    ] });
+  }, $ = () => f ? /* @__PURE__ */ o.jsx(R, { size: "xs" }) : v(), b = () => k ? /* @__PURE__ */ o.jsx("div", { className: m("content", d, y), children: $() }) : $();
+  return s ? /* @__PURE__ */ o.jsx(
+    L,
     {
-      disabled: a,
-      href: u.href,
-      className: l(
+      disabled: i,
+      href: s.href,
+      className: m(
         void 0,
         {
-          "has-fullWidth": !!f,
-          [`has-variant-${e}`]: !0,
-          [`has-bg-${i}`]: e === "contained",
-          [`has-text-${i}`]: e === "text",
-          "is-disabled": !!a,
-          ...c
+          "has-fullWidth": !!c,
+          [`has-variant-${a}`]: !0,
+          [`has-bg-${l}`]: a === "contained",
+          [`has-text-${l}`]: a === "text",
+          "is-disabled": !!i,
+          ...d
         },
         h
       ),
       onClick: () => {
-        var o;
-        return (o = n == null ? void 0 : n.onClick) == null ? void 0 : o.call(n, M);
+        var n;
+        return (n = e == null ? void 0 : e.onClick) == null ? void 0 : n.call(e, M);
       },
       onKeyDown: () => {
-        var o;
-        return (o = n == null ? void 0 : n.onKeyDown) == null ? void 0 : o.call(n, O);
+        var n;
+        return (n = e == null ? void 0 : e.onKeyDown) == null ? void 0 : n.call(e, O);
       },
-      children: j()
+      children: b()
     }
-  ) : /* @__PURE__ */ t.jsx(
+  ) : /* @__PURE__ */ o.jsx(
     "button",
     {
-      ...n,
-      color: i,
-      disabled: !!a || !!x,
-      id: `${s}${D(d) ? ` ${d}` : ""}`,
-      className: l(
+      ...e,
+      color: l,
+      disabled: !!i || !!f,
+      id: `${x}${D(u) ? ` ${u}` : ""}`,
+      className: m(
         void 0,
         {
-          "has-fullWidth": !!f,
-          [`has-variant-${e}`]: !0,
-          [`has-bg-${i}`]: e === "contained",
-          [`has-text-${i}`]: e === "text",
-          "is-disabled": !!a,
-          ...c
+          "has-fullWidth": !!c,
+          [`has-variant-${a}`]: !0,
+          [`has-bg-${l}`]: a === "contained",
+          [`has-text-${l}`]: a === "text",
+          "is-disabled": !!i,
+          ...d
         },
         h
       ),
-      tabIndex: u !== void 0 || a ? -1 : (n == null ? void 0 : n.tabIndex) ?? void 0,
-      children: j()
+      tabIndex: s !== void 0 || i ? -1 : (e == null ? void 0 : e.tabIndex) ?? void 0,
+      children: b()
     }
   );
 };