@humandialog/forms.svelte 0.4.14 → 0.4.15

package/components/Grid.menu.svelte

@@ -97,6 +97,8 @@
         if(!!onhide)
             onhide();
 
+        e.stopPropagation();
+
         if(!operation)
             return;
 

package/components/combo/combo.d.ts

@@ -7,6 +7,8 @@ export declare class rCombo_item {
 export declare class rCombo_definition {
     source: rCombo_item[];
     collection_expr: string | undefined;
+    collection_path: string | undefined;
+    collection: object[] | undefined;
     on_collect: undefined;
     element_key: string | undefined;
     element_name: string | undefined;

package/components/combo/combo.js

@@ -7,6 +7,8 @@ export class rCombo_item {
 export class rCombo_definition {
     source = [];
     collection_expr;
+    collection_path;
+    collection;
     on_collect = undefined;
     element_key;
     element_name;

package/components/combo/combo.source.svelte

@@ -1,11 +1,15 @@
 <script>import { getContext } from "svelte";
-export let collection = "";
+export let association = void 0;
+export let path = void 0;
+export let objects = void 0;
 export let on_collect = void 0;
 export let key = "";
 export let name = "";
 export let avatar = "";
 let definition = getContext("rCombo-definition");
-definition.collection_expr = collection;
+definition.collection_expr = association;
+definition.collection_path = path;
+definition.collection = objects;
 definition.on_collect = on_collect;
 definition.element_key = key;
 definition.element_name = name;

package/components/combo/combo.source.svelte.d.ts

@@ -1,7 +1,9 @@
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
-        collection?: string | undefined;
+        association?: string | undefined;
+        path?: string | undefined;
+        objects?: object[] | undefined;
         on_collect?: undefined;
         key?: string | undefined;
         name?: string | undefined;

package/components/combo/combo.svelte

@@ -1,7 +1,7 @@
 <script>import { data_tick_store, context_items_store, context_types_store } from "../../stores.js";
 import { inform_modification, push_changes } from "../../updates.js";
 import { parse_width_directive, should_be_comapact } from "../../utils.js";
-import { afterUpdate, getContext, setContext } from "svelte";
+import { afterUpdate, getContext, onMount, setContext } from "svelte";
 import { rCombo_definition, rCombo_item, cached_sources } from "./combo";
 import FaChevronDown from "svelte-icons/fa/FaChevronDown.svelte";
 import Icon from "../icon.svelte";
@@ -9,19 +9,25 @@ import { Auth } from "@humandialog/auth.svelte/dist/index.js";
 export let label = "";
 export let self = null;
 export let a = "";
+export let is_association = false;
 export let context = "";
 export let typename = "";
 export let choice_callback = "";
 export let on_select = void 0;
+export let definition = null;
+export let changed = void 0;
 export let icon = false;
 export let placeholder = "Choose wisely...";
 export let s = "sm";
 export let c = "";
 export let compact = false;
 export let in_context = "sel";
+export let cached = false;
 let is_compact = getContext("rIs-table-component") || compact;
-let definition = new rCombo_definition();
-setContext("rCombo-definition", definition);
+if (!definition) {
+  definition = new rCombo_definition();
+  setContext("rCombo-definition", definition);
+}
 let is_dropdown_open = false;
 let dropdown_position = "";
 let combo;
@@ -76,13 +82,27 @@ function setup(...args) {
     label = a;
   tick_request_internal = tick_request_internal + 1;
   if (is_compact) {
-    if ($context_items_store[in_context] != self)
-      can_be_activated = false;
-    else
-      can_be_activated = true;
+    can_be_activated = false;
+    let contexts = in_context.split(" ");
+    contexts.forEach((ctx2) => {
+      if ($context_items_store[ctx2] == item)
+        can_be_activated = true;
+    });
   } else
     can_be_activated = true;
 }
+onMount(() => {
+  if (definition.on_collect)
+    definition.on_collect().then((source) => source_fetched(source));
+  else if (definition.collection_expr)
+    fetch_source_from_association().then((source) => source_fetched(source));
+  else if (definition.collection_path)
+    get_source_collection(definition.collection_path, `${definition.collection_path}`).then((source) => source_fetched(source));
+  else if (definition.collection)
+    source_fetched(definition.collection);
+  return () => {
+  };
+});
 afterUpdate(() => {
   if (is_dropdown_open && textbox && document.activeElement != textbox)
     textbox.focus();
@@ -170,14 +190,8 @@ export function show(event, hide_callback) {
     characterData: true,
     subtree: true
   });
-  if (definition.collection_expr)
-    fetch_source().then((source) => source_fetched(source));
-  else if (definition.on_collect) {
-    definition.on_collect().then((source) => source_fetched(source));
-  } else {
-    filtered_source = definition.source.map((e) => e);
-    highlighted_option = filtered_source.length > 0 ? filtered_source[0] : null;
-  }
+  filtered_source = definition.source.map((e) => e);
+  highlighted_option = filtered_source.length > 0 ? filtered_source[0] : null;
 }
 export function hide() {
   if (mutation_observer)
@@ -234,41 +248,82 @@ function get_combo_text() {
 }
 async function on_choose(itm) {
   hide();
-  if (choice_callback) {
-    let body = {
-      choice: {
-        $ref: itm.Key
-      }
-    };
-    let path = `${typename}/${item.Id}/${choice_callback}`;
-    let fields = calc_path_fields_param();
-    if (fields)
-      path += fields;
-    let res = await Auth.fetch(
-      `json/yav1/${path}`,
-      {
-        method: "POST",
-        body: JSON.stringify(body)
-      }
-    );
-    if (res.ok) {
-      let result_item = await res.json();
-      let result_typename = Object.keys(result_item)[0];
-      item[a] = result_item[result_typename];
-      tick_request_internal = tick_request_internal + 1;
-    } else
-      console.error(res);
-  } else if (on_select) {
+  if (on_select) {
     await on_select(item, itm.Key, itm.Name);
     tick_request_internal = tick_request_internal + 1;
   } else {
-    item[a] = itm.Key ?? itm.Name;
-    tick_request_internal = tick_request_internal + 1;
-    if (item && a && typename) {
-      inform_modification(item, a, typename);
-      push_changes();
+    if (is_association) {
+      if (choice_callback) {
+        let body = {
+          choice: {
+            $ref: itm.Key
+          }
+        };
+        let path;
+        if (item.$ref)
+          path = `${item.$ref}/${choice_callback}`;
+        else
+          path = `${typename}/${item.Id}/${choice_callback}`;
+        let fields = calc_path_fields_param();
+        if (fields)
+          path += fields;
+        let result = await Auth.post(`json/yav1/${path}`, body);
+        if (result) {
+          let result_typename = Object.keys(result)[0];
+          item[a] = result[result_typename];
+          tick_request_internal = tick_request_internal + 1;
+        }
+      } else {
+        let path;
+        if (item.$ref)
+          path = `json/yav1/${item.$ref}/set`;
+        else if (typename && item.Id)
+          path = `json/yav1/${typename}/${item.Id}/set`;
+        let result = await Auth.post(
+          path,
+          {
+            [a]: {
+              $ref: itm.Key
+            }
+          }
+        );
+        if (result) {
+          let name = definition.element_name ?? "$display";
+          item[a] = {
+            $ref: itm.Key,
+            [name]: itm.Name
+          };
+          tick_request_internal = tick_request_internal + 1;
+        }
+      }
+    } else {
+      if (choice_callback) {
+        let path;
+        if (item.$ref)
+          path = `json/yav1/${item.$ref}/${choice_callback}`;
+        else
+          path = `json/yav1/${typename}/${item.Id}/${choice_callback}`;
+        let fields = calc_path_fields_param();
+        if (fields)
+          path += fields;
+        let value = itm.Key ?? itm.Name;
+        let result = await Auth.post(path, { choice: value });
+        if (result) {
+          item[a] = result;
+          tick_request_internal = tick_request_internal + 1;
+        }
+      } else {
+        item[a] = itm.Key ?? itm.Name;
+        tick_request_internal = tick_request_internal + 1;
+        if (item && a && typename) {
+          inform_modification(item, a, typename);
+          push_changes();
+        }
+      }
     }
   }
+  if (!!changed)
+    changed(itm.Key, itm.Name);
 }
 function on_keydown(e) {
   switch (e.key) {
@@ -335,7 +390,7 @@ let last_tick_internal = -1;
 function on_mouse_move(over) {
   highlighted_option = over;
 }
-async function fetch_source() {
+async function fetch_source_from_association() {
   if (item.hasOwnProperty(definition.collection_expr)) {
     let prop = item[definition.collection_expr];
     if (!prop)
@@ -351,7 +406,11 @@ async function fetch_source() {
     } else
       return null;
   } else {
-    let path = `${typename}/${item.Id}/${definition.collection_expr}`;
+    let path;
+    if (item.$ref)
+      path = `${item.$ref}/${definition.collection_expr}`;
+    else
+      path = `${typename}/${item.Id}/${definition.collection_expr}`;
     return await get_source_collection(path, `${typename}_${definition.collection_expr}`);
   }
 }
@@ -376,23 +435,16 @@ function calc_path_fields_param() {
 async function get_source_collection(path, cache_key) {
   if (!cached_sources.has(cache_key)) {
     let promise2 = new Promise(async (resolve, fail) => {
-      try {
-        let fields = calc_path_fields_param();
-        if (fields)
-          path += fields;
-        let res = await Auth.fetch(`json/yav1/${path}`, {
-          method: "POST"
-        });
-        if (res.ok)
-          resolve(await res.json());
-        else
-          resolve(null);
-      } catch (err) {
-        console.error(err);
-        resolve(null);
-      }
+      let fields = calc_path_fields_param();
+      if (fields)
+        path += fields;
+      let res = await Auth.get(`json/yav1/${path}`);
+      resolve(res);
     });
-    cached_sources.set(cache_key, promise2);
+    if (!cached)
+      return await promise2;
+    else
+      cached_sources.set(cache_key, promise2);
   }
   let promise = cached_sources.get(cache_key);
   return await promise;
@@ -407,18 +459,21 @@ function source_fetched(source) {
     let type = Object.keys(source)[0];
     array = source[type];
   }
-  item[definition.collection_expr] = [...array];
   definition.source = [];
   array.forEach((e) => {
     let el = new rCombo_item();
     if (definition.element_name)
       el.Name = e[definition.element_name];
-    else
+    else if (e.$display)
       el.Name = e.$display;
+    else
+      el.Name = e.toString();
     if (definition.element_key)
       el.Key = e[definition.element_key];
-    else
+    else if (e.$ref)
       el.Key = e.$ref;
+    else
+      el.Key = el.Name;
     if (icon) {
       if (definition.element_avatar)
         el.Avatar = e[definition.element_avatar];
@@ -427,8 +482,6 @@ function source_fetched(source) {
     }
     definition.source.push(el);
   });
-  filtered_source = definition.source.map((e) => e);
-  highlighted_option = filtered_source.length > 0 ? filtered_source[0] : null;
 }
 function setup_view(...args) {
   if (tick_request_internal <= last_tick_internal)
@@ -498,13 +551,6 @@ function on_focus_out(e) {
             style={dropdown_position}
             use:dropdown_action>
         <ul class="py-1">
-<!--        {#if is_dropdown_open && definition.collection_expr}
-                {#await fetch_source()}
-                    <p>Loading...</p>
-                {:then source} 
-                    {@const c = source_fetched(source)}
-                {/await}
-            {/if}  -->
 
             {#if definition.source && definition.source.length}
                 {@const _filtered_source = filtered_source ? filtered_source : definition.source}

package/components/combo/combo.svelte.d.ts

@@ -1,19 +1,24 @@
 import { SvelteComponentTyped } from "svelte";
+import { rCombo_definition } from './combo';
 declare const __propDef: {
     props: {
         label?: string | undefined;
         self?: null | undefined;
         a?: string | undefined;
+        is_association?: boolean | undefined;
         context?: string | undefined;
         typename?: string | undefined;
         choice_callback?: string | undefined;
         on_select?: undefined;
+        definition?: rCombo_definition | null | undefined;
+        changed?: undefined;
         icon?: boolean | undefined;
         placeholder?: string | undefined;
         s?: string | undefined;
         c?: string | undefined;
         compact?: boolean | undefined;
         in_context?: string | undefined;
+        cached?: boolean | undefined;
         show?: ((event: any, hide_callback: any) => void) | undefined;
         hide?: (() => void) | undefined;
     };

package/components/date.svelte

@@ -79,6 +79,14 @@ function setup(...args) {
     item = self ?? $context_items_store[ctx];
     if (!typename)
       typename = $context_types_store[ctx];
+    if (!typename) {
+      if (item.$type)
+        typename = item.$type;
+      else if (item.$ref) {
+        let s2 = item.$ref.split("/");
+        typename = s2[0];
+      }
+    }
     if (!item[a])
       value = null;
     else
@@ -86,10 +94,12 @@ function setup(...args) {
   } else
     value = date;
   if (is_compact) {
-    if ($context_items_store[in_context] != self)
-      can_be_activated = false;
-    else
-      can_be_activated = true;
+    can_be_activated = false;
+    let contexts = in_context.split(" ");
+    contexts.forEach((ctx2) => {
+      if ($context_items_store[ctx2] == item)
+        can_be_activated = true;
+    });
   } else
     can_be_activated = true;
   rValue = get_formatted_date(value);
@@ -120,7 +130,6 @@ async function on_changed() {
     value = null;
   else
     value = new Date(rValue);
-  console.log("rValue", rValue, "value", value);
   if (on_select) {
     await on_select(value);
   } else if (item != null) {

package/components/list/List.d.ts

@@ -0,0 +1,28 @@
+import { rCombo_definition } from '../combo/combo';
+export declare enum rList_property_type {
+    Hidden = 0,
+    Text = 1,
+    Date = 2,
+    Combo = 3
+}
+export declare class rList_property {
+    constructor(type: rList_property_type);
+    type: rList_property_type;
+    name: string;
+    a: string;
+    on_select: Function | undefined;
+}
+export declare class rList_property_combo extends rList_property {
+    constructor();
+    association: boolean;
+    combo_definition: rCombo_definition;
+}
+export declare class rList_definition {
+    title: string;
+    title_editable: boolean;
+    summary: string;
+    summary_editable: boolean;
+    can_insert: boolean;
+    oninsert: Function | undefined;
+    properties: rList_property[];
+}

package/components/list/List.js

@@ -0,0 +1,34 @@
+import { rCombo_definition } from '../combo/combo';
+export var rList_property_type;
+(function (rList_property_type) {
+    rList_property_type[rList_property_type["Hidden"] = 0] = "Hidden";
+    rList_property_type[rList_property_type["Text"] = 1] = "Text";
+    rList_property_type[rList_property_type["Date"] = 2] = "Date";
+    rList_property_type[rList_property_type["Combo"] = 3] = "Combo";
+})(rList_property_type || (rList_property_type = {}));
+export class rList_property {
+    constructor(type) {
+        this.type = type;
+    }
+    type = rList_property_type.Hidden;
+    name = '';
+    a = '';
+    on_select = undefined;
+}
+export class rList_property_combo extends rList_property {
+    constructor() {
+        super(rList_property_type.Combo);
+        this.combo_definition = new rCombo_definition;
+    }
+    association = false;
+    combo_definition;
+}
+export class rList_definition {
+    title = '';
+    title_editable = false;
+    summary = '';
+    summary_editable = false;
+    can_insert = false;
+    oninsert = undefined;
+    properties = [];
+}