@konstructio/ui 0.1.2-alpha.1 → 0.1.2-alpha.10

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 (106) hide show
  1. package/dist/{Modal-V67Uz78z.js → Modal-B8jrP02v.js} +20 -20
  2. package/dist/_commonjsHelpers-DaMA6jEr.js +8 -0
  3. package/dist/{chevron-down-BLZPftpV.js → chevron-down-MZvQoT2F.js} +2 -2
  4. package/dist/chevron-right-VYBOBhRt.js +19 -0
  5. package/dist/components/Alert/Alert.js +2 -2
  6. package/dist/components/AlertDialog/AlertDialog.js +1 -1
  7. package/dist/components/AlertDialog/components/AlertDialogTrigger.js +1 -1
  8. package/dist/components/AlertDialog/components/index.js +1 -1
  9. package/dist/components/Badge/Badge.js +2 -2
  10. package/dist/components/Breadcrumb/Breadcrumb.js +1 -1
  11. package/dist/components/Breadcrumb/components/Item/Item.js +24 -23
  12. package/dist/components/Checkbox/Checkbox.js +5 -4
  13. package/dist/components/Checkbox/Checkbox.variants.js +5 -4
  14. package/dist/components/Command/Command.js +2 -2
  15. package/dist/components/Command/components/Command.js +1 -1
  16. package/dist/components/Command/components/CommandEmpty.js +1 -1
  17. package/dist/components/Command/components/CommandGroup.js +1 -1
  18. package/dist/components/Command/components/CommandInput.js +2 -2
  19. package/dist/components/Command/components/CommandItem.js +1 -1
  20. package/dist/components/Command/components/CommandList.js +1 -1
  21. package/dist/components/Command/components/CommandSeparator.js +1 -1
  22. package/dist/components/Command/components/DialogContent.js +2 -2
  23. package/dist/components/Command/components/DialogOverlay.js +1 -1
  24. package/dist/components/Datepicker/DatePicker.js +545 -543
  25. package/dist/components/Dropdown/Dropdown.js +36 -24
  26. package/dist/components/Dropdown/Dropdown.variants.js +25 -7
  27. package/dist/components/Dropdown/components/List/List.js +59 -44
  28. package/dist/components/Dropdown/components/List/List.variants.js +9 -7
  29. package/dist/components/Dropdown/components/ListItem/ListItem.js +48 -24
  30. package/dist/components/Dropdown/components/ListItem/ListItem.variants.js +9 -7
  31. package/dist/components/Dropdown/components/Wrapper.js +141 -106
  32. package/dist/components/Dropdown/contexts/dropdown.context.js +9 -8
  33. package/dist/components/Dropdown/contexts/dropdown.provider.js +20 -19
  34. package/dist/components/Dropdown/hooks/useDropdown.js +26 -27
  35. package/dist/components/Dropdown/hooks/useNavigationList.js +32 -28
  36. package/dist/components/DropdownButton/DropdownButton.js +1 -1
  37. package/dist/components/Filter/components/BadgeDropdown/BadgeMultiSelect.js +1 -1
  38. package/dist/components/Filter/components/DateFilterDropdown/DateFilterDropdown.js +1 -1
  39. package/dist/components/Filter/components/ResetButton/ResetButton.js +16 -11
  40. package/dist/components/Input/Input.js +1 -1
  41. package/dist/components/Loading/Loading.js +2 -2
  42. package/dist/components/Modal/Modal.js +2 -2
  43. package/dist/components/Modal/components/Wrapper/Wrapper.js +3 -3
  44. package/dist/components/Modal/components/index.js +1 -1
  45. package/dist/components/NumberInput/NumberInput.js +2 -2
  46. package/dist/components/PieChart/PieChart.js +217 -215
  47. package/dist/components/Range/Range.js +1 -1
  48. package/dist/components/Sidebar/components/Wrapper/Wrapper.js +29 -28
  49. package/dist/components/Slider/Slider.js +1 -1
  50. package/dist/components/Switch/Switch.js +6 -5
  51. package/dist/components/Tabs/Tabs.js +1 -1
  52. package/dist/components/Tabs/Tabs.variants.js +45 -24
  53. package/dist/components/Tabs/components/Content.js +1 -1
  54. package/dist/components/Tabs/components/List.js +1 -1
  55. package/dist/components/Tabs/components/Trigger.js +9 -8
  56. package/dist/components/TagSelect/components/Wrapper/Wrapper.js +98 -49
  57. package/dist/components/TimePicker/components/Wrapper/Wrapper.js +1 -1
  58. package/dist/components/Toast/Toast.js +57 -55
  59. package/dist/components/VirtualizedTable/VirtualizedTable.js +117 -0
  60. package/dist/components/VirtualizedTable/VirtualizedTable.variants.js +5 -0
  61. package/dist/components/VirtualizedTable/assets/chevron-down.js +25 -0
  62. package/dist/components/VirtualizedTable/assets/chevron-up.js +25 -0
  63. package/dist/components/VirtualizedTable/assets/index.js +6 -0
  64. package/dist/components/VirtualizedTable/components/Actions/Actions.js +46 -0
  65. package/dist/components/VirtualizedTable/components/Body/Body.js +25 -0
  66. package/dist/components/VirtualizedTable/components/DotPaginate/DotPaginate.js +165 -0
  67. package/dist/components/VirtualizedTable/components/DropdownPaginate/DropdownPaginate.js +34 -0
  68. package/dist/components/VirtualizedTable/components/Filter/Filter.js +86 -0
  69. package/dist/components/VirtualizedTable/components/FormPaginate/FormPaginate.js +48 -0
  70. package/dist/components/VirtualizedTable/components/Header/Header.js +82 -0
  71. package/dist/components/VirtualizedTable/components/Pagination/Pagination.js +45 -0
  72. package/dist/components/VirtualizedTable/components/TruncateText/TruncateText.js +1871 -0
  73. package/dist/components/VirtualizedTable/components/index.js +14 -0
  74. package/dist/components/VirtualizedTable/constants/index.js +5 -0
  75. package/dist/components/VirtualizedTable/constants/pagination.js +5 -0
  76. package/dist/components/VirtualizedTable/contexts/index.js +8 -0
  77. package/dist/components/VirtualizedTable/contexts/table.context.js +31 -0
  78. package/dist/components/VirtualizedTable/contexts/table.hook.js +11 -0
  79. package/dist/components/VirtualizedTable/contexts/table.provider.js +82 -0
  80. package/dist/components/index.js +44 -40
  81. package/dist/{createLucideIcon-DbC6TvM5.js → createLucideIcon-D2CN7Ma9.js} +4 -4
  82. package/dist/debounce-BFejQm9P.js +200 -0
  83. package/dist/{index-D3xzCzcO.js → index-0XtjXVpJ.js} +2 -2
  84. package/dist/index-BAEWsOG1.js +27 -0
  85. package/dist/index-BVRIAMfe.js +36 -0
  86. package/dist/index-BZPx6jYI.js +8 -0
  87. package/dist/{index-Oq5GlCHP.js → index-Bn4c-gww.js} +1 -1
  88. package/dist/index-CffpTFMi.js +137 -0
  89. package/dist/{index-BAraV3ai.js → index-DQJhMz8c.js} +1 -1
  90. package/dist/index-DdXGVVBv.js +15 -0
  91. package/dist/index-Dx2grAuN.js +1742 -0
  92. package/dist/{index-h-Ul0anl.js → index-N2OStZoU.js} +1 -1
  93. package/dist/{index-BXuxPoz7.js → index-amYX3uxF.js} +18 -17
  94. package/dist/{index-DB2XhXHn.js → index-l3NwplN0.js} +11 -10
  95. package/dist/{index-iXyXtdgP.js → index-sp5ZfG6g.js} +1 -1
  96. package/dist/index.d.ts +109 -6
  97. package/dist/index.js +41 -37
  98. package/dist/package.json +30 -22
  99. package/dist/styles.css +1 -1
  100. package/dist/{x-BPcqkRZd.js → x-4F_5p77m.js} +1 -1
  101. package/package.json +30 -22
  102. package/dist/_commonjsHelpers-C6fGbg64.js +0 -6
  103. package/dist/chevron-up-RLP4nX7V.js +0 -54
  104. package/dist/index-C9T9HQaa.js +0 -423
  105. package/dist/index-CZnD2QxM.js +0 -32
  106. package/dist/index-CrBonFvu.js +0 -144
