sveltekit-ui 1.0.30 → 1.0.31

package/dist/Components/ContentInput/AttributesInput/index.svelte.js

@@ -1313,15 +1313,8 @@ export function create_attributes_input_manager(config) {
         let val_input_manager = $state(
           create_variable_path_input_manager({
             val: config?.val?.val_from_variable_path,
-            // defined_data_type: {
-            //   ...defined_data_type,
-            //   properties: {
-            //     ...defined_data_type?.properties,
-            //     [iter_identifier_text_input_manager?.val]: { type: "int_literal" },
-            //   },
-            // },
             get_defined_options: config?.get_defined_options,
-            on_finish: () => attributes_manager.close_popover(),
+            on_finish: () => val_input_manager.close_popover(),
           })
         )
         let join_text_text_input_manager = $state(

package/dist/Components/ContentInput/index.svelte.js

@@ -56,7 +56,10 @@ export function create_content_input_manager(config) {
       if (input?.type_id == selector_id) {
         return { defined, is_found_selector_id: true }
       } else if (input?.type_id == "loop") {
-        defined[input?.attributes?.iter_identifier] = { type: "text_literal" }
+        console.log("loop_iter_iter_identifier", input?.attributes?.iter_identifier)
+        if (input?.attributes?.iter_identifier) {
+          defined[input?.attributes?.iter_identifier] = { type: "text_literal" }
+        }
       }
       if (Array.isArray(input?.children)) {
         for (let child of input?.children) {
@@ -73,10 +76,13 @@ export function create_content_input_manager(config) {
   }
 
   function get_defined_options(selector_id) {
+    console.log("get_defined_options", deep_copy({ definition_stack, selector_id }))
     const defined_at_selector_id = get_defined_at_selector_id(selector_id)
+    console.log("defined_at_selector_id", deep_copy({ defined_at_selector_id }))
     const defined_data_type = json_to_data_type(
       Object.assign({}, ...[...(Array.isArray(definition_stack) ? definition_stack : [])].reverse())
     )
+    console.log("defined_data_type", deep_copy({ defined_data_type }))
     return Object.entries({ ...(defined_data_type?.properties || {}), ...defined_at_selector_id }).map(
       ([key, val]) => ({
         key,

package/dist/Components/TableAdvanced/ColumnInput/index.svelte.js

@@ -13,6 +13,8 @@ import {
   variables_data_type_remaining_to_astc,
   set_definition_stack,
   astc_element,
+  deep_copy,
+  get_def_from_variable_path,
 } from "../../../client/index.js"
 
 export function create_column_input_manager(config) {
@@ -110,7 +112,7 @@ export function create_column_input_manager(config) {
   }
 
   function init(config) {
-    console.log("column_input_init", config)
+    console.log("column_input_init", deep_copy(config))
     definition_stack = config?.definition_stack
     column_id_text_input_manager = create_text_input_manager({
       label: "Column ID",
@@ -121,20 +123,16 @@ export function create_column_input_manager(config) {
       storage: null,
       storage_default_folder_path: null,
       definition_stack: definition_stack,
-      on_event: (input) => {
-        console.log("set_definition_stack_tbd400", input)
-        set_definition_stack(input)
-      },
     })
+    const editable_row = get_def_from_variable_path([...rows_data_from_variable_path, 0], definition_stack)
+    const row_definition_stack = row_iter_identifier
+      ? [{ [row_iter_identifier]: editable_row }, ...definition_stack]
+      : definition_stack
     body_content_input_manager = create_content_input_manager({
       val: config?.val?.body_content ?? null,
       storage: config?.storage,
       storage_default_folder_path: null,
-      definition_stack: definition_stack,
-      on_event: (input) => {
-        console.log("set_definition_stack_tbd33")
-        set_definition_stack(input)
-      },
+      definition_stack: row_definition_stack,
     })
     column_description_text_input_manager = create_text_input_manager({
       type: "text_area",
@@ -192,24 +190,28 @@ export function create_column_input_manager(config) {
       val: config?.val?.is_db_column ?? column_input_options?.is_db_column?.default_value ?? false,
     })
     column_db_data_type_input_manager = create_data_type_input_manager({
-      // data_sample: () => variables,
       table_options: config?.table_options,
       val: config?.val?.db_data_type,
       on_finish: (input) => {
-        let default_content_input_astc = variables_data_type_remaining_to_astc(input, "input", ["rows"])
+        let default_content_input_astc = variables_data_type_remaining_to_astc(input, "input", [
+          ...(Array.isArray(rows_data_from_variable_path) ? rows_data_from_variable_path : []),
+          [row_iter_identifier],
+          column_id_text_input_manager.val,
+        ])
         column_default_value_content_manager = create_content_manager({
           val: default_content_input_astc,
           table_options: config?.table_options,
           on_search_table_row_ids: config?.on_search_table_row_ids,
           definition_stack: definition_stack,
           on_event: (input) => {
-            const res = set_definition_stack(
-              input,
-              definition_stack,
-              column_default_value_content_manager?.pass_event_down
-            )
-            definition_stack = res?.definition_stack
-            return res
+            // console.log("input3334", input)
+            // const res = set_definition_stack(
+            //   input,
+            //   definition_stack,
+            //   column_default_value_content_manager?.pass_event_down
+            // )
+            // definition_stack = res?.definition_stack
+            // return res
           },
         })
       },
@@ -260,7 +262,6 @@ export function create_column_input_manager(config) {
       font_size: 1,
       border_radius: 0.5,
       on_click: () => {
-        console.log("guess_header_content_button_manager")
         if (column_id_text_input_manager?.val) {
           const header_text = column_id_text_input_manager.val
             .split("_")
@@ -278,7 +279,6 @@ export function create_column_input_manager(config) {
       font_size: 1,
       border_radius: 0.5,
       on_click: () => {
-        console.log("guess_body_content_button_manager")
         if (column_id_text_input_manager.val && column_db_data_type_input_manager?.val) {
           let guessed_column_display_content = variables_data_type_remaining_to_astc(
             column_db_data_type_input_manager?.val,
@@ -289,7 +289,6 @@ export function create_column_input_manager(config) {
               column_id_text_input_manager.val,
             ]
           )
-          console.log("guessed_column_display_content", guessed_column_display_content)
           body_content_input_manager.add_version(guessed_column_display_content)
         } else {
           body_content_input_manager.add_version(null)

package/dist/Components/VariablePathInput/index.svelte.js

@@ -2,6 +2,7 @@ import { create_popover_manager } from "../Popover/index.svelte.js"
 import { create_button_manager } from "../Button/index.svelte.js"
 import { create_text_input_manager } from "../TextInput/index.svelte.js"
 import { create_dropdown_manager } from "../Dropdown/index.svelte.js"
+import { deep_copy } from "../../client/index.js"
 
 export function create_variable_path_input_manager(config) {
   let popover_manager = $state(null)
@@ -14,6 +15,7 @@ export function create_variable_path_input_manager(config) {
   let path_prepped = $state(null)
   let val = $derived(get_val())
   let val_text = $derived(val_to_text(val))
+  let variable_data_type_at_path = $state(null)
 
   function get_val() {
     return def_dropdown_manager?.val
@@ -24,7 +26,7 @@ export function create_variable_path_input_manager(config) {
   function prep_path(input) {
     let path_prepped_loc = $state([])
     if (Array.isArray(input)) {
-      let variable_data_type_at_path = Array.isArray(defined_options)
+      variable_data_type_at_path = Array.isArray(defined_options)
         ? defined_options.find((h) => h?.key === def_dropdown_manager?.val)?.data_type
         : null
       for (let i = 1; i < input.length; i++) {
@@ -104,7 +106,6 @@ export function create_variable_path_input_manager(config) {
             })
           }
         }
-        console.log("key_options", key_options)
         let val = $derived(
           type_dropdown_manager?.val == "string"
             ? const_string_value_text_input_manager?.val
@@ -123,6 +124,7 @@ export function create_variable_path_input_manager(config) {
             ? variable_path_input_manager?.variable_data_type_at_path
             : null
         )
+        variable_data_type_at_path = variable_data_type_at_next_path
         path_prepped_loc.push({
           get type_dropdown_manager() {
             return type_dropdown_manager
@@ -177,6 +179,9 @@ export function create_variable_path_input_manager(config) {
 
   function init(input) {
     levels_nested = input?.levels_nested ?? 0
+    if (typeof config?.get_defined_options == "function") {
+      defined_options = config?.get_defined_options()
+    }
     popover_manager = create_popover_manager({
       min_width: 280,
       target_width: 450,
@@ -239,6 +244,9 @@ export function create_variable_path_input_manager(config) {
     get val_text() {
       return val_text
     },
+    get variable_data_type_at_path() {
+      return variable_data_type_at_path
+    },
     get levels_nested() {
       return levels_nested
     },

package/dist/client/astc_formatting/index.js

@@ -792,12 +792,15 @@ export function variables_data_type_remaining_to_astc(
     // }
     const child_astc = variables_data_type_remaining_to_astc(
       variables_data_type_remaining?.items,
-      preferred_content_use
+      preferred_content_use,
+      [...leading_variable_path, ["loop_index"]]
     )
+    console.log("loop_child", { child_astc, variables_data_type_remaining })
     return astc_element("loop", [child_astc], {
       val_from_variable_path: leading_variable_path,
       ...(variables_data_type_remaining?.attributes ?? {}),
       font_size: 1.2,
+      iter_identifier: "loop_index",
     })
     // } else if (variables_data_type_remaining?.type == "list") {
     // list input tbd just content input i guess

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sveltekit-ui",
-  "version": "1.0.30",
+  "version": "1.0.31",
   "description": "A SvelteKit UI component library for building modern web applications",
   "license": "MIT",
   "type": "module",
@@ -19,7 +19,7 @@
   "dependencies": {
     "context-filter-polyfill": "^0.3.23",
     "qr-code-styling": "^1.9.2",
-    "svelte": "^5.38.2"
+    "svelte": "^5.38.3"
   },
   "peerDependencies": {
     "@sveltejs/kit": "^2.22.2"

package/src/lib/Components/ContentInput/AttributesInput/index.svelte.js

@@ -1313,15 +1313,8 @@ export function create_attributes_input_manager(config) {
         let val_input_manager = $state(
           create_variable_path_input_manager({
             val: config?.val?.val_from_variable_path,
-            // defined_data_type: {
-            //   ...defined_data_type,
-            //   properties: {
-            //     ...defined_data_type?.properties,
-            //     [iter_identifier_text_input_manager?.val]: { type: "int_literal" },
-            //   },
-            // },
             get_defined_options: config?.get_defined_options,
-            on_finish: () => attributes_manager.close_popover(),
+            on_finish: () => val_input_manager.close_popover(),
           })
         )
         let join_text_text_input_manager = $state(

package/src/lib/Components/ContentInput/index.svelte.js

@@ -56,7 +56,10 @@ export function create_content_input_manager(config) {
       if (input?.type_id == selector_id) {
         return { defined, is_found_selector_id: true }
       } else if (input?.type_id == "loop") {
-        defined[input?.attributes?.iter_identifier] = { type: "text_literal" }
+        console.log("loop_iter_iter_identifier", input?.attributes?.iter_identifier)
+        if (input?.attributes?.iter_identifier) {
+          defined[input?.attributes?.iter_identifier] = { type: "text_literal" }
+        }
       }
       if (Array.isArray(input?.children)) {
         for (let child of input?.children) {
@@ -73,10 +76,13 @@ export function create_content_input_manager(config) {
   }
 
   function get_defined_options(selector_id) {
+    console.log("get_defined_options", deep_copy({ definition_stack, selector_id }))
     const defined_at_selector_id = get_defined_at_selector_id(selector_id)
+    console.log("defined_at_selector_id", deep_copy({ defined_at_selector_id }))
     const defined_data_type = json_to_data_type(
       Object.assign({}, ...[...(Array.isArray(definition_stack) ? definition_stack : [])].reverse())
     )
+    console.log("defined_data_type", deep_copy({ defined_data_type }))
     return Object.entries({ ...(defined_data_type?.properties || {}), ...defined_at_selector_id }).map(
       ([key, val]) => ({
         key,

package/src/lib/Components/TableAdvanced/ColumnInput/index.svelte.js

@@ -13,6 +13,8 @@ import {
   variables_data_type_remaining_to_astc,
   set_definition_stack,
   astc_element,
+  deep_copy,
+  get_def_from_variable_path,
 } from "$lib/client/index.js"
 
 export function create_column_input_manager(config) {
@@ -110,7 +112,7 @@ export function create_column_input_manager(config) {
   }
 
   function init(config) {
-    console.log("column_input_init", config)
+    console.log("column_input_init", deep_copy(config))
     definition_stack = config?.definition_stack
     column_id_text_input_manager = create_text_input_manager({
       label: "Column ID",
@@ -121,20 +123,16 @@ export function create_column_input_manager(config) {
       storage: null,
       storage_default_folder_path: null,
       definition_stack: definition_stack,
-      on_event: (input) => {
-        console.log("set_definition_stack_tbd400", input)
-        set_definition_stack(input)
-      },
     })
+    const editable_row = get_def_from_variable_path([...rows_data_from_variable_path, 0], definition_stack)
+    const row_definition_stack = row_iter_identifier
+      ? [{ [row_iter_identifier]: editable_row }, ...definition_stack]
+      : definition_stack
     body_content_input_manager = create_content_input_manager({
       val: config?.val?.body_content ?? null,
       storage: config?.storage,
       storage_default_folder_path: null,
-      definition_stack: definition_stack,
-      on_event: (input) => {
-        console.log("set_definition_stack_tbd33")
-        set_definition_stack(input)
-      },
+      definition_stack: row_definition_stack,
     })
     column_description_text_input_manager = create_text_input_manager({
       type: "text_area",
@@ -192,24 +190,28 @@ export function create_column_input_manager(config) {
       val: config?.val?.is_db_column ?? column_input_options?.is_db_column?.default_value ?? false,
     })
     column_db_data_type_input_manager = create_data_type_input_manager({
-      // data_sample: () => variables,
       table_options: config?.table_options,
       val: config?.val?.db_data_type,
       on_finish: (input) => {
-        let default_content_input_astc = variables_data_type_remaining_to_astc(input, "input", ["rows"])
+        let default_content_input_astc = variables_data_type_remaining_to_astc(input, "input", [
+          ...(Array.isArray(rows_data_from_variable_path) ? rows_data_from_variable_path : []),
+          [row_iter_identifier],
+          column_id_text_input_manager.val,
+        ])
         column_default_value_content_manager = create_content_manager({
           val: default_content_input_astc,
           table_options: config?.table_options,
           on_search_table_row_ids: config?.on_search_table_row_ids,
           definition_stack: definition_stack,
           on_event: (input) => {
-            const res = set_definition_stack(
-              input,
-              definition_stack,
-              column_default_value_content_manager?.pass_event_down
-            )
-            definition_stack = res?.definition_stack
-            return res
+            // console.log("input3334", input)
+            // const res = set_definition_stack(
+            //   input,
+            //   definition_stack,
+            //   column_default_value_content_manager?.pass_event_down
+            // )
+            // definition_stack = res?.definition_stack
+            // return res
           },
         })
       },
@@ -260,7 +262,6 @@ export function create_column_input_manager(config) {
       font_size: 1,
       border_radius: 0.5,
       on_click: () => {
-        console.log("guess_header_content_button_manager")
         if (column_id_text_input_manager?.val) {
           const header_text = column_id_text_input_manager.val
             .split("_")
@@ -278,7 +279,6 @@ export function create_column_input_manager(config) {
       font_size: 1,
       border_radius: 0.5,
       on_click: () => {
-        console.log("guess_body_content_button_manager")
         if (column_id_text_input_manager.val && column_db_data_type_input_manager?.val) {
           let guessed_column_display_content = variables_data_type_remaining_to_astc(
             column_db_data_type_input_manager?.val,
@@ -289,7 +289,6 @@ export function create_column_input_manager(config) {
               column_id_text_input_manager.val,
             ]
           )
-          console.log("guessed_column_display_content", guessed_column_display_content)
           body_content_input_manager.add_version(guessed_column_display_content)
         } else {
           body_content_input_manager.add_version(null)

package/src/lib/Components/VariablePathInput/index.svelte.js

@@ -2,6 +2,7 @@ import { create_popover_manager } from "$lib/Components/Popover/index.svelte.js"
 import { create_button_manager } from "$lib/Components/Button/index.svelte.js"
 import { create_text_input_manager } from "$lib/Components/TextInput/index.svelte.js"
 import { create_dropdown_manager } from "$lib/Components/Dropdown/index.svelte.js"
+import { deep_copy } from "$lib/client/index.js"
 
 export function create_variable_path_input_manager(config) {
   let popover_manager = $state(null)
@@ -14,6 +15,7 @@ export function create_variable_path_input_manager(config) {
   let path_prepped = $state(null)
   let val = $derived(get_val())
   let val_text = $derived(val_to_text(val))
+  let variable_data_type_at_path = $state(null)
 
   function get_val() {
     return def_dropdown_manager?.val
@@ -24,7 +26,7 @@ export function create_variable_path_input_manager(config) {
   function prep_path(input) {
     let path_prepped_loc = $state([])
     if (Array.isArray(input)) {
-      let variable_data_type_at_path = Array.isArray(defined_options)
+      variable_data_type_at_path = Array.isArray(defined_options)
         ? defined_options.find((h) => h?.key === def_dropdown_manager?.val)?.data_type
         : null
       for (let i = 1; i < input.length; i++) {
@@ -104,7 +106,6 @@ export function create_variable_path_input_manager(config) {
             })
           }
         }
-        console.log("key_options", key_options)
         let val = $derived(
           type_dropdown_manager?.val == "string"
             ? const_string_value_text_input_manager?.val
@@ -123,6 +124,7 @@ export function create_variable_path_input_manager(config) {
             ? variable_path_input_manager?.variable_data_type_at_path
             : null
         )
+        variable_data_type_at_path = variable_data_type_at_next_path
         path_prepped_loc.push({
           get type_dropdown_manager() {
             return type_dropdown_manager
@@ -177,6 +179,9 @@ export function create_variable_path_input_manager(config) {
 
   function init(input) {
     levels_nested = input?.levels_nested ?? 0
+    if (typeof config?.get_defined_options == "function") {
+      defined_options = config?.get_defined_options()
+    }
     popover_manager = create_popover_manager({
       min_width: 280,
       target_width: 450,
@@ -239,6 +244,9 @@ export function create_variable_path_input_manager(config) {
     get val_text() {
       return val_text
     },
+    get variable_data_type_at_path() {
+      return variable_data_type_at_path
+    },
     get levels_nested() {
       return levels_nested
     },

package/src/lib/client/astc_formatting/index.js

@@ -792,12 +792,15 @@ export function variables_data_type_remaining_to_astc(
     // }
     const child_astc = variables_data_type_remaining_to_astc(
       variables_data_type_remaining?.items,
-      preferred_content_use
+      preferred_content_use,
+      [...leading_variable_path, ["loop_index"]]
     )
+    console.log("loop_child", { child_astc, variables_data_type_remaining })
     return astc_element("loop", [child_astc], {
       val_from_variable_path: leading_variable_path,
       ...(variables_data_type_remaining?.attributes ?? {}),
       font_size: 1.2,
+      iter_identifier: "loop_index",
     })
     // } else if (variables_data_type_remaining?.type == "list") {
     // list input tbd just content input i guess