@studio-west/component-sw 0.12.12 → 0.12.13

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.
package/README.md CHANGED
@@ -280,9 +280,9 @@ model - индекс активной кнопки.
280
280
 
281
281
  ### Свойства / Properties
282
282
 
283
- | Имя | Тип | По умолчанию | Значения/Описание |
284
- |----------|-----------|--------------|----------------------------------------------------------------------|
285
- | `visual` | `Boolean` | `true` | Видимость |
283
+ | Имя | Тип | По умолчанию | Значения/Описание |
284
+ |----------|-----------|--------------|-------------------|
285
+ | `visual` | `Boolean` | `true` | Видимость |
286
286
 
287
287
  ### Слоты / Slots
288
288
 
@@ -1052,28 +1052,71 @@ model - состояние чекбокса (checked ) булевое знач
1052
1052
 
1053
1053
  ## SwTable
1054
1054
 
1055
- Компонент `SwTable` представляет собой динамическую таблицу с поддержкой сложных заголовков, объединения ячеек и кастомизации содержимого через слоты.
1055
+ Компонент `SwTable` динамическая таблица с вложенными заголовками, объединением ячеек (`rowspan` / `colspan`), кастомизацией через слоты, подсветкой строк и столбцов при наведении, изменением ширины колонок и фиксацией крайних колонок при горизонтальном скролле.
1056
1056
 
1057
- ### Свойства / Properties
1057
+ The `SwTable` component is a dynamic table with nested headers, cell merging (`rowspan` / `colspan`), slot-based customization, row and column hover highlighting, column resizing, and sticky edge columns during horizontal scroll.
1058
+
1059
+ Колонки описываются дочерним компонентом `SwTableColumn`. / Columns are defined with the child `SwTableColumn` component.
1060
+
1061
+ ### Свойства SwTable / SwTable Properties
1062
+
1063
+ | Имя / Name | Тип / Type | По умолчанию / Default | Значения/Описание / Values & Description |
1064
+ |-------------|---------------------|------------------------|--------------------------------------------------------------------------------------------------------|
1065
+ | `data` | `Array` | `required` | Данные таблицы — массив объектов. / Table data — an array of row objects. |
1066
+ | `resizable` | `Boolean` | `true` | Разрешить изменение ширины колонок перетаскиванием края заголовка. / Allow resizing leaf columns by dragging the header edge. |
1067
+ | `maxWidth` | `String` \| `Number`| — | Максимальная ширина контейнера таблицы. При переполнении — горизонтальный скролл и активация `fixed`-колонок. / Max table container width; enables horizontal scroll and `fixed` columns when content overflows. |
1068
+
1069
+ ### События SwTable / SwTable Events
1070
+
1071
+ | Имя / Name | Параметры / Payload | Описание / Description |
1072
+ |-----------------|-----------------------|--------------------------------------------------------------------------------|
1073
+ | `column-resize` | `{ prop, width }` | Срабатывает после изменения ширины колонки (в px). / Fired after a column width change (px). |
1074
+
1075
+ ### Свойства SwTableColumn / SwTableColumn Properties
1076
+
1077
+ | Имя / Name | Тип / Type | По умолчанию / Default | Значения/Описание / Values & Description |
1078
+ |-------------|---------------------|------------------------|----------------------------------------------------------------------------------------------------------|
1079
+ | `prop` | `String` | — | Ключ поля в объекте строки. Поддерживает вложенные пути: `speed.midl`. / Row field key; supports nested paths such as `speed.midl`. |
1080
+ | `label` | `String` | `''` | Заголовок колонки. / Column header label. |
1081
+ | `width` | `String` \| `Number`| `'auto'` | Ширина колонки, например `180` или `'180px'`. / Column width, e.g. `180` or `'180px'`. |
1082
+ | `height` | `String` \| `Number`| `'auto'` | Минимальная высота ячейки заголовка. / Minimum header cell height. |
1083
+ | `resizable` | `Boolean` | — | Разрешить ресайз конкретной колонки. По умолчанию наследует `resizable` таблицы. / Allow resizing this column; defaults to the table `resizable` value. |
1084
+ | `minWidth` | `String` \| `Number`| `48` | Минимальная ширина при ресайзе (px). / Minimum width while resizing (px). |
1085
+ | `fixed` | `String` | — | `'left'` \| `'right'` — фиксация колонки при горизонтальном скролле. / `'left'` \| `'right'` — sticky column during horizontal scroll. |
1086
+
1087
+ `SwTableColumn` без `prop` используется как групповой заголовок; внутри него задаются дочерние `SwTableColumn`. / A `SwTableColumn` without `prop` is a group header; place child `SwTableColumn` components inside it.
1058
1088
 
