@ztwoint/z-ui 0.1.58 → 0.1.60

package/dist/components/assets/icons/drag-handle.d.ts

@@ -0,0 +1,2 @@
+declare const DragHandleIcon: () => import("react/jsx-runtime").JSX.Element;
+export default DragHandleIcon;

package/dist/components/assets/icons/minus.d.ts

@@ -0,0 +1,8 @@
+import { SVGProps } from 'react';
+type IconProps = SVGProps<SVGSVGElement> & {
+    secondaryfill?: string;
+    strokewidth?: number;
+    title?: string;
+};
+export declare function Minus({ title, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
+export default Minus;

package/dist/components/assets/icons/octagon-warning-Copy.js

@@ -0,0 +1,30 @@
+import { jsx as r } from "react/jsx-runtime";
+function m({
+  fill: t = "currentColor",
+  strokewidth: o = 1,
+  width: e = "1em",
+  height: n = "1em",
+  ...h
+}) {
+  return /* @__PURE__ */ r(
+    "svg",
+    {
+      height: n,
+      width: e,
+      ...h,
+      viewBox: "0 0 14 14",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ r("g", { fill: t, children: /* @__PURE__ */ r(
+        "path",
+        {
+          d: "M9.6 0.58h-5.28l-3.74 3.74v5.28l3.74 3.74h5.28l3.74-3.74v-5.28l-3.74-3.74z m-3.22 2.9h1.16v4.64h-1.16v-4.64z m0.58 6.96c-0.4 0-0.72-0.33-0.72-0.73s0.33-0.72 0.72-0.72 0.72 0.33 0.72 0.72-0.33 0.72-0.72 0.73z",
+          fill: t,
+          strokeWidth: o
+        }
+      ) })
+    }
+  );
+}
+export {
+  m as default
+};

package/dist/components/column-reorder/column-reorder.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ColumnReOrderProps } from './column-reorder.type';
+export declare const ColumnReOrder: FC<ColumnReOrderProps>;

package/dist/components/column-reorder/column-reorder.hook.d.ts

@@ -0,0 +1,4 @@
+import { ColumnReOrderProps, ColumnType } from './column-reorder.type';
+export declare const useColumnReorder: ({ columns, onReorder }: ColumnReOrderProps) => {
+    internalColumns: ColumnType[];
+};

package/dist/components/column-reorder/column-reorder.type.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+export type ColumnType = {
+    id: string;
+    label: [string, string];
+    icon: React.ReactNode;
+};
+export interface ColumnReOrderProps {
+    columns: ColumnType[];
+    onReorder?: (reorderedColumns: ColumnType[]) => void;
+    onRemove?: (columnId: string) => void;
+    className?: string;
+}

package/dist/components/column-reorder/components/column-item/column-item.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ColumnItemProps } from './column-item.type';
+export declare const ColumnItem: React.FC<ColumnItemProps>;
+export default ColumnItem;

package/dist/components/column-reorder/components/column-item/column-item.hook.d.ts

@@ -0,0 +1,7 @@
+import { ColumnType } from '../../column-reorder.type';
+import { ColumnItemState } from './column-item.type';
+export declare const idle: ColumnItemState;
+export declare const useColumnItemDragAndDrop: (column: ColumnType, index: number) => {
+    ref: import('react').RefObject<HTMLDivElement | null>;
+    state: ColumnItemState;
+};

package/dist/components/column-reorder/components/column-item/column-item.type.d.ts

