svelte-comp 1.3.3 → 1.3.6

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 (138) hide show
  1. package/LICENSE.md +21 -21
  2. package/README.md +101 -100
  3. package/dist/App.svelte +507 -507
  4. package/dist/Container.svelte +59 -59
  5. package/dist/app.css +234 -235
  6. package/dist/app.d.ts +10 -0
  7. package/dist/lib/Accordion.svelte +155 -155
  8. package/dist/lib/Badge.svelte +44 -44
  9. package/dist/lib/Button.svelte +185 -170
  10. package/dist/lib/Calendar.svelte +384 -384
  11. package/dist/lib/Card.svelte +103 -103
  12. package/dist/lib/Carousel.svelte +293 -293
  13. package/dist/lib/Carousel.svelte.d.ts +1 -1
  14. package/dist/lib/CheckBox.svelte +210 -210
  15. package/dist/lib/CodeView.svelte +308 -307
  16. package/dist/lib/ColorPicker.svelte +159 -159
  17. package/dist/lib/ContextMenu.svelte +328 -322
  18. package/dist/lib/DatePicker.svelte +246 -246
  19. package/dist/lib/Dialog.svelte +233 -233
  20. package/dist/lib/Field.svelte +299 -299
  21. package/dist/lib/FilePicker.svelte +295 -240
  22. package/dist/lib/FilePicker.svelte.d.ts +6 -1
  23. package/dist/lib/Form.svelte +438 -438
  24. package/dist/lib/Hamburger.svelte +217 -217
  25. package/dist/lib/InstallPWA.svelte +94 -94
  26. package/dist/lib/Menu.svelte +623 -623
  27. package/dist/lib/NoticeBase.svelte +140 -140
  28. package/dist/lib/PaginatedCard.svelte +73 -73
  29. package/dist/lib/Pagination.svelte +119 -119
  30. package/dist/lib/PrimaryColorSelect.svelte +111 -111
  31. package/dist/lib/ProgressBar.svelte +141 -141
  32. package/dist/lib/ProgressCircle.svelte +190 -190
  33. package/dist/lib/Radio.svelte +189 -189
  34. package/dist/lib/SearchInput.svelte +104 -104
  35. package/dist/lib/Select.svelte +524 -524
  36. package/dist/lib/Slider.svelte +253 -253
  37. package/dist/lib/Splitter.svelte +159 -150
  38. package/dist/lib/Switch.svelte +168 -167
  39. package/dist/lib/Table.svelte +299 -299
  40. package/dist/lib/Tabs.svelte +213 -213
  41. package/dist/lib/ThemeToggle.svelte +128 -127
  42. package/dist/lib/TimePicker.svelte +312 -312
  43. package/dist/lib/TimePickerNew.svelte +634 -0
  44. package/dist/lib/TimePickerNew.svelte.d.ts +49 -0
  45. package/dist/lib/Toast.svelte +123 -123
  46. package/dist/lib/Tooltip.svelte +110 -110
  47. package/dist/lib/Topbar.svelte +107 -107
  48. package/dist/lib/__tests__/Accordion.test.d.ts +1 -0
  49. package/dist/lib/__tests__/Accordion.test.js +171 -0
  50. package/dist/lib/__tests__/Badge.test.d.ts +1 -0
  51. package/dist/lib/__tests__/Badge.test.js +41 -0
  52. package/dist/lib/__tests__/Button.test.d.ts +1 -0
  53. package/dist/lib/__tests__/Button.test.js +269 -0
  54. package/dist/lib/__tests__/Calendar.test.d.ts +1 -0
  55. package/dist/lib/__tests__/Calendar.test.js +171 -0
  56. package/dist/lib/__tests__/Card.test.d.ts +1 -0
  57. package/dist/lib/__tests__/Card.test.js +148 -0
  58. package/dist/lib/__tests__/Carousel.test.d.ts +1 -0
  59. package/dist/lib/__tests__/Carousel.test.js +439 -0
  60. package/dist/lib/__tests__/CheckBox.test.d.ts +1 -0
  61. package/dist/lib/__tests__/CheckBox.test.js +152 -0
  62. package/dist/lib/__tests__/CodeView.test.d.ts +1 -0
  63. package/dist/lib/__tests__/CodeView.test.js +157 -0
  64. package/dist/lib/__tests__/ColorPicker.test.d.ts +1 -0
  65. package/dist/lib/__tests__/ColorPicker.test.js +93 -0
  66. package/dist/lib/__tests__/ContextMenu.test.d.ts +1 -0
  67. package/dist/lib/__tests__/ContextMenu.test.js +67 -0
  68. package/dist/lib/__tests__/DatePicker.test.d.ts +1 -0
  69. package/dist/lib/__tests__/DatePicker.test.js +108 -0
  70. package/dist/lib/__tests__/Dialog.test.d.ts +1 -0
  71. package/dist/lib/__tests__/Dialog.test.js +183 -0
  72. package/dist/lib/__tests__/Field.test.d.ts +1 -0
  73. package/dist/lib/__tests__/Field.test.js +190 -0
  74. package/dist/lib/__tests__/FilePicker.test.d.ts +1 -0
  75. package/dist/lib/__tests__/FilePicker.test.js +179 -0
  76. package/dist/lib/__tests__/Form.integration.test.d.ts +1 -0
  77. package/dist/lib/__tests__/Form.integration.test.js +158 -0
  78. package/dist/lib/__tests__/Form.test.d.ts +1 -0
  79. package/dist/lib/__tests__/Form.test.js +463 -0
  80. package/dist/lib/__tests__/Hamburger.test.d.ts +1 -0
  81. package/dist/lib/__tests__/Hamburger.test.js +161 -0
  82. package/dist/lib/__tests__/InstallPWA.test.d.ts +1 -0
  83. package/dist/lib/__tests__/InstallPWA.test.js +15 -0
  84. package/dist/lib/__tests__/Menu.test.d.ts +1 -0
  85. package/dist/lib/__tests__/Menu.test.js +285 -0
  86. package/dist/lib/__tests__/NoticeBase.test.d.ts +1 -0
  87. package/dist/lib/__tests__/NoticeBase.test.js +60 -0
  88. package/dist/lib/__tests__/PaginatedCard.test.d.ts +1 -0
  89. package/dist/lib/__tests__/PaginatedCard.test.js +89 -0
  90. package/dist/lib/__tests__/Pagination.test.d.ts +1 -0
  91. package/dist/lib/__tests__/Pagination.test.js +168 -0
  92. package/dist/lib/__tests__/PrimaryColorSelect.test.d.ts +1 -0
  93. package/dist/lib/__tests__/PrimaryColorSelect.test.js +92 -0
  94. package/dist/lib/__tests__/ProgressBar.test.d.ts +1 -0
  95. package/dist/lib/__tests__/ProgressBar.test.js +69 -0
  96. package/dist/lib/__tests__/ProgressCircle.test.d.ts +1 -0
  97. package/dist/lib/__tests__/ProgressCircle.test.js +71 -0
  98. package/dist/lib/__tests__/Radio.test.d.ts +1 -0
  99. package/dist/lib/__tests__/Radio.test.js +127 -0
  100. package/dist/lib/__tests__/SearchInput.test.d.ts +1 -0
  101. package/dist/lib/__tests__/SearchInput.test.js +80 -0
  102. package/dist/lib/__tests__/Select.test.d.ts +1 -0
  103. package/dist/lib/__tests__/Select.test.js +408 -0
  104. package/dist/lib/__tests__/Slider.test.d.ts +1 -0
  105. package/dist/lib/__tests__/Slider.test.js +213 -0
  106. package/dist/lib/__tests__/Splitter.test.d.ts +1 -0
  107. package/dist/lib/__tests__/Splitter.test.js +87 -0
  108. package/dist/lib/__tests__/Switch.test.d.ts +1 -0
  109. package/dist/lib/__tests__/Switch.test.js +97 -0
  110. package/dist/lib/__tests__/Table.test.d.ts +1 -0
  111. package/dist/lib/__tests__/Table.test.js +349 -0
  112. package/dist/lib/__tests__/Tabs.test.d.ts +1 -0
  113. package/dist/lib/__tests__/Tabs.test.js +262 -0
  114. package/dist/lib/__tests__/ThemeToggle.test.d.ts +1 -0
  115. package/dist/lib/__tests__/ThemeToggle.test.js +84 -0
  116. package/dist/lib/__tests__/TimePicker.test.d.ts +1 -0
  117. package/dist/lib/__tests__/TimePicker.test.js +146 -0
  118. package/dist/lib/__tests__/TimePickerNew.test.d.ts +1 -0
  119. package/dist/lib/__tests__/TimePickerNew.test.js +322 -0
  120. package/dist/lib/__tests__/Toast.test.d.ts +1 -0
  121. package/dist/lib/__tests__/Toast.test.js +135 -0
  122. package/dist/lib/__tests__/Tooltip.test.d.ts +1 -0
  123. package/dist/lib/__tests__/Tooltip.test.js +171 -0
  124. package/dist/lib/__tests__/Topbar.test.d.ts +1 -0
  125. package/dist/lib/__tests__/Topbar.test.js +25 -0
  126. package/dist/lib/__tests__/setupLangContext.d.ts +1 -0
  127. package/dist/lib/__tests__/setupLangContext.js +65 -0
  128. package/dist/lib/__tests__/storage.test.d.ts +1 -0
  129. package/dist/lib/__tests__/storage.test.js +124 -0
  130. package/dist/lib/__tests__/utils.test.d.ts +1 -0
  131. package/dist/lib/__tests__/utils.test.js +11 -0
  132. package/dist/lib/index.d.ts +1 -0
  133. package/dist/lib/index.js +1 -0
  134. package/dist/lib/lang.d.ts +4 -0
  135. package/dist/lib/lang.js +4 -0
  136. package/dist/styles.css +234 -232
  137. package/dist/utils/index.js +15 -4
  138. package/package.json +52 -52
