@ztwoint/z-ui 0.1.74 → 0.1.76

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/dist/components/table/components/index.d.ts +1 -1
  2. package/dist/components/table/components/table-message-state.d.ts +8 -0
  3. package/dist/components/table/components/table-message-state.js +9 -0
  4. package/dist/components/table/index.d.ts +1 -1
  5. package/dist/components/table/table.const.d.ts +1 -0
  6. package/dist/components/table/table.const.js +1 -0
  7. package/dist/components/table/table.d.ts +1 -0
  8. package/dist/components/table/table.js +49 -28
  9. package/dist/components/table-card/table-card.js +13 -11
  10. package/dist/components/table-card/table-card.type.d.ts +1 -0
  11. package/dist/components/table-filter/table-filter-button.js +1 -1
  12. package/dist/css/styles/tailwind.css +1 -1
  13. package/dist/index.js +11 -11
  14. package/dist/node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/ledger/dispatch-consumer-event.js +2 -2
  15. package/dist/node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/util/detect-broken-drag.js +2 -2
  16. package/dist/node_modules/bind-event-listener/dist/index.js +2 -2
  17. package/dist/types/components/table/components/index.d.ts +1 -1
  18. package/dist/types/components/table/components/table-message-state.d.ts +8 -0
  19. package/dist/types/components/table/index.d.ts +1 -1
  20. package/dist/types/components/table/table.const.d.ts +1 -0
  21. package/dist/types/components/table/table.d.ts +1 -0
  22. package/dist/types/components/table-card/table-card.type.d.ts +1 -0
  23. package/package.json +1 -1
  24. package/dist/components/table/components/table-empty-state.d.ts +0 -7
  25. package/dist/components/table/components/table-empty-state.js +0 -6
  26. package/dist/types/components/table/components/table-empty-state.d.ts +0 -7
@@ -2,7 +2,7 @@ export { TableCell } from './table-cell';
2
2
  export { NumberCell, BooleanCell, AvatarCell, DescriptionCell, LabelCell, LinkCell } from './cell';
3
3
  export { TableHeader } from './table-header';
4
4
  export { TableRow } from './table-row';
5
- export { TableEmptyState } from './table-empty-state';
5
+ export { TableMessageState } from './table-message-state';
6
6
  export { TableLoadingState } from './table-loading-state';
7
7
  export { Pagination as TablePagination } from './pagination/pagination';
8
8
  export { TableHeaderWrapper } from './table-header-wrapper';