@@ -1,4 +1,4 @@
1
- import { g as ge } from "./_commonjsHelpers-C6fGbg64.js";
1
+ import { g as ge } from "./_commonjsHelpers-DaMA6jEr.js";
2
2
  var V = { exports: {} }, N = { exports: {} }, T = {};
3
3
  /** @license React v16.13.1
4
4
  * react-is.production.min.js
@@ -2,10 +2,11 @@ import * as i from "react";
2
2
  import { a as Ee, c as he, b as _, d as ye } from "./index-BfXxHr_2.js";
3
3
  import { u as S, c as De } from "./index-DQH6odE9.js";
4
4
  import { u as w } from "./index-bwWKd82e.js";
5
- import { P as be, D as Ce } from "./index-CrBonFvu.js";
6
- import { P as N } from "./index-C9T9HQaa.js";
5
+ import { D as be } from "./index-CffpTFMi.js";
6
+ import { P as N } from "./index-BVRIAMfe.js";
7
7
  import { u as j } from "./index-0ioNhtNM.js";
8
8
  import { jsx as l, jsxs as q, Fragment as B } from "react/jsx-runtime";
9
+ import { P as Ce } from "./index-DdXGVVBv.js";
9
10
  import { P as U } from "./index-C1g_chDT.js";
10
11
  import { R as Ae } from "./Combination-VYaRRJBZ.js";
11
12
  var x = "focusScope.autoFocusOnMount", L = "focusScope.autoFocusOnUnmount", V = { bubbles: !1, cancelable: !0 }, Re = "FocusScope", Q = i.forwardRef((e, o) => {
@@ -197,7 +198,7 @@ var Se = function(e) {
197
198
  return r ? (n.push.apply(n, Array.from(r.querySelectorAll("[aria-live]"))), we(n, r, t, "aria-hidden")) : function() {
198
199
  return null;
199
200
  };
200
- }, M = "Dialog", [te, et] = he(M), [Le, m] = te(M), oe = (e) => {
201
+ }, M = "Dialog", [te, tt] = he(M), [Le, m] = te(M), oe = (e) => {
201
202
  const {
202
203
  __scopeDialog: o,
203
204
  children: t,
@@ -252,7 +253,7 @@ var K = "DialogPortal", [ke, ae] = te(K, {
252
253
  forceMount: void 0
253
254
  }), se = (e) => {
254
255
  const { __scopeDialog: o, forceMount: t, children: n, container: r } = e, a = m(K, o);
255
- return /* @__PURE__ */ l(ke, { scope: o, forceMount: t, children: i.Children.map(n, (d) => /* @__PURE__ */ l(U, { present: t || a.open, children: /* @__PURE__ */ l(be, { asChild: !0, container: r, children: d }) })) });
256
+ return /* @__PURE__ */ l(ke, { scope: o, forceMount: t, children: i.Children.map(n, (d) => /* @__PURE__ */ l(U, { present: t || a.open, children: /* @__PURE__ */ l(Ce, { asChild: !0, container: r, children: d }) })) });
256
257
  };
