@ztwoint/z-ui 0.1.75 → 0.1.76

package/dist/components/table/components/index.d.ts

@@ -2,7 +2,7 @@ export { TableCell } from './table-cell';
 export { NumberCell, BooleanCell, AvatarCell, DescriptionCell, LabelCell, LinkCell } from './cell';
 export { TableHeader } from './table-header';
 export { TableRow } from './table-row';
-export { TableEmptyState } from './table-empty-state';
+export { TableMessageState } from './table-message-state';
 export { TableLoadingState } from './table-loading-state';
 export { Pagination as TablePagination } from './pagination/pagination';
 export { TableHeaderWrapper } from './table-header-wrapper';

package/dist/components/table/components/table-message-state.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+interface TableMessageStateProps {
+    colSpan: number;
+    message: string;
+    className?: string;
+}
+export declare const TableMessageState: React.FC<TableMessageStateProps>;
+export {};

package/dist/components/table/components/table-message-state.js

@@ -0,0 +1,9 @@
+import { jsx as e } from "react/jsx-runtime";
+const o = ({
+  colSpan: r,
+  message: t,
+  className: d
+}) => /* @__PURE__ */ e("tbody", { children: /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { colSpan: r, className: d, children: t }) }) });
+export {
+  o as TableMessageState
+};

package/dist/components/table/index.d.ts

