sveltekit-ui 1.0.17 → 1.0.18
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/dist/Components/TableAdvanced/SortByInput/index.svelte +6 -16
- package/dist/Components/TableAdvanced/SortByInput/index.svelte.js +2 -43
- package/dist/Components/TableAdvanced/index.svelte.js +19 -33
- package/dist/Components/VariablePathInput/index.svelte.js +0 -2
- package/package.json +2 -2
- package/src/lib/Components/TableAdvanced/SortByInput/index.svelte +6 -16
- package/src/lib/Components/TableAdvanced/SortByInput/index.svelte.js +2 -43
- package/src/lib/Components/TableAdvanced/index.svelte.js +19 -33
- package/src/lib/Components/VariablePathInput/index.svelte.js +0 -2
- package/src/routes/[component]/Showcase/TableAdvanced/index.svelte +51 -7
|
@@ -13,8 +13,9 @@
|
|
|
13
13
|
<thead>
|
|
14
14
|
<tr>
|
|
15
15
|
<th>Sort Order</th>
|
|
16
|
-
<th>Data
|
|
16
|
+
<th>Data Variable Path</th>
|
|
17
17
|
<th>Is Ascending</th>
|
|
18
|
+
<th>Remove</th>
|
|
18
19
|
<th></th>
|
|
19
20
|
</tr>
|
|
20
21
|
</thead>
|
|
@@ -29,20 +30,7 @@
|
|
|
29
30
|
<td>
|
|
30
31
|
<Checkbox manager={sort_prepped?.is_ascending_checkbox_manager} />
|
|
31
32
|
</td>
|
|
32
|
-
<td>
|
|
33
|
-
<Button manager={sort_prepped?.extra_button_manager} />
|
|
34
|
-
<Popover manager={sort_prepped?.extra_popover_manager}>
|
|
35
|
-
{#snippet content()}
|
|
36
|
-
{#if Array(manager?.sorts_prepped) && manager?.sorts_prepped.length > 0 && i > 1}
|
|
37
|
-
<Button manager={sort_prepped?.shift_up_button_manager} />
|
|
38
|
-
{/if}
|
|
39
|
-
{#if Array(manager?.sorts_prepped) && manager?.sorts_prepped.length > 1 && i < manager?.sorts_prepped.length}
|
|
40
|
-
<Button manager={sort_prepped?.shift_down_button_manager} />
|
|
41
|
-
{/if}
|
|
42
|
-
<Button manager={sort_prepped?.delete_button_manager} />
|
|
43
|
-
{/snippet}
|
|
44
|
-
</Popover>
|
|
45
|
-
</td>
|
|
33
|
+
<td><Button manager={sort_prepped?.delete_button_manager} /></td>
|
|
46
34
|
</tr>
|
|
47
35
|
{/each}
|
|
48
36
|
{:else}
|
|
@@ -53,7 +41,9 @@
|
|
|
53
41
|
</tbody>
|
|
54
42
|
</table>
|
|
55
43
|
</div>
|
|
56
|
-
<
|
|
44
|
+
<div style="margin-top: 1rem;">
|
|
45
|
+
<Button manager={manager?.add_sort_button_manager} />
|
|
46
|
+
</div>
|
|
57
47
|
{/snippet}
|
|
58
48
|
|
|
59
49
|
{#if manager?.is_popover}
|
|
@@ -35,54 +35,17 @@ export function create_sort_by_input_manager(config) {
|
|
|
35
35
|
let sorts_prepped_loc = []
|
|
36
36
|
if (Array.isArray(sorts)) {
|
|
37
37
|
for (let i = 0; i < sorts.length; i++) {
|
|
38
|
-
let extra_button_manager = $state(null)
|
|
39
|
-
let extra_popover_manager = $state(null)
|
|
40
|
-
extra_popover_manager = create_popover_manager({
|
|
41
|
-
target_width: 200,
|
|
42
|
-
target_height: 200,
|
|
43
|
-
type: "dropdown",
|
|
44
|
-
anchor_id: () => `button_${extra_button_manager?.id}`,
|
|
45
|
-
})
|
|
46
|
-
extra_button_manager = create_button_manager({
|
|
47
|
-
type: "soft",
|
|
48
|
-
support_icon: "three_dots",
|
|
49
|
-
icon_sw: 60,
|
|
50
|
-
is_uniform: true,
|
|
51
|
-
popover_target: () => `popover_${extra_popover_manager?.id}`,
|
|
52
|
-
})
|
|
53
38
|
let delete_button_manager = create_button_manager({
|
|
54
|
-
type: "
|
|
55
|
-
|
|
39
|
+
type: "outlined",
|
|
40
|
+
is_uniform: true,
|
|
56
41
|
support_icon: "x",
|
|
57
42
|
color: "var(--error-t)",
|
|
58
|
-
text_align: "left",
|
|
59
43
|
on_click: () => {
|
|
60
|
-
extra_popover_manager.close()
|
|
61
44
|
if (Array.isArray(sorts_prepped) && i >= 0 && i < sorts_prepped.length) {
|
|
62
45
|
sorts_prepped.splice(i, 1)
|
|
63
46
|
}
|
|
64
47
|
},
|
|
65
48
|
})
|
|
66
|
-
let shift_up_button_manager = create_button_manager({
|
|
67
|
-
type: "soft",
|
|
68
|
-
text: "Shift Up",
|
|
69
|
-
support_icon: "arrow_tailed",
|
|
70
|
-
icon_deg: 270,
|
|
71
|
-
text_align: "left",
|
|
72
|
-
on_click: () => {
|
|
73
|
-
console.log("shift sort up")
|
|
74
|
-
},
|
|
75
|
-
})
|
|
76
|
-
let shift_down_button_manager = create_button_manager({
|
|
77
|
-
type: "soft",
|
|
78
|
-
text: "Shift Down",
|
|
79
|
-
support_icon: "arrow_tailed",
|
|
80
|
-
text_align: "left",
|
|
81
|
-
icon_deg: 90,
|
|
82
|
-
on_click: () => {
|
|
83
|
-
console.log("shift sort down")
|
|
84
|
-
},
|
|
85
|
-
})
|
|
86
49
|
let is_ascending_checkbox_manager = create_checkbox_manager({
|
|
87
50
|
type: "toggle",
|
|
88
51
|
val: sorts?.[i]?.is_ascending ?? null,
|
|
@@ -99,11 +62,7 @@ export function create_sort_by_input_manager(config) {
|
|
|
99
62
|
})
|
|
100
63
|
sorts_prepped_loc.push({
|
|
101
64
|
...sorts?.[i],
|
|
102
|
-
extra_button_manager: extra_button_manager,
|
|
103
|
-
extra_popover_manager: extra_popover_manager,
|
|
104
65
|
delete_button_manager: delete_button_manager,
|
|
105
|
-
shift_up_button_manager: shift_up_button_manager,
|
|
106
|
-
shift_down_button_manager: shift_down_button_manager,
|
|
107
66
|
is_ascending_checkbox_manager: is_ascending_checkbox_manager,
|
|
108
67
|
variable_path_input_manager: variable_path_input_manager,
|
|
109
68
|
})
|
|
@@ -58,8 +58,8 @@ export function create_table_advanced_manager(config) {
|
|
|
58
58
|
let pagination_manager = $state(null)
|
|
59
59
|
let rows_per_page_dropdown_manager = $state(null)
|
|
60
60
|
let cur_page = $state(1)
|
|
61
|
-
let sort_by = $state(null)
|
|
62
61
|
let load_more_button_manager = $state(null)
|
|
62
|
+
let sort_by = $state(null)
|
|
63
63
|
let sort_by_input_manager = $state(null)
|
|
64
64
|
let is_bulk_select = $state(false)
|
|
65
65
|
let toggle_bulk_selectable_button_manager = $state(null)
|
|
@@ -142,32 +142,29 @@ export function create_table_advanced_manager(config) {
|
|
|
142
142
|
} else {
|
|
143
143
|
row_indexes = Array.isArray(rows_prepped) ? Array.from({ length: rows_prepped.length }, (_, i) => i) : []
|
|
144
144
|
}
|
|
145
|
+
function get_column_value(row, column_id) {
|
|
146
|
+
const attrs = row?.columns?.[column_id]?.body_content?.attributes ?? {}
|
|
147
|
+
const val_from_variable_path = attrs.val_from_variable_path ?? attrs.content_from_variable_path
|
|
148
|
+
if (val_from_variable_path) {
|
|
149
|
+
return get_def_from_variable_path(val_from_variable_path, [{ row_i: row?.row_i }, ...definition_stack])
|
|
150
|
+
}
|
|
151
|
+
return attrs.val ?? attrs.content ?? null
|
|
152
|
+
}
|
|
145
153
|
if (Array.isArray(sort_by) && sort_by.length > 0) {
|
|
146
154
|
row_indexes.sort((a, b) => {
|
|
147
155
|
for (let sort_item of sort_by) {
|
|
148
156
|
const column_id = sort_item?.variable_path?.[0]
|
|
149
157
|
const is_ascending = !!sort_item?.is_ascending
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
rows_prepped[b]?.columns?.[column_id]?.content_manager?.val_prepped?.attributes?.val ??
|
|
158
|
-
rows_prepped[b]?.columns?.[column_id]?.body_content?.attributes?.val ??
|
|
159
|
-
rows_prepped[b]?.columns?.[column_id]?.body_content?.attributes?.content ??
|
|
160
|
-
rows_prepped[b]?.columns?.[column_id]?.body_content?.attributes?.content_from_variable_path ??
|
|
161
|
-
null
|
|
162
|
-
if (val_a === val_b) continue
|
|
163
|
-
if (val_a == null) return is_ascending ? 1 : -1
|
|
164
|
-
if (val_b == null) return is_ascending ? -1 : 1
|
|
165
|
-
|
|
166
|
-
if (typeof val_a === "number" && typeof val_b === "number") {
|
|
167
|
-
return is_ascending ? val_a - val_b : val_b - val_a
|
|
158
|
+
let a_val = get_column_value(rows_prepped[a], column_id)
|
|
159
|
+
let b_val = get_column_value(rows_prepped[b], column_id)
|
|
160
|
+
if (a_val === b_val) continue
|
|
161
|
+
if (a_val == null) return is_ascending ? 1 : -1
|
|
162
|
+
if (b_val == null) return is_ascending ? -1 : 1
|
|
163
|
+
if (typeof a_val === "number" && typeof b_val === "number") {
|
|
164
|
+
return is_ascending ? a_val - b_val : b_val - a_val
|
|
168
165
|
}
|
|
169
|
-
const a_str = Array.isArray(
|
|
170
|
-
const b_str = Array.isArray(
|
|
166
|
+
const a_str = Array.isArray(a_val) ? a_val.join(",") : String(a_val)
|
|
167
|
+
const b_str = Array.isArray(b_val) ? b_val.join(",") : String(b_val)
|
|
171
168
|
if (a_str === b_str) continue
|
|
172
169
|
return is_ascending ? a_str.localeCompare(b_str) : b_str.localeCompare(a_str)
|
|
173
170
|
}
|
|
@@ -191,7 +188,6 @@ export function create_table_advanced_manager(config) {
|
|
|
191
188
|
const raf = () => (browser ? new Promise(requestAnimationFrame) : new Promise((r) => setTimeout(r, 0)))
|
|
192
189
|
|
|
193
190
|
async function set_rows_prepped(columns_prepped_input) {
|
|
194
|
-
console.log("set_rows_prepped", rows_data)
|
|
195
191
|
is_loading_rows = true
|
|
196
192
|
rows_prepped = []
|
|
197
193
|
loading_rows_progress = 0
|
|
@@ -216,7 +212,6 @@ export function create_table_advanced_manager(config) {
|
|
|
216
212
|
}
|
|
217
213
|
|
|
218
214
|
function get_row_prepped(columns_prepped_input, row_data, row_i) {
|
|
219
|
-
// console.log("get_row_prepped", { row_data, row_i, ds: [{ [row_iter_identifier]: row_i }, ...definition_stack] })
|
|
220
215
|
let searchable_text = ""
|
|
221
216
|
let columns_prepped_loc = {}
|
|
222
217
|
if (Array.isArray(column_ids_display_order)) {
|
|
@@ -483,7 +478,6 @@ export function create_table_advanced_manager(config) {
|
|
|
483
478
|
}
|
|
484
479
|
)
|
|
485
480
|
} else {
|
|
486
|
-
console.log("insert_column_error_tbd", res)
|
|
487
481
|
preempt_insert_column_popover_manager.show_temp_message("Error inserting column", "error", 1800, false)
|
|
488
482
|
}
|
|
489
483
|
}
|
|
@@ -498,7 +492,6 @@ export function create_table_advanced_manager(config) {
|
|
|
498
492
|
const path_to_set = [...rows_data_from_variable_path, Number.isInteger(row_i) ? row_i : 0]
|
|
499
493
|
let editable_row = null
|
|
500
494
|
if (!Number.isInteger(row_i)) {
|
|
501
|
-
console.log("columns_prepped", columns_prepped)
|
|
502
495
|
editable_row = {}
|
|
503
496
|
} else {
|
|
504
497
|
editable_row = get_def_from_variable_path([...rows_data_from_variable_path, row_i], definition_stack)
|
|
@@ -533,7 +526,6 @@ export function create_table_advanced_manager(config) {
|
|
|
533
526
|
on_click: async () => {
|
|
534
527
|
upsert_row_is_loading = true
|
|
535
528
|
const row_data = get_def_from_variable_path([row_edit_def_identifier], row_definition_stack)
|
|
536
|
-
console.log("edited_row", { row_i, row_data })
|
|
537
529
|
if (Number.isInteger(row_i)) {
|
|
538
530
|
if (typeof config?.on_event == "function") {
|
|
539
531
|
const res = await config?.on_event({
|
|
@@ -569,7 +561,6 @@ export function create_table_advanced_manager(config) {
|
|
|
569
561
|
row: row_data,
|
|
570
562
|
path: path_to_set,
|
|
571
563
|
})
|
|
572
|
-
console.log("insert_row_res", { res, columns_prepped })
|
|
573
564
|
if (res?.is_success) {
|
|
574
565
|
preempt_insert_row_popover_manager.show_temp_message(
|
|
575
566
|
"Successfully inserted row",
|
|
@@ -579,7 +570,6 @@ export function create_table_advanced_manager(config) {
|
|
|
579
570
|
() => set_rows_prepped(columns_prepped)
|
|
580
571
|
)
|
|
581
572
|
} else {
|
|
582
|
-
console.log("insert_row_error_tbd", res)
|
|
583
573
|
preempt_insert_row_popover_manager.show_temp_message("Error insering row", "error", 1800, false)
|
|
584
574
|
}
|
|
585
575
|
}
|
|
@@ -745,7 +735,6 @@ export function create_table_advanced_manager(config) {
|
|
|
745
735
|
}
|
|
746
736
|
|
|
747
737
|
function reset_definition_stack(input) {
|
|
748
|
-
console.log("reset_definition_stack", deep_copy(input))
|
|
749
738
|
definition_stack = input
|
|
750
739
|
set_rows_prepped(columns_prepped)
|
|
751
740
|
}
|
|
@@ -759,7 +748,7 @@ export function create_table_advanced_manager(config) {
|
|
|
759
748
|
table_id = config?.table_id
|
|
760
749
|
table_name = config?.table_name
|
|
761
750
|
table_description = config?.table_description
|
|
762
|
-
sort_by = config?.table?.
|
|
751
|
+
sort_by = config?.table?.sort_by
|
|
763
752
|
rows_data_from_variable_path = config?.rows_data_from_variable_path
|
|
764
753
|
row_iter_identifier = config?.row_iter_identifier ?? "row_i"
|
|
765
754
|
definition_stack = config?.definition_stack
|
|
@@ -814,7 +803,6 @@ export function create_table_advanced_manager(config) {
|
|
|
814
803
|
val: sort_by,
|
|
815
804
|
apply_sort: (input) => {
|
|
816
805
|
sort_by = input
|
|
817
|
-
console.log("apply_sort", sort_by)
|
|
818
806
|
},
|
|
819
807
|
save_server_sort: async (input) => {
|
|
820
808
|
if (typeof config?.on_event == "function") {
|
|
@@ -826,7 +814,6 @@ export function create_table_advanced_manager(config) {
|
|
|
826
814
|
}
|
|
827
815
|
},
|
|
828
816
|
get_defined_options: () => {
|
|
829
|
-
console.log("columns_prepped", columns_prepped)
|
|
830
817
|
const defined_options = Object.keys(columns_prepped || {}).map((h) => ({ key: h, name: h }))
|
|
831
818
|
return defined_options
|
|
832
819
|
},
|
|
@@ -1020,7 +1007,6 @@ export function create_table_advanced_manager(config) {
|
|
|
1020
1007
|
}
|
|
1021
1008
|
)
|
|
1022
1009
|
} else {
|
|
1023
|
-
console.log("update_row_error_tbd", res)
|
|
1024
1010
|
prempt_bulk_upload_rows_popover_manager.show_temp_message("Error bulk inserting rows", "error", 1800, false)
|
|
1025
1011
|
}
|
|
1026
1012
|
}
|
|
@@ -2,7 +2,6 @@ import { create_popover_manager } from "../Popover/index.svelte.js"
|
|
|
2
2
|
import { create_button_manager } from "../Button/index.svelte.js"
|
|
3
3
|
import { create_text_input_manager } from "../TextInput/index.svelte.js"
|
|
4
4
|
import { create_dropdown_manager } from "../Dropdown/index.svelte.js"
|
|
5
|
-
import { deep_copy } from "../../client/index.js"
|
|
6
5
|
|
|
7
6
|
export function create_variable_path_input_manager(config) {
|
|
8
7
|
let popover_manager = $state(null)
|
|
@@ -23,7 +22,6 @@ export function create_variable_path_input_manager(config) {
|
|
|
23
22
|
}
|
|
24
23
|
|
|
25
24
|
function prep_path(input) {
|
|
26
|
-
console.log("prep_path", input)
|
|
27
25
|
let path_prepped_loc = $state([])
|
|
28
26
|
if (Array.isArray(input)) {
|
|
29
27
|
let variable_data_type_at_path = Array.isArray(defined_options)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sveltekit-ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.18",
|
|
4
4
|
"description": "A SvelteKit UI component library for building modern web applications",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"@sveltejs/vite-plugin-svelte": "^6.1.0",
|
|
32
32
|
"@vercel/analytics": "^1.5.0",
|
|
33
33
|
"typescript": "^5.9.2",
|
|
34
|
-
"vite": "^7.1.
|
|
34
|
+
"vite": "^7.1.1"
|
|
35
35
|
},
|
|
36
36
|
"homepage": "https://www.sveltekit-ui.com",
|
|
37
37
|
"keywords": [
|
|
@@ -13,8 +13,9 @@
|
|
|
13
13
|
<thead>
|
|
14
14
|
<tr>
|
|
15
15
|
<th>Sort Order</th>
|
|
16
|
-
<th>Data
|
|
16
|
+
<th>Data Variable Path</th>
|
|
17
17
|
<th>Is Ascending</th>
|
|
18
|
+
<th>Remove</th>
|
|
18
19
|
<th></th>
|
|
19
20
|
</tr>
|
|
20
21
|
</thead>
|
|
@@ -29,20 +30,7 @@
|
|
|
29
30
|
<td>
|
|
30
31
|
<Checkbox manager={sort_prepped?.is_ascending_checkbox_manager} />
|
|
31
32
|
</td>
|
|
32
|
-
<td>
|
|
33
|
-
<Button manager={sort_prepped?.extra_button_manager} />
|
|
34
|
-
<Popover manager={sort_prepped?.extra_popover_manager}>
|
|
35
|
-
{#snippet content()}
|
|
36
|
-
{#if Array(manager?.sorts_prepped) && manager?.sorts_prepped.length > 0 && i > 1}
|
|
37
|
-
<Button manager={sort_prepped?.shift_up_button_manager} />
|
|
38
|
-
{/if}
|
|
39
|
-
{#if Array(manager?.sorts_prepped) && manager?.sorts_prepped.length > 1 && i < manager?.sorts_prepped.length}
|
|
40
|
-
<Button manager={sort_prepped?.shift_down_button_manager} />
|
|
41
|
-
{/if}
|
|
42
|
-
<Button manager={sort_prepped?.delete_button_manager} />
|
|
43
|
-
{/snippet}
|
|
44
|
-
</Popover>
|
|
45
|
-
</td>
|
|
33
|
+
<td><Button manager={sort_prepped?.delete_button_manager} /></td>
|
|
46
34
|
</tr>
|
|
47
35
|
{/each}
|
|
48
36
|
{:else}
|
|
@@ -53,7 +41,9 @@
|
|
|
53
41
|
</tbody>
|
|
54
42
|
</table>
|
|
55
43
|
</div>
|
|
56
|
-
<
|
|
44
|
+
<div style="margin-top: 1rem;">
|
|
45
|
+
<Button manager={manager?.add_sort_button_manager} />
|
|
46
|
+
</div>
|
|
57
47
|
{/snippet}
|
|
58
48
|
|
|
59
49
|
{#if manager?.is_popover}
|
|
@@ -35,54 +35,17 @@ export function create_sort_by_input_manager(config) {
|
|
|
35
35
|
let sorts_prepped_loc = []
|
|
36
36
|
if (Array.isArray(sorts)) {
|
|
37
37
|
for (let i = 0; i < sorts.length; i++) {
|
|
38
|
-
let extra_button_manager = $state(null)
|
|
39
|
-
let extra_popover_manager = $state(null)
|
|
40
|
-
extra_popover_manager = create_popover_manager({
|
|
41
|
-
target_width: 200,
|
|
42
|
-
target_height: 200,
|
|
43
|
-
type: "dropdown",
|
|
44
|
-
anchor_id: () => `button_${extra_button_manager?.id}`,
|
|
45
|
-
})
|
|
46
|
-
extra_button_manager = create_button_manager({
|
|
47
|
-
type: "soft",
|
|
48
|
-
support_icon: "three_dots",
|
|
49
|
-
icon_sw: 60,
|
|
50
|
-
is_uniform: true,
|
|
51
|
-
popover_target: () => `popover_${extra_popover_manager?.id}`,
|
|
52
|
-
})
|
|
53
38
|
let delete_button_manager = create_button_manager({
|
|
54
|
-
type: "
|
|
55
|
-
|
|
39
|
+
type: "outlined",
|
|
40
|
+
is_uniform: true,
|
|
56
41
|
support_icon: "x",
|
|
57
42
|
color: "var(--error-t)",
|
|
58
|
-
text_align: "left",
|
|
59
43
|
on_click: () => {
|
|
60
|
-
extra_popover_manager.close()
|
|
61
44
|
if (Array.isArray(sorts_prepped) && i >= 0 && i < sorts_prepped.length) {
|
|
62
45
|
sorts_prepped.splice(i, 1)
|
|
63
46
|
}
|
|
64
47
|
},
|
|
65
48
|
})
|
|
66
|
-
let shift_up_button_manager = create_button_manager({
|
|
67
|
-
type: "soft",
|
|
68
|
-
text: "Shift Up",
|
|
69
|
-
support_icon: "arrow_tailed",
|
|
70
|
-
icon_deg: 270,
|
|
71
|
-
text_align: "left",
|
|
72
|
-
on_click: () => {
|
|
73
|
-
console.log("shift sort up")
|
|
74
|
-
},
|
|
75
|
-
})
|
|
76
|
-
let shift_down_button_manager = create_button_manager({
|
|
77
|
-
type: "soft",
|
|
78
|
-
text: "Shift Down",
|
|
79
|
-
support_icon: "arrow_tailed",
|
|
80
|
-
text_align: "left",
|
|
81
|
-
icon_deg: 90,
|
|
82
|
-
on_click: () => {
|
|
83
|
-
console.log("shift sort down")
|
|
84
|
-
},
|
|
85
|
-
})
|
|
86
49
|
let is_ascending_checkbox_manager = create_checkbox_manager({
|
|
87
50
|
type: "toggle",
|
|
88
51
|
val: sorts?.[i]?.is_ascending ?? null,
|
|
@@ -99,11 +62,7 @@ export function create_sort_by_input_manager(config) {
|
|
|
99
62
|
})
|
|
100
63
|
sorts_prepped_loc.push({
|
|
101
64
|
...sorts?.[i],
|
|
102
|
-
extra_button_manager: extra_button_manager,
|
|
103
|
-
extra_popover_manager: extra_popover_manager,
|
|
104
65
|
delete_button_manager: delete_button_manager,
|
|
105
|
-
shift_up_button_manager: shift_up_button_manager,
|
|
106
|
-
shift_down_button_manager: shift_down_button_manager,
|
|
107
66
|
is_ascending_checkbox_manager: is_ascending_checkbox_manager,
|
|
108
67
|
variable_path_input_manager: variable_path_input_manager,
|
|
109
68
|
})
|
|
@@ -58,8 +58,8 @@ export function create_table_advanced_manager(config) {
|
|
|
58
58
|
let pagination_manager = $state(null)
|
|
59
59
|
let rows_per_page_dropdown_manager = $state(null)
|
|
60
60
|
let cur_page = $state(1)
|
|
61
|
-
let sort_by = $state(null)
|
|
62
61
|
let load_more_button_manager = $state(null)
|
|
62
|
+
let sort_by = $state(null)
|
|
63
63
|
let sort_by_input_manager = $state(null)
|
|
64
64
|
let is_bulk_select = $state(false)
|
|
65
65
|
let toggle_bulk_selectable_button_manager = $state(null)
|
|
@@ -142,32 +142,29 @@ export function create_table_advanced_manager(config) {
|
|
|
142
142
|
} else {
|
|
143
143
|
row_indexes = Array.isArray(rows_prepped) ? Array.from({ length: rows_prepped.length }, (_, i) => i) : []
|
|
144
144
|
}
|
|
145
|
+
function get_column_value(row, column_id) {
|
|
146
|
+
const attrs = row?.columns?.[column_id]?.body_content?.attributes ?? {}
|
|
147
|
+
const val_from_variable_path = attrs.val_from_variable_path ?? attrs.content_from_variable_path
|
|
148
|
+
if (val_from_variable_path) {
|
|
149
|
+
return get_def_from_variable_path(val_from_variable_path, [{ row_i: row?.row_i }, ...definition_stack])
|
|
150
|
+
}
|
|
151
|
+
return attrs.val ?? attrs.content ?? null
|
|
152
|
+
}
|
|
145
153
|
if (Array.isArray(sort_by) && sort_by.length > 0) {
|
|
146
154
|
row_indexes.sort((a, b) => {
|
|
147
155
|
for (let sort_item of sort_by) {
|
|
148
156
|
const column_id = sort_item?.variable_path?.[0]
|
|
149
157
|
const is_ascending = !!sort_item?.is_ascending
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
rows_prepped[b]?.columns?.[column_id]?.content_manager?.val_prepped?.attributes?.val ??
|
|
158
|
-
rows_prepped[b]?.columns?.[column_id]?.body_content?.attributes?.val ??
|
|
159
|
-
rows_prepped[b]?.columns?.[column_id]?.body_content?.attributes?.content ??
|
|
160
|
-
rows_prepped[b]?.columns?.[column_id]?.body_content?.attributes?.content_from_variable_path ??
|
|
161
|
-
null
|
|
162
|
-
if (val_a === val_b) continue
|
|
163
|
-
if (val_a == null) return is_ascending ? 1 : -1
|
|
164
|
-
if (val_b == null) return is_ascending ? -1 : 1
|
|
165
|
-
|
|
166
|
-
if (typeof val_a === "number" && typeof val_b === "number") {
|
|
167
|
-
return is_ascending ? val_a - val_b : val_b - val_a
|
|
158
|
+
let a_val = get_column_value(rows_prepped[a], column_id)
|
|
159
|
+
let b_val = get_column_value(rows_prepped[b], column_id)
|
|
160
|
+
if (a_val === b_val) continue
|
|
161
|
+
if (a_val == null) return is_ascending ? 1 : -1
|
|
162
|
+
if (b_val == null) return is_ascending ? -1 : 1
|
|
163
|
+
if (typeof a_val === "number" && typeof b_val === "number") {
|
|
164
|
+
return is_ascending ? a_val - b_val : b_val - a_val
|
|
168
165
|
}
|
|
169
|
-
const a_str = Array.isArray(
|
|
170
|
-
const b_str = Array.isArray(
|
|
166
|
+
const a_str = Array.isArray(a_val) ? a_val.join(",") : String(a_val)
|
|
167
|
+
const b_str = Array.isArray(b_val) ? b_val.join(",") : String(b_val)
|
|
171
168
|
if (a_str === b_str) continue
|
|
172
169
|
return is_ascending ? a_str.localeCompare(b_str) : b_str.localeCompare(a_str)
|
|
173
170
|
}
|
|
@@ -191,7 +188,6 @@ export function create_table_advanced_manager(config) {
|
|
|
191
188
|
const raf = () => (browser ? new Promise(requestAnimationFrame) : new Promise((r) => setTimeout(r, 0)))
|
|
192
189
|
|
|
193
190
|
async function set_rows_prepped(columns_prepped_input) {
|
|
194
|
-
console.log("set_rows_prepped", rows_data)
|
|
195
191
|
is_loading_rows = true
|
|
196
192
|
rows_prepped = []
|
|
197
193
|
loading_rows_progress = 0
|
|
@@ -216,7 +212,6 @@ export function create_table_advanced_manager(config) {
|
|
|
216
212
|
}
|
|
217
213
|
|
|
218
214
|
function get_row_prepped(columns_prepped_input, row_data, row_i) {
|
|
219
|
-
// console.log("get_row_prepped", { row_data, row_i, ds: [{ [row_iter_identifier]: row_i }, ...definition_stack] })
|
|
220
215
|
let searchable_text = ""
|
|
221
216
|
let columns_prepped_loc = {}
|
|
222
217
|
if (Array.isArray(column_ids_display_order)) {
|
|
@@ -483,7 +478,6 @@ export function create_table_advanced_manager(config) {
|
|
|
483
478
|
}
|
|
484
479
|
)
|
|
485
480
|
} else {
|
|
486
|
-
console.log("insert_column_error_tbd", res)
|
|
487
481
|
preempt_insert_column_popover_manager.show_temp_message("Error inserting column", "error", 1800, false)
|
|
488
482
|
}
|
|
489
483
|
}
|
|
@@ -498,7 +492,6 @@ export function create_table_advanced_manager(config) {
|
|
|
498
492
|
const path_to_set = [...rows_data_from_variable_path, Number.isInteger(row_i) ? row_i : 0]
|
|
499
493
|
let editable_row = null
|
|
500
494
|
if (!Number.isInteger(row_i)) {
|
|
501
|
-
console.log("columns_prepped", columns_prepped)
|
|
502
495
|
editable_row = {}
|
|
503
496
|
} else {
|
|
504
497
|
editable_row = get_def_from_variable_path([...rows_data_from_variable_path, row_i], definition_stack)
|
|
@@ -533,7 +526,6 @@ export function create_table_advanced_manager(config) {
|
|
|
533
526
|
on_click: async () => {
|
|
534
527
|
upsert_row_is_loading = true
|
|
535
528
|
const row_data = get_def_from_variable_path([row_edit_def_identifier], row_definition_stack)
|
|
536
|
-
console.log("edited_row", { row_i, row_data })
|
|
537
529
|
if (Number.isInteger(row_i)) {
|
|
538
530
|
if (typeof config?.on_event == "function") {
|
|
539
531
|
const res = await config?.on_event({
|
|
@@ -569,7 +561,6 @@ export function create_table_advanced_manager(config) {
|
|
|
569
561
|
row: row_data,
|
|
570
562
|
path: path_to_set,
|
|
571
563
|
})
|
|
572
|
-
console.log("insert_row_res", { res, columns_prepped })
|
|
573
564
|
if (res?.is_success) {
|
|
574
565
|
preempt_insert_row_popover_manager.show_temp_message(
|
|
575
566
|
"Successfully inserted row",
|
|
@@ -579,7 +570,6 @@ export function create_table_advanced_manager(config) {
|
|
|
579
570
|
() => set_rows_prepped(columns_prepped)
|
|
580
571
|
)
|
|
581
572
|
} else {
|
|
582
|
-
console.log("insert_row_error_tbd", res)
|
|
583
573
|
preempt_insert_row_popover_manager.show_temp_message("Error insering row", "error", 1800, false)
|
|
584
574
|
}
|
|
585
575
|
}
|
|
@@ -745,7 +735,6 @@ export function create_table_advanced_manager(config) {
|
|
|
745
735
|
}
|
|
746
736
|
|
|
747
737
|
function reset_definition_stack(input) {
|
|
748
|
-
console.log("reset_definition_stack", deep_copy(input))
|
|
749
738
|
definition_stack = input
|
|
750
739
|
set_rows_prepped(columns_prepped)
|
|
751
740
|
}
|
|
@@ -759,7 +748,7 @@ export function create_table_advanced_manager(config) {
|
|
|
759
748
|
table_id = config?.table_id
|
|
760
749
|
table_name = config?.table_name
|
|
761
750
|
table_description = config?.table_description
|
|
762
|
-
sort_by = config?.table?.
|
|
751
|
+
sort_by = config?.table?.sort_by
|
|
763
752
|
rows_data_from_variable_path = config?.rows_data_from_variable_path
|
|
764
753
|
row_iter_identifier = config?.row_iter_identifier ?? "row_i"
|
|
765
754
|
definition_stack = config?.definition_stack
|
|
@@ -814,7 +803,6 @@ export function create_table_advanced_manager(config) {
|
|
|
814
803
|
val: sort_by,
|
|
815
804
|
apply_sort: (input) => {
|
|
816
805
|
sort_by = input
|
|
817
|
-
console.log("apply_sort", sort_by)
|
|
818
806
|
},
|
|
819
807
|
save_server_sort: async (input) => {
|
|
820
808
|
if (typeof config?.on_event == "function") {
|
|
@@ -826,7 +814,6 @@ export function create_table_advanced_manager(config) {
|
|
|
826
814
|
}
|
|
827
815
|
},
|
|
828
816
|
get_defined_options: () => {
|
|
829
|
-
console.log("columns_prepped", columns_prepped)
|
|
830
817
|
const defined_options = Object.keys(columns_prepped || {}).map((h) => ({ key: h, name: h }))
|
|
831
818
|
return defined_options
|
|
832
819
|
},
|
|
@@ -1020,7 +1007,6 @@ export function create_table_advanced_manager(config) {
|
|
|
1020
1007
|
}
|
|
1021
1008
|
)
|
|
1022
1009
|
} else {
|
|
1023
|
-
console.log("update_row_error_tbd", res)
|
|
1024
1010
|
prempt_bulk_upload_rows_popover_manager.show_temp_message("Error bulk inserting rows", "error", 1800, false)
|
|
1025
1011
|
}
|
|
1026
1012
|
}
|
|
@@ -2,7 +2,6 @@ import { create_popover_manager } from "$lib/Components/Popover/index.svelte.js"
|
|
|
2
2
|
import { create_button_manager } from "$lib/Components/Button/index.svelte.js"
|
|
3
3
|
import { create_text_input_manager } from "$lib/Components/TextInput/index.svelte.js"
|
|
4
4
|
import { create_dropdown_manager } from "$lib/Components/Dropdown/index.svelte.js"
|
|
5
|
-
import { deep_copy } from "$lib/client/index.js"
|
|
6
5
|
|
|
7
6
|
export function create_variable_path_input_manager(config) {
|
|
8
7
|
let popover_manager = $state(null)
|
|
@@ -23,7 +22,6 @@ export function create_variable_path_input_manager(config) {
|
|
|
23
22
|
}
|
|
24
23
|
|
|
25
24
|
function prep_path(input) {
|
|
26
|
-
console.log("prep_path", input)
|
|
27
25
|
let path_prepped_loc = $state([])
|
|
28
26
|
if (Array.isArray(input)) {
|
|
29
27
|
let variable_data_type_at_path = Array.isArray(defined_options)
|
|
@@ -268,19 +268,19 @@
|
|
|
268
268
|
is_autogenerated: true,
|
|
269
269
|
is_force_uniqueness: false,
|
|
270
270
|
},
|
|
271
|
-
|
|
271
|
+
population: {
|
|
272
272
|
is_fixed: false,
|
|
273
273
|
is_shown: true,
|
|
274
274
|
alignment: "left",
|
|
275
275
|
max_width: 30,
|
|
276
276
|
min_width: 20,
|
|
277
|
-
description: "
|
|
277
|
+
description: "population",
|
|
278
278
|
is_nullable: true,
|
|
279
279
|
body_content: {
|
|
280
280
|
type_id: "number",
|
|
281
281
|
children: [],
|
|
282
282
|
attributes: {
|
|
283
|
-
val_from_variable_path: ["rows", ["row_i"], "
|
|
283
|
+
val_from_variable_path: ["rows", ["row_i"], "population"],
|
|
284
284
|
},
|
|
285
285
|
selector_id: "vukyefhw",
|
|
286
286
|
},
|
|
@@ -297,7 +297,45 @@
|
|
|
297
297
|
type_id: "base_text",
|
|
298
298
|
children: [],
|
|
299
299
|
attributes: {
|
|
300
|
-
content: "
|
|
300
|
+
content: "Population",
|
|
301
|
+
},
|
|
302
|
+
selector_id: "lpcqsjlq",
|
|
303
|
+
},
|
|
304
|
+
is_primary_key: false,
|
|
305
|
+
is_autogenerated: false,
|
|
306
|
+
is_force_uniqueness: false,
|
|
307
|
+
is_use_in_short_display: false,
|
|
308
|
+
},
|
|
309
|
+
us_state: {
|
|
310
|
+
is_fixed: false,
|
|
311
|
+
is_shown: true,
|
|
312
|
+
alignment: "left",
|
|
313
|
+
max_width: 30,
|
|
314
|
+
min_width: 20,
|
|
315
|
+
description: "us_state",
|
|
316
|
+
is_nullable: true,
|
|
317
|
+
body_content: {
|
|
318
|
+
type_id: "base_text",
|
|
319
|
+
children: [],
|
|
320
|
+
attributes: {
|
|
321
|
+
content_from_variable_path: ["rows", ["row_i"], "us_state"],
|
|
322
|
+
},
|
|
323
|
+
selector_id: "kukyefhw",
|
|
324
|
+
},
|
|
325
|
+
db_data_type: {
|
|
326
|
+
type: "text_literal",
|
|
327
|
+
attributes: {},
|
|
328
|
+
},
|
|
329
|
+
is_db_column: true,
|
|
330
|
+
is_updatable: false,
|
|
331
|
+
default_value: null,
|
|
332
|
+
display_order: 2,
|
|
333
|
+
postgres_type: "text",
|
|
334
|
+
header_content: {
|
|
335
|
+
type_id: "base_text",
|
|
336
|
+
children: [],
|
|
337
|
+
attributes: {
|
|
338
|
+
content: "US State",
|
|
301
339
|
},
|
|
302
340
|
selector_id: "lpcqsjlq",
|
|
303
341
|
},
|
|
@@ -329,7 +367,7 @@
|
|
|
329
367
|
},
|
|
330
368
|
is_db_column: true,
|
|
331
369
|
default_value: null,
|
|
332
|
-
display_order:
|
|
370
|
+
display_order: 3,
|
|
333
371
|
postgres_type: "bigint",
|
|
334
372
|
header_content: {
|
|
335
373
|
type_id: "base_text",
|
|
@@ -366,7 +404,7 @@
|
|
|
366
404
|
},
|
|
367
405
|
is_db_column: true,
|
|
368
406
|
default_value: null,
|
|
369
|
-
display_order:
|
|
407
|
+
display_order: 4,
|
|
370
408
|
postgres_type: "bigint",
|
|
371
409
|
header_content: {
|
|
372
410
|
type_id: "base_text",
|
|
@@ -390,7 +428,13 @@
|
|
|
390
428
|
})
|
|
391
429
|
|
|
392
430
|
let table_manager = $state(null)
|
|
393
|
-
let variables = $state({
|
|
431
|
+
let variables = $state({
|
|
432
|
+
rows: [
|
|
433
|
+
{ us_state: "cccc", population: 200 },
|
|
434
|
+
{ us_state: "zzzz", population: 20 },
|
|
435
|
+
{ us_state: "aaaaa", population: 400 },
|
|
436
|
+
],
|
|
437
|
+
})
|
|
394
438
|
|
|
395
439
|
table_manager = create_table_advanced_manager({
|
|
396
440
|
table_id: "abcdefg",
|