sveltekit-ui 1.0.10 → 1.0.12

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

@@ -33,10 +33,9 @@ export function create_attributes_input_manager(config) {
   let finish_button_manager = $state(null)
   let selector_id = $state(null)
   let val_original = $state(null)
+  let defined_data_type = $state(null)
 
-  let variables_data_type = $derived(set_closurable(config?.variables_data_type, null))
   let val = $derived(attributes_manager?.val)
-
   let has_changed = $derived(!is_deep_equal(val, val_original))
 
   const align_dropdown_options = [
@@ -49,66 +48,12 @@ export function create_attributes_input_manager(config) {
     { key: "space-evenly", name: "Space Evenly" },
   ]
 
-  // if (att_val?.input_type == "dropdown") {
-  //   input_type = "dropdown"
-  //   manager = create_dropdown_manager({
-  //     is_button_compressed: true,
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //     is_multiselect: att_val?.is_multiselect,
-  //     options: att_val?.options,
-  //   })
-  // } else if (att_val?.type == "text_literal") {
-  //   input_type = "text_input"
-  //   manager = create_text_input_manager({
-  //     type: att_val?.text_type ?? "text",
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //     placeholder: val?.placeholder,
-  //   })
-  // } else if (att_val?.type == "email_address_literal") {
-  //   input_type = "text_input"
-  //   manager = create_text_input_manager({
-  //     type: "email",
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //     placeholder: att_val?.placeholder,
-  //   })
-  // } else if (att_val?.type == "phone_literal") {
-  //   input_type = "text_input"
-  //   manager = create_text_input_manager({
-  //     type: "tel",
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //     placeholder: att_val?.placeholder,
-  //   })
-  // } else if (att_val?.type == "color_literal") {
-  //   input_type = "color_input"
-  //   manager = create_color_input_manager({
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //   })
-  // } else if (att_val?.type == "boolean_literal") {
-  //   input_type = "checkbox"
-  //   manager = create_checkbox_manager({
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //   })
-  // } else if (att_val?.type == "time_literal") {
-  //   input_type = "time_input"
-  //   manager = create_time_input_manager({
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //   })
-  // } else if (att_val?.type == "variable_path_literal") {
-  //   input_type = "variable_path_input"
-  //   manager = create_variable_path_input_manager({
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //     variables_data_type: () => variables_data_type,
-  //   })
-  // } else if (att_val?.type == "location_literal") {
-  //   input_type = "location_input"
-  //   manager = create_location_input_manager({
-  //     val: typeof val?.[att_key] == "undefined" ? att_val?.default : val?.[att_key],
-  //   })
-  // }
-
   function init(config) {
+    console.log("dt_yyy", config?.defined_data_type)
     val_original = set_closurable(config?.val, null)
     content_type = config?.content_type
+    defined_data_type = config?.defined_data_type
+    console.log("att_defined_data_type", defined_data_type)
     popover_manager = create_popover_manager({
       header: config?.header ?? "Edit Attributes",
       type: "panel",
@@ -118,37 +63,38 @@ export function create_attributes_input_manager(config) {
       if (content_type == "number") {
         attributes_manager = create_number_config_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "qr") {
         attributes_manager = create_qr_config_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "variable_path_input") {
         attributes_manager = create_variable_path_input_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
+          on_finish: () => attributes_manager.close_popover(),
         })
       } else if (content_type == "table_advanced") {
         attributes_manager = create_table_advanced_config_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "dropdown") {
         attributes_manager = create_dropdown_config_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "slider") {
         attributes_manager = create_slider_config_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "time_input") {
         attributes_manager = create_time_input_config_manager({
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "time") {
         let val_format_dropdown_manager = $state(null)
@@ -162,7 +108,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_time_input_manager?.val,
@@ -218,7 +164,7 @@ export function create_attributes_input_manager(config) {
         )
         let background_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Background Color",
             attribute_root_key: "background_color",
             attribute_const_val: () => background_color_color_input_manager?.val,
@@ -233,7 +179,7 @@ export function create_attributes_input_manager(config) {
         )
         let border_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Border Color",
             attribute_root_key: "border_color",
             attribute_const_val: () => border_color_color_input_manager?.val,
@@ -250,7 +196,7 @@ export function create_attributes_input_manager(config) {
         )
         let border_radius_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Border Radius",
             attribute_root_key: "border_radius",
             attribute_const_val: () => border_radius_slider_manager?.val,
@@ -267,7 +213,7 @@ export function create_attributes_input_manager(config) {
         )
         let padding_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Padding",
             attribute_root_key: "padding",
             attribute_const_val: () => padding_slider_manager?.val,
@@ -302,7 +248,7 @@ export function create_attributes_input_manager(config) {
         )
         let caption_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Caption",
             attribute_root_key: "caption",
             attribute_const_val: () => caption_text_input_manager?.val,
@@ -327,7 +273,7 @@ export function create_attributes_input_manager(config) {
         )
         let background_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Background Color",
             attribute_root_key: "background_color",
             attribute_const_val: () => background_color_color_input_manager?.val,
@@ -342,7 +288,7 @@ export function create_attributes_input_manager(config) {
         )
         let border_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Border Color",
             attribute_root_key: "border_color",
             attribute_const_val: () => border_color_color_input_manager?.val,
@@ -359,7 +305,7 @@ export function create_attributes_input_manager(config) {
         )
         let border_radius_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Border Radius",
             attribute_root_key: "border_radius",
             attribute_const_val: () => border_radius_slider_manager?.val,
@@ -376,7 +322,7 @@ export function create_attributes_input_manager(config) {
         )
         let padding_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Padding",
             attribute_root_key: "padding",
             attribute_const_val: () => padding_slider_manager?.val,
@@ -392,7 +338,7 @@ export function create_attributes_input_manager(config) {
         )
         let align_content_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Align Content",
             attribute_root_key: "align_content",
             attribute_const_val: () => align_content_dropdown_manager?.val,
@@ -408,7 +354,7 @@ export function create_attributes_input_manager(config) {
         )
         let justify_content_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Justify Content",
             attribute_root_key: "justify_content",
             attribute_const_val: () => justify_content_dropdown_manager?.val,
@@ -441,7 +387,7 @@ export function create_attributes_input_manager(config) {
         }
       } else if (content_type == "text_input") {
         attributes_manager = create_text_input_config_manager({
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
           val: config?.val,
         })
       } else if (content_type == "color_input") {
@@ -457,7 +403,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_color_input_manager?.val,
@@ -473,7 +419,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_show_details_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Show Details",
             attribute_root_key: "is_show_details",
             attribute_const_val: () => is_show_details_checkbox_manager?.val,
@@ -490,7 +436,7 @@ export function create_attributes_input_manager(config) {
         )
         let size_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Size",
             attribute_root_key: "size",
             attribute_const_val: () => size_slider_manager?.val,
@@ -507,7 +453,7 @@ export function create_attributes_input_manager(config) {
         )
         let border_radius_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Border Radius",
             attribute_root_key: "border_radius",
             attribute_const_val: () => border_radius_slider_manager?.val,
@@ -538,7 +484,7 @@ export function create_attributes_input_manager(config) {
           storage_default_folder_path: config?.storage_default_folder_path,
           storage_path: config?.storage_path,
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (content_type == "audio") {
         attributes_manager = create_audio_config_manager({
@@ -546,7 +492,7 @@ export function create_attributes_input_manager(config) {
           storage_default_folder_path: config?.storage_default_folder_path,
           storage_path: config?.storage_path,
           val: config?.val,
-          variables_data_type: () => variables_data_type,
+          get_defined_options: config?.get_defined_options,
         })
       } else if (["h1", "h2", "h3", "h4", "h5", "base_text", "em", "strong", "strong_em"].includes(content_type)) {
         let content_text_input_manager = $state(
@@ -560,7 +506,7 @@ export function create_attributes_input_manager(config) {
         )
         let content_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Content",
             attribute_root_key: "content",
             attribute_const_val: () => content_text_input_manager?.val,
@@ -575,7 +521,7 @@ export function create_attributes_input_manager(config) {
         )
         let text_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Text Color",
             attribute_root_key: "text_color",
             attribute_const_val: () => text_color_color_input_manager?.val,
@@ -606,7 +552,7 @@ export function create_attributes_input_manager(config) {
         )
         let content_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Content",
             attribute_root_key: "content",
             attribute_const_val: () => content_text_input_manager?.val,
@@ -622,7 +568,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_show_copy_button_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Show Copy Button",
             attribute_root_key: "is_show_copy_button",
             attribute_const_val: () => is_show_copy_button_checkbox_manager?.val,
@@ -637,7 +583,7 @@ export function create_attributes_input_manager(config) {
         )
         let text_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Text Color",
             attribute_root_key: "text_color",
             attribute_const_val: () => text_color_color_input_manager?.val,
@@ -669,7 +615,7 @@ export function create_attributes_input_manager(config) {
         )
         let post_id_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Post ID",
             attribute_root_key: "post_id",
             attribute_const_val: () => post_id_text_input_manager?.val,
@@ -684,7 +630,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_dark_theme_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Dark Theme",
             attribute_root_key: "is_dark_theme",
             attribute_const_val: () => is_dark_theme_checkbox_manager?.val,
@@ -713,7 +659,7 @@ export function create_attributes_input_manager(config) {
         )
         let video_id_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Video ID",
             attribute_root_key: "video_id",
             attribute_const_val: () => video_id_text_input_manager?.val,
@@ -728,7 +674,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_dark_theme_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Dark Theme",
             attribute_root_key: "is_dark_theme",
             attribute_const_val: () => is_dark_theme_checkbox_manager?.val,
@@ -769,7 +715,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_run_serverside_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Run Serverside",
             attribute_root_key: "is_run_serverside",
             attribute_const_val: () => is_run_serverside_checkbox_manager?.val,
@@ -795,7 +741,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_show_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Show",
             attribute_root_key: "is_show",
             attribute_const_val: () => is_show_checkbox_manager?.val,
@@ -822,7 +768,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_checkbox_manager?.val,
@@ -842,7 +788,7 @@ export function create_attributes_input_manager(config) {
         )
         let type_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Type",
             attribute_root_key: "type",
             attribute_const_val: () => type_dropdown_manager?.val,
@@ -860,7 +806,7 @@ export function create_attributes_input_manager(config) {
         )
         let size_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Size",
             attribute_root_key: "size",
             attribute_const_val: () => size_slider_manager?.val,
@@ -875,7 +821,7 @@ export function create_attributes_input_manager(config) {
         )
         let color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Color",
             attribute_root_key: "color",
             attribute_const_val: () => color_input_manager?.val,
@@ -912,7 +858,7 @@ export function create_attributes_input_manager(config) {
         )
         let content_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Content",
             attribute_root_key: "content",
             attribute_const_val: () => content_text_input_manager?.val,
@@ -928,7 +874,7 @@ export function create_attributes_input_manager(config) {
         )
         let language_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Language",
             attribute_root_key: "language",
             attribute_const_val: () => language_text_input_manager?.val,
@@ -959,7 +905,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_text_input_manager?.val,
@@ -1020,7 +966,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_location_input_manager?.val,
@@ -1064,7 +1010,7 @@ export function create_attributes_input_manager(config) {
         )
         let href_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "href",
             attribute_root_key: "href",
             attribute_const_val: () => href_text_input_manager?.val,
@@ -1080,7 +1026,7 @@ export function create_attributes_input_manager(config) {
         )
         let display_text_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Dispaly Text",
             attribute_root_key: "display_text",
             attribute_const_val: () => display_text_text_input_manager?.val,
@@ -1095,7 +1041,7 @@ export function create_attributes_input_manager(config) {
         )
         let text_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Text Color",
             attribute_root_key: "text_color",
             attribute_const_val: () => text_color_color_input_manager?.val,
@@ -1111,7 +1057,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_show_preview_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Show Preview",
             attribute_root_key: "is_show_preview",
             attribute_const_val: () => display_text_text_input_manager?.val,
@@ -1148,7 +1094,7 @@ export function create_attributes_input_manager(config) {
         )
         let is_icon_only_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Is Icon Only",
             attribute_root_key: "is_icon_only",
             attribute_const_val: () => is_icon_only_checkbox_manager?.val,
@@ -1162,7 +1108,7 @@ export function create_attributes_input_manager(config) {
         })
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_icon_input_manager?.val,
@@ -1190,7 +1136,7 @@ export function create_attributes_input_manager(config) {
         )
         let icon_id_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Icon ID",
             attribute_root_key: "icon_id",
             attribute_const_val: () => icon_id_icon_input_manager?.val,
@@ -1208,7 +1154,7 @@ export function create_attributes_input_manager(config) {
         )
         let icon_size_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Size",
             attribute_root_key: "size",
             attribute_const_val: () => icon_size_slider_manager?.val,
@@ -1226,7 +1172,7 @@ export function create_attributes_input_manager(config) {
         )
         let icon_sw_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Stroke Width",
             attribute_root_key: "sw",
             attribute_const_val: () => icon_sw_slider_manager?.val,
@@ -1244,7 +1190,7 @@ export function create_attributes_input_manager(config) {
         )
         let icon_deg_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Degrees Turned",
             attribute_root_key: "deg",
             attribute_const_val: () => icon_deg_slider_manager?.val,
@@ -1259,7 +1205,7 @@ export function create_attributes_input_manager(config) {
         )
         let icon_color_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Icon Color",
             attribute_root_key: "color",
             attribute_const_val: () => icon_color_color_input_manager?.val,
@@ -1297,7 +1243,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_cron_input_manager?.val,
@@ -1322,7 +1268,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_cron_input_manager?.val,
@@ -1339,10 +1285,25 @@ export function create_attributes_input_manager(config) {
           },
         }
       } else if (content_type == "loop") {
+        let iter_identifier_text_input_manager = $state(
+          create_text_input_manager({
+            label: "Iter Identifier",
+            val: config?.val?.iter_identifier,
+            placeholder: "some_key",
+          })
+        )
         let val_input_manager = $state(
           create_variable_path_input_manager({
             val: config?.val?.val_from_variable_path,
-            variables_data_type: () => variables_data_type,
+            // 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(),
           })
         )
         let join_text_text_input_manager = $state(
@@ -1354,7 +1315,13 @@ export function create_attributes_input_manager(config) {
         )
         let join_text_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            defined_data_type: {
+              ...defined_data_type,
+              properties: {
+                ...defined_data_type?.properties,
+                [iter_identifier_text_input_manager?.val]: { type: "int_literal" },
+              },
+            },
             label: "Join Text",
             attribute_root_key: "join_text",
             attribute_const_val: () => join_text_text_input_manager?.val,
@@ -1363,10 +1330,12 @@ export function create_attributes_input_manager(config) {
         )
         attributes_manager = {
           val_input_manager: val_input_manager,
+          iter_identifier_text_input_manager: iter_identifier_text_input_manager,
           join_text_text_input_manager: join_text_text_input_manager,
           join_text_defined_type_input_manager: join_text_defined_type_input_manager,
           get val() {
             return {
+              iter_identifier: iter_identifier_text_input_manager?.val,
               val_from_variable_path: val_input_manager?.val,
               ...join_text_defined_type_input_manager?.val,
             }
@@ -1380,7 +1349,7 @@ export function create_attributes_input_manager(config) {
         )
         let val_defined_type_input_manager = $state(
           create_defined_type_input_manager({
-            variables_data_type: () => variables_data_type,
+            get_defined_options: config?.get_defined_options,
             label: "Val",
             attribute_root_key: "val",
             attribute_const_val: () => val_text_input_manager?.val,