@humandialog/forms.svelte 0.4.45 → 0.5.1

package/page.svelte

@@ -1,127 +1,118 @@
 <script>
-    import { setContext, onMount } from 'svelte';
-    import {
-        context_items_store,
-        data_tick_store,
-        context_types_store,
-        context_info_store,
-        context_toolbar_operations,
-        page_toolbar_operations,
-        page_title     } from './stores.js'
-    
-    //import {chnages} from './utils.js'
-
-    export let context = "data"
-    export let self = null
-    export let typename = '';
-    export let focused_only = false
-    export let in_context = ''
-    export let cl =
-        "w-full h-full flex flex-col dark:bg-slate-800  overflow-y-hidden  overflow-x-hidden py-1 px-1 border-0" // border-green-500
-    export let c = ''
-    
-    export let toolbar_operations = undefined;
-    export let clears_context = '';
-    export let title = '';
-
-    
-    switch (c) {
-        case 'main':
-            cl = "w-full h-full flex flex-col dark:bg-slate-800  overflow-y-hidden  overflow-x-hidden py-1 px-1 border-0"
-            break;
-        case 'main-d':
-            cl = "bg-slate-800 w-full h-full flex flex-col dark:bg-slate-800  overflow-y-hidden  overflow-x-hidden py-1 px-1 border-0"
-            break;
-        default:
-            //NOP    
-    }
-
-    onMount(() => {
-            if(toolbar_operations != undefined && Array.isArray(toolbar_operations))
-                $page_toolbar_operations = [...toolbar_operations]
-
-            $page_title = title;
-
-            return () => 
-            { 
-                $page_toolbar_operations = [] 
-                $page_title = ''
-            }
-    })
-
-    setContext('ctx', context)
-    let item = null;
-    let visibilty = "hidden"
-    if (in_context == '')
-        in_context = context;
-    let last_tick = 0
-    if (self != null)
-        $context_items_store[context] = self
-    
-    if(typename)
-        $context_types_store[context] = typename;
-
-    item = $context_items_store[context]
-    visibilty = "hidden";
-    if (item != null) {
-        if (focused_only) {
-            if ($context_items_store.focused == in_context)
-                visibilty = "";
-        } else
-            visibilty = "";
-    }
-    let t = 0
-    $: {
-        t = $data_tick_store
-        //chnages.just_changed_context = false;
-
-        if (t > last_tick) {
-            last_tick = t
-            if (self != null)
-                $context_items_store[context] = self
-            
-            if(typename)
-                $context_types_store[context] = typename;
-
-            item = $context_items_store[context]
-            visibilty = "hidden";
-            if (item != null) {
-                if (focused_only) {
-                    if ($context_items_store.focused == in_context)
-                        visibilty = "";
-                } else
-                    visibilty = "";
-            }
-            //console.log("$page[" + in_context + ", " + context + "]: " + visibilty)
-            //console.log(item)  
-            //console.log("--------------")
-        }
-    }
-
-    function clear_selection(e)
-    {
-        //console.log('page click', chnages.just_changed_context)
-        if(!clears_context)
-            return;
-
-       
-
-        let contexts = clears_context.split(' ');
-        contexts.forEach(c => 
-        {
-            $context_items_store[c] = null;
-            $context_info_store[c] = '';
-        })
-
-        //e.stopPropagation();
-    
-        $context_toolbar_operations = [];
-        $data_tick_store = $data_tick_store + 1;
-    }
+	import { setContext, onMount } from 'svelte';
+	import {
+		contextItemsStore,
+		data_tick_store,
+		contextTypesStore,
+		context_info_store,
+		contextToolbarOperations,
+		pageToolbarOperations,
+		page_title
+	} from './stores.js';
+
+	//import {chnages} from './utils.js'
+
+	export let context = 'data';
+	export let self = null;
+	export let typename = '';
+	export let focused_only = false;
+	export let inContext = '';
+	export let cl =
+		'w-full h-full flex flex-col dark:bg-stone-800  overflow-y-hidden  overflow-x-hidden py-1 px-1 border-0'; // border-green-500
+	export let c = '';
+
+	export let toolbarOperations = undefined;
+	export let clears_context = '';
+	export let title = '';
+
+	switch (c) {
+		case 'main':
+			cl =
+				'w-full h-full flex flex-col dark:bg-stone-800  overflow-y-hidden  overflow-x-hidden py-1 px-1 border-0';
+			break;
+		case 'main-d':
+			cl =
+				'bg-stone-800 w-full h-full flex flex-col dark:bg-stone-800  overflow-y-hidden  overflow-x-hidden py-1 px-1 border-0';
+			break;
+		default:
+		//NOP
+	}
+
+	onMount(() => {
+		if (toolbarOperations != undefined && Array.isArray(toolbarOperations))
+			$pageToolbarOperations = [...toolbarOperations];
+
+		$page_title = title;
+
+		//clear_selection();
+		$contextToolbarOperations = [];
+		$data_tick_store = $data_tick_store + 1;
+
+		return () => {
+			$pageToolbarOperations = [];
+			$page_title = '';
+		};
+	});
+
+	setContext('ctx', context);
+	let item = null;
+	let visibilty = 'hidden';
+	if (inContext == '') inContext = context;
+	let last_tick = 0;
+	if (self != null) $contextItemsStore[context] = self;
+
+	if (typename) $contextTypesStore[context] = typename;
+
+	item = $contextItemsStore[context];
+	visibilty = 'hidden';
+	if (item != null) {
+		if (focused_only) {
+			if ($contextItemsStore.focused == inContext) visibilty = '';
+		} else visibilty = '';
+	}
+	let t = 0;
+	$: {
+		t = $data_tick_store;
+		//chnages.just_changed_context = false;
+
+		if (t > last_tick) {
+			last_tick = t;
+			if (self != null) $contextItemsStore[context] = self;
+
+			if (typename) $contextTypesStore[context] = typename;
+
+			item = $contextItemsStore[context];
+			visibilty = 'hidden';
+			if (item != null) {
+				if (focused_only) {
+					if ($contextItemsStore.focused == inContext) visibilty = '';
+				} else visibilty = '';
+			}
+			//console.log("$page[" + inContext + ", " + context + "]: " + visibilty)
+			//console.log(item)
+			//console.log("--------------")
+		}
+	}
+
+	function clear_selection(e) {
+		//console.log('page click', chnages.just_changed_context)
+		if (!clears_context) return;
+
+		let contexts = clears_context.split(' ');
+		contexts.forEach((c) => {
+			$contextItemsStore[c] = null;
+			$context_info_store[c] = '';
+		});
+
+		//e.stopPropagation();
+
+		$contextToolbarOperations = [];
+		$data_tick_store = $data_tick_store + 1;
+	}
 </script>
 
