@pathscale/ui 1.1.1 → 1.1.2
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.
|
@@ -10,7 +10,7 @@ import * as __WEBPACK_EXTERNAL_MODULE__input_Input_js_ae745814__ from "../input/
|
|
|
10
10
|
import * as __WEBPACK_EXTERNAL_MODULE__dropdown_Dropdown_js_1eafe997__ from "../dropdown/Dropdown.js";
|
|
11
11
|
import * as __WEBPACK_EXTERNAL_MODULE__loading_Loading_js_1fa096bd__ from "../loading/Loading.js";
|
|
12
12
|
import * as __WEBPACK_EXTERNAL_MODULE__menu_Menu_js_2e8cbfbf__ from "../menu/Menu.js";
|
|
13
|
-
var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="cursor-pointer ml-auto">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class=mb-2></div><div class="flex gap-2 justify-end">'), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="enhanced-table-footer shrink-0 border-t border-base-300"><div class="px-4 py-3"><div><div class="flex items-center gap-2"><span class=opacity-70>Rows per page</span></div><div class="flex items-center gap-3 ml-4"><span class=opacity-70>Page <!> of </span><div class=join>'), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="enhanced-table-root flex h-full min-h-0 w-full flex-col"><div class="enhanced-table-scroll flex-1 min-h-0 overflow-y-auto overflow-x-auto">'), _tmpl$5 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="flex items-center gap-2"><div class=truncate
|
|
13
|
+
var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="cursor-pointer ml-auto shrink-0">'), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div><div class=mb-2></div><div class="flex gap-2 justify-end">'), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="enhanced-table-footer shrink-0 border-t border-base-300"><div class="px-4 py-3"><div><div class="flex items-center gap-2"><span class=opacity-70>Rows per page</span></div><div class="flex items-center gap-3 ml-4"><span class=opacity-70>Page <!> of </span><div class=join>'), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="enhanced-table-root flex h-full min-h-0 w-full flex-col"><div class="enhanced-table-scroll flex-1 min-h-0 overflow-y-auto overflow-x-auto">'), _tmpl$5 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="flex items-center gap-2"><div class=truncate>'), _tmpl$6 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<div class="flex gap-2">');
|
|
14
14
|
function EnhancedTable_EnhancedTable(props) {
|
|
15
15
|
const [local, tableProps] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
|
|
16
16
|
"data",
|
|
@@ -128,12 +128,61 @@ function EnhancedTable_EnhancedTable(props) {
|
|
|
128
128
|
});
|
|
129
129
|
const headerGroups = ()=>table.getHeaderGroups();
|
|
130
130
|
const totalColumns = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>table.getVisibleLeafColumns().length + (local.enableRowSelection ? 1 : 0) + (local.expandable ? 1 : 0));
|
|
131
|
+
const filterTriggerRefs = new Map();
|
|
132
|
+
const [filterPanelStyle, setFilterPanelStyle] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)({
|
|
133
|
+
position: "fixed",
|
|
134
|
+
top: "0px",
|
|
135
|
+
left: "0px",
|
|
136
|
+
"z-index": 1300
|
|
137
|
+
});
|
|
138
|
+
let filterPanelRef;
|
|
139
|
+
const updateFilterPanelPosition = ()=>{
|
|
140
|
+
const colId = openFilterFor();
|
|
141
|
+
if (!colId) return;
|
|
142
|
+
const triggerEl = filterTriggerRefs.get(colId);
|
|
143
|
+
if (!triggerEl) return;
|
|
144
|
+
const rect = triggerEl.getBoundingClientRect();
|
|
145
|
+
const panelWidth = 224;
|
|
146
|
+
const offset = 6;
|
|
147
|
+
const viewportPadding = 8;
|
|
148
|
+
let left = rect.right - panelWidth;
|
|
149
|
+
left = Math.max(viewportPadding, Math.min(left, window.innerWidth - panelWidth - viewportPadding));
|
|
150
|
+
let top = rect.bottom + offset;
|
|
151
|
+
if (filterPanelRef) {
|
|
152
|
+
const panelHeight = filterPanelRef.getBoundingClientRect().height;
|
|
153
|
+
if (top + panelHeight > window.innerHeight - viewportPadding) {
|
|
154
|
+
const above = rect.top - panelHeight - offset;
|
|
155
|
+
top = above >= viewportPadding ? above : Math.max(viewportPadding, window.innerHeight - panelHeight - viewportPadding);
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
setFilterPanelStyle({
|
|
159
|
+
position: "fixed",
|
|
160
|
+
top: `${top}px`,
|
|
161
|
+
left: `${left}px`,
|
|
162
|
+
"z-index": 1300
|
|
163
|
+
});
|
|
164
|
+
};
|
|
165
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createEffect)(()=>{
|
|
166
|
+
if (!openFilterFor()) return;
|
|
167
|
+
requestAnimationFrame(()=>{
|
|
168
|
+
updateFilterPanelPosition();
|
|
169
|
+
requestAnimationFrame(updateFilterPanelPosition);
|
|
170
|
+
});
|
|
171
|
+
const onViewportChange = ()=>updateFilterPanelPosition();
|
|
172
|
+
window.addEventListener("resize", onViewportChange);
|
|
173
|
+
window.addEventListener("scroll", onViewportChange, true);
|
|
174
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.onCleanup)(()=>{
|
|
175
|
+
window.removeEventListener("resize", onViewportChange);
|
|
176
|
+
window.removeEventListener("scroll", onViewportChange, true);
|
|
177
|
+
});
|
|
178
|
+
});
|
|
131
179
|
const FilterIconTrigger = (props)=>(()=>{
|
|
132
180
|
var _el$ = _tmpl$();
|
|
133
181
|
_el$.$$click = (e)=>{
|
|
134
182
|
e.stopPropagation();
|
|
135
183
|
if (!props.disabled) setOpenFilterFor((c)=>c === props.colId ? null : props.colId);
|
|
136
184
|
};
|
|
185
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)((el)=>filterTriggerRefs.set(props.colId, el), _el$);
|
|
137
186
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.filterIcon);
|
|
138
187
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_$p)=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.classList)(_el$, {
|
|
139
188
|
"opacity-50 pointer-events-none": props.disabled,
|
|
@@ -149,28 +198,46 @@ function EnhancedTable_EnhancedTable(props) {
|
|
|
149
198
|
return openFilterFor() === colId;
|
|
150
199
|
},
|
|
151
200
|
get children () {
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
column: col
|
|
156
|
-
}));
|
|
157
|
-
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_Button_js_6d750473__["default"], {
|
|
158
|
-
size: "sm",
|
|
159
|
-
variant: "outline",
|
|
160
|
-
onClick: ()=>{
|
|
161
|
-
col.setFilterValue(void 0);
|
|
162
|
-
setOpenFilterFor(null);
|
|
201
|
+
return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.Portal, {
|
|
202
|
+
get mount () {
|
|
203
|
+
return "undefined" == typeof document ? void 0 : document.body;
|
|
163
204
|
},
|
|
164
|
-
children
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
205
|
+
get children () {
|
|
206
|
+
var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
|
|
207
|
+
_el$2.$$click = (e)=>e.stopPropagation();
|
|
208
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.use)((el)=>{
|
|
209
|
+
filterPanelRef = el;
|
|
210
|
+
}, _el$2);
|
|
211
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$3, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(ColumnFilter, {
|
|
212
|
+
column: col
|
|
213
|
+
}));
|
|
214
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_Button_js_6d750473__["default"], {
|
|
215
|
+
size: "sm",
|
|
216
|
+
variant: "outline",
|
|
217
|
+
onClick: ()=>{
|
|
218
|
+
col.setFilterValue(void 0);
|
|
219
|
+
setOpenFilterFor(null);
|
|
220
|
+
},
|
|
221
|
+
children: "Clear"
|
|
222
|
+
}), null);
|
|
223
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__button_Button_js_6d750473__["default"], {
|
|
224
|
+
size: "sm",
|
|
225
|
+
variant: "primary",
|
|
226
|
+
onClick: ()=>setOpenFilterFor(null),
|
|
227
|
+
children: "Apply"
|
|
228
|
+
}), null);
|
|
229
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
|
|
230
|
+
var _v$ = filterPanelStyle(), _v$2 = local.filterPanelClass ?? "z-[1300] w-56 border border-nf-border bg-nf-surface-1 shadow-lg rounded-box p-2";
|
|
231
|
+
_p$.e = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.style)(_el$2, _v$, _p$.e);
|
|
232
|
+
_v$2 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$2, _p$.t = _v$2);
|
|
233
|
+
return _p$;
|
|
234
|
+
}, {
|
|
235
|
+
e: void 0,
|
|
236
|
+
t: void 0
|
|
237
|
+
});
|
|
238
|
+
return _el$2;
|
|
239
|
+
}
|
|
240
|
+
});
|
|
174
241
|
}
|
|
175
242
|
});
|
|
176
243
|
};
|
|
@@ -310,7 +377,7 @@ function EnhancedTable_EnhancedTable(props) {
|
|
|
310
377
|
return canSort ? header.column.getToggleSortingHandler() : void 0;
|
|
311
378
|
},
|
|
312
379
|
get children () {
|
|
313
|
-
var _el$17 = _tmpl$5(), _el$18 = _el$17.firstChild
|
|
380
|
+
var _el$17 = _tmpl$5(), _el$18 = _el$17.firstChild;
|
|
314
381
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$18, ()=>(0, __WEBPACK_EXTERNAL_MODULE__tanstack_solid_table_1239d047__.flexRender)(header.column.columnDef.header, header.getContext()));
|
|
315
382
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$17, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
|
|
316
383
|
get when () {
|
|
@@ -319,7 +386,7 @@ function EnhancedTable_EnhancedTable(props) {
|
|
|
319
386
|
get children () {
|
|
320
387
|
return local.sortAscIcon;
|
|
321
388
|
}
|
|
322
|
-
}),
|
|
389
|
+
}), null);
|
|
323
390
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$17, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
|
|
324
391
|
get when () {
|
|
325
392
|
return "desc" === header.column.getIsSorted();
|
|
@@ -327,7 +394,7 @@ function EnhancedTable_EnhancedTable(props) {
|
|
|
327
394
|
get children () {
|
|
328
395
|
return local.sortDescIcon;
|
|
329
396
|
}
|
|
330
|
-
}),
|
|
397
|
+
}), null);
|
|
331
398
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$17, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
|
|
332
399
|
get when () {
|
|
333
400
|
return canSort && false === header.column.getIsSorted() && local.sortNeutralIcon;
|
|
@@ -335,7 +402,7 @@ function EnhancedTable_EnhancedTable(props) {
|
|
|
335
402
|
get children () {
|
|
336
403
|
return local.sortNeutralIcon;
|
|
337
404
|
}
|
|
338
|
-
}),
|
|
405
|
+
}), null);
|
|
339
406
|
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$17, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
|
|
340
407
|
when: canFilter,
|
|
341
408
|
get children () {
|
|
@@ -640,8 +707,8 @@ function ColumnFilter(props) {
|
|
|
640
707
|
]);
|
|
641
708
|
};
|
|
642
709
|
return (()=>{
|
|
643
|
-
var _el$
|
|
644
|
-
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$
|
|
710
|
+
var _el$19 = _tmpl$6();
|
|
711
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$19, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__input_Input_js_ae745814__["default"], {
|
|
645
712
|
size: "sm",
|
|
646
713
|
type: "number",
|
|
647
714
|
placeholder: "Min",
|
|
@@ -650,7 +717,7 @@ function ColumnFilter(props) {
|
|
|
650
717
|
},
|
|
651
718
|
onInput: (e)=>setRange(e.currentTarget.value, v[1])
|
|
652
719
|
}), null);
|
|
653
|
-
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$
|
|
720
|
+
(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$19, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__input_Input_js_ae745814__["default"], {
|
|
654
721
|
size: "sm",
|
|
655
722
|
type: "number",
|
|
656
723
|
placeholder: "Max",
|
|
@@ -659,7 +726,7 @@ function ColumnFilter(props) {
|
|
|
659
726
|
},
|
|
660
727
|
onInput: (e)=>setRange(v[0], e.currentTarget.value)
|
|
661
728
|
}), null);
|
|
662
|
-
return _el$
|
|
729
|
+
return _el$19;
|
|
663
730
|
})();
|
|
664
731
|
}
|
|
665
732
|
if ("select" === type) {
|