1059
- | Имя | Тип | По умолчанию | Значения/Описание |
1060
- |--------|----------|--------------|----------------------------------------------------|
1061
- | `data` | `Array` | `required` | Содержание таблицы - обязательный массив объектов. |
1089
+ ### Подсветка при наведении / Hover highlight
1090
+
1091
+ - **Строка** — при наведении на строку в `tbody` подсвечиваются все её ячейки (учитывается `rowspan`). / **Row** — hovering a `tbody` row highlights all of its cells (`rowspan` is respected).
1092
+ - **Столбец** — при наведении на ячейку заголовка подсвечивается весь столбец; для группового заголовка с `colspan` — все вложенные колонки. / **Column** — hovering a header cell highlights the whole column; for a grouped header with `colspan`, all nested columns are highlighted.
1093
+
1094
+ Стили подсветки заданы в `component-sw.css` (классы `row-hover`, `col-hover`). / Hover styles are defined in `component-sw.css` (`row-hover`, `col-hover` classes).
1095
+
1096
+ ### Фиксированные колонки / Fixed columns
1097
+
1098
+ Фиксация включается, когда одновременно: / Sticky columns activate when all of the following are true:
1099
+
1100
+ 1. задан `max-width` у `SwTable`; / `max-width` is set on `SwTable`;
1101
+ 2. у колонок указан `fixed="left"` или `fixed="right"`; / columns have `fixed="left"` or `fixed="right"`;
1102
+ 3. суммарная ширина таблицы превышает контейнер. / total table width exceeds the container.
1103
+
1104
+ Групповой заголовок фиксируется, если все его дочерние колонки имеют одинаковое значение `fixed`. / A group header is sticky when all of its child columns share the same `fixed` value.
1062
1105
 
1063
1106
  ### Слоты / Slots
1064
1107
 
1065
- #`<prop>` - именованный слот для конкретной колонки (приоритет выше default). Доступные параметры: `{ row, $index, value }`
1108
+ `#<prop>` именованный слот для конкретной колонки (приоритет выше default). Параметры: `{ row, $index, value }` / Named slot for a specific column (higher priority than default). Parameters: `{ row, $index, value }`
1066
1109
 
1067
- #default - универсальный слот для всех колонок. Доступные параметры: `{ row, $index, column, value }`
1110
+ `#default` универсальный слот для всех колонок. Параметры: `{ row, $index, column, value }` / Default slot for all columns. Parameters: `{ row, $index, column, value }`
1068
1111
 
1069
- - `row` - весь объект строки данных
1070
- - `$index` - индекс строки (начиная с 0)
1071
- - `column` - имя колонки (prop)
1072
- - `value` - значение ячейки
1112
+ - `row` весь объект строки данных / the full row data object
1113
+ - `$index` индекс строки (начиная с 0) / row index (zero-based)
1114
+ - `column` имя колонки (`prop`) / column name (`prop`)
1115
+ - `value` значение ячейки / cell value
1073
1116
 
1074
1117
  ### Пример использования / Example Usage
1075
1118
 
1076
- #### Базовый пример с вложенными колонками:
1119
+ #### Базовый пример с вложенными колонками / Nested column headers:
1077
1120
 
1078
1121
  ```html
1079
1122
  <script>
@@ -1091,7 +1134,39 @@ model - состояние чекбокса (checked ) булевое знач
1091
1134
  </sw-table>
1092
1135
  ```