@@ -0,0 +1,18 @@
+import { Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
+import { ColumnType } from '../../column-reorder.type';
+export type ColumnItemState = {
+    type: 'idle';
+} | {
+    type: 'preview';
+    container: HTMLElement;
+} | {
+    type: 'is-dragging';
+} | {
+    type: 'is-dragging-over';
+    closestEdge: Edge | null;
+};
+export interface ColumnItemProps {
+    column: ColumnType;
+    index: number;
+    onRemove?: (columnId: string) => void;
+}

package/dist/components/column-reorder/components/column-item/column-item.util.d.ts

@@ -0,0 +1,10 @@
+import { ColumnType } from '../../column-reorder.type';
+export declare const getColumnData: (column: ColumnType, index: number) => {
+    columnId: string;
+    index: number;
+};
+export declare const isColumnData: (data: Record<string | symbol, unknown>) => boolean;
+export declare const parseColumnLabel: (column: ColumnType) => {
+    groupLabel: string;
+    fieldLabel: string;
+};

package/dist/components/column-reorder/components/column-item/index.d.ts

@@ -0,0 +1,3 @@
+export { default as ColumnItem } from './column-item';
+export type { ColumnItemProps, ColumnItemState } from './column-item.type';
+export { isColumnData } from './column-item.util';

package/dist/components/column-reorder/components/index.d.ts

@@ -0,0 +1 @@
+export * from './column-item';

package/dist/components/column-reorder/index.d.ts

@@ -0,0 +1,2 @@
+export * from './column-reorder';
+export * from './column-reorder.type';

package/dist/components/table/components/cell/link-cell.d.ts

@@ -6,5 +6,6 @@ export interface LinkCellProps {
     rightIcon?: React.ReactNode;
     leftIcon?: React.ReactNode;
     className?: string;
+    LinkComponent?: React.ElementType;
 }
 export declare const LinkCell: React.FC<LinkCellProps>;

package/dist/components/table/components/cell/link-cell.js

@@ -1,17 +1,18 @@
 import { jsxs as s, jsx as a } from "react/jsx-runtime";
 import "react";
 import { cn as e } from "../../../../lib/utils.js";
-const p = ({
+const x = ({
   value: i,
   href: m,
   target: t = "_self",
   leftIcon: n,
   rightIcon: r,
-  className: o
+  className: o,
+  LinkComponent: c = "a"
 }) => {
   const l = "min-h-max min-w-max";
   return /* @__PURE__ */ s(
-    "a",
+    c,
     {
       href: m,
       target: t,
@@ -31,5 +32,5 @@ const p = ({
   );
 };
 export {
-  p as LinkCell
+  x as LinkCell
 };

package/dist/components/table-card/table-card.js

@@ -1,7 +1,7 @@
-import { jsx as o, jsxs as c } from "react/jsx-runtime";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
 import { Table as t } from "../table/table-provider.js";
 import "react";
-import { cn as n } from "../../lib/utils.js";
+import { cn as i } from "../../lib/utils.js";
 /* empty css                        */
 import "../alert/alert.const.js";
 import "../button/button.js";
@@ -30,51 +30,62 @@ import "../stepper/stepper.js";
 import "../stepper-item/stepper-item.js";
 import "@radix-ui/react-tabs";
 import "../tooltip/tooltip.js";
+import f from "../assets/icons/octagon-warning-Copy.js";
 import "../badge/badge.js";
 import "../avatar/avatar.js";
 import "../text-preset/text-preset.js";
 import "../table/table.context.js";
-const Pt = ({
-  dataSource: v,
-  schema: u,
+const Pe = ({
+  dataSource: w,
+  schema: P,
   loading: H,
-  emptyMessage: w,
+  emptyMessage: k,
   className: T,
   rounded: d = !0,
-  bordered: h = !0,
-  showHeader: C = !0,
+  bordered: n = !0,
+  showHeader: g = !0,
   headerClassName: _,
   search: m,
-  filter: e,
-  headerLeftContent: P,
-  headerActions: i,
-  body: r = {
+  filter: r,
+  headerLeftContent: h,
+  headerActions: u,
+  body: l = {
     cell: { hasBorder: !0 },
     className: "",
     stickyHeader: !0
   },
   showFooter: p = !0,
-  footerClassName: k,
-  pagination: l,
-  paginationInfo: a,
-  paginationQuickJumper: s
+  footerClassName: j,
+  pagination: o,
+  paginationInfo: c,
+  paginationQuickJumper: s,
+  error: x = !1
 }) => {
-  var B;
-  const x = s && s.totalPage && s.totalPage >= 2, F = l && l.totalPage && l.totalPage >= 2 || !!a || x, g = m || e || P || i, R = typeof (e == null ? void 0 : e.showFilterButton) > "u" ? !0 : e == null ? void 0 : e.showFilterButton;
-  return /* @__PURE__ */ o("div", { className: n("flex flex-col overflow-hidden", T), children: /* @__PURE__ */ c(t, { dataSource: v, schema: u, loading: H, emptyMessage: w, children: [
-    C && g && /* @__PURE__ */ c(
+  var v;
+  if (x)
+    return /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center h-64 bg-background-error-subtle rounded-lg text-text-warning-secondary", children: /* @__PURE__ */ a("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ e(f, { className: "mt-1.5" }),
+      /* @__PURE__ */ a("div", { className: "flex flex-col gap-2", children: [
+        /* @__PURE__ */ e("div", { className: "text-text-error-primary text-lg font-medium", children: "Error loading data" }),
+        /* @__PURE__ */ e("div", { className: "text-sm", children: "Please try again later" }),
+        typeof x == "string" && /* @__PURE__ */ e("div", { className: "text-text-warning-secondary text-sm", children: x })
+      ] })
+    ] }) });
+  const C = s && s.totalPage && s.totalPage >= 2, N = o && o.totalPage && o.totalPage >= 2 || !!c || C, F = m || r || h || u, R = typeof (r == null ? void 0 : r.showFilterButton) > "u" ? !0 : r == null ? void 0 : r.showFilterButton;
+  return /* @__PURE__ */ e("div", { className: i("flex flex-col overflow-hidden", T), children: /* @__PURE__ */ a(t, { dataSource: w, schema: P, loading: H, emptyMessage: k, children: [
+    g && F && /* @__PURE__ */ a(
       t.Header,
       {
-        className: n(
+        className: i(
           "flex-shrink-0",
-          h && "border-stroke-solid-medium border-1 border-b-0",
+          n && "border-stroke-solid-medium border-1 border-b-0",
           d && "rounded-t-xl",
           _
         ),
         children: [
-          /* @__PURE__ */ c(t.HeaderContent, { children: [
-            P && P,
-            m && /* @__PURE__ */ o(
+          /* @__PURE__ */ a(t.HeaderContent, { children: [
+            h && h,
+            m && /* @__PURE__ */ e(
               t.Search,
               {
                 search: {
@@ -86,64 +97,64 @@ const Pt = ({
                 className: m.className
               }
             ),
-            e && /* @__PURE__ */ c(
+            r && /* @__PURE__ */ a(
               t.Filter,
               {
-                schema: u,
+                schema: P,
                 filter: {
-                  value: e.value || [],
-                  onChange: e.onChange || (() => {
+                  value: r.value || [],
+                  onChange: r.onChange || (() => {
                   })
                 },
                 children: [
-                  R && /* @__PURE__ */ o(t.Filter.FilterButton, {}),
-                  (B = e == null ? void 0 : e.quickFilters) == null ? void 0 : B.map((N) => /* @__PURE__ */ o(t.Filter.FilterColumnButton, { filterName: N }, N))
+                  R && /* @__PURE__ */ e(t.Filter.FilterButton, {}),
+                  (v = r == null ? void 0 : r.quickFilters) == null ? void 0 : v.map((B) => /* @__PURE__ */ e(t.Filter.FilterColumnButton, { filterName: B }, B))
                 ]
               }
             )
           ] }),
-          i && /* @__PURE__ */ o(t.HeaderContent, { children: i })
+          u && /* @__PURE__ */ e(t.HeaderContent, { children: u })
         ]
       }
     ),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ e(
       t.Body,
       {
-        cell: r == null ? void 0 : r.cell,
-        sort: r == null ? void 0 : r.sort,
-        className: n(
+        cell: l == null ? void 0 : l.cell,
+        sort: l == null ? void 0 : l.sort,
+        className: i(
           "flex-1 min-h-0",
-          h && "border-stroke-solid-light border-1",
-          d && !(C && g) && "rounded-t-xl",
-          d && !(p && F) && "rounded-b-xl",
-          h && "[&_td:first-child]:border-l-0 [&_td:last-child]:border-r-0",
-          h && "[&_th:first-child]:border-l-0 [&_th:last-child]:border-r-0",
-          r == null ? void 0 : r.className
+          n && "border-stroke-solid-light border-1",
+          d && !(g && F) && "rounded-t-xl",
+          d && !(p && N) && "rounded-b-xl",
+          n && "[&_td:first-child]:border-l-0 [&_td:last-child]:border-r-0",
+          n && "[&_th:first-child]:border-l-0 [&_th:last-child]:border-r-0",
+          l == null ? void 0 : l.className
         ),
-        stickyHeader: r == null ? void 0 : r.stickyHeader
+        stickyHeader: l == null ? void 0 : l.stickyHeader
       }
     ),
-    p && F && /* @__PURE__ */ c(
+    p && N && /* @__PURE__ */ a(
       t.Footer,
       {
-        className: n(
+        className: i(
           "flex-shrink-0 border-stroke-solid-light border-t-[0.5px] mt-[-2px]",
-          h && "border",
+          n && "border",
           d && "rounded-b-xl",
-          k
+          j
         ),
         children: [
-          a ? /* @__PURE__ */ o(t.FooterContent, { children: /* @__PURE__ */ o(
+          c ? /* @__PURE__ */ e(t.FooterContent, { children: /* @__PURE__ */ e(
             t.PaginationInfo,
             {
-              showTotal: a.showTotal,
-              totalItems: a.totalItems,
-              currentPage: a.currentPage,
-              itemsPerPage: a.itemsPerPage
+              showTotal: c.showTotal,
+              totalItems: c.totalItems,
+              currentPage: c.currentPage,
+              itemsPerPage: c.itemsPerPage
             }
-          ) }) : s || l ? /* @__PURE__ */ o(t.FooterContent, { children: null }) : null,
-          (s || l) && /* @__PURE__ */ c(t.FooterContent, { children: [
-            x && /* @__PURE__ */ o(
+          ) }) : s || o ? /* @__PURE__ */ e(t.FooterContent, { children: null }) : null,
+          (s || o) && /* @__PURE__ */ a(t.FooterContent, { children: [
+            C && /* @__PURE__ */ e(
               t.PaginationQuickJumper,
               {
                 currentPage: s.currentPage,
@@ -153,14 +164,14 @@ const Pt = ({
                 disabled: s.disabled
               }
             ),
-            l && /* @__PURE__ */ o(
+            o && /* @__PURE__ */ e(
               t.Pagination,
               {
-                currentPage: l.currentPage,
-                totalPage: l.totalPage,
-                onChange: l.onChange || (() => {
+                currentPage: o.currentPage,
+                totalPage: o.totalPage,
+                onChange: o.onChange || (() => {
                 }),
-                totalItems: l.totalItems
+                totalItems: o.totalItems
               }
             )
           ] })
@@ -170,5 +181,5 @@ const Pt = ({
   ] }) });
 };
 export {
-  Pt as default
+  Pe as default
 };

package/dist/components/table-card/table-card.type.d.ts

@@ -31,4 +31,5 @@ export interface TableCardProps {
     paginationQuickJumper?: PaginationQuickJumperProps;
     loading?: boolean;
     emptyMessage?: string;
+    error?: boolean | string;
 }