@@ -0,0 +1,87 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ var __generator = (this && this.__generator) || function (thisArg, body) {
11
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
12
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
13
+ function verb(n) { return function (v) { return step([n, v]); }; }
14
+ function step(op) {
15
+ if (f) throw new TypeError("Generator is already executing.");
16
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
17
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
18
+ if (y = 0, t) op = [op[0] & 2, t.value];
19
+ switch (op[0]) {
20
+ case 0: case 1: t = op; break;
21
+ case 4: _.label++; return { value: op[1], done: false };
22
+ case 5: _.label++; y = op[1]; op = [0]; continue;
23
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
24
+ default:
25
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
26
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
27
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
28
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
29
+ if (t[2]) _.ops.pop();
30
+ _.trys.pop(); continue;
31
+ }
32
+ op = body.call(thisArg, _);
33
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
34
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
35
+ }
36
+ };
37
+ // $lib/__tests__/Splitter.test.ts
38
+ import { render, fireEvent } from "@testing-library/svelte";
39
+ import { describe, it, expect } from "vitest";
40
+ import Splitter from "../Splitter.svelte";
41
+ describe("Splitter", function () {
42
+ it("renders horizontal layout by default", function () {
43
+ var container = render(Splitter).container;
44
+ var root = container.firstElementChild;
45
+ expect(root.className).toContain("flex");
46
+ var firstPanel = root.children[0];
47
+ expect(firstPanel.style.width).toBe("30%");
48
+ });
49
+ it("renders vertical layout when direction is vertical", function () {
50
+ var container = render(Splitter, {
51
+ props: { direction: "vertical", initialSize: 40 },
52
+ }).container;
53
+ var root = container.firstElementChild;
54
+ expect(root.className).toContain("flex-col");
55
+ var firstPanel = root.children[0];
56
+ expect(firstPanel.style.height).toBe("40%");
57
+ });
58
+ it("resizes when dragging the divider", function () { return __awaiter(void 0, void 0, void 0, function () {
59
+ var container, root, firstPanel, divider;
60
+ return __generator(this, function (_a) {
61
+ switch (_a.label) {
62
+ case 0:
63
+ container = render(Splitter, {
64
+ props: { initialSize: 30 },
65
+ }).container;
66
+ root = container.firstElementChild;
67
+ Object.defineProperty(root, "offsetWidth", {
68
+ value: 200,
69
+ configurable: true,
70
+ });
71
+ firstPanel = root.children[0];
72
+ divider = root.children[1];
73
+ return [4 /*yield*/, fireEvent.pointerDown(divider, { clientX: 0 })];
74
+ case 1:
75
+ _a.sent();
76
+ return [4 /*yield*/, fireEvent.pointerMove(document, { clientX: 20 })];
77
+ case 2:
78
+ _a.sent();
79
+ return [4 /*yield*/, fireEvent.pointerUp(document)];
80
+ case 3:
81
+ _a.sent();
82
+ expect(parseFloat(firstPanel.style.width)).toBeCloseTo(40, 1);
83
+ return [2 /*return*/];
84
+ }
85
+ });
86
+ }); });
87
+ });
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,97 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ var __generator = (this && this.__generator) || function (thisArg, body) {
11
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
12
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
13
+ function verb(n) { return function (v) { return step([n, v]); }; }
14
+ function step(op) {
15
+ if (f) throw new TypeError("Generator is already executing.");
16
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
17
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
18
+ if (y = 0, t) op = [op[0] & 2, t.value];
19
+ switch (op[0]) {
20
+ case 0: case 1: t = op; break;
21
+ case 4: _.label++; return { value: op[1], done: false };
22
+ case 5: _.label++; y = op[1]; op = [0]; continue;
23
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
24
+ default:
25
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
26
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
27
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
28
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
29
+ if (t[2]) _.ops.pop();
30
+ _.trys.pop(); continue;
31
+ }
32
+ op = body.call(thisArg, _);
33
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
34
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
35
+ }
36
+ };
37
+ // $lib/__tests__/Switch.test.ts
38
+ import { render, fireEvent } from "@testing-library/svelte";
39
+ import { describe, it, expect, vi } from "vitest";
40
+ import Switch from "../Switch.svelte";
41
+ describe("Switch", function () {
42
+ it("toggles state when clicked", function () { return __awaiter(void 0, void 0, void 0, function () {
43
+ var container, switchButton;
44
+ return __generator(this, function (_a) {
45
+ switch (_a.label) {
46
+ case 0:
47
+ container = render(Switch).container;
48
+ switchButton = container.querySelector("button");
49
+ expect(switchButton.getAttribute("aria-pressed")).toBe("false");
50
+ return [4 /*yield*/, fireEvent.click(switchButton)];
51
+ case 1:
52
+ _a.sent();
53
+ expect(switchButton.getAttribute("aria-pressed")).toBe("true");
54
+ return [2 /*return*/];
55
+ }
56
+ });
57
+ }); });
58
+ it("respects initial checked state", function () {
59
+ var container = render(Switch, {
60
+ props: { checked: true },
61
+ }).container;
62
+ var switchButton = container.querySelector("button");
63
+ expect(switchButton.getAttribute("aria-pressed")).toBe("true");
64
+ });
65
+ it("handles disabled state", function () {
66
+ var container = render(Switch, {
67
+ props: { disabled: true },
68
+ }).container;
69
+ var switchButton = container.querySelector("button");
70
+ expect(switchButton.disabled).toBe(true);
71
+ });
72
+ it("calls onChange when toggled", function () { return __awaiter(void 0, void 0, void 0, function () {
73
+ var mockOnChange, container, switchButton;
74
+ return __generator(this, function (_a) {
75
+ switch (_a.label) {
76
+ case 0:
77
+ mockOnChange = vi.fn();
78
+ container = render(Switch, {
79
+ props: { onChange: mockOnChange },
80
+ }).container;
81
+ switchButton = container.querySelector("button");
82
+ return [4 /*yield*/, fireEvent.click(switchButton)];
83
+ case 1:
84
+ _a.sent();
85
+ expect(mockOnChange).toHaveBeenCalledWith(true);
86
+ return [2 /*return*/];
87
+ }
88
+ });
89
+ }); });
90
+ it("applies correct size classes", function () {
91
+ var container = render(Switch, {
92
+ props: { sz: "lg" },
93
+ }).container;
94
+ var switchButton = container.querySelector("button");
95
+ expect(switchButton === null || switchButton === void 0 ? void 0 : switchButton.className).toContain("w-14");
96
+ });
97
+ });
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,349 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ var __generator = (this && this.__generator) || function (thisArg, body) {
11
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
12
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
13
+ function verb(n) { return function (v) { return step([n, v]); }; }
14
+ function step(op) {
15
+ if (f) throw new TypeError("Generator is already executing.");
16
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
17
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
18
+ if (y = 0, t) op = [op[0] & 2, t.value];
19
+ switch (op[0]) {
20
+ case 0: case 1: t = op; break;
21
+ case 4: _.label++; return { value: op[1], done: false };
22
+ case 5: _.label++; y = op[1]; op = [0]; continue;
23
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
24
+ default:
25
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
26
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
27
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
28
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
29
+ if (t[2]) _.ops.pop();
30
+ _.trys.pop(); continue;
31
+ }
32
+ op = body.call(thisArg, _);
33
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
34
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
35
+ }
36
+ };
37
+ // src/lib/__tests__/Table.test.ts
38
+ import { render, fireEvent } from "@testing-library/svelte";
39
+ import { describe, it, expect, vi } from "vitest";
40
+ import Table from "../Table.svelte";
41
+ var baseColumns = [
42
+ { key: "name", label: "Name" },
43
+ { key: "age", label: "Age" },
44
+ ];
45
+ var simpleRows = [
46
+ { name: "Ada", age: 30 },
47
+ { name: "Linus", age: 40 },
48
+ ];
49
+ var complexRows = [
50
+ { name: "Ada", age: 30, email: "ada@example.com" },
51
+ { name: "Linus", age: 40, email: "linus@example.com" },
52
+ { name: "Grace", age: 35, email: "grace@example.com" },
53
+ { name: "Alan", age: 25, email: "alan@example.com" },
54
+ ];
55
+ describe("Table", function () {
56
+ it("renders headers and rows with data", function () {
57
+ var _a = render(Table, {
58
+ props: { columns: baseColumns, rows: simpleRows },
59
+ }), getByText = _a.getByText, container = _a.container;
60
+ expect(getByText("Name")).toBeTruthy();
61
+ expect(getByText("Age")).toBeTruthy();
62
+ var bodyRows = container.querySelectorAll("tbody tr");
63
+ expect(bodyRows.length).toBe(2);
64
+ var firstRowCells = bodyRows[0].querySelectorAll("td");
65
+ expect(firstRowCells[0].textContent).toBe("Ada");
66
+ expect(firstRowCells[1].textContent).toBe("30");
67
+ });
68
+ it("handles empty rows array", function () {
69
+ var container = render(Table, {
70
+ props: { columns: baseColumns, rows: [] },
71
+ }).container;
72
+ var bodyRows = container.querySelectorAll("tbody tr");
73
+ expect(bodyRows.length).toBe(0);
74
+ });
75
+ it("handles empty columns array", function () {
76
+ var container = render(Table, {
77
+ props: { columns: [], rows: simpleRows },
78
+ }).container;
79
+ var headers = container.querySelectorAll("thead th");
80
+ var cells = container.querySelectorAll("tbody td");
81
+ expect(headers.length).toBe(0);
82
+ expect(cells.length).toBe(0);
83
+ });
84
+ it("applies alignment and width for columns", function () {
85
+ var columns = [
86
+ { key: "name", label: "Name", align: "start", width: "200px" },
87
+ { key: "age", label: "Age", align: "end", width: "80px" },
88
+ ];
89
+ var container = render(Table, {
90
+ props: { columns: columns, rows: simpleRows },
91
+ }).container;
92
+ var headers = container.querySelectorAll("thead th");
93
+ expect(headers[0].className).toContain("text-left");
94
+ expect(headers[1].className).toContain("text-right");
95
+ expect(headers[0].getAttribute("style")).toContain("width: 200px");
96
+ expect(headers[1].getAttribute("style")).toContain("width: 80px");
97
+ });
98
+ it("wraps table in responsive overflow container", function () {
99
+ var container = render(Table, {
100
+ props: { columns: baseColumns, rows: simpleRows },
101
+ }).container;
102
+ var wrapper = container.firstElementChild;
103
+ expect(wrapper.className).toContain("overflow-x-auto");
104
+ });
105
+ it("renders sticky header when stickyHeader=true", function () {
106
+ var container = render(Table, {
107
+ props: { columns: baseColumns, rows: simpleRows, stickyHeader: true },
108
+ }).container;
109
+ var headerRow = container.querySelector("thead tr");
110
+ expect(headerRow === null || headerRow === void 0 ? void 0 : headerRow.className).toContain("sticky");
111
+ });
112
+ it("hides header row for list variant", function () {
113
+ var container = render(Table, {
114
+ props: { columns: baseColumns, rows: simpleRows, variant: "list" },
115
+ }).container;
116
+ var headerRow = container.querySelector("thead tr");
117
+ var headers = container.querySelectorAll("thead th");
118
+ expect(headerRow).toBeNull();
119
+ expect(headers.length).toBe(0);
120
+ });
121
+ // ---------- SORTING: NUMBERS ----------
122
+ it("sorts numeric column ascending on first click", function () { return __awaiter(void 0, void 0, void 0, function () {
123
+ var numericRows, _a, getByLabelText, container, ageHeaderButton, bodyRows, ages;
124
+ return __generator(this, function (_b) {
125
+ switch (_b.label) {
126
+ case 0:
127
+ numericRows = [
128
+ { name: "A", age: 10 },
129
+ { name: "B", age: 5 },
130
+ { name: "C", age: 20 },
131
+ ];
132
+ _a = render(Table, {
133
+ props: { columns: baseColumns, rows: numericRows },
134
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
135
+ ageHeaderButton = getByLabelText("Sort by Age");
136
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
137
+ case 1:
138
+ _b.sent();
139
+ bodyRows = container.querySelectorAll("tbody tr");
140
+ ages = Array.from(bodyRows).map(function (row) { return row.querySelectorAll("td")[1].textContent; });
141
+ expect(ages).toEqual(["5", "10", "20"]);
142
+ return [2 /*return*/];
143
+ }
144
+ });
145
+ }); });
146
+ it("sorts numeric column descending on second click", function () { return __awaiter(void 0, void 0, void 0, function () {
147
+ var numericRows, _a, getByLabelText, container, ageHeaderButton, bodyRows, ages;
148
+ return __generator(this, function (_b) {
149
+ switch (_b.label) {
150
+ case 0:
151
+ numericRows = [
152
+ { name: "A", age: 10 },
153
+ { name: "B", age: 5 },
154
+ { name: "C", age: 20 },
155
+ ];
156
+ _a = render(Table, {
157
+ props: { columns: baseColumns, rows: numericRows },
158
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
159
+ ageHeaderButton = getByLabelText("Sort by Age");
160
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
161
+ case 1:
162
+ _b.sent();
163
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
164
+ case 2:
165
+ _b.sent();
166
+ bodyRows = container.querySelectorAll("tbody tr");
167
+ ages = Array.from(bodyRows).map(function (row) { return row.querySelectorAll("td")[1].textContent; });
168
+ expect(ages).toEqual(["20", "10", "5"]);
169
+ return [2 /*return*/];
170
+ }
171
+ });
172
+ }); });
173
+ it("places null/empty values at the bottom when sorting ascending", function () { return __awaiter(void 0, void 0, void 0, function () {
174
+ var rowsWithNulls, _a, getByLabelText, container, ageHeaderButton, bodyRows, names;
175
+ return __generator(this, function (_b) {
176
+ switch (_b.label) {
177
+ case 0:
178
+ rowsWithNulls = [
179
+ { name: "Ada", age: null },
180
+ { name: "Linus", age: 40 },
181
+ { name: "Grace", age: 35 },
182
+ ];
183
+ _a = render(Table, {
184
+ props: { columns: baseColumns, rows: rowsWithNulls },
185
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
186
+ ageHeaderButton = getByLabelText("Sort by Age");
187
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
188
+ case 1:
189
+ _b.sent();
190
+ bodyRows = container.querySelectorAll("tbody tr");
191
+ names = Array.from(bodyRows).map(function (row) { return row.querySelectorAll("td")[0].textContent; });
192
+ expect(names[names.length - 1]).toBe("Ada");
193
+ return [2 /*return*/];
194
+ }
195
+ });
196
+ }); });
197
+ it("keeps equal numeric values stable (stable sort)", function () { return __awaiter(void 0, void 0, void 0, function () {
198
+ var rowsWithDuplicates, _a, getByLabelText, container, ageHeaderButton, bodyRows, names;
199
+ return __generator(this, function (_b) {
200
+ switch (_b.label) {
201
+ case 0:
202
+ rowsWithDuplicates = [
203
+ { name: "First", age: 30 },
204
+ { name: "Second", age: 30 },
205
+ { name: "Third", age: 40 },
206
+ ];
207
+ _a = render(Table, {
208
+ props: { columns: baseColumns, rows: rowsWithDuplicates },
209
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
210
+ ageHeaderButton = getByLabelText("Sort by Age");
211
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
212
+ case 1:
213
+ _b.sent();
214
+ bodyRows = container.querySelectorAll("tbody tr");
215
+ names = Array.from(bodyRows).map(function (row) { return row.querySelectorAll("td")[0].textContent; });
216
+ expect(names.slice(0, 2)).toEqual(["First", "Second"]);
217
+ return [2 /*return*/];
218
+ }
219
+ });
220
+ }); });
221
+ // ---------- SORTING: LINES ----------
222
+ it("sorts string column ascending by name", function () { return __awaiter(void 0, void 0, void 0, function () {
223
+ var stringRows, _a, getByLabelText, container, nameHeaderButton, bodyRows, names;
224
+ return __generator(this, function (_b) {
225
+ switch (_b.label) {
226
+ case 0:
227
+ stringRows = [
228
+ { name: "Charlie", age: 30 },
229
+ { name: "Alice", age: 25 },
230
+ { name: "Bob", age: 35 },
231
+ ];
232
+ _a = render(Table, {
233
+ props: { columns: baseColumns, rows: stringRows },
234
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
235
+ nameHeaderButton = getByLabelText("Sort by Name");
236
+ return [4 /*yield*/, fireEvent.click(nameHeaderButton)];
237
+ case 1:
238
+ _b.sent();
239
+ bodyRows = container.querySelectorAll("tbody tr");
240
+ names = Array.from(bodyRows).map(function (row) { return row.querySelectorAll("td")[0].textContent; });
241
+ expect(names).toEqual(["Alice", "Bob", "Charlie"]);
242
+ return [2 /*return*/];
243
+ }
244
+ });
245
+ }); });
246
+ // ---------- ARIA-SORT & KEYBOARD ----------
247
+ it("updates aria-sort on sortable headers when sorting", function () { return __awaiter(void 0, void 0, void 0, function () {
248
+ var _a, getByLabelText, container, ageHeaderButton, ageTh;
249
+ return __generator(this, function (_b) {
250
+ switch (_b.label) {
251
+ case 0:
252
+ _a = render(Table, {
253
+ props: { columns: baseColumns, rows: complexRows },
254
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
255
+ ageHeaderButton = getByLabelText("Sort by Age");
256
+ ageTh = container.querySelector('th[aria-sort="none"]');
257
+ expect(ageTh).toBeTruthy();
258
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
259
+ case 1:
260
+ _b.sent();
261
+ ageTh = container.querySelector('th[aria-sort="ascending"]');
262
+ expect(ageTh).toBeTruthy();
263
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
264
+ case 2:
265
+ _b.sent();
266
+ ageTh = container.querySelector('th[aria-sort="descending"]');
267
+ expect(ageTh).toBeTruthy();
268
+ return [2 /*return*/];
269
+ }
270
+ });
271
+ }); });
272
+ it("supports keyboard sorting via Enter and Space", function () { return __awaiter(void 0, void 0, void 0, function () {
273
+ var _a, getByLabelText, container, nameHeaderButton, nameTh;
274
+ return __generator(this, function (_b) {
275
+ switch (_b.label) {
276
+ case 0:
277
+ _a = render(Table, {
278
+ props: { columns: baseColumns, rows: complexRows },
279
+ }), getByLabelText = _a.getByLabelText, container = _a.container;
280
+ nameHeaderButton = getByLabelText("Sort by Name");
281
+ return [4 /*yield*/, fireEvent.keyDown(nameHeaderButton, { key: "Enter" })];
282
+ case 1:
283
+ _b.sent();
284
+ nameTh = container.querySelector('th[aria-sort="ascending"]');
285
+ expect(nameTh).toBeTruthy();
286
+ return [4 /*yield*/, fireEvent.keyDown(nameHeaderButton, { key: " " })];
287
+ case 2:
288
+ _b.sent();
289
+ nameTh = container.querySelector('th[aria-sort="descending"]');
290
+ expect(nameTh).toBeTruthy();
291
+ return [2 /*return*/];
292
+ }
293
+ });
294
+ }); });
295
+ it("preserves sort state after rerender with new rows", function () { return __awaiter(void 0, void 0, void 0, function () {
296
+ var rows1, rows2, _a, getByLabelText, container, rerender, ageHeaderButton, bodyRows, ages;
297
+ return __generator(this, function (_b) {
298
+ switch (_b.label) {
299
+ case 0:
300
+ rows1 = [
301
+ { name: "Ada", age: 30 },
302
+ { name: "Linus", age: 40 },
303
+ { name: "Alan", age: 25 },
304
+ ];
305
+ rows2 = [
306
+ { name: "Alan", age: 25 },
307
+ { name: "Linus", age: 40 },
308
+ { name: "Ada", age: 30 },
309
+ ];
310
+ _a = render(Table, {
311
+ props: { columns: baseColumns, rows: rows1 },
312
+ }), getByLabelText = _a.getByLabelText, container = _a.container, rerender = _a.rerender;
313
+ ageHeaderButton = getByLabelText("Sort by Age");
314
+ return [4 /*yield*/, fireEvent.click(ageHeaderButton)];
315
+ case 1:
316
+ _b.sent(); // sort asc
317
+ return [4 /*yield*/, rerender({ columns: baseColumns, rows: rows2 })];
318
+ case 2:
319
+ _b.sent();
320
+ bodyRows = container.querySelectorAll("tbody tr");
321
+ ages = Array.from(bodyRows).map(function (row) { return row.querySelectorAll("td")[1].textContent; });
322
+ expect(ages).toEqual(["25", "30", "40"]);
323
+ return [2 /*return*/];
324
+ }
325
+ });
326
+ }); });
327
+ // ---------- PAGINATION ----------
328
+ it("renders pagination section when pagination prop is provided", function () {
329
+ var pagination = {
330
+ currentPage: 1,
331
+ totalPages: 3,
332
+ onPageChange: vi.fn(),
333
+ };
334
+ var container = render(Table, {
335
+ props: { columns: baseColumns, rows: complexRows, pagination: pagination },
336
+ }).container;
337
+ var table = container.querySelector("table");
338
+ var paginationWrapper = table.nextElementSibling;
339
+ expect(paginationWrapper).toBeTruthy();
340
+ });
341
+ // ---------- OTHER ----------
342
+ it("applies custom class to wrapper", function () {
343
+ var container = render(Table, {
344
+ props: { columns: baseColumns, rows: simpleRows, class: "custom-table" },
345
+ }).container;
346
+ var wrapper = container.firstElementChild;
347
+ expect(wrapper.className).toContain("custom-table");
348
+ });
349
+ });
@@ -0,0 +1 @@
1
+ export {};