1093
1136
 
1094
- #### Пример с v-for для динамических колонок:
1137
+ #### Ресайз колонок / Column resize:
1138
+
1139
+ ```html
1140
+ <sw-table :data="users" @column-resize="onColumnResize">
1141
+ <sw-table-column prop="name" label="Имя" width="180px" />
1142
+ <sw-table-column prop="age" label="Возраст" width="100px" />
1143
+ <sw-table-column
1144
+ prop="actions"
1145
+ label="Действия"
1146
+ width="150px"
1147
+ :resizable="false"
1148
+ />
1149
+ </sw-table>
1150
+
1151
+ <script setup>
1152
+ function onColumnResize({ prop, width }) {
1153
+ console.log(prop, width)
1154
+ }
1155
+ </script>
1156
+ ```
1157
+
1158
+ #### Фиксированные крайние колонки / Fixed edge columns:
1159
+
1160
+ ```html
1161
+ <sw-table :data="rows" max-width="520px">
1162
+ <sw-table-column prop="id" label="ID" width="70px" fixed="left" />
1163
+ <sw-table-column prop="name" label="Имя" width="160px" fixed="left" />
1164
+ <sw-table-column prop="email" label="Email" width="200px" />
1165
+ <sw-table-column prop="note" label="Примечание" width="180px" fixed="right" />
1166
+ </sw-table>
1167
+ ```
1168
+
1169
+ #### Пример с v-for для динамических колонок / Dynamic columns with v-for:
1095
1170
 
1096
1171
  ```html
1097
1172
  <script setup>
@@ -1121,7 +1196,7 @@ const tableData = ref([
1121
1196
  </sw-table>
1122
1197
  ```
1123
1198
 
1124
- #### Пример с кастомизацией через слоты:
1199
+ #### Пример с кастомизацией через слоты / Slot customization:
1125
1200
 
1126
1201
  ```html
1127
1202
  <script setup>
@@ -1167,7 +1242,7 @@ const deleteUser = (id) => {
1167
1242
  </sw-table>
1168
1243
  ```
1169
1244
 
1170
- #### Пример с универсальным default слотом:
1245
+ #### Пример с универсальным default слотом / Default slot for all columns:
1171
1246
 
1172
1247
  ```html
1173
1248
  <script setup>
@@ -1198,7 +1273,7 @@ const products = ref([
1198
1273
  </sw-table>
1199
1274
  ```
1200
1275
 
1201
- #### Пример с объединением ячеек (rowspan/colspan):
1276
+ #### Пример с объединением ячеек (rowspan/colspan) / Cell merging (rowspan/colspan):
1202
1277
 