@@ -4,6 +4,6 @@ export type { TableProps, TableSchema, TableSchemaColumn, CellType, CellValue, C
 export { extractCellValue } from './table.utils';
 export { DEFAULT_EMPTY_MESSAGE, TABLE_CSS_CLASSES } from './table.const';
 export { TableContext, useTableContext } from './table.context';
-export { TableCell, TableHeader, TableRow, TableEmptyState, TableLoadingState, TablePagination, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
+export { TableCell, TableHeader, TableRow, TableMessageState, TableLoadingState, TablePagination, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
 export { PaginationInfo, PaginationQuickJumper } from './components/pagination/components';
 export * from './components/cell';

package/dist/components/table/table.const.d.ts

@@ -26,5 +26,6 @@ export declare const TABLE_CSS_CLASSES: {
     readonly sortIconActive: "ml-2 w-4 h-4 text-gray-600";
     readonly row: " transition-colors duration-200 text-text-neutral-primary";
     readonly emptyState: "px-4 py-8 text-center text-gray-500";
+    readonly dataErrorState: "px-4 py-8 text-center text-text-danger-primary";
     readonly loading: "px-4 py-8 text-center text-gray-500";
 };

package/dist/components/table/table.const.js

@@ -25,6 +25,7 @@ const e = "No data available", t = {
   sortIconActive: "ml-2 w-4 h-4 text-gray-600",
   row: " transition-colors duration-200 text-text-neutral-primary",
   emptyState: "px-4 py-8 text-center text-gray-500",
+  dataErrorState: "px-4 py-8 text-center text-text-danger-primary",
   loading: "px-4 py-8 text-center text-gray-500"
 };
 export {

package/dist/components/table/table.d.ts

@@ -3,5 +3,6 @@ import * as React from 'react';
 export declare const TableBody: React.FC<Partial<TableProps> & {
     className?: string;
     stickyHeader?: boolean;
+    dataSourceError?: boolean | string;
 }>;
 export default TableBody;

package/dist/components/table/table.js

@@ -1,43 +1,64 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import * as y from "react";
-import { DEFAULT_EMPTY_MESSAGE as S, TABLE_CSS_CLASSES as n } from "./table.const.js";
-import { TableHeader as g } from "./components/table-header/table-header.js";
-import { TableRow as T } from "./components/table-row.js";
-import { TableEmptyState as v } from "./components/table-empty-state.js";
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import * as S from "react";
+import { DEFAULT_EMPTY_MESSAGE as T, TABLE_CSS_CLASSES as o } from "./table.const.js";
+import { TableHeader as N } from "./components/table-header/table-header.js";
+import { TableRow as v } from "./components/table-row.js";
+import { TableMessageState as i } from "./components/table-message-state.js";
 import { TableContext as w } from "./table.context.js";
-import { cn as m } from "../../lib/utils.js";
-const j = ({ cell: a = { hasBorder: !0 }, sort: d, className: i, stickyHeader: c = !1, ...f }) => {
-  const u = y.useContext(w), {
+import { cn as d } from "../../lib/utils.js";
+const j = ({
+  cell: s = { hasBorder: !0 },
+  sort: c,
+  className: f,
+  stickyHeader: p = !1,
+  dataSourceError: l,
+  ...u
+}) => {
+  const h = S.useContext(w), {
     dataSource: t = [],
-    schema: o = [],
+    schema: a = [],
     loading: r = !1,
-    emptyMessage: p = S,
-    customCells: b
-  } = u || f, h = () => !t || t.length === 0 && !r ? /* @__PURE__ */ e(v, { colSpan: o.length, message: p }) : /* @__PURE__ */ e("tbody", { children: t.map((x, s) => /* @__PURE__ */ e(
-    T,
+    emptyMessage: b = T,
+    customCells: g
+  } = h || u, x = () => l ? /* @__PURE__ */ e(
+    i,
     {
-      record: x,
-      index: s,
-      schema: o,
-      customCells: b,
-      cell: a
+      colSpan: a.length,
+      message: typeof l == "string" ? l : "Error loading data",
+      className: o.dataErrorState
+    }
+  ) : !t || t.length === 0 && !r ? /* @__PURE__ */ e(
+    i,
+    {
+      colSpan: a.length,
+      message: b,
+      className: o.emptyState
+    }
+  ) : /* @__PURE__ */ e("tbody", { children: t.map((y, m) => /* @__PURE__ */ e(
+    v,
+    {
+      record: y,
+      index: m,
+      schema: a,
+      customCells: g,
+      cell: s
     },
-    s
+    m
   )) });
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ n(
     "div",
     {
-      className: m(
+      className: d(
         r ? "overflow-y-hidden relative" : "overflow-y-auto",
-        n.bordered[a.hasBorder && !r && t.length > 0 ? "true" : "false"],
-        i
+        o.bordered[s.hasBorder && !r && t.length > 0 ? "true" : "false"],
+        f
       ),
       children: [
-        /* @__PURE__ */ l("table", { className: m(n.table, "w-full"), children: [
-          h(),
-          /* @__PURE__ */ e(g, { schema: o, sort: d, cell: a, stickyHeader: c })
+        /* @__PURE__ */ n("table", { className: d(o.table, "w-full"), children: [
+          x(),
+          /* @__PURE__ */ e(N, { schema: a, sort: c, cell: s, stickyHeader: p })
         ] }),
-        r && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full bg-white/80 flex items-center justify-center", children: /* @__PURE__ */ l("div", { className: "flex flex-col items-center gap-3", children: [
+        r && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full bg-white/80 flex items-center justify-center", children: /* @__PURE__ */ n("div", { className: "flex flex-col items-center gap-3", children: [
           /* @__PURE__ */ e("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-text-brand-secondary" }),
           /* @__PURE__ */ e("p", { className: "text-text-neutral-primary font-medium", children: "Loading..." })
         ] }) })

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

@@ -31,7 +31,7 @@ import "../stepper-item/stepper-item.js";
 import "@radix-ui/react-tabs";
 import "../tooltip/tooltip.js";
 import { Filter as p } from "../table-filter/index.js";
-import b from "../assets/icons/octagon-warning-Copy.js";
+import q from "../assets/icons/octagon-warning-Copy.js";
 import "../badge/badge.js";
 import "../avatar/avatar.js";
 import "../text-preset/text-preset.js";
@@ -39,9 +39,9 @@ import "react-dom";
 import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/util/changing-window/count-events-for-safari.js";
 import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/ledger/dispatch-consumer-event.js";
 import "../table/table.context.js";
-const Fe = ({
-  dataSource: B,
-  schema: f,
+const we = ({
+  dataSource: f,
+  schema: B,
   loading: H,
   emptyMessage: k,
   className: T,
@@ -64,22 +64,23 @@ const Fe = ({
   paginationInfo: c,
   paginationQuickJumper: s,
   error: x = !1,
-  freeze: R = !1
+  dataSourceError: R = !1,
+  freeze: S = !1
 }) => {
   var F;
   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(b, { className: "mt-1.5" }),
+      /* @__PURE__ */ e(q, { 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, v = m || t || h || u, S = typeof (t == null ? void 0 : t.showFilterButton) > "u" ? !0 : t == null ? void 0 : t.showFilterButton;
+  const C = s && s.totalPage && s.totalPage >= 2, N = o && o.totalPage && o.totalPage >= 2 || !!c || C, v = m || t || h || u, b = typeof (t == null ? void 0 : t.showFilterButton) > "u" ? !0 : t == null ? void 0 : t.showFilterButton;
   return /* @__PURE__ */ a("div", { className: d("flex flex-col overflow-hidden relative", T), children: [
-    R && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full cursor-not-allowed bg-white/50" }),
-    /* @__PURE__ */ a(r, { dataSource: B, schema: f, loading: H, emptyMessage: k, children: [
+    S && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full cursor-not-allowed bg-white/50" }),
+    /* @__PURE__ */ a(r, { dataSource: f, schema: B, loading: H, emptyMessage: k, children: [
       P && v && /* @__PURE__ */ a(
         r.Header,
         {
@@ -114,7 +115,7 @@ const Fe = ({
                     })
                   },
                   children: [
-                    S && /* @__PURE__ */ e(p.FilterButton, {}),
+                    b && /* @__PURE__ */ e(p.FilterButton, {}),
                     (F = t == null ? void 0 : t.quickFilters) == null ? void 0 : F.map((w) => /* @__PURE__ */ e(p.FilterColumnButton, { filterName: w }, w))
                   ]
                 }
@@ -127,6 +128,7 @@ const Fe = ({
       /* @__PURE__ */ e(
         r.Body,
         {
+          dataSourceError: R,
           cell: l == null ? void 0 : l.cell,
           sort: l == null ? void 0 : l.sort,
           className: d(
@@ -189,5 +191,5 @@ const Fe = ({
   ] });
 };
 export {
-  Fe as default
+  we as default
 };

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

@@ -33,6 +33,7 @@ export interface TableCardProps {
     paginationQuickJumper?: PaginationQuickJumperProps;
     loading?: boolean;
     emptyMessage?: string;
+    dataSourceError?: boolean | string;
     error?: boolean | string;
     freeze?: boolean;
 }

package/dist/index.js

@@ -8,7 +8,7 @@ import { Z2SideNavBarHeader as T } from "./components/collapsible-side-nav-bar/s
 import { Z2SideNavBarContent as c } from "./components/collapsible-side-nav-bar/side-nav-bar-content.js";
 import { Z2SideNavBarFooter as w } from "./components/collapsible-side-nav-bar/side-nav-bar-footer.js";
 import { Z2SideNavBarGroup as v } from "./components/collapsible-side-nav-bar/side-nav-bar-group.js";
-import { Z2SideNavBarItem as M } from "./components/collapsible-side-nav-bar/side-nav-bar-item.js";
+import { Z2SideNavBarItem as B } from "./components/collapsible-side-nav-bar/side-nav-bar-item.js";
 import { Z2SideNavBarSeparator as L } from "./components/collapsible-side-nav-bar/side-nav-bar-separator.js";
 import { useZ2SideNavBar as N } from "./components/collapsible-side-nav-bar/context.js";
 import { Z2Popover as h } from "./components/collapsible-side-nav-bar/popover/popover.js";
@@ -23,7 +23,7 @@ import { CountryFlags as z } from "./components/country-flags/country-flags.js";
 import { Z2Checkbox as X } from "./components/checkbox/checkbox.js";
 import { Z2Dialog as oo, Z2DialogClose as eo, Z2DialogContent as ro, Z2DialogDescription as to, Z2DialogFooter as ao, Z2DialogHeader as po, Z2DialogOverlay as no, Z2DialogPortal as lo, Z2DialogTitle as mo, Z2DialogTrigger as fo } from "./components/dialog/dialog.js";
 import { DropdownContext as io, Z2Dropdown as Zo, Z2DropdownContent as uo, Z2DropdownInput as So, Z2DropdownItem as Do, Z2DropdownSub as bo, Z2DropdownSubContent as Co, Z2DropdownSubItem as To, Z2DropdownSubTrigger as go } from "./components/dropdown/z2-dropdown.js";
-import { Z2DropdownMenu as so, Z2DropdownMenuCheckboxItem as wo, Z2DropdownMenuContent as Io, Z2DropdownMenuGroup as vo, Z2DropdownMenuItem as Bo, Z2DropdownMenuLabel as Mo, Z2DropdownMenuPortal as Ao, Z2DropdownMenuRadioGroup as Lo, Z2DropdownMenuRadioItem as Po, Z2DropdownMenuSeparator as No, Z2DropdownMenuShortcut as Eo, Z2DropdownMenuSub as ho, Z2DropdownMenuSubContent as Fo, Z2DropdownMenuSubTrigger as Ho, Z2DropdownMenuTrigger as _o } from "./components/dropdown-menu/z2-dropdown-menu.js";
+import { Z2DropdownMenu as so, Z2DropdownMenuCheckboxItem as wo, Z2DropdownMenuContent as Io, Z2DropdownMenuGroup as vo, Z2DropdownMenuItem as Mo, Z2DropdownMenuLabel as Bo, Z2DropdownMenuPortal as Ao, Z2DropdownMenuRadioGroup as Lo, Z2DropdownMenuRadioItem as Po, Z2DropdownMenuSeparator as No, Z2DropdownMenuShortcut as Eo, Z2DropdownMenuSub as ho, Z2DropdownMenuSubContent as Fo, Z2DropdownMenuSubTrigger as Ho, Z2DropdownMenuTrigger as _o } from "./components/dropdown-menu/z2-dropdown-menu.js";
 import { FileUploadArea as Ro } from "./components/file-upload-area/file-upload-area.js";
 import { DEFAULT_ACCEPT as Go } from "./components/file-upload-area/file-upload-area.const.js";
 import { Input as Vo } from "./components/input/input.js";
@@ -38,7 +38,7 @@ import { TableBody as be } from "./components/table/table.js";
 import { extractCellValue as Te } from "./components/table/table.utils.js";
 import { DEFAULT_EMPTY_MESSAGE as ce, TABLE_CSS_CLASSES as se } from "./components/table/table.const.js";
 import { TableContext as Ie, useTableContext as ve } from "./components/table/table.context.js";
-import { TableCell as Me } from "./components/table/components/table-cell.js";
+import { TableCell as Be } from "./components/table/components/table-cell.js";
 import { NumberCell as Le } from "./components/table/components/cell/number-cell.js";
 import { BooleanCell as Ne } from "./components/table/components/cell/boolean-cell.js";
 import { LinkCell as he } from "./components/table/components/cell/link-cell.js";
@@ -48,7 +48,7 @@ import { LabelCell as ke } from "./components/table/components/cell/label-cell.j
 import { TableHeader as Ue } from "./components/table/components/table-header/table-header.js";
 import "react/jsx-runtime";
 import { TableRow as We } from "./components/table/components/table-row.js";
-import { TableEmptyState as Je } from "./components/table/components/table-empty-state.js";
+import { TableMessageState as Je } from "./components/table/components/table-message-state.js";
 import { TableLoadingState as Ye } from "./components/table/components/table-loading-state.js";
 import { Pagination as qe } from "./components/table/components/pagination/pagination.js";
 import { TableHeaderWrapper as Ke } from "./components/table/components/table-header-wrapper.js";
@@ -66,7 +66,7 @@ import { Avatar as Cr, AvatarWithLabel as Tr } from "./components/avatar/avatar.
 import { Z2TextPreset as cr } from "./components/text-preset/text-preset.js";
 import { ColumnReOrder as wr } from "./components/column-reorder/column-reorder.js";
 import { default as vr } from "./components/tree-checkbox-select/TreeCheckboxSelect.js";
-import { InfoIcon as Mr } from "./components/assets/icons/info-icon.js";
+import { InfoIcon as Br } from "./components/assets/icons/info-icon.js";
 import { useTheme as Lr } from "./lib/theme.hook.js";
 import { cn as Nr } from "./lib/utils.js";
 import { Z2PopoverTrigger as hr } from "./components/collapsible-side-nav-bar/popover/popover-trigger.js";
@@ -92,7 +92,7 @@ export {
   He as DescriptionCell,
   io as DropdownContext,
   Ro as FileUploadArea,
-  Mr as InfoIcon,
+  Br as InfoIcon,
   Vo as Input,
   ke as LabelCell,
   he as LinkCell,
@@ -110,15 +110,15 @@ export {
   ue as Table,
   be as TableBody,
   dr as TableCard,
-  Me as TableCell,
+  Be as TableCell,
   Ie as TableContext,
-  Je as TableEmptyState,
   er as TableFooter,
   tr as TableFooterContent,
   Ue as TableHeader,
   $e as TableHeaderContent,
   Ke as TableHeaderWrapper,
   Ye as TableLoadingState,
+  Je as TableMessageState,
   qe as TablePagination,
   Se as TableProvider,
   We as TableRow,
@@ -143,8 +143,8 @@ export {
   wo as Z2DropdownMenuCheckboxItem,
   Io as Z2DropdownMenuContent,
   vo as Z2DropdownMenuGroup,
-  Bo as Z2DropdownMenuItem,
-  Mo as Z2DropdownMenuLabel,
+  Mo as Z2DropdownMenuItem,
+  Bo as Z2DropdownMenuLabel,
   Ao as Z2DropdownMenuPortal,
   Lo as Z2DropdownMenuRadioGroup,
   Po as Z2DropdownMenuRadioItem,
@@ -176,7 +176,7 @@ export {
   w as Z2SideNavBarFooter,
   v as Z2SideNavBarGroup,
   T as Z2SideNavBarHeader,
-  M as Z2SideNavBarItem,
+  B as Z2SideNavBarItem,
   u as Z2SideNavBarProvider,
   L as Z2SideNavBarSeparator,
   b as Z2SidebarVariants,

package/dist/types/components/table/components/index.d.ts

@@ -2,7 +2,7 @@ export { TableCell } from './table-cell';
 export { NumberCell, BooleanCell, AvatarCell, DescriptionCell, LabelCell, LinkCell } from './cell';
 export { TableHeader } from './table-header';
 export { TableRow } from './table-row';
-export { TableEmptyState } from './table-empty-state';
+export { TableMessageState } from './table-message-state';
 export { TableLoadingState } from './table-loading-state';
 export { Pagination as TablePagination } from './pagination/pagination';
 export { TableHeaderWrapper } from './table-header-wrapper';

package/dist/types/components/table/components/table-message-state.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+interface TableMessageStateProps {
+    colSpan: number;
+    message: string;
+    className?: string;
+}
+export declare const TableMessageState: React.FC<TableMessageStateProps>;
+export {};

package/dist/types/components/table/index.d.ts

@@ -4,6 +4,6 @@ export type { TableProps, TableSchema, TableSchemaColumn, CellType, CellValue, C
 export { extractCellValue } from './table.utils';
 export { DEFAULT_EMPTY_MESSAGE, TABLE_CSS_CLASSES } from './table.const';
 export { TableContext, useTableContext } from './table.context';
-export { TableCell, TableHeader, TableRow, TableEmptyState, TableLoadingState, TablePagination, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
+export { TableCell, TableHeader, TableRow, TableMessageState, TableLoadingState, TablePagination, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
 export { PaginationInfo, PaginationQuickJumper } from './components/pagination/components';
 export * from './components/cell';

package/dist/types/components/table/table.const.d.ts

@@ -26,5 +26,6 @@ export declare const TABLE_CSS_CLASSES: {
     readonly sortIconActive: "ml-2 w-4 h-4 text-gray-600";
     readonly row: " transition-colors duration-200 text-text-neutral-primary";
     readonly emptyState: "px-4 py-8 text-center text-gray-500";
+    readonly dataErrorState: "px-4 py-8 text-center text-text-danger-primary";
     readonly loading: "px-4 py-8 text-center text-gray-500";
 };

package/dist/types/components/table/table.d.ts

@@ -3,5 +3,6 @@ import { TableProps } from './table.type';
 export declare const TableBody: React.FC<Partial<TableProps> & {
     className?: string;
     stickyHeader?: boolean;
+    dataSourceError?: boolean | string;
 }>;
 export default TableBody;

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

@@ -34,6 +34,7 @@ export interface TableCardProps {
     paginationQuickJumper?: PaginationQuickJumperProps;
     loading?: boolean;
     emptyMessage?: string;
+    dataSourceError?: boolean | string;
     error?: boolean | string;
     freeze?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ztwoint/z-ui",
-  "version": "0.1.75",
+  "version": "0.1.76",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",

package/dist/components/table/components/table-empty-state.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-interface TableEmptyStateProps {
-    colSpan: number;
-    message: string;
-}
-export declare const TableEmptyState: React.FC<TableEmptyStateProps>;
-export {};

package/dist/components/table/components/table-empty-state.js

@@ -1,6 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import { TABLE_CSS_CLASSES as m } from "../table.const.js";
-const a = ({ colSpan: r, message: e }) => /* @__PURE__ */ t("tbody", { children: /* @__PURE__ */ t("tr", { children: /* @__PURE__ */ t("td", { colSpan: r, className: m.emptyState, children: e }) }) });
-export {
-  a as TableEmptyState
-};

package/dist/types/components/table/components/table-empty-state.d.ts

@@ -1,7 +0,0 @@
-import * as React from 'react';
-interface TableEmptyStateProps {
-    colSpan: number;
-    message: string;
-}
-export declare const TableEmptyState: React.FC<TableEmptyStateProps>;
-export {};