@@ -0,0 +1,8 @@
1
+ import * as React from 'react';
2
+ interface TableMessageStateProps {
3
+ colSpan: number;
4
+ message: string;
5
+ className?: string;
6
+ }
7
+ export declare const TableMessageState: React.FC<TableMessageStateProps>;
8
+ export {};
@@ -0,0 +1,9 @@
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ const o = ({
3
+ colSpan: r,
4
+ message: t,
5
+ className: d
6
+ }) => /* @__PURE__ */ e("tbody", { children: /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e("td", { colSpan: r, className: d, children: t }) }) });
7
+ export {
8
+ o as TableMessageState
9
+ };
@@ -4,6 +4,6 @@ export type { TableProps, TableSchema, TableSchemaColumn, CellType, CellValue, C
4
4
  export { extractCellValue } from './table.utils';
5
5
  export { DEFAULT_EMPTY_MESSAGE, TABLE_CSS_CLASSES } from './table.const';
6
6
  export { TableContext, useTableContext } from './table.context';
7
- export { TableCell, TableHeader, TableRow, TableEmptyState, TableLoadingState, TablePagination, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
7
+ export { TableCell, TableHeader, TableRow, TableMessageState, TableLoadingState, TablePagination, NumberCell, BooleanCell, TableHeaderWrapper, TableHeaderContent, TableFooter, TableFooterContent, } from './components';
8
8
  export { PaginationInfo, PaginationQuickJumper } from './components/pagination/components';
9
9
  export * from './components/cell';
@@ -26,5 +26,6 @@ export declare const TABLE_CSS_CLASSES: {
26
26
  readonly sortIconActive: "ml-2 w-4 h-4 text-gray-600";
27
27
  readonly row: " transition-colors duration-200 text-text-neutral-primary";
28
28
  readonly emptyState: "px-4 py-8 text-center text-gray-500";
29
+ readonly dataErrorState: "px-4 py-8 text-center text-text-danger-primary";
29
30
  readonly loading: "px-4 py-8 text-center text-gray-500";
30
31
  };
@@ -25,6 +25,7 @@ const e = "No data available", t = {
25
25
  sortIconActive: "ml-2 w-4 h-4 text-gray-600",
26
26
  row: " transition-colors duration-200 text-text-neutral-primary",
27
27
  emptyState: "px-4 py-8 text-center text-gray-500",
28
+ dataErrorState: "px-4 py-8 text-center text-text-danger-primary",
28
29
  loading: "px-4 py-8 text-center text-gray-500"
29
30
  };
30
31
  export {
@@ -3,5 +3,6 @@ import * as React from 'react';
3
3
  export declare const TableBody: React.FC<Partial<TableProps> & {
4
4
  className?: string;
5
5
  stickyHeader?: boolean;
6
+ dataSourceError?: boolean | string;
6
7
  }>;
7
8
  export default TableBody;
@@ -1,43 +1,64 @@
1
- import { jsxs as l, jsx as e } from "react/jsx-runtime";
2
- import * as y from "react";
3
- import { DEFAULT_EMPTY_MESSAGE as S, TABLE_CSS_CLASSES as n } from "./table.const.js";
4
- import { TableHeader as g } from "./components/table-header/table-header.js";
5
- import { TableRow as T } from "./components/table-row.js";
6
- import { TableEmptyState as v } from "./components/table-empty-state.js";
1
+ import { jsxs as n, jsx as e } from "react/jsx-runtime";
2
+ import * as S from "react";
3
+ import { DEFAULT_EMPTY_MESSAGE as T, TABLE_CSS_CLASSES as o } from "./table.const.js";
4
+ import { TableHeader as N } from "./components/table-header/table-header.js";
5
+ import { TableRow as v } from "./components/table-row.js";
6
+ import { TableMessageState as i } from "./components/table-message-state.js";
7
7
  import { TableContext as w } from "./table.context.js";
8
- import { cn as m } from "../../lib/utils.js";
9
- const j = ({ cell: a = { hasBorder: !0 }, sort: d, className: i, stickyHeader: c = !1, ...f }) => {
10
- const u = y.useContext(w), {
8
+ import { cn as d } from "../../lib/utils.js";
9
+ const j = ({
10
+ cell: s = { hasBorder: !0 },
11
+ sort: c,
12
+ className: f,
13
+ stickyHeader: p = !1,
14
+ dataSourceError: l,
15
+ ...u
16
+ }) => {
17
+ const h = S.useContext(w), {
11
18
  dataSource: t = [],
12
- schema: o = [],
19
+ schema: a = [],
13
20
  loading: r = !1,
14
- emptyMessage: p = S,
15
- customCells: b
16
- } = 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(
17
- T,
21
+ emptyMessage: b = T,
22
+ customCells: g
23
+ } = h || u, x = () => l ? /* @__PURE__ */ e(
24
+ i,
18
25
  {
19
- record: x,
20
- index: s,
21
- schema: o,
22
- customCells: b,
23
- cell: a
26
+ colSpan: a.length,
27
+ message: typeof l == "string" ? l : "Error loading data",
28
+ className: o.dataErrorState
29
+ }
30
+ ) : !t || t.length === 0 && !r ? /* @__PURE__ */ e(
31
+ i,
32
+ {
33
+ colSpan: a.length,
34
+ message: b,
35
+ className: o.emptyState
36
+ }
37
+ ) : /* @__PURE__ */ e("tbody", { children: t.map((y, m) => /* @__PURE__ */ e(
38
+ v,
39
+ {
40
+ record: y,
41
+ index: m,
42
+ schema: a,
43
+ customCells: g,
44
+ cell: s
24
45
  },
25
- s
46
+ m
26
47
  )) });
27
- return /* @__PURE__ */ l(
48
+ return /* @__PURE__ */ n(
28
49
  "div",
29
50
  {
30
- className: m(
51
+ className: d(
31
52
  r ? "overflow-y-hidden relative" : "overflow-y-auto",
32
- n.bordered[a.hasBorder && !r && t.length > 0 ? "true" : "false"],
33
- i
53
+ o.bordered[s.hasBorder && !r && t.length > 0 ? "true" : "false"],
54
+ f
34
55
  ),
35
56
  children: [
36
- /* @__PURE__ */ l("table", { className: m(n.table, "w-full"), children: [
37
- h(),
38
- /* @__PURE__ */ e(g, { schema: o, sort: d, cell: a, stickyHeader: c })
57
+ /* @__PURE__ */ n("table", { className: d(o.table, "w-full"), children: [
58
+ x(),
59
+ /* @__PURE__ */ e(N, { schema: a, sort: c, cell: s, stickyHeader: p })
39
60
  ] }),
40
- 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: [
61
+ 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: [
41
62
  /* @__PURE__ */ e("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-text-brand-secondary" }),
42
63
  /* @__PURE__ */ e("p", { className: "text-text-neutral-primary font-medium", children: "Loading..." })
43
64
  ] }) })
@@ -31,7 +31,7 @@ import "../stepper-item/stepper-item.js";
31
31
  import "@radix-ui/react-tabs";
32
32
  import "../tooltip/tooltip.js";
33
33
  import { Filter as p } from "../table-filter/index.js";
34
- import b from "../assets/icons/octagon-warning-Copy.js";
34
+ import q from "../assets/icons/octagon-warning-Copy.js";
35
35
  import "../badge/badge.js";
36
36
  import "../avatar/avatar.js";
37
37
  import "../text-preset/text-preset.js";
@@ -39,9 +39,9 @@ import "react-dom";
39
39
  import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/util/changing-window/count-events-for-safari.js";
40
40
  import "../../node_modules/@atlaskit/pragmatic-drag-and-drop/dist/esm/ledger/dispatch-consumer-event.js";
41
41
  import "../table/table.context.js";
42
- const Fe = ({
43
- dataSource: B,
44
- schema: f,
42
+ const we = ({
43
+ dataSource: f,
44
+ schema: B,
45
45
  loading: H,
46
46
  emptyMessage: k,
47
47
  className: T,
@@ -64,22 +64,23 @@ const Fe = ({
64
64
  paginationInfo: c,
65
65
  paginationQuickJumper: s,
66
66
  error: x = !1,
67
- freeze: R = !1
67
+ dataSourceError: R = !1,
68
+ freeze: S = !1
68
69
  }) => {
69
70
  var F;
70
71
  if (x)
71
72
  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: [
72
- /* @__PURE__ */ e(b, { className: "mt-1.5" }),
73
+ /* @__PURE__ */ e(q, { className: "mt-1.5" }),
73
74
  /* @__PURE__ */ a("div", { className: "flex flex-col gap-2", children: [
74
75
  /* @__PURE__ */ e("div", { className: "text-text-error-primary text-lg font-medium", children: "Error loading data" }),
75
76
  /* @__PURE__ */ e("div", { className: "text-sm", children: "Please try again later" }),
76
77
  typeof x == "string" && /* @__PURE__ */ e("div", { className: "text-text-warning-secondary text-sm", children: x })
77
78
  ] })
78
79
  ] }) });
79
- 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;
80
+ 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;
80
81
  return /* @__PURE__ */ a("div", { className: d("flex flex-col overflow-hidden relative", T), children: [
81
- R && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full cursor-not-allowed bg-white/50" }),
82
- /* @__PURE__ */ a(r, { dataSource: B, schema: f, loading: H, emptyMessage: k, children: [
82
+ S && /* @__PURE__ */ e("div", { className: "absolute top-0 inset-0 w-full h-full cursor-not-allowed bg-white/50" }),
83
+ /* @__PURE__ */ a(r, { dataSource: f, schema: B, loading: H, emptyMessage: k, children: [
83
84
  P && v && /* @__PURE__ */ a(
84
85
  r.Header,
85
86
  {
@@ -114,7 +115,7 @@ const Fe = ({
114
115
  })
115
116
  },
116
117
  children: [
117
- S && /* @__PURE__ */ e(p.FilterButton, {}),
118
+ b && /* @__PURE__ */ e(p.FilterButton, {}),
118
119
  (F = t == null ? void 0 : t.quickFilters) == null ? void 0 : F.map((w) => /* @__PURE__ */ e(p.FilterColumnButton, { filterName: w }, w))
119
120
  ]
120
121
  }
@@ -127,6 +128,7 @@ const Fe = ({
127
128
  /* @__PURE__ */ e(
128
129
  r.Body,
129
130
  {
131
+ dataSourceError: R,
130
132
  cell: l == null ? void 0 : l.cell,
131
133
  sort: l == null ? void 0 : l.sort,
132
134
  className: d(
@@ -189,5 +191,5 @@ const Fe = ({
189
191
  ] });
190
192
  };
191
193
  export {
192
- Fe as default
194
+ we as default
193
195
  };
@@ -33,6 +33,7 @@ export interface TableCardProps {
33
33
  paginationQuickJumper?: PaginationQuickJumperProps;
34
34
  loading?: boolean;
35
35
  emptyMessage?: string;
36
+ dataSourceError?: boolean | string;
36
37
  error?: boolean | string;
37
38
  freeze?: boolean;
38
39
  }
@@ -75,7 +75,7 @@ const ne = () => {
75
75
  shade: d ? "brand" : "neutral",
76
76
  size: "small",
77
77
  children: [
78
- "Filter ",
78
+ "Filters ",
79
79
  d && `(${h.value.length})`
80
80
  ]
81
81
  }