1203
1278
  ```html
1204
1279
  <script setup>
@@ -1292,25 +1367,15 @@ Default - для вкладок
1292
1367
 
1293
1368
  ## Изменения / Changelog
1294
1369
 
1295
- ### 0.12.11
1296
-
1297
- **SSR-совместимость / SSR compatibility**
1298
-
1299
- - `Alert`: инициализация контейнера вынесена из верхнего уровня модуля в саму функцию и защищена проверкой `typeof document === 'undefined'` — больше не падает при импорте на сервере. / `Alert`: container initialization moved out of module top-level into the function and guarded with `typeof document === 'undefined'` — no longer crashes when imported on the server.
1300
- - `SwDatePicker`: обращение к `navigator.language` обёрнуто в проверку окружения (раньше выполнялось в `setup` при SSR). / `SwDatePicker`: `navigator.language` access is now environment-guarded (previously executed in `setup` during SSR).
1301
- - `SwSlider`: обращение к `document.querySelector` в рендер-функции `tooltipStyle` защищено проверкой окружения. / `SwSlider`: the `document.querySelector` call inside the `tooltipStyle` render function is now environment-guarded.
1302
- - `dist` пересобран — `dist/index.js` и `dist/index.cjs` больше не содержат обращений к `document`/`window` на верхнем уровне и корректно импортируются в Node/SSR. / `dist` rebuilt — `dist/index.js` and `dist/index.cjs` no longer contain top-level `document`/`window` access and import correctly in Node/SSR.
1303
-
1304
- **Самодостаточные исходники / Self-contained source**
1305
-
1306
- - Все внутренние импорты переведены с алиаса `@/` на относительные пути, поэтому сырые `.vue`/`.ts` файлы корректно резолвятся при прямом импорте из `src` (в т.ч. при pre-bundle в Vite у проекта-потребителя). / All internal imports switched from the `@/` alias to relative paths, so the raw `.vue`/`.ts` files resolve correctly when imported directly from `src` (including Vite pre-bundle in the consumer project).
1307
- - Добавлен shim `types/shims-vue.d.ts` для корректной типизации импортов `.vue`. / Added `types/shims-vue.d.ts` shim for correct typing of `.vue` imports.
1308
- - Удалены «мёртвые» type-реэкспорты из несуществующего модуля `@/types`. / Removed dead type re-exports from the non-existent `@/types` module.
1370
+ ### 0.12.13
1309
1371
 
1310
- **Исправления / Fixes**
1372
+ **SwTable**
1311
1373
 
1312
- - `SwSwitch`: модификатор `.sw-small` теперь действительно уменьшает переключатель (использует `--sw-component-size-small` вместо базового размера). / `SwSwitch`: the `.sw-small` modifier now actually shrinks the switch (uses `--sw-component-size-small` instead of the base size).
1313
- - Устранены все ошибки `vue-tsc` (`SwMenu`, `SwSelect`, `index.ts`, `utils`)проверка типов проходит чисто. / Fixed all `vue-tsc` errors (`SwMenu`, `SwSelect`, `index.ts`, `utils`) type-check passes cleanly.
1374
+ - Подсветка строки при наведении на строку в `tbody` учётом `rowspan`). / Row highlight on `tbody` row hover (`rowspan` supported).
1375
+ - Подсветка столбца при наведении на ячейку заголовка; для группового заголовка с `colspan` — все вложенные колонки. / Column highlight on header cell hover; grouped headers with `colspan` highlight all nested columns.
1376
+ - Изменение ширины колонок перетаскиванием края заголовка; проп `resizable` у таблицы и колонки, событие `column-resize`. / Resize leaf columns by dragging the header edge; table/column `resizable` prop and `column-resize` event.
1377
+ - Фиксация крайних колонок (`fixed="left"` \| `fixed="right"` на `SwTableColumn`) при горизонтальном скролле; prop `maxWidth` у `SwTable`. / Sticky edge columns (`fixed="left"` \| `fixed="right"` on `SwTableColumn`) during horizontal scroll; `maxWidth` prop on `SwTable`.
1378
+ - Колонки снова регистрируются корректно: `SwTable` и `SwTableColumn` монтируют слот через скрытый контейнер (`provide` / `inject`). / Columns register correctly again: `SwTable` and `SwTableColumn` mount the slot via a hidden container (`provide` / `inject`).
1314
1379
 
1315
1380
  ---
1316
1381
 
@@ -0,0 +1,338 @@
1
+ import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, nextTick as o, normalizeClass as s, normalizeStyle as c, onMounted as l, onUnmounted as u, openBlock as d, provide as f, reactive as p, ref as m, renderList as h, renderSlot as g, toDisplayString as _, unref as ee, useSlots as te, watch as ne, watchEffect as re, withModifiers as ie } from "vue";
2
+ //#region src/components/SwTable.vue
3
+ var v = {
4
+ style: { display: "none" },
5
+ "aria-hidden": "true"
6
+ }, ae = [
7
+ "colspan",
8
+ "rowspan",
9
+ "onMouseenter"
10
+ ], oe = ["onMousedown"], se = ["onMouseenter"], ce = ["colspan", "rowspan"], y = {
11
+ __name: "SwTable",
12
+ props: {
13
+ data: {
14
+ type: Array,
15
+ required: !0
16
+ },
17
+ resizable: {
18
+ type: Boolean,
19
+ default: !0
20
+ },
21
+ maxWidth: {
22
+ type: [String, Number],
23
+ default: void 0
24
+ }
25
+ },
26
+ emits: ["column-resize"],
27
+ setup(y, { emit: b }) {
28
+ let x = y, S = b, le = te(), C = p([]), w = m({}), T = m(!1), E = m(null), D = m(null), O = m(null), k = m(null), A = m(!1), j = typeof window < "u" && typeof document < "u", ue = 0, M = null;
29
+ f("swTableColumns", C), f("swTableAllocColumnOrder", () => ue++);
30
+ function N(e) {
31
+ if (e == null || e === "auto") return null;
32
+ if (typeof e == "number") return e;
33
+ let t = parseInt(e, 10);
34
+ return Number.isNaN(t) ? null : t;
35
+ }
36
+ function P(e) {
37
+ return e == null ? void 0 : `${e}px`;
38
+ }
39
+ function F(e, t) {
40
+ return w.value[e] == null ? N(t) : w.value[e];
41
+ }
42
+ function I(e, t) {
43
+ let n = F(e, t);
44
+ if (n == null) return {};
45
+ let r = P(n);
46
+ return {
47
+ width: r,
48
+ minWidth: r
49
+ };
50
+ }
51
+ function L(e) {
52
+ return e?.prop ? F(e.prop, e.width) ?? N(e.minWidth) ?? 80 : N(e?.width) ?? N(e?.minWidth) ?? 80;
53
+ }
54
+ function R(e) {
55
+ let t = 0;
56
+ for (let n = 0; n < e; n++) t += L(X.value[n]);
57
+ return t;
58
+ }
59
+ function z(e) {
60
+ let t = 0, n = X.value;
61
+ for (let r = n.length - 1; r > e; r--) t += L(n[r]);
62
+ return t;
63
+ }
64
+ function B(e) {
65
+ if (e.fixed) return e.fixed;
66
+ if (e.prop) return X.value.find((t) => t.prop === e.prop)?.fixed;
67
+ if (!e.colIndices?.length) return null;
68
+ let t = e.colIndices.map((e) => X.value[e]?.fixed).filter(Boolean);
69
+ return t.length && t.every((e) => e === "left") ? "left" : t.length && t.every((e) => e === "right") ? "right" : null;
70
+ }
71
+ function V(e, t = !1) {
72
+ let n = B(e);
73
+ if (!n) return {};
74
+ let r = e.colIndex ?? e.colIndices[0], i = e.colIndex == null ? e.colIndices[e.colIndices.length - 1] : e.colIndex + (e.colspan || 1) - 1, a = t ? 100 : 0;
75
+ return n === "left" ? {
76
+ position: "sticky",
77
+ left: `${R(r)}px`,
78
+ zIndex: a + r + 1
79
+ } : {
80
+ position: "sticky",
81
+ right: `${z(i)}px`,
82
+ zIndex: a + X.value.length - i
83
+ };
84
+ }
85
+ function H(e) {
86
+ let t = { minHeight: e.height && e.height !== "auto" ? e.height : void 0 };
87
+ return e.prop ? Object.assign(t, I(e.prop, e.width)) : e.width && e.width !== "auto" && (t.minWidth = P(N(e.width)) || e.width), Q.value && Object.assign(t, V(e, !0)), t;
88
+ }
89
+ function U(e) {
90
+ let t = { ...e.style };
91
+ return Q.value && Object.assign(t, V(e)), t;
92
+ }
93
+ function W(e) {
94
+ return !x.resizable || !e.prop ? !1 : e.resizable !== !1;
95
+ }
96
+ function de(e) {
97
+ E.value = new Set(e.colIndices);
98
+ }
99
+ function fe() {
100
+ E.value = null;
101
+ }
102
+ function G(e) {
103
+ if (!E.value) return !1;
104
+ let t = e.colIndex, n = t + (e.colspan || 1) - 1;
105
+ for (let e = t; e <= n; e++) if (E.value.has(e)) return !0;
106
+ return !1;
107
+ }
108
+ function pe(e, t) {
109
+ let n = D.value;
110
+ return n === null ? !1 : t <= n && n < t + (e.rowspan || 1);
111
+ }
112
+ function K(e) {
113
+ let t = B(e);
114
+ return {
115
+ "fixed-left": Q.value && t === "left",
116
+ "fixed-right": Q.value && t === "right"
117
+ };
118
+ }
119
+ function me(e, t) {
120
+ let n = G(e), r = pe(e, t);
121
+ return {
122
+ ...K(e),
123
+ "col-hover": n && !r,
124
+ "row-hover": r && !n
125
+ };
126
+ }
127
+ function he(e) {
128
+ return {
129
+ ...K(e),
130
+ resizable: W(e),
131
+ "col-hover": G(e)
132
+ };
133
+ }
134
+ function ge(e) {
135
+ return N(e.minWidth) ?? 48;
136
+ }
137
+ function _e(e, t) {
138
+ if (!j) return;
139
+ let n = e.currentTarget.closest("th");
140
+ if (!n || !t.prop) return;
141
+ let r = t.prop, i = e.clientX, a = F(r, t.width) ?? n.offsetWidth, s = ge(t);
142
+ T.value = !0, document.body.style.cursor = "col-resize", document.body.style.userSelect = "none";
143
+ let c = (e) => {
144
+ let t = Math.max(s, a + (e.clientX - i));
145
+ w.value = {
146
+ ...w.value,
147
+ [r]: t
148
+ };
149
+ }, l = () => {
150
+ document.removeEventListener("mousemove", c), document.removeEventListener("mouseup", l), document.body.style.cursor = "", document.body.style.userSelect = "", T.value = !1, S("column-resize", {
151
+ prop: r,
152
+ width: w.value[r]
153
+ }), o($);
154
+ };
155
+ document.addEventListener("mousemove", c), document.addEventListener("mouseup", l);
156
+ }
157
+ function q(e) {
158
+ return [...e].sort((e, t) => e.order - t.order);
159
+ }
160
+ function J(e) {
161
+ if (!e || e.length === 0) return 1;
162
+ let t = 1;
163
+ for (let n of e) if (n.children && n.children.length > 0) {
164
+ let e = J(n.children);
165
+ t = Math.max(t, 1 + e);
166
+ }
167
+ return t;
168
+ }
169
+ function ve(e, t) {
170
+ let n = Array.from({ length: t }, () => []), r = 0;
171
+ function i(e, a, o = "") {
172
+ let s = q(e);
173
+ for (let e = 0; e < s.length; e++) {
174
+ let c = s[e], l = o ? `${o}-${c.prop || e}` : c.prop || e;
175
+ if (c.children && c.children.length > 0) {
176
+ let e = r, t = ye(c.children);
177
+ i(c.children, a + 1, l), n[a].push({
178
+ key: l,
179
+ label: c.label,
180
+ colspan: t,
181
+ rowspan: 1,
182
+ width: c.width,
183
+ height: c.height,
184
+ colIndices: Array.from({ length: t }, (t, n) => e + n)
185
+ });
186
+ } else {
187
+ let e = r++;
188
+ n[a].push({
189
+ key: c.prop,
190
+ label: c.label,
191
+ colspan: 1,
192
+ rowspan: t - a,
193
+ width: c.width,
194
+ height: c.height,
195
+ prop: c.prop,
196
+ resizable: c.resizable,
197
+ minWidth: c.minWidth,
198
+ colIndex: e,
199
+ colIndices: [e]
200
+ });
201
+ }
202
+ }
203
+ }
204
+ return i(e, 0), n;
205
+ }
206
+ function ye(e) {
207
+ let t = 0;
208
+ function n(e) {
209
+ for (let r of q(e)) r.children && r.children.length > 0 ? n(r.children) : t++;
210
+ }
211
+ return n(e), t;
212
+ }
213
+ function Y(e) {
214
+ let t = [];
215
+ function n(e) {
216
+ for (let r of q(e)) r.children && r.children.length > 0 ? n(r.children) : t.push(r);
217
+ }
218
+ return n(e), t;
219
+ }
220
+ function be(e, t) {
221
+ if (!e || !Array.isArray(e) || !t || !Array.isArray(t)) return [];
222
+ function n(e, t) {
223
+ if (!e || !t) return;
224
+ let n = t.split("."), r = e;
225
+ for (let e of n) {
226
+ if (r == null) return;
227
+ r = r[e];
228
+ }
229
+ return r;
230
+ }
231
+ let r = [], i = /* @__PURE__ */ new Map();
232
+ return e.forEach((e, a) => {
233
+ let o = [];
234
+ t.forEach((t, r) => {
235
+ let s = `${a}-${r}`;
236
+ if (i.has(s)) return;
237
+ let c = n(e, t.prop), l = c, u = 1, d = 1, f = {};
238
+ c && typeof c == "object" && c && (l = c.label || c.value || "", u = c.colspan || 1, d = c.rowspan || 1, f = c.style || {}), f = {
239
+ ...f,
240
+ ...I(t.prop, t.width)
241
+ };
242
+ let p = {
243
+ key: s,
244
+ label: l,
245
+ prop: t.prop,
246
+ fixed: t.fixed,
247
+ colIndex: r,
248
+ colspan: u,
249
+ rowspan: d,
250
+ style: f,
251
+ originalRow: e,
252
+ rowIndex: a
253
+ };
254
+ o.push(p);
255
+ for (let e = 0; e < d; e++) for (let t = 0; t < u; t++) {
256
+ if (e === 0 && t === 0) continue;
257
+ let n = `${a + e}-${r + t}`;
258
+ i.set(n, !0);
259
+ }
260
+ }), o.length > 0 && r.push(o);
261
+ }), r;
262
+ }
263
+ let xe = t(() => J(C)), Se = t(() => ve(C, xe.value)), X = t(() => Y(C)), Z = t(() => be(x.data, X.value)), Ce = t(() => X.value.some((e) => e.fixed)), we = t(() => {
264
+ if (x.maxWidth != null) return { maxWidth: typeof x.maxWidth == "number" ? `${x.maxWidth}px` : x.maxWidth };
265
+ }), Q = t(() => x.maxWidth != null && Ce.value && A.value);
266
+ function $() {
267
+ if (!j) {
268
+ A.value = !1;
269
+ return;
270
+ }
271
+ let e = O.value, t = k.value;
272
+ if (!e || !t) {
273
+ A.value = !1;
274
+ return;
275
+ }
276
+ A.value = t.scrollWidth > e.clientWidth + 1;
277
+ }
278
+ function Te() {
279
+ let e = {};
280
+ for (let t of X.value) {
281
+ let n = N(t.width);
282
+ t.prop && n != null && (e[t.prop] = n);
283
+ }
284
+ w.value = e;
285
+ }
286
+ return re(() => {
287
+ X.value, Te();
288
+ }), ne([
289
+ () => x.data,
290
+ () => x.maxWidth,
291
+ X,
292
+ w,
293
+ Z
294
+ ], () => o($)), l(() => {
295
+ $(), !(!j || typeof ResizeObserver > "u") && (M = new ResizeObserver(() => $()), O.value && M.observe(O.value), k.value && M.observe(k.value));
296
+ }), u(() => {
297
+ M?.disconnect(), M = null;
298
+ }), (t, o) => (d(), r(e, null, [i("div", v, [g(t.$slots, "default")]), i("div", {
299
+ ref_key: "wrapperRef",
300
+ ref: O,
301
+ class: s(["sw-table-wrapper", { "fixed-active": Q.value }]),
302
+ style: c(we.value)
303
+ }, [i("table", {
304
+ ref_key: "tableRef",
305
+ ref: k,
306
+ class: s(["sw-table", { resizing: T.value }])
307
+ }, [i("thead", null, [(d(!0), r(e, null, h(Se.value, (t, i) => (d(), r("tr", { key: i }, [(d(!0), r(e, null, h(t, (e) => (d(), r("th", {
308
+ key: e.key,
309
+ colspan: e.colspan,
310
+ rowspan: e.rowspan,
311
+ class: s(he(e)),
312
+ style: c(H(e)),
313
+ onMouseenter: (t) => de(e),
314
+ onMouseleave: fe
315
+ }, [a(_(e.label) + " ", 1), W(e) ? (d(), r("span", {
316
+ key: 0,
317
+ class: "resize-handle",
318
+ onMousedown: ie((t) => _e(t, e), ["prevent"])
319
+ }, null, 40, oe)) : n("", !0)], 46, ae))), 128))]))), 128))]), i("tbody", null, [(d(!0), r(e, null, h(Z.value, (n, i) => (d(), r("tr", {
320
+ key: i,
321
+ onMouseenter: (e) => D.value = i,
322
+ onMouseleave: o[0] ||= (e) => D.value = null
323
+ }, [(d(!0), r(e, null, h(n, (n) => (d(), r("td", {
324
+ key: n.key,
325
+ colspan: n.colspan,
326
+ rowspan: n.rowspan,
327
+ class: s(me(n, i)),
328
+ style: c(U(n))
329
+ }, [n.prop && ee(le)[n.prop] ? g(t.$slots, n.prop, {
330
+ key: 0,
331
+ row: n.originalRow,
332
+ $index: n.rowIndex,
333
+ value: n.label
334
+ }) : (d(), r(e, { key: 1 }, [a(_(n.label), 1)], 64))], 14, ce))), 128))], 40, se))), 128))])], 2)], 6)], 64));
335
+ }
336
+ };
337
+ //#endregion
338
+ export { y as default };
@@ -0,0 +1,66 @@
1
+ import { createElementBlock as e, inject as t, onUnmounted as n, openBlock as r, provide as i, reactive as a, renderSlot as o, watch as s } from "vue";
2
+ //#region src/components/SwTableColumn.vue
3
+ var c = { style: { display: "none" } }, l = {
4
+ __name: "SwTableColumn",
5
+ props: {
6
+ prop: {
7
+ type: String,
8
+ default: void 0
9
+ },
10
+ label: {
11
+ type: String,
12
+ default: ""
13
+ },
14
+ width: {
15
+ type: [String, Number],
16
+ default: "auto"
17
+ },
18
+ height: {
19
+ type: [String, Number],
20
+ default: "auto"
21
+ },
22
+ resizable: {
23
+ type: Boolean,
24
+ default: void 0
25
+ },
26
+ minWidth: {
27
+ type: [String, Number],
28
+ default: 48
29
+ },
30
+ fixed: {
31
+ type: String,
32
+ default: void 0,
33
+ validator: (e) => e == null || e === "left" || e === "right"
34
+ }
35
+ },
36
+ setup(l) {
37
+ let u = l, d = t("swTableColumns", null), f = t("swTableParentColumn", null), p = a({
38
+ order: t("swTableAllocColumnOrder", null)?.() ?? 0,
39
+ prop: u.prop,
40
+ label: u.label,
41
+ width: u.width,
42
+ height: u.height,
43
+ resizable: u.resizable,
44
+ minWidth: u.minWidth,
45
+ fixed: u.fixed,
46
+ children: []
47
+ });
48
+ s(() => u, (e) => {
49
+ p.prop = e.prop, p.label = e.label, p.width = e.width, p.height = e.height, p.resizable = e.resizable, p.minWidth = e.minWidth, p.fixed = e.fixed;
50
+ }, { deep: !0 }), i("swTableParentColumn", p);
51
+ function m() {
52
+ f ? f.children.push(p) : d && d.push(p);
53
+ }
54
+ function h() {
55
+ let e = f ? f.children : d;
56
+ if (!e) return;
57
+ let t = e.indexOf(p);
58
+ t > -1 && e.splice(t, 1);
59
+ }
60
+ return m(), n(() => {
61
+ h();
62
+ }), (t, n) => (r(), e("div", c, [o(t.$slots, "default")]));
63
+ }
64
+ };
65
+ //#endregion
66
+ export { l as default };