257
258
  se.displayName = K;
258
259
  var I = "DialogOverlay", ie = i.forwardRef(
@@ -347,7 +348,7 @@ var Ke = i.forwardRef(
347
348
  onMountAutoFocus: r,
348
349
  onUnmountAutoFocus: a,
349
350
  children: /* @__PURE__ */ l(
350
- Ce,
351
+ be,
351
352
  {
352
353
  role: "dialog",
353
354
  id: s.contentId,
@@ -399,7 +400,7 @@ ve.displayName = pe;
399
400
  function H(e) {
400
401
  return e ? "open" : "closed";
401
402
  }
402
- var me = "DialogTitleWarning", [tt, ge] = ye(me, {
403
+ var me = "DialogTitleWarning", [ot, ge] = ye(me, {
403
404
  contentName: A,
404
405
  titleName: G,
405
406
  docsSlug: "dialog"
@@ -418,18 +419,18 @@ For more information, see https://radix-ui.com/primitives/docs/components/${o.do
418
419
  const r = e.current?.getAttribute("aria-describedby");
419
420
  o && r && (document.getElementById(o) || console.warn(n));
420
421
  }, [n, e, o]), null;
421
- }, ot = oe, nt = re, rt = se, at = ie, st = ce, it = le, ct = de, ut = ve;
422
+ }, nt = oe, rt = re, at = se, st = ie, it = ce, ct = le, ut = de, lt = ve;
422
423
  export {
423
- st as C,
424
+ it as C,
424
425
  le as D,
425
- at as O,
426
- rt as P,
427
- ot as R,
428
- it as T,
429
- tt as W,
426
+ st as O,
427
+ at as P,
428
+ nt as R,
429
+ ct as T,
430
+ ot as W,
430
431
  se as a,
431
- ut as b,
432
- et as c,
433
- ct as d,
434
- nt as e
432
+ lt as b,
433
+ tt as c,
434
+ ut as d,
435
+ rt as e
435
436
  };
@@ -2,8 +2,9 @@ import * as l from "react";
2
2
  import { a as ce, c as le, b as _ } from "./index-BfXxHr_2.js";
3
3
  import { u as M } from "./index-DQH6odE9.js";
4
4
  import { u as de } from "./index-BdMNhZnh.js";
5
- import { a as ue, u as fe } from "./index-CZnD2QxM.js";
6
- import { P as T } from "./index-C9T9HQaa.js";
5
+ import { u as ue } from "./index-BZPx6jYI.js";
6
+ import { u as fe } from "./index-BAEWsOG1.js";
7
+ import { P as T } from "./index-BVRIAMfe.js";
7
8
  import { c as me } from "./index-Cvx4lqTq.js";
8
9
  import { jsx as g, jsxs as Se } from "react/jsx-runtime";
9
10
  function $(e, [t, n]) {
@@ -14,7 +15,7 @@ var j = ["PageUp", "PageDown"], X = ["ArrowUp", "ArrowDown", "ArrowLeft", "Arrow
14
15
  "from-right": ["Home", "PageDown", "ArrowDown", "ArrowRight"],
15
16
  "from-bottom": ["Home", "PageDown", "ArrowDown", "ArrowLeft"],
16
17
  "from-top": ["Home", "PageDown", "ArrowUp", "ArrowLeft"]
17
- }, C = "Slider", [N, pe, he] = me(C), [W, ze] = le(C, [
18
+ }, C = "Slider", [N, pe, he] = me(C), [W, He] = le(C, [
18
19
  he
19
20
  ]), [ge, V] = W(C), q = l.forwardRef(
20
21
  (e, t) => {
@@ -305,7 +306,7 @@ var O = "SliderThumb", oe = l.forwardRef(
305
306
  }
306
307
  ), be = l.forwardRef(
307
308
  (e, t) => {
308
- const { __scopeSlider: n, index: o, name: s, ...c } = e, r = V(O, n), a = Q(O, n), [u, w] = l.useState(null), p = M(t, (D) => w(D)), i = u ? r.form || !!u.closest("form") : !0, d = ue(u), v = r.values[o], y = v === void 0 ? 0 : ie(v, r.min, r.max), h = Pe(o, r.values.length), m = d?.[a.size], f = m ? De(m, y, a.direction) : 0;
309
+ const { __scopeSlider: n, index: o, name: s, ...c } = e, r = V(O, n), a = Q(O, n), [u, w] = l.useState(null), p = M(t, (D) => w(D)), i = u ? r.form || !!u.closest("form") : !0, d = fe(u), v = r.values[o], y = v === void 0 ? 0 : ie(v, r.min, r.max), h = Pe(o, r.values.length), m = d?.[a.size], f = m ? De(m, y, a.direction) : 0;
309
310
  return l.useEffect(() => {
310
311
  if (u)
311
312
  return r.thumbs.add(u), () => {
@@ -357,7 +358,7 @@ var O = "SliderThumb", oe = l.forwardRef(
357
358
  oe.displayName = O;
358
359
  var Re = "RadioBubbleInput", re = l.forwardRef(
359
360
  ({ __scopeSlider: e, value: t, ...n }, o) => {
360
- const s = l.useRef(null), c = M(s, o), r = fe(t);
361
+ const s = l.useRef(null), c = M(s, o), r = ue(t);
361
362
  return l.useEffect(() => {
362
363
  const a = s.current;
363
364
  if (!a) return;
@@ -422,10 +423,10 @@ function Ce(e, t) {
422
423
  const n = Math.pow(10, t);
423
424
  return Math.round(e * n) / n;
424
425
  }
425
- var He = q, Ne = te, Le = ne, Oe = oe;
426
+ var Ne = q, Le = te, Oe = ne, Ue = oe;
426
427
  export {
427
- He as R,
428
- Ne as T,
429
- Le as a,
430
- Oe as b
428
+ Ne as R,
429
+ Le as T,
430
+ Oe as a,
431
+ Ue as b
431
432
  };
@@ -1,5 +1,5 @@
1
1
  import * as i from "react";
2
- import { P as o } from "./index-C9T9HQaa.js";
2
+ import { P as o } from "./index-BVRIAMfe.js";
3
3
  import { jsx as t } from "react/jsx-runtime";
4
4
  var d = Object.freeze({
5
5
  // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
package/dist/index.d.ts CHANGED
@@ -1,7 +1,9 @@
1
1
  import { AlertDialogProps as AlertDialogProps_2 } from '@radix-ui/react-alert-dialog';
2
2
  import { ButtonHTMLAttributes } from 'react';
3
+ import { CellContext } from '@tanstack/react-table';
3
4
  import { CheckboxProps as CheckboxProps_2 } from '@radix-ui/react-checkbox';
4
5
  import { ClassProp } from 'class-variance-authority/types';
6
+ import { ColumnDef } from '@tanstack/react-table';
5
7
  import { ComponentRef } from 'react';
6
8
  import { Context } from 'react';
7
9
  import { DayPickerProps } from 'react-day-picker';
@@ -11,15 +13,23 @@ import { getAllTimezones } from 'countries-and-timezones';
11
13
  import { HTMLAttributes } from 'react';
12
14
  import { HtmlHTMLAttributes } from 'react';
13
15
  import { InputHTMLAttributes } from 'react';
16
+ import { JSX } from 'react/jsx-runtime';
17
+ import { JSX as JSX_2 } from 'react';
14
18
  import { PropsWithChildren } from 'react';
15
19
  import { ReactNode } from 'react';
16
20
  import * as ReactTabs from '@radix-ui/react-tabs';
17
21
  import { Ref } from 'react';
18
22
  import { RefAttributes } from 'react';
23
+ import { RowData as RowData_2 } from '@tanstack/react-table';
19
24
  import { SliderProps } from '@radix-ui/react-slider';
20
25
  import { TabsContentProps } from '@radix-ui/react-tabs';
21
26
  import { VariantProps } from 'class-variance-authority';
22
27
 
28
+ declare type Action<TData> = {
29
+ label: string;
30
+ onClick: (rowData: TData) => void;
31
+ };
32
+
23
33
  export declare const Alert: FC<AlertProps>;
24
34
 
25
35
  export declare const AlertDialog: FC<AlertDialogProps>;
@@ -198,11 +208,14 @@ export declare const Dropdown: FC<DropdownProps>;
198
208
 
199
209
  export declare const DropdownButton: FC<Props>;
200
210
 
201
- declare interface DropdownProps extends VariantProps<typeof dropdownVariants>, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
211
+ declare type DropdownProps = VariantProps<typeof dropdownVariants> & Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> & {
212
+ additionalOptions?: ReactNode[] | string[];
202
213
  className?: string;
203
214
  error?: string;
204
215
  helperText?: string;
216
+ highlightSearch?: boolean;
205
217
  iconClassName?: string;
218
+ inputClassName?: string;
206
219
  isLoading?: boolean;
207
220
  isRequired?: boolean;
208
221
  label?: string;
@@ -211,12 +224,13 @@ declare interface DropdownProps extends VariantProps<typeof dropdownVariants>, O
211
224
  listItemClassName?: string;
212
225
  options: Option_3[];
213
226
  searchable?: boolean;
227
+ showSearchIcon?: boolean;
214
228
  theme?: Theme;
215
229
  value?: string;
216
230
  wrapperClassName?: string;
217
231
  onBlur?: VoidFunction;
218
232
  onChange?: OnChangeFn;
219
- }
233
+ };
220
234
 
221
235
  declare const dropdownVariants: (props?: ({
222
236
  hasError?: boolean | null | undefined;
@@ -224,6 +238,12 @@ declare const dropdownVariants: (props?: ({
224
238
 
225
239
  export declare const Filter: FilterComponentProps;
226
240
 
241
+ declare type FilterAction = {
242
+ label: string;
243
+ onClick: () => void;
244
+ variant?: ButtonProps['variant'];
245
+ };
246
+
227
247
  declare type FilterComponentProps = FC<FilterProps> & {
228
248
  BadgeMultiSelect: FC<BadgeMultiSelectProps>;
229
249
  DateFilterDropdown: FC<DateFilterDropdownProps>;
@@ -320,6 +340,13 @@ declare interface ModalProps extends PropsWithChildren, VariantProps<typeof moda
320
340
 
321
341
  declare const modalVariants: (props?: ClassProp | undefined) => string;
322
342
 
343
+ declare type MultiSelectFilter = {
344
+ key: string;
345
+ label: string;
346
+ position?: 'right' | 'left';
347
+ options: OptionType[];
348
+ };
349
+
323
350
  export declare const Navigation: FC<NavigationProps> & NavigationChildrenProps;
324
351
 
325
352
  declare type NavigationChildrenProps = {
@@ -429,6 +456,12 @@ declare type Option_5 = {
429
456
  variant?: BadgeProps['variant'];
430
457
  };
431
458
 
459
+ declare type OptionType = {
460
+ id: string;
461
+ label: string;
462
+ variant?: 'info' | 'danger' | 'success' | 'default' | 'warning' | null;
463
+ };
464
+
432
465
  export declare const PieChart: FC<Props_2>;
433
466
 
434
467
  export declare const ProgressBar: FC<ProgressBarProps>;
@@ -535,6 +568,61 @@ declare type Props_2 = {
535
568
  subtitle?: string;
536
569
  });
537
570
 
571
+ declare type Props_3<TData extends RowData> = CellContext<TData, string> & {
572
+ value?: string;
573
+ };
574
+
575
+ declare type Props_4<TData extends RowData_2> = VariantProps<typeof virtualizeTableVariants> & {
576
+ id: string;
577
+ ariaLabel?: string;
578
+ columns: ColumnDef<TData, string>[];
579
+ data: TData[];
580
+ className?: string;
581
+ classNameHeaderActiveArrows?: string;
582
+ classNameHeaderArrows?: string;
583
+ classNameHeaderTable?: string;
584
+ classNameTable?: string;
585
+ classNameWrapperTable?: string;
586
+ fetchData: (params: Record<string, string | number | string[] | number[] | undefined>) => Promise<{
587
+ data: TData[];
588
+ totalItemsCount?: number;
589
+ }>;
590
+ } & ({
591
+ showPagination: true;
592
+ showTotalItems?: boolean;
593
+ showDropdownPagination?: boolean;
594
+ showDotPagination?: boolean;
595
+ showFormPagination?: boolean;
596
+ pageSizes?: number[] | string[];
597
+ totalItems: number;
598
+ } | {
599
+ showPagination?: false | undefined;
600
+ showTotalItems?: never;
601
+ showDropdownPagination?: never;
602
+ showDotPagination?: never;
603
+ showFormPagination?: never;
604
+ pageSizes?: never;
605
+ totalItems?: never;
606
+ }) & ({
607
+ filterSearchPlaceholder?: string;
608
+ multiSelectFilter?: MultiSelectFilter[];
609
+ showFilter: true;
610
+ showFilterInput?: boolean;
611
+ filterActions?: FilterAction[];
612
+ showResetButton?: boolean;
613
+ } | {
614
+ filterSearchPlaceholder?: never;
615
+ multiSelectFilter?: never;
616
+ showFilter?: false | undefined;
617
+ showFilterInput?: never;
618
+ filterActions?: FilterAction[];
619
+ showResetButton?: never;
620
+ });
621
+
622
+ declare type Props_5<TData extends RowData> = CellContext<TData, unknown> & {
623
+ actions: Action<TData>[];
624
+ };
625
+
538
626
  export declare const Radio: FC<RadioProps>;
539
627
 
540
628
  export declare const RadioCard: FC<RadioCardProps>;
@@ -610,11 +698,13 @@ declare interface RangeProps extends VariantProps<typeof rangeVariants> {
610
698
 
611
699
  declare const rangeVariants: (props?: ClassProp | undefined) => string;
612
700
 
613
- declare type ResetButtonProps = {
701
+ declare type ResetButtonProps = ButtonProps & {
614
702
  disabled?: boolean;
615
703
  onClick?: VoidFunction;
616
704
  };
617
705
 
706
+ declare type RowData = RowData_2;
707
+
618
708
  declare interface RowProps extends React.HTMLAttributes<HTMLTableRowElement>, PropsWithChildren, VariantProps<typeof rowVariants> {
619
709
  width?: string;
620
710
  isSelected?: boolean;
@@ -637,11 +727,12 @@ declare type SidebarChildrenProps = {
637
727
  };
638
728
 
639
729
  declare interface SidebarProps extends VariantProps<typeof wrapperSiderbarVariants>, PropsWithChildren {
640
- wrapperClassName?: string;
641
- minWith?: number;
642
- maxWith?: number;
643
730
  canResize?: boolean;
731
+ dividerClassName?: string;
732
+ maxWith?: number;
733
+ minWith?: number;
644
734
  theme?: Theme;
735
+ wrapperClassName?: string;
645
736
  }
646
737
 
647
738
  export declare const Slider: FC<SliderProps_2>;
@@ -829,6 +920,8 @@ declare const triggerVariants: (props?: ({
829
920
  variant?: "default" | "active" | "inactive" | null | undefined;
830
921
  } & ClassProp) | undefined) => string;
831
922
 
923
+ export declare const TruncateText: <TData>({ getValue, value }: Props_3<TData>) => JSX.Element;
924
+
832
925
  export declare const Typography: ForwardRefExoticComponent<Omit<TypographyProps, 'ref'> & RefAttributes<HTMLParagraphElement | HTMLHeadingElement>>;
833
926
 
834
927
  declare interface TypographyProps extends HTMLAttributes<ComponentRef<HeadingTag | 'p' | 'span'>>, VariantProps<typeof typographyVariants> {
@@ -846,6 +939,16 @@ export declare const useTheme: () => ThemeProps;
846
939
 
847
940
  export declare const useToggle: (initialState?: boolean) => [boolean, (value?: boolean) => void];
848
941
 
942
+ export declare const VirtualizedTable: VirtualizedTableCompound;
943
+
944
+ declare type VirtualizedTableCompound = (<TData extends RowData>(props: Props_4<TData>) => JSX_2.Element) & {
945
+ TruncateText: typeof TruncateText;
946
+ Actions: <TData extends RowData>(props: Props_5<TData>) => JSX_2.Element | null;
947
+ displayName?: string;
948
+ };
949
+
950
+ declare const virtualizeTableVariants: (props?: ClassProp | undefined) => string;
951
+
849
952
  declare const wrapperSiderbarVariants: (props?: ClassProp | undefined) => string;
850
953
 
851
954
  export { }
package/dist/index.js CHANGED
@@ -4,10 +4,10 @@ import { Autocomplete as x } from "./components/Autocomplete/Autocomplete.js";
4
4
  import { Badge as a } from "./components/Badge/Badge.js";
5
5
  import { Breadcrumb as d } from "./components/Breadcrumb/Breadcrumb.js";
6
6
  import { Button as n } from "./components/Button/Button.js";
7
- import { Card as T } from "./components/Card/Card.js";
7
+ import { Card as l } from "./components/Card/Card.js";
8
8
  import { Checkbox as c } from "./components/Checkbox/Checkbox.js";
9
- import { DatePicker as h } from "./components/Datepicker/DatePicker.js";
10
- import { Divider as D } from "./components/Divider/Divider.js";
9
+ import { DatePicker as b } from "./components/Datepicker/DatePicker.js";
10
+ import { Divider as C } from "./components/Divider/Divider.js";
11
11
  import { Dropdown as v } from "./components/Dropdown/Dropdown.js";
12
12
  import { DropdownButton as S } from "./components/DropdownButton/DropdownButton.js";
13
13
  import { Filter as P } from "./components/Filter/Filter.js";
@@ -15,12 +15,12 @@ import { BadgeMultiSelect as w } from "./components/Filter/components/BadgeDropd
15
15
  import { DateFilterDropdown as k } from "./components/Filter/components/DateFilterDropdown/DateFilterDropdown.js";
16
16
  import { Input as G } from "./components/Input/Input.js";
17
17
  import { Loading as M } from "./components/Loading/Loading.js";
18
- import { M as I } from "./Modal-V67Uz78z.js";
19
- import { NumberInput as j } from "./components/NumberInput/NumberInput.js";
20
- import { PieChart as z } from "./components/PieChart/PieChart.js";
21
- import { ProgressBar as H } from "./components/ProgressBar/ProgressBar.js";
22
- import { Radio as K } from "./components/Radio/Radio.js";
23
- import { RadioCard as U } from "./components/RadioCard/RadioCard.js";
18
+ import { M as I } from "./Modal-B8jrP02v.js";
19
+ import { NumberInput as O } from "./components/NumberInput/NumberInput.js";
20
+ import { PieChart as j } from "./components/PieChart/PieChart.js";
21
+ import { ProgressBar as E } from "./components/ProgressBar/ProgressBar.js";
22
+ import { Radio as J } from "./components/Radio/Radio.js";
23
+ import { RadioCard as Q } from "./components/RadioCard/RadioCard.js";
24
24
  import { RadioCardGroup as W } from "./components/RadioCardGroup/RadioCardGroup.js";
25
25
  import { RadioGroup as Y } from "./components/RadioGroup/RadioGroup.js";
26
26
  import { Range as _ } from "./components/Range/Range.js";
@@ -30,11 +30,11 @@ import { Navigation as po } from "./components/Sidebar/components/Navigation/Nav
30
30
  import { NavigationGroup as xo } from "./components/Sidebar/components/NavigationGroup/NavigationGroup.js";
31
31
  import { NavigationOption as ao } from "./components/Sidebar/components/NavigationOption/NavigationOption.js";
32
32
  import { NavigationSeparator as go } from "./components/Sidebar/components/NavigationSeparator/NavigationSeparator.js";
33
- import { Sidebar as lo } from "./components/Sidebar/Sidebar.js";
33
+ import { Sidebar as To } from "./components/Sidebar/Sidebar.js";
34
34
  import { Slider as uo } from "./components/Slider/Slider.js";
35
35
  import { Switch as so } from "./components/Switch/Switch.js";
36
- import { Table as Co } from "./components/Table/Table.js";
37
- import { Content as bo } from "./components/Tabs/components/Content.js";
36
+ import { Table as ho } from "./components/Table/Table.js";
37
+ import { Content as Do } from "./components/Tabs/components/Content.js";
38
38
  import { List as Bo } from "./components/Tabs/components/List.js";
39
39
  import { Tabs as No } from "./components/Tabs/Tabs.js";
40
40
  import { Trigger as Ro } from "./components/Tabs/components/Trigger.js";
@@ -42,13 +42,15 @@ import { Tag as Ao } from "./components/Tag/Tag.js";
42
42
  import { TagSelect as Fo } from "./components/TagSelect/TagSelect.js";
43
43
  import { TextArea as Lo } from "./components/TextArea/TextArea.js";
44
44
  import { TimePicker as yo } from "./components/TimePicker/TimePicker.js";
45
- import { Toast as Oo } from "./components/Toast/Toast.js";
46
- import { Tooltip as qo } from "./components/Tooltip/Tooltip.js";
47
- import { Typography as Eo } from "./components/Typography/Typography.js";
48
- import { ThemeContext as Jo } from "./contexts/theme.context.js";
49
- import { useTheme as Qo } from "./contexts/theme.hook.js";
50
- import { ThemeProvider as Vo } from "./contexts/theme.provider.js";
51
- import { useToggle as Xo } from "./hooks/useToggle.js";
45
+ import { Toast as zo } from "./components/Toast/Toast.js";
46
+ import { Tooltip as Vo } from "./components/Tooltip/Tooltip.js";
47
+ import { Typography as qo } from "./components/Typography/Typography.js";
48
+ import { TruncateText as Ho } from "./components/VirtualizedTable/components/TruncateText/TruncateText.js";
49
+ import { VirtualizedTable as Ko } from "./components/VirtualizedTable/VirtualizedTable.js";
50
+ import { ThemeContext as Uo } from "./contexts/theme.context.js";
51
+ import { useTheme as Xo } from "./contexts/theme.hook.js";
52
+ import { ThemeProvider as Zo } from "./contexts/theme.provider.js";
53
+ import { useToggle as $o } from "./hooks/useToggle.js";
52
54
  export {
53
55
  e as Alert,
54
56
  p as AlertDialog,
@@ -57,12 +59,12 @@ export {
57
59
  w as BadgeMultiSelect,
58
60
  d as Breadcrumb,
59
61
  n as Button,
60
- T as Card,
62
+ l as Card,
61
63
  c as Checkbox,
62
- bo as Content,
64
+ Do as Content,
63
65
  k as DateFilterDropdown,
64
- h as DatePicker,
65
- D as Divider,
66
+ b as DatePicker,
67
+ C as Divider,
66
68
  v as Dropdown,
67
69
  S as DropdownButton,
68
70
  P as Filter,
@@ -76,29 +78,31 @@ export {
76
78
  xo as NavigationGroup,
77
79
  ao as NavigationOption,
78
80
  go as NavigationSeparator,
79
- j as NumberInput,
80
- z as PieChart,
81
- H as ProgressBar,
82
- K as Radio,
83
- U as RadioCard,
81
+ O as NumberInput,
82
+ j as PieChart,
83
+ E as ProgressBar,
84
+ J as Radio,
85
+ Q as RadioCard,
84
86
  W as RadioCardGroup,
85
87
  Y as RadioGroup,
86
88
  _ as Range,
87
- lo as Sidebar,
89
+ To as Sidebar,
88
90
  uo as Slider,
89
91
  so as Switch,
90
- Co as Table,
92
+ ho as Table,
91
93
  No as Tabs,
92
94
  Ao as Tag,
93
95
  Fo as TagSelect,
94
96
  Lo as TextArea,
95
- Jo as ThemeContext,
96
- Vo as ThemeProvider,
97
+ Uo as ThemeContext,
98
+ Zo as ThemeProvider,
97
99
  yo as TimePicker,
98
- Oo as Toast,
99
- qo as Tooltip,
100
+ zo as Toast,
101
+ Vo as Tooltip,
100
102
  Ro as Trigger,
101
- Eo as Typography,
102
- Qo as useTheme,
103
- Xo as useToggle
103
+ Ho as TruncateText,
104
+ qo as Typography,
105
+ Ko as VirtualizedTable,
106
+ Xo as useTheme,
107
+ $o as useToggle
104
108
  };
package/dist/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@konstructio/ui",
3
3
  "description": "A set of reusable and customizable React components built for konstruct.io",
4
4
  "private": false,
5
- "version": "0.1.1-alpha.6",
5
+ "version": "0.1.2-alpha.9",
6
6
  "type": "module",
7
7
  "license": "MIT",
8
8
  "main": "dist/index.js",
@@ -63,22 +63,25 @@
63
63
  "@radix-ui/react-switch": "^1.2.6",
64
64
  "@radix-ui/react-tabs": "^1.1.13",
65
65
  "@radix-ui/react-toast": "^1.2.15",
66
+ "@radix-ui/react-tooltip": "^1.2.8",
66
67
  "@radix-ui/react-visually-hidden": "^1.2.3",
67
- "chart.js": "^4.5.0",
68
+ "@tanstack/react-table": "^8.21.3",
69
+ "chart.js": "^4.5.1",
68
70
  "class-variance-authority": "^0.7.1",
69
71
  "clsx": "^2.1.1",
70
72
  "cmdk": "^1.1.1",
71
73
  "countries-and-timezones": "^3.8.0",
72
74
  "js-cookie": "^3.0.5",
73
- "lucide-react": "^0.544.0",
75
+ "lucide-react": "^0.545.0",
74
76
  "react-chartjs-2": "^5.3.0",
75
- "react-day-picker": "^9.11.0",
77
+ "react-day-picker": "^9.11.1",
76
78
  "react-feather": "^2.0.10",
77
79
  "react-focus-lock": "^2.13.6",
78
80
  "react-remove-scroll": "^2.7.1",
79
81
  "tailwind-merge": "^3.3.1"
80
82
  },
81
83
  "peerDependencies": {
84
+ "@tanstack/react-query": "^5.90",
82
85
  "@types/react": "*",
83
86
  "@types/react-dom": "*",
84
87
  "react": "^16.8 || ^17.0 || ^18.0 || ^19.0",
@@ -104,32 +107,37 @@
104
107
  },
105
108
  "@types/react-router-dom": {
106
109
  "optional": true
110
+ },
111
+ "@tanstack/react-query": {
112
+ "optional": false
107
113
  }
108
114
  },
109
115
  "devDependencies": {
116
+ "@faker-js/faker": "^10.0.0",
110
117
  "@rollup/plugin-alias": "^5.1.1",
111
- "@storybook/addon-docs": "^9.1.7",
112
- "@storybook/addon-links": "^9.1.7",
113
- "@storybook/react-vite": "^9.1.7",
114
- "@tailwindcss/vite": "^4.1.13",
115
- "@testing-library/jest-dom": "^6.8.0",
118
+ "@storybook/addon-docs": "^9.1.10",
119
+ "@storybook/addon-links": "^9.1.10",
120
+ "@storybook/react-vite": "^9.1.10",
121
+ "@tailwindcss/vite": "^4.1.14",
122
+ "@tanstack/react-query": "^5.90.4",
123
+ "@testing-library/jest-dom": "^6.9.1",
116
124
  "@testing-library/react": "^16.3.0",
117
125
  "@testing-library/user-event": "^14.6.1",
118
126
  "@types/jest-axe": "^3.5.9",
119
127
  "@types/js-cookie": "^3.0.6",
120
128
  "@types/lodash": "^4.17.20",
121
- "@types/react": "^19.1.13",
122
- "@types/react-dom": "^19.1.9",
123
- "@typescript-eslint/eslint-plugin": "^8.44.0",
124
- "@typescript-eslint/parser": "^8.44.0",
125
- "@vitejs/plugin-react": "^5.0.3",
129
+ "@types/react": "^19.2.2",
130
+ "@types/react-dom": "^19.2.2",
131
+ "@typescript-eslint/eslint-plugin": "^8.46.1",
132
+ "@typescript-eslint/parser": "^8.46.1",
133
+ "@vitejs/plugin-react": "^5.0.4",
126
134
  "@vitest/coverage-v8": "^3.2.4",
127
135
  "autoprefixer": "^10.4.21",
128
- "eslint": "^9.36.0",
136
+ "eslint": "^9.37.0",
129
137
  "eslint-plugin-react": "^7.37.5",
130
- "eslint-plugin-react-hooks": "^5.2.0",
131
- "eslint-plugin-react-refresh": "^0.4.20",
132
- "eslint-plugin-storybook": "^9.1.7",
138
+ "eslint-plugin-react-hooks": "^6.1.1",
139
+ "eslint-plugin-react-refresh": "^0.4.23",
140
+ "eslint-plugin-storybook": "^9.1.10",
133
141
  "eslint-plugin-vitest": "^0.5.4",
134
142
  "glob": "^11.0.3",
135
143
  "husky": "^9.1.7",
@@ -139,11 +147,11 @@
139
147
  "postcss": "^8.5.6",
140
148
  "prettier": "^3.6.2",
141
149
  "rimraf": "^6.0.1",
142
- "storybook": "^9.1.7",
143
- "tailwindcss": "^4.1.13",
150
+ "storybook": "^9.1.10",
151
+ "tailwindcss": "^4.1.14",
144
152
  "ts-node": "^10.9.2",
145
- "typescript": "^5.9.2",
146
- "vite": "^7.1.7",
153
+ "typescript": "^5.9.3",
154
+ "vite": "^7.1.10",
147
155
  "vite-plugin-dts": "^4.5.4",
148
156
  "vite-plugin-lib-inject-css": "^2.2.2",
149
157
  "vite-plugin-svgr": "^4.5.0",