@stubber/form-fields 1.6.0 → 1.6.2

package/dist/fields2/Form.svelte

@@ -1,12 +1,12 @@
-<script>import { get as getStoreValue } from "svelte/store";
+<script>import { get as getStoreValue, writable } from "svelte/store";
 import FormField from "./form-field.svelte";
 import { build_fields } from "./utils";
 import { validate_field } from "./validations/validate_field";
 export let initial_form;
 export let form;
-export let attachments;
+export let attachments = writable([]);
 export let dependencies = void 0;
-export let form_valid;
+export let form_valid = false;
 if (initial_form.data) {
   form.update((data) => {
     return { ...data, ...initial_form.data };

package/dist/fields2/Form.svelte.d.ts

@@ -1,13 +1,14 @@
 import { SvelteComponent } from "svelte";
 import { type Writable } from "svelte/store";
 import type { IFormDependencies, IInitialForm } from "./interfaces";
+import type { UploadedFile } from "./fileserver";
 declare const __propDef: {
     props: {
         initial_form: IInitialForm;
         form: Writable<any>;
-        attachments: Writable<any>;
+        attachments?: Writable<UploadedFile[]>;
         dependencies?: IFormDependencies | undefined;
-        form_valid: boolean;
+        form_valid?: boolean;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/fields2/sub/contact-selector-field.svelte

@@ -15,7 +15,8 @@
 </script>
 
 <script>import { Button } from "@stubber/ui/button";
-import SelectField, {} from "./select-field.svelte";
+import SelectField, {
+} from "./select-field.svelte";
 export let fieldStore;
 const params = $fieldStore.params || {};
 const dependencies = $fieldStore.formDependencies;
@@ -25,54 +26,51 @@ const show_create_contact_modal = () => {
   const orguuid = dependencies?.stubber?.orguuid;
   createWantToModal("_create_new_contact", stubref, orguuid);
 };
-const field = $fieldStore;
-if (field.params) {
-  field.params.load_options = async (search_term) => {
-    const socket = dependencies?.clienthub?.socket;
-    const orguuid = dependencies?.stubber?.orguuid;
-    const stubref = dependencies?.stubber?.stubref;
-    if (!socket || !orguuid || !stubref) {
-      console.error("ClientHub socket or stubber details not available.");
-      return [];
-    }
-    const details = {
-      resource_name: "contacts"
-    };
-    details.params = $fieldStore.params || {};
-    details.params.orguuid = orguuid;
-    details.params.stubref = stubref;
-    details.params.input = search_term;
-    if (details.params.limit === void 0) {
-      details.params.limit = 50;
-    }
-    console.log("Loading contacts with details:", details);
-    return new Promise((resolve, reject) => {
-      socket.emit("request", { type: "resource", details }, (res) => {
-        if (res.success) {
-          console.log("Contacts loaded:", res);
-          const contacts = res.payload?.contacts || [];
-          const result = contacts.map((contact) => {
-            let label = contact._default_label;
-            if (params.label && contact[params.label]) {
-              label = contact[params.label];
-            }
-            return {
-              value: contact,
-              label
-            };
-          });
-          resolve(result);
-        } else {
-          console.error("Failed to load contacts:", res);
-          resolve([]);
-        }
-      });
-    });
+const load_options = async (search_term) => {
+  const socket = dependencies?.clienthub?.socket;
+  const orguuid = dependencies?.stubber?.orguuid;
+  const stubref = dependencies?.stubber?.stubref;
+  if (!socket || !orguuid || !stubref) {
+    console.error("ClientHub socket or stubber details not available.");
+    return [];
+  }
+  const details = {
+    resource_name: "contacts"
   };
-}
+  details.params = $fieldStore.params || {};
+  details.params.orguuid = orguuid;
+  details.params.stubref = stubref;
+  details.params.input = search_term;
+  if (details.params.limit === void 0) {
+    details.params.limit = 50;
+  }
+  console.log("Loading contacts with details:", details);
+  return new Promise((resolve, reject) => {
+    socket.emit("request", { type: "resource", details }, (res) => {
+      if (res.success) {
+        console.log("Contacts loaded:", res);
+        const contacts = res.payload?.contacts || [];
+        const result = contacts.map((contact) => {
+          let label = contact._default_label;
+          if (params.label && contact[params.label]) {
+            label = contact[params.label];
+          }
+          return {
+            value: contact,
+            label
+          };
+        });
+        resolve(result);
+      } else {
+        console.error("Failed to load contacts:", res);
+        resolve([]);
+      }
+    });
+  });
+};
 </script>
 
-<SelectField {fieldStore}>
+<SelectField {fieldStore} {load_options}>
   <Button
     on:click={show_create_contact_modal}
     variant="ghost"

package/dist/fields2/sub/contact-selector-field.svelte.d.ts

@@ -1,16 +1,15 @@
 import { SvelteComponent } from "svelte";
 import type { Writable } from "svelte/store";
 import type { IBaseField, IBuiltField, IInitialForm } from "../interfaces";
-export interface IContactSelectorFieldParams {
+export interface IContactSelectorFieldParams extends ISelectFieldParams {
     label?: string;
     limit?: number;
-    load_options?: (search_term: string) => Promise<ISelectFieldOption[]>;
 }
 export declare const contact_selector_field_param_spec: IInitialForm;
 export interface IContactSelectorField extends IBaseField<IContactSelectorFieldParams> {
     fieldtype: "contactselector";
 }
-import { type ISelectFieldOption } from "./select-field.svelte";
+import { type ISelectFieldParams } from "./select-field.svelte";
 declare const __propDef: {
     props: {
         fieldStore: Writable<IBuiltField<IContactSelectorFieldParams>>;

package/dist/fields2/sub/field-builder-field.svelte

@@ -311,6 +311,7 @@ function select_field_type(newValue, trigger) {
     </Collapsible.Trigger>
 
     <Collapsible.Content class="flex flex-col gap-y-2 pl-2 pt-2">
+      <!-- todo this doesnt update when fieldtype changes -->
       {@const field_param_spec = field_params_spec_lookup[value.fieldtype ?? "unknown"]}
       {#if field_param_spec}
         <Form

package/dist/fields2/sub/select-field.svelte

@@ -33,6 +33,7 @@ import FieldLabel from "../FieldLabel.svelte";
 import FieldMessage from "../FieldMessage.svelte";
 import { set_value_details } from "../utils";
 export let fieldStore;
+export let load_options = void 0;
 let open = false;
 let loading = false;
 let items = [];
@@ -70,19 +71,18 @@ function closeAndFocusTrigger(triggerId) {
 let last_search = void 0;
 const handle_search = async (search) => {
   last_search = search;
-  if (params.load_options) {
+  if (load_options) {
     loading = true;
-    const remote_results = await params.load_options($state.search);
+    const remote_results = await load_options($state.search);
     loading = false;
     items = map_field_options(remote_results);
   }
 };
 let debounced_handle_search = null;
-if (params.load_options) {
+if (load_options) {
   debounced_handle_search = debounce(handle_search, 300);
 }
-$: if (params.load_options && $state.search !== void 0 && $state.search !== last_search) {
-  console.log("doing debounced search", !!debounced_handle_search);
+$: if (load_options && $state.search !== void 0 && $state.search !== last_search) {
   if (debounced_handle_search) debounced_handle_search($state.search);
 }
 const handle_select = (item_key, trigger) => {
@@ -110,7 +110,7 @@ const handle_select = (item_key, trigger) => {
     </Button>
   </Popover.Trigger>
   <Popover.Content sameWidth class="p-0 z-[100]">
-    <Command.Root shouldFilter={!params.load_options} {state}>
+    <Command.Root shouldFilter={!load_options} {state}>
       <Command.Input class="border-none outline-none focus:ring-0" placeholder="Search..." />
       <Command.List>
         {#if loading}

package/dist/fields2/sub/select-field.svelte.d.ts

@@ -7,7 +7,6 @@ export interface ISelectFieldOption {
 }
 export interface ISelectFieldParams {
     options?: ISelectFieldOption[];
-    load_options?: (search_term: string) => Promise<ISelectFieldOption[]>;
 }
 export declare const select_field_param_spec: IInitialForm;
 export interface ISelectField extends IBaseField<ISelectFieldParams> {
@@ -16,6 +15,7 @@ export interface ISelectField extends IBaseField<ISelectFieldParams> {
 declare const __propDef: {
     props: {
         fieldStore: Writable<IBuiltField<ISelectFieldParams>>;
+        load_options?: ((search_term: string) => Promise<ISelectFieldOption[]>) | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/dist/fields2/sub/selectresource-field.svelte

@@ -61,9 +61,6 @@ const load_options = async (search_term) => {
     });
   });
 };
-if ($fieldStore.params) {
-  $fieldStore.params.load_options = load_options;
-}
 </script>
 
-<SelectField {fieldStore} />
+<SelectField {fieldStore} {load_options} />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stubber/form-fields",
-  "version": "1.6.0",
+  "version": "1.6.2",
   "description": "An automatic form builder based on field specifications",
   "keywords": [
     "components",