@csedl/hotwire-svelte-helpers 4.5.0 → 4.6.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@csedl/hotwire-svelte-helpers",
-  "version": "4.5.0",
+  "version": "4.6.0",
   "description": "Hotwire + Svelte helpers for Rails: Stimulus floating dropdowns/toolips + Svelte global panels/modals + RTurbo-friendly utilities. Build together with the rubygem svelte-on-rails and its npm-package.",
   "main": "index.js",
   "scripts": {

package/src/svelte/templates/FormInput.svelte

@@ -6,11 +6,25 @@
         errors,
         onChangeFunction,
         type,
-        autocomplete = 'on'
+        autocomplete = 'on',
+        collection,
+        includeBlank = false,
     } = $props();
 
     let model = $derived(context._schema.self.paramKey)
-    let columnSchema = $derived(context._schema[columnName])
+    let columnSchema = $derived.by(() => {
+        const cnt = context._schema[columnName]
+        if (!cnt) {
+            const keys = Object.keys(context._schema).sort()
+            if (keys.length > 0) {
+                throw new Error(`Column ${columnName} not found in schema, available keys in _schema are:\n • ${keys.join('\n • ')}`)
+            } else {
+                throw new Error(`Column ${columnName} not found in schema, _schema is empty!`)
+            }
+
+        }
+        return cnt
+    })
     let value = $derived(context[columnName])
     let inputType = $derived.by(() => {
         const t = {
@@ -55,11 +69,23 @@
             <select
                     id="{model}_{columnName}"
                     name="{model}[{columnSchema.key}]"
-                    value="{value}"
                     onchange="{onChangeFunction}"
                     class="input-field">
                 {#each Object.entries(columnSchema.enum) as [key, label]}
-                    <option value="{key}">{label}</option>
+                    <option value="{key}" selected={key == value}>{label}</option>
+                {/each}
+            </select>
+        {:else if collection}
+            <select
+                    id="{model}_{columnName}"
+                    name="{model}[{columnSchema.key}]"
+                    onchange="{onChangeFunction}"
+                    class="input-field">
+                {#if includeBlank}
+                    <option></option>
+                {/if}
+                {#each Object.entries(collection) as [key, label]}
+                    <option value="{key}" selected={key == value}>{label}</option>
                 {/each}
             </select>
         {:else if inputType === 'textarea'}