-<div class="bg-slate-100 dark:bg-slate-800 {visibilty} {cl}" on:click={clear_selection}>
-    {#if visibilty == "" }
-        <slot/>
-    {/if}
-</div>
+<div class="bg-stone-100 dark:bg-stone-800 {visibilty} {cl}" on:click={clear_selection}>
+	{#if visibilty == ''}
+		<slot />
+	{/if}
+</div>

package/page.svelte.d.ts

@@ -8,8 +8,8 @@ export default class Page extends SvelteComponentTyped<{
     cl?: string | undefined;
     typename?: string | undefined;
     focused_only?: boolean | undefined;
-    in_context?: string | undefined;
-    toolbar_operations?: any;
+    inContext?: string | undefined;
+    toolbarOperations?: any;
     clears_context?: string | undefined;
     title?: string | undefined;
 }, {
@@ -30,8 +30,8 @@ declare const __propDef: {
         cl?: string | undefined;
         typename?: string | undefined;
         focused_only?: boolean | undefined;
-        in_context?: string | undefined;
-        toolbar_operations?: any;
+        inContext?: string | undefined;
+        toolbarOperations?: any;
         clears_context?: string | undefined;
         title?: string | undefined;
     };

package/stores.d.ts

@@ -1,6 +1,7 @@
-export function set_navigator_title(key: any, title: any): void;
-export function has_selected_item(): boolean;
-export function has_data_item(): boolean;
+export function setNavigatorTitle(key: any, title: any): void;
+export function hasSelectedItem(): boolean;
+export function hasDataItem(): boolean;
+export function reloadMainView(): void;
 export function set_dark_mode_default(value: any): void;
 export function set_default_tools_visible(value: any): void;
 export function restore_defults(): void;
@@ -9,7 +10,7 @@ export function auto_hide_sidebar(): void;
 export function hide_sidebar(): void;
 export function show_sidebar(index: any): void;
 export const data_tick_store: import("svelte/store").Writable<number>;
-export const context_items_store: import("svelte/store").Writable<{
+export const contextItemsStore: import("svelte/store").Writable<{
     focused: string;
     data: null;
     sel: null;
@@ -18,15 +19,16 @@ export const context_info_store: import("svelte/store").Writable<{
     data: string;
     sel: string;
 }>;
-export const context_types_store: import("svelte/store").Writable<{
+export const contextTypesStore: import("svelte/store").Writable<{
     focused: string;
     data: null;
     sel: null;
 }>;
-export const context_toolbar_operations: import("svelte/store").Writable<never[]>;
-export const page_toolbar_operations: import("svelte/store").Writable<never[]>;
+export const contextToolbarOperations: import("svelte/store").Writable<never[]>;
+export const pageToolbarOperations: import("svelte/store").Writable<never[]>;
 export const page_title: import("svelte/store").Writable<string>;
 export const nav_titles: import("svelte/store").Writable<{}>;
+export const mainViewReloader: import("svelte/store").Writable<number>;
 export const dark_mode_store: import("svelte/store").Writable<any>;
 export const main_sidebar_visible_store: import("svelte/store").Writable<any>;
 export let previously_visible_sidebar: string;

package/stores.js

@@ -3,33 +3,41 @@ import {writable, get} from 'svelte/store';
 import {SCREEN_SIZES} from './utils.js'
 
 export const data_tick_store = writable(1);
-export const context_items_store = writable({focused:'', data: null, sel: null})
+export const contextItemsStore = writable({focused:'', data: null, sel: null})
 export const context_info_store = writable({data: '', sel: ''})
-export const context_types_store = writable({focused:'', data: null, sel: null})
-export const context_toolbar_operations = writable([]);
-export const page_toolbar_operations = writable([]);
+export const contextTypesStore = writable({focused:'', data: null, sel: null})
+export const contextToolbarOperations = writable([]);
+export const pageToolbarOperations = writable([]);
 export const page_title = writable('');
 export const nav_titles = writable({});
+export const mainViewReloader = writable(1);
 
-export function set_navigator_title(key, title)
+export function setNavigatorTitle(key, title)
 {
     let titles = get(nav_titles);
     titles[key] = title;
     nav_titles.set(titles);
 }
 
-export function has_selected_item()
+export function hasSelectedItem()
 {
-    let itm = get(context_items_store).sel
+    let itm = get(contextItemsStore).sel
     return itm !== null && itm !== undefined;
 }
 
-export function has_data_item()
+export function hasDataItem()
 {
-    let itm = get(context_items_store).data
+    let itm = get(contextItemsStore).data
     return itm !== null && itm !== undefined;
 }
 
+export function reloadMainView()
+{
+    let val = get(mainViewReloader);
+    val += 1;
+    mainViewReloader.set(val);
+}
+
 
 let has_saved_dark_mode = false;
 function create_dark_mode_store()

package/tenant.members.svelte

@@ -22,12 +22,12 @@
     // ==============================================================================
 
     export let users = undefined;
-    export let name_attrib = "Name";
-    export let email_attrib = "login";
-    export let ref_attrib = "$ref";
-    export let show_files = false;
+    export let nameAttrib = "Name";
+    export let emailAttrib = "login";
+    export let refAttrib = "$ref";
+    export let showFiles = false;
     //export let show_admin = true;
-    export let app_groups = undefined;
+    export let appGroups = undefined;
 
     // ===============================================================================
   
@@ -53,9 +53,9 @@
             {
                 reef_users.push(
                     {
-                        [name_attrib]: u[name_attrib],
-                        [email_attrib]: u[email_attrib],
-                        [ref_attrib]: u[ref_attrib],
+                        [nameAttrib]: u[nameAttrib],
+                        [emailAttrib]: u[emailAttrib],
+                        [refAttrib]: u[refAttrib],
                         auth_group: 0,
                         files_group :0,
                         app_group: 0,
@@ -84,7 +84,7 @@
         let handled_no = 0;
         reef_users.forEach(async ru =>
         {
-            let details = await reef.get(`/sys/user_details?email=${ru[email_attrib]}`)
+            let details = await reef.get(`/sys/user_details?email=${ru[emailAttrib]}`)
             set_user_info(ru, details);
 
             handled_no++;
@@ -92,7 +92,7 @@
             {
                 
                 
-                list?.update_objects(reef_users);
+                list?.updateObjects(reef_users);
             }
         } )
     }
@@ -136,12 +136,12 @@
 
     async function delete_user(user)
     {
-        let email = user[email_attrib];
+        let email = user[emailAttrib];
         
         let removed_user_details = await reef.get('/sys/kick_out_user?email=' + email);
         if(removed_user_details)
         {
-            //let removed_user = reef_users.find( u => u[email_attrib] == user[email_attrib])
+            //let removed_user = reef_users.find( u => u[emailAttrib] == user[emailAttrib])
             set_user_info(user, removed_user_details);
             list?.refresh();
         }
@@ -151,13 +151,13 @@
     {
         user[property] = name;
 
-        let user_path = user[ref_attrib];
+        let user_path = user[refAttrib];
         if(!user_path)
             return;
 
         await reef.post(`${user_path}/set`,
                     {
-                        [name_attrib]: name
+                        [nameAttrib]: name
                     }); 
     }
 
@@ -165,7 +165,7 @@
     {
         if(user.auth_group != flags)
         {
-            let email = user[email_attrib];
+            let email = user[emailAttrib];
             let info = await reef.get(`sys/set_user_details?email=${email}&auth_group=${flags}`)
             if(info)
             {
@@ -183,7 +183,7 @@
         {
             user.files_group = flags;
             
-            let email = user[email_attrib];
+            let email = user[emailAttrib];
             let info = await reef.get(`sys/set_user_details?email=${email}&files_group=${flags}`)
             if(info)
             {
@@ -210,15 +210,15 @@
     {
         let operations = [
             {
-                caption: name_attrib,
-                action: (focused) =>  { list.edit(user, name_attrib) }
+                caption: nameAttrib,
+                action: (focused) =>  { list.edit(user, nameAttrib) }
             },
             {
                 caption: 'Privileges',
                 action: (focused) => { list.edit(user, 'Privileges') }
             }];
 
-        if(show_files)
+        if(showFiles)
         {
             operations.push({
                 caption: 'Files',
@@ -362,9 +362,9 @@
         {
             reef_users.push(
                 {
-                    [name_attrib]: names[i],
-                    [email_attrib]: 'u@fake.com',
-                    [ref_attrib]: `./User/${1000+i}`,
+                    [nameAttrib]: names[i],
+                    [emailAttrib]: 'u@fake.com',
+                    [refAttrib]: `./User/${1000+i}`,
                     __hd_internal_item_id: 1000+i
                 }
             )
@@ -385,24 +385,24 @@
                             admin: new_user.maintainer,
                             set:
                             {
-                                [name_attrib]: new_user.name,
-                                [email_attrib]: new_user.email
+                                [nameAttrib]: new_user.name,
+                                [emailAttrib]: new_user.email
                             }
                         })
         if(result)
         {
             let created_user = result.User;
             let new_reef_user = {
-                [name_attrib]: created_user[name_attrib],
-                [email_attrib]: created_user[email_attrib],
-                [ref_attrib]: created_user[ref_attrib]
+                [nameAttrib]: created_user[nameAttrib],
+                [emailAttrib]: created_user[emailAttrib],
+                [refAttrib]: created_user[refAttrib]
             }
 
-            let details = await reef.get(`/sys/user_details?email=${new_reef_user[email_attrib]}`)
+            let details = await reef.get(`/sys/user_details?email=${new_reef_user[emailAttrib]}`)
             set_user_info(new_reef_user, details);
 
             reef_users = [...reef_users, new_reef_user]
-            list?.update_objects(reef_users);
+            list?.updateObjects(reef_users);
         }
 
 
@@ -424,32 +424,32 @@
 </script>
 
 <Page   self={data_item} 
-        cl="!bg-white dark:!bg-slate-900 w-full h-full flex flex-col overflow-y-auto overflow-x-hidden py-1 px-1 border-0" 
-        toolbar_operations={page_operations}
+        cl="!bg-white dark:!bg-stone-900 w-full h-full flex flex-col overflow-y-auto overflow-x-hidden py-1 px-1 border-0" 
+        toolbarOperations={page_operations}
         clears_context='props sel'>
     <!--a href="/" class="underline text-sm font-semibold ml-3"> &lt; Back to root</a-->
 
     {#if reef_users && reef_users.length > 0}
     <List       objects={reef_users} 
                 title='Members' 
-                toolbar_operations={user_operations} 
-                context_menu={user_context_menu}
+                toolbarOperations={user_operations} 
+                contextMenu={user_context_menu}
                 key='__hd_internal_item_id'
                 bind:this={list}>
-            <ListTitle a={name_attrib} on_change={on_name_changed}/>
-            <ListSummary a={email_attrib} readonly/>
+            <ListTitle a={nameAttrib} onChange={on_name_changed}/>
+            <ListSummary a={emailAttrib} readonly/>
 
             <ListStaticProperty name="Membership" a="membership_tag"/>
             
-            <ListComboProperty name='Privileges' a='auth_group' on_select={on_change_privileges}>
+            <ListComboProperty name='Privileges' a='auth_group' onSelect={on_change_privileges}>
                 <ComboItem name='None'       key={0}  />
                 <ComboItem name='Can See'    key={1}  />
                 <ComboItem name='Can Invite' key={3}  />
                 <ComboItem name='Maintainer' key={7}  />
             </ListComboProperty>
 
-            {#if show_files}
-            <ListComboProperty name='Files' a='files_group' on_select={on_change_files_access}>
+            {#if showFiles}
+            <ListComboProperty name='Files' a='files_group' onSelect={on_change_files_access}>
                 <ComboItem name='None'      key={0}  />
                 <ComboItem name='Read'      key={1}  />
                 <ComboItem name='Write'     key={2}  />
@@ -465,28 +465,28 @@
 
 <Modal  bind:open={create_new_user_enabled}
         title='Invite someone'
-        ok_caption='Invite'
-        on_ok_callback={on_new_user_requested}
-        on_cancel_callback={on_new_user_canceled}
+        okCaption='Invite'
+        onOkCallback={on_new_user_requested}
+        onCancelCallback={on_new_user_canceled}
         icon={FaUserPlus}>
             <Input  label='Name' 
                     placeholder='' 
                     self={new_user} 
                     a="name"
-                    validate_cb={is_valid_name}
+                    validateCb={is_valid_name}
                     bind:this={name_input}/>
             
             <Input  label='E-mail' 
                     placeholder='' 
                     self={new_user} 
                     a="email" 
-                    validate_cb={is_valid_email_address}
+                    validateCb={is_valid_email_address}
                     bind:this={email_input}/>
 
             <Checkbox class="mt-2 text-xs font-normal" self={new_user} a="maintainer">
                 <div class="flex flex-row items-center">
                     <span class="">Maintainer</span>
-                    <Icon id="b1" size={4} component={FaInfoCircle} class="text-slate-400 ml-5 pt-0 mt-1"/>
+                    <Icon id="b1" size={4} component={FaInfoCircle} class="text-stone-400 ml-5 pt-0 mt-1"/>
                     <Popover class="w-64 text-sm font-light " title="Maintainer" triggeredBy="#b1">
                         Means that the invited user will be able to add and remove others and manage permissions in this organization.
                     </Popover>

package/tenant.members.svelte.d.ts

@@ -3,11 +3,11 @@
 /** @typedef {typeof __propDef.slots}  TenantSlots */
 export default class Tenant extends SvelteComponentTyped<{
     users?: any;
-    name_attrib?: string | undefined;
-    email_attrib?: string | undefined;
-    ref_attrib?: string | undefined;
-    show_files?: boolean | undefined;
-    app_groups?: any;
+    nameAttrib?: string | undefined;
+    emailAttrib?: string | undefined;
+    refAttrib?: string | undefined;
+    showFiles?: boolean | undefined;
+    appGroups?: any;
 }, {
     [evt: string]: CustomEvent<any>;
 }, {}> {
@@ -19,11 +19,11 @@ import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
         users?: any;
-        name_attrib?: string | undefined;
-        email_attrib?: string | undefined;
-        ref_attrib?: string | undefined;
-        show_files?: boolean | undefined;
-        app_groups?: any;
+        nameAttrib?: string | undefined;
+        emailAttrib?: string | undefined;
+        refAttrib?: string | undefined;
+        showFiles?: boolean | undefined;
+        appGroups?: any;
     };
     events: {
         [evt: string]: CustomEvent<any>;

package/tile.svelte

@@ -1,7 +1,7 @@
 
 
 <script>
-    import {data_tick_store, context_items_store} from './stores.js' 
+    import {data_tick_store, contextItemsStore} from './stores.js' 
     import { setContext } from 'svelte';
     export let c = ''   
     export let cl = 'col-span-1'
@@ -13,7 +13,7 @@
     {    
         setContext('ctx', context) 
         if(self != null)
-            context_items_store[context] = self 
+            contextItemsStore[context] = self 
     }
 
     
@@ -36,6 +36,6 @@
  </script>    
  
 
-<div class=" {cl} bg-slate-100 dark:bg-slate-800 shadow rounded-lg p-2 flex flex-col">
+<div class=" {cl} bg-stone-100 dark:bg-stone-800 shadow rounded-lg p-2 flex flex-col">
    <slot/> 
 </div>

package/tiles.vertical.row.svelte

@@ -19,7 +19,7 @@
     }
  </script>    
  
- <div class="{cl} mt-4 gap-4 bg-slate-500">
+ <div class="{cl} mt-4 gap-4 bg-stone-500">
      <slot/>
  </div>