@cagatayfdn/flora-components 0.0.130 → 0.0.131

package/dist/components/Table/Table.js

@@ -1,215 +1,255 @@
-import { j as s } from "../../jsx-runtime-BcAkpsdy.js";
-import { useState as Z, useEffect as I } from "react";
-import ee from "../NoResult/NoResult.js";
-import { c as j } from "../../index-BHf7G3IG.js";
-import { s as c } from "../../Table.module-DUqpZOLt.js";
-import { ThemeAppearance as T, AppearanceSpinner as $ } from "../../enums/appearance.js";
-import A from "../Checkbox/Checkbox.js";
-import te from "../Loading/Loading.js";
-import re from "../ScrollContainer/ScrollContainer.js";
-import O from "./TableHeader.js";
-import ae from "./TableSort.js";
-import { i as u } from "../../includes-8YTFrx85.js";
-import { _ as D, k as se } from "../../keys-B0bo5Q7o.js";
-import { _ as R, a as ne, b as ie } from "../../_reduce-DsUCMz4O.js";
-import { _ as le } from "../../Select-BE_y91ZN.js";
-function de(i, t) {
-  for (var a = 0, l = t.length, h = []; a < l; )
-    i(t[a]) && (h[h.length] = t[a]), a += 1;
-  return h;
+import { j as t } from "../../jsx-runtime-BcAkpsdy.js";
+import ae, { useState as E, useEffect as se } from "react";
+import ne from "../NoResult/NoResult.js";
+import { c as C } from "../../index-BHf7G3IG.js";
+import { s as p } from "../../Table.module-DUqpZOLt.js";
+import { ThemeAppearance as F, AppearanceSpinner as O } from "../../enums/appearance.js";
+import z from "../Checkbox/Checkbox.js";
+import oe from "../Loading/Loading.js";
+import le from "../ScrollContainer/ScrollContainer.js";
+import D from "./TableHeader.js";
+import ie from "./TableSort.js";
+import de from "../Icon/index.js";
+import { Icons as ce } from "../../assets/icons/icons.js";
+import { i as h } from "../../includes-8YTFrx85.js";
+import { _ as V, k as pe } from "../../keys-B0bo5Q7o.js";
+import { _ as G, a as he, b as fe } from "../../_reduce-DsUCMz4O.js";
+import { _ as xe } from "../../Select-BE_y91ZN.js";
+function ue(o, s) {
+  for (var n = 0, l = s.length, f = []; n < l; )
+    o(s[n]) && (f[f.length] = s[n]), n += 1;
+  return f;
 }
-var oe = /* @__PURE__ */ function() {
-  function i(t, a) {
-    this.xf = a, this.f = t;
+var ge = /* @__PURE__ */ function() {
+  function o(s, n) {
+    this.xf = n, this.f = s;
   }
-  return i.prototype["@@transducer/init"] = R.init, i.prototype["@@transducer/result"] = R.result, i.prototype["@@transducer/step"] = function(t, a) {
-    return this.f(a) ? this.xf["@@transducer/step"](t, a) : t;
-  }, i;
-}(), ce = /* @__PURE__ */ D(function(t, a) {
-  return new oe(t, a);
+  return o.prototype["@@transducer/init"] = G.init, o.prototype["@@transducer/result"] = G.result, o.prototype["@@transducer/step"] = function(s, n) {
+    return this.f(n) ? this.xf["@@transducer/step"](s, n) : s;
+  }, o;
+}(), je = /* @__PURE__ */ V(function(s, n) {
+  return new ge(s, n);
 });
-const he = ce;
-var z = /* @__PURE__ */ D(
-  /* @__PURE__ */ ne(["filter"], he, function(i, t) {
-    return le(t) ? ie(function(a, l) {
-      return i(t[l]) && (a[l] = t[l]), a;
-    }, {}, se(t)) : (
+const me = je;
+var w = /* @__PURE__ */ V(
+  /* @__PURE__ */ he(["filter"], me, function(o, s) {
+    return xe(s) ? fe(function(n, l) {
+      return o(s[l]) && (n[l] = s[l]), n;
+    }, {}, pe(s)) : (
       // else
-      de(i, t)
+      ue(o, s)
     );
   })
 );
-const Le = (i) => {
+const Oe = (o) => {
   const {
-    columns: t = [],
-    dataSource: a = [],
+    columns: s = [],
+    dataSource: n = [],
     totalCount: l,
-    currentPage: h,
-    className: F,
-    wrapperClass: G,
-    title: V,
-    rowSelection: C = !1,
-    actionOnChange: m,
-    rowSelectionChange: d,
-    pagerVisible: w,
-    pagerOnChange: k,
-    columnRenderer: N,
-    pageSizeOnChange: S,
-    pageSize: _,
-    headerVisible: E = !0,
-    headerLeftItem: U,
-    customFooterItem: W,
-    isLoading: X = !1,
-    footerAction: B = !0,
-    pageSizeVisible: K = !0,
-    appearance: x = T.LIGHT,
-    fixedHeader: P,
-    showItemsText: y,
+    currentPage: f,
+    className: U,
+    wrapperClass: W,
+    title: X,
+    rowSelection: g = !1,
+    actionOnChange: N,
+    rowSelectionChange: i,
+    pagerVisible: k,
+    pagerOnChange: S,
+    columnRenderer: _,
+    pageSizeOnChange: R,
+    pageSize: y,
+    headerVisible: B = !0,
+    headerLeftItem: K,
+    customFooterItem: P,
+    isLoading: q = !1,
+    footerAction: J = !0,
+    pageSizeVisible: M = !0,
+    appearance: j = F.LIGHT,
+    fixedHeader: Q,
+    showItemsText: v,
     customHeader: L,
-    selectedItems: v = [],
-    scrollClass: q,
-    disabledItems: p = []
-  } = i, [o, g] = Z(v), J = (e) => {
-    d && (e.target.checked ? (g(
-      a.filter((n) => !u(n, p))
-    ), d(
-      a.filter((n) => !u(n, p))
-    )) : (g([]), d([])));
-  }, M = (e, n) => {
-    d && (e.target.checked ? (g([...o, n]), d([...o, n])) : (g(
-      z((r) => r.pk !== n.pk, o)
-    ), d(
-      z((r) => r.pk !== n.pk, o)
+    selectedItems: H = [],
+    scrollClass: Y,
+    disabledItems: u = [],
+    expandable: x
+  } = o, [d, m] = E(H), [T, $] = E([]), Z = (e) => {
+    i && (e.target.checked ? (m(
+      n.filter((a) => !h(a, u))
+    ), i(
+      n.filter((a) => !h(a, u))
+    )) : (m([]), i([])));
+  }, I = (e, a) => {
+    i && (e.target.checked ? (m([...d, a]), i([...d, a])) : (m(
+      w((r) => r.pk !== a.pk, d)
+    ), i(
+      w((r) => r.pk !== a.pk, d)
     )));
-  }, Q = (e, n) => e == null ? void 0 : e.map((r, f) => /* @__PURE__ */ s.jsx(
+  }, ee = (e) => {
+    h(e, T) ? $((a) => w((r) => r !== e, a)) : $((a) => [...a, e]);
+  }, te = (e, a) => e == null ? void 0 : e.map((r, c) => /* @__PURE__ */ t.jsx(
     "td",
     {
       width: r.width,
       onClick: (b) => {
-        r != null && r.onClick && (r == null || r.onClick(b, n, r, f));
+        r != null && r.onClick && (r == null || r.onClick(b, a, r, c));
       },
-      className: j(r.className, r.tdClassName),
-      children: r.render ? r.render(n[r.dataIndex], n) : n[r.dataIndex]
+      className: C(r.className, r.tdClassName),
+      children: r.render ? r.render(a[r.dataIndex], a) : a[r.dataIndex]
     },
-    `col-${f}`
+    `col-${c}`
   ));
-  return I(() => {
-    d && d(
-      v.filter((e) => !u(e, p))
-    );
-  }, [o, p]), /* @__PURE__ */ s.jsxs(
+  return se(() => {
+    i && i(H.filter((e) => !h(e, u)));
+  }, [d, u]), /* @__PURE__ */ t.jsxs(
     "div",
     {
       "data-testid": "table-container",
-      className: j(c.wrapper, G, {
-        [c[`${x}`]]: x
+      className: C(p.wrapper, W, {
+        [p[`${j}`]]: j
       }),
       children: [
-        E && /* @__PURE__ */ s.jsx(
-          O,
+        B && /* @__PURE__ */ t.jsx(
+          D,
           {
-            title: V,
-            showItemsText: y,
-            actionOnChange: m,
-            pageSize: _,
-            pageSizeOnChange: S,
-            pagerOnChange: k,
-            pagerVisible: w,
+            title: X,
+            showItemsText: v,
+            actionOnChange: N,
+            pageSize: y,
+            pageSizeOnChange: R,
+            pagerOnChange: S,
+            pagerVisible: k,
             totalCount: l,
-            currentPage: h
+            currentPage: f
           }
         ),
-        /* @__PURE__ */ s.jsxs("div", { className: c.tableWrap, children: [
-          X && /* @__PURE__ */ s.jsx(
-            te,
+        /* @__PURE__ */ t.jsxs("div", { className: p.tableWrap, children: [
+          q && /* @__PURE__ */ t.jsx(
+            oe,
             {
-              wrapperClass: c.tableLoading,
-              appearance: x === T.LIGHT ? $.LIGHT : $.DARK
+              wrapperClass: p.tableLoading,
+              appearance: j === F.LIGHT ? O.LIGHT : O.DARK
             }
           ),
           L && L,
-          /* @__PURE__ */ s.jsx(re, { className: q || c.scrollWrap, children: /* @__PURE__ */ s.jsxs(
+          /* @__PURE__ */ t.jsx(le, { className: Y || p.scrollWrap, children: /* @__PURE__ */ t.jsxs(
             "table",
             {
               "data-testid": "table-content",
-              className: j(c.table, F, {
-                [c.fixed]: P
+              className: C(p.table, U, {
+                [p.fixed]: Q
               }),
               children: [
-                /* @__PURE__ */ s.jsx("thead", { "data-testid": "table-head", children: /* @__PURE__ */ s.jsxs("tr", { "data-testid": "table-row", children: [
-                  C && /* @__PURE__ */ s.jsx("th", { style: { width: 26 }, children: /* @__PURE__ */ s.jsx(
-                    A,
+                /* @__PURE__ */ t.jsx("thead", { "data-testid": "table-head", children: /* @__PURE__ */ t.jsxs("tr", { "data-testid": "table-row", children: [
+                  x && /* @__PURE__ */ t.jsx("th", { className: "w-[48px]" }),
+                  g && /* @__PURE__ */ t.jsx("th", { className: "w-[26px]", children: /* @__PURE__ */ t.jsx(
+                    z,
                     {
                       name: "selectAll",
-                      isDisabled: a.length === 0,
-                      checked: a.length > 0 && a.length === o.length,
-                      onChange: J
+                      isDisabled: n.length === 0,
+                      checked: n.length > 0 && n.length === d.length,
+                      onChange: Z
                     }
                   ) }),
-                  t == null ? void 0 : t.map((e, n) => {
-                    var r, f;
-                    return e.sortable ? /* @__PURE__ */ s.jsx(
+                  s == null ? void 0 : s.map((e, a) => {
+                    var r, c;
+                    return e.sortable ? /* @__PURE__ */ t.jsx(
                       "th",
                       {
                         "data-testid": "table-head-item",
                         style: { width: e.width },
                         className: e.className,
-                        children: /* @__PURE__ */ s.jsx(
-                          ae,
+                        children: /* @__PURE__ */ t.jsx(
+                          ie,
                           {
                             title: (r = e.title) == null ? void 0 : r.toString().toLocaleUpperCase(),
-                            onClick: (b, Y) => {
-                              var H;
-                              return (H = e == null ? void 0 : e.onSort) == null ? void 0 : H.call(e, b, Y);
+                            onClick: (b, re) => {
+                              var A;
+                              return (A = e == null ? void 0 : e.onSort) == null ? void 0 : A.call(e, b, re);
                             }
                           }
                         )
                       },
-                      `table-header-${n}`
-                    ) : /* @__PURE__ */ s.jsx(
+                      `table-header-${a}`
+                    ) : /* @__PURE__ */ t.jsx(
                       "th",
                       {
                         "data-testid": "table-head-item",
                         style: { width: e.width },
                         className: e.className,
-                        children: typeof e.title == "string" || e.title instanceof String ? (f = e.title) == null ? void 0 : f.toString().toLocaleUpperCase() : e.title
+                        children: typeof e.title == "string" || e.title instanceof String ? (c = e.title) == null ? void 0 : c.toString().toLocaleUpperCase() : e.title
                       },
-                      `table-header-${n}`
+                      `table-header-${a}`
                     );
                   })
                 ] }) }),
-                /* @__PURE__ */ s.jsx("tbody", { "data-testid": "table-body", children: a.length > 0 ? a.map((e, n) => /* @__PURE__ */ s.jsxs("tr", { children: [
-                  C && /* @__PURE__ */ s.jsx("td", { children: /* @__PURE__ */ s.jsx(
-                    A,
-                    {
-                      checked: u(e, o),
-                      name: `select-${n}`,
-                      onChange: (r) => M(r, e),
-                      isDisabled: u(e, p)
-                    }
-                  ) }),
-                  N ? N(t, e) : Q(t, e)
-                ] }, `row-${n}`)) : /* @__PURE__ */ s.jsx("tr", { children: /* @__PURE__ */ s.jsx("td", { colSpan: t.length + 1, children: /* @__PURE__ */ s.jsx(ee, {}) }) }) })
+                /* @__PURE__ */ t.jsx("tbody", { "data-testid": "table-body", children: n.length > 0 ? n.map((e, a) => {
+                  const r = h(a, T);
+                  return /* @__PURE__ */ t.jsxs(ae.Fragment, { children: [
+                    /* @__PURE__ */ t.jsxs("tr", { children: [
+                      x && /* @__PURE__ */ t.jsx(
+                        "td",
+                        {
+                          className: "text-center cursor-pointer pr-[0]!",
+                          onClick: () => ee(a),
+                          children: /* @__PURE__ */ t.jsx(
+                            "span",
+                            {
+                              className: "inline-block transition-transform duration-200",
+                              style: {
+                                transform: r ? "rotate(90deg)" : "rotate(0deg)"
+                              },
+                              children: /* @__PURE__ */ t.jsx(de, { name: ce.ChevronRight })
+                            }
+                          )
+                        }
+                      ),
+                      g && /* @__PURE__ */ t.jsx("td", { children: /* @__PURE__ */ t.jsx(
+                        z,
+                        {
+                          checked: h(e, d),
+                          name: `select-${a}`,
+                          onChange: (c) => I(c, e),
+                          isDisabled: h(e, u)
+                        }
+                      ) }),
+                      _ ? _(s, e) : te(s, e)
+                    ] }),
+                    x && r && /* @__PURE__ */ t.jsx("tr", { children: /* @__PURE__ */ t.jsx(
+                      "td",
+                      {
+                        colSpan: s.length + (g ? 1 : 0) + (x ? 1 : 0),
+                        className: "p-0 border-0",
+                        children: x.expandedRowRender(e)
+                      }
+                    ) })
+                  ] }, `row-${a}`);
+                }) : /* @__PURE__ */ t.jsx("tr", { children: /* @__PURE__ */ t.jsx(
+                  "td",
+                  {
+                    colSpan: s.length + (g ? 1 : 0) + (x ? 1 : 0),
+                    children: /* @__PURE__ */ t.jsx(ne, {})
+                  }
+                ) }) })
               ]
             }
           ) })
         ] }),
-        B && /* @__PURE__ */ s.jsx(
-          O,
+        J && /* @__PURE__ */ t.jsx(
+          D,
           {
             className: "mt-0",
-            showItemsText: y,
-            actionOnChange: m,
-            pageSize: _,
-            pageSizeOnChange: S,
-            pagerOnChange: k,
-            pagerVisible: w,
-            pageSizeVisible: K,
+            showItemsText: v,
+            actionOnChange: N,
+            pageSize: y,
+            pageSizeOnChange: R,
+            pagerOnChange: S,
+            pagerVisible: k,
+            pageSizeVisible: M,
             totalCount: l,
-            customItem: W,
-            headerLeftItem: U,
-            currentPage: h,
-            appearance: x
+            customItem: P,
+            headerLeftItem: K,
+            currentPage: f,
+            appearance: j
           }
         )
       ]
@@ -217,5 +257,5 @@ const Le = (i) => {
   );
 };
 export {
-  Le as default
+  Oe as default
 };

package/dist/index.d.mts

@@ -496,6 +496,11 @@ export declare interface EventProps<T = HTMLElement> {
     onInvalid?: (e: React.FormEvent<T>) => void;
 }
 
+declare type ExpandableType = {
+    expandedRowRender: (record: any) => ReactNode;
+    rowExpandable?: (record: any) => boolean;
+};
+
 export declare const FileUpload: React_2.ForwardRefExoticComponent<{
     type?: "number" | "email" | "search" | "text" | "url" | "tel" | "password" | "hidden" | undefined;
     id?: string | undefined;
@@ -1316,6 +1321,7 @@ export declare type TableProps = {
     fixedHeader?: boolean;
     customHeader?: ReactNode;
     scrollClass?: string;
+    expandable?: ExpandableType;
 } & TableHeaderProps;
 
 export declare const TableSort: (props: TableSortProps) => JSX_2.Element;

package/dist/index.d.ts

@@ -496,6 +496,11 @@ export declare interface EventProps<T = HTMLElement> {
     onInvalid?: (e: React.FormEvent<T>) => void;
 }
 
+declare type ExpandableType = {
+    expandedRowRender: (record: any) => ReactNode;
+    rowExpandable?: (record: any) => boolean;
+};
+
 export declare const FileUpload: React_2.ForwardRefExoticComponent<{
     type?: "number" | "email" | "search" | "text" | "url" | "tel" | "password" | "hidden" | undefined;
     id?: string | undefined;
@@ -1316,6 +1321,7 @@ export declare type TableProps = {
     fixedHeader?: boolean;
     customHeader?: ReactNode;
     scrollClass?: string;
+    expandable?: ExpandableType;
 } & TableHeaderProps;
 
 export declare const TableSort: (props: TableSortProps) => JSX_2.Element;