@humandialog/forms.svelte 1.7.27 → 1.8.0

package/dialog.svelte

@@ -41,15 +41,25 @@ let close_callback = void 0;
 </script>
 
 {#if open}
-<div id="__hd_svelte_property_dialog_container" 
+<div id="__hd_svelte_property_dialog_container"
     visible={open}
     class="relative z-30" aria-labelledby="modal-title" role="dialog" aria-modal="true" bind:this={root}>
-    <div class="fixed w-screen h-screen inset-0 bg-stone-500 dark:bg-stone-800 bg-opacity-75 dark:bg-opacity-75 transition-opacity"></div>
-  
+    <!--div class="fixed w-screen h-screen inset-0 bg-stone-500 dark:bg-stone-800 bg-opacity-75 dark:bg-opacity-75 transition-opacity"></div-->
+
     <div class="fixed z-30 inset-0 w-screen overflow-y-auto overscroll-contain">
       <div class="flex min-h-full items-end justify-center p-1 text-center sm:items-center sm:p-0">
-        <div class=" p-2 bg-stone-100 dark:bg-stone-800 rounded-lg shadow-md shadow-stone-500 dark:shadow-black text-left shadow-xl transition-all  
-                    sm:my-8 w-full sm:max-w-lg"> <!-- transform overflow-hidden -->
+        <div class=" p-0
+                    sm:my-8 w-full sm:max-w-lg
+                    bg-stone-100 dark:bg-stone-800
+                    rounded-lg
+
+                    sm:shadow-xl sm:shadow-slate-700/70
+                    sm:dark:shadow-black/80
+                    sm:outline sm:outline-1 sm:outline-stone-500
+
+
+                    text-left transition-all
+                    "> <!-- transform overflow-hidden -->
             <slot/>
         </div>
       </div>
@@ -57,9 +67,9 @@ let close_callback = void 0;
   </div>
   {/if}
 
-<!-- use usePreventScroll instead -->  
+<!-- use usePreventScroll instead -->
 <!--style>
-    :global(body:has(#__hd_svelte_property_dialog_container[visible="true"])) 
+    :global(body:has(#__hd_svelte_property_dialog_container[visible="true"]))
     {
         overflow: hidden;
     }

package/form.box.svelte.d.ts

@@ -2,10 +2,10 @@
 /** @typedef {typeof __propDef.events}  FormEvents */
 /** @typedef {typeof __propDef.slots}  FormSlots */
 export default class Form extends SvelteComponentTyped<{
-    self?: null | undefined;
     context?: string | undefined;
-    c?: string | undefined;
+    self?: null | undefined;
     cl?: string | undefined;
+    c?: string | undefined;
     fit?: boolean | undefined;
 }, {
     [evt: string]: CustomEvent<any>;
@@ -19,10 +19,10 @@ export type FormSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
-        self?: null | undefined;
         context?: string | undefined;
-        c?: string | undefined;
+        self?: null | undefined;
         cl?: string | undefined;
+        c?: string | undefined;
         fit?: boolean | undefined;
     };
     events: {

package/horizontal.nav.tabs.svelte

@@ -1,38 +1,61 @@
 <script>
+    import {FaUsers, FaCog, FaToggleOn, FaToggleOff, FaSignInAlt, FaSignOutAlt, FaPlus, FaLanguage} from 'svelte-icons/fa/'
     import {contextItemsStore,
             context_info_store,
             contextToolbarOperations,
-            data_tick_store,
-            navKey
-        } from "./stores.js";     
+            data_tick_store, showFABAlways, leftHandedFAB,
+            navKey, tools_visible_store, bottom_bar_visible_store,
+            dark_mode_store, reloadWholeApp
+        } from "./stores.js";
     import Icon from './components/icon.svelte';
     import {session, signInHRef, signOutHRef} from '@humandialog/auth.svelte'
-	import { navGetKey, navHide, navIsVisible, navShow, navToggle } from './utils';
-    
+    import {push } from 'svelte-spa-router';
+	import { navGetKey, navHide, navIsVisible, navShow, navToggle, isDeviceSmallerThan } from './utils';
+    import {setCurrentLanguage, getLanguages, i18n, getCurrentLanguage} from './i18n.js'
+    import {showMenu, SHOW_MENU_RIGHT} from './components/menu'
+
     export let appConfig = undefined;
     export let clearsContext = 'sel props'
-    
+
     export let definedTabs = undefined
     export let mainToolbarConfig = undefined
-    
+
     let tabs = new Array();
     let config = null;
-    
-    
+    let has_selection_details = false;
+    let selection_detils_caption =  i18n({en: 'Properties', es: 'Propiedades', pl: 'Właściwości'});
+
+    let show_sign_in_out_icons = false;
     let is_logged_in = false;
-    
+    let sign_in_href = '';
+    let sign_out_href = '';
+
     $:  {
         if(appConfig)
         {
             config = appConfig.mainToolbar;
+            has_selection_details = appConfig.selectionDetails;
+
+            if(has_selection_details)
+            {
+                if(appConfig.selectionDetails.captionFunc)
+                    selection_detils_caption = appConfig.selectionDetails.captionFunc()
+                else if(appConfig.selectionDetails.caption)
+                    selection_detils_caption = appConfig.selectionDetails.caption
+
+            }
         }
         else
         {
+            has_selection_details = false;
             config = mainToolbarConfig;
         }
 
         is_logged_in = $session.isActive;
-        
+        show_sign_in_out_icons = config.signin ? true : false;
+        sign_in_href = $signInHRef;
+        sign_out_href = $signOutHRef;
+
         tabs = new Array();
 
         if(definedTabs && Array.isArray(definedTabs) && definedTabs.length > 0)
@@ -41,8 +64,8 @@
         }
         else
         {
-            Object.keys(appConfig.sidebar).forEach( (key) =>    
-                { 
+            Object.keys(appConfig.sidebar).forEach( (key) =>
+                {
                     const ctab = appConfig.sidebar[key];
                     const can_show = (ctab.authorized && is_logged_in) || (!ctab.authorized)
                     if(can_show)
@@ -56,7 +79,7 @@
                             badgeObtainer: ctab.badgeObtainer
                         }
 
-                        tabs.push(tab); 
+                        tabs.push(tab);
                     }
                 });
 
@@ -77,10 +100,10 @@
 
     function on_navigator_tab_clicked(e, key)
     {
-        e.stopPropagation();    
+        e.stopPropagation();
         navToggle(key);
     }
-    
+
 
     function clearSelection()
     {
@@ -117,7 +140,151 @@
     {
         tabs = [...tabs]
     }
-    
+
+    function show_options(e)
+    {
+
+        let owner = e.target;
+        while(owner && owner.tagName != 'BUTTON')
+            owner = owner.parentElement
+
+        if(!owner)
+            return;
+
+        let rect = owner.getBoundingClientRect();
+        let options = [];
+
+        if(config.customOperations && Array.isArray(config.customOperations) && config.customOperations.length > 0)
+        {
+            config.customOperations.forEach( o => {
+                let add = true;
+                if(o.condition)
+                    add = o.condition();
+
+                if(add)
+                {
+                    let caption = ''
+                    if(o.captionFunc)
+                        caption = o.captionFunc()
+                    else if(o.caption)
+                        caption = o.caption
+
+                    options.push({
+                                    caption: caption,
+                                    icon: o.icon,
+                                    mricon: o.mricon,
+                                    action: o.action,
+                                    menu: o.menu
+                                })
+                }
+            })
+        }
+
+        if(show_sign_in_out_icons)
+        {
+                if(!is_logged_in)
+                {
+                    options.push({
+                        caption: i18n( { en: 'Sign in', es: 'Iniciar sesión', pl: 'Zaloguj'}),
+                        icon: FaSignInAlt,
+                        mricon: 'log-in',
+                        action: (focused) => { push(sign_in_href) }
+                    });
+                }
+                else
+                {
+                    options.push({
+                        caption: i18n({en: 'Sign out', es: 'Cerrar sesión', pl: 'Wyloguj' }) ,
+                        icon: FaSignOutAlt,
+                        mricon: 'log-out',
+                        action: (focused) => { push(sign_out_href) }
+                    });
+                }
+
+                options.push({separator: true})
+
+        }
+
+        if(!config || config.darkMode)
+        {
+            const capt = i18n({en: 'Dark mode', es: 'Modo oscuro', pl: 'Tryb ciemny'})
+            if($dark_mode_store == '')
+            {
+                options.push( {
+                        caption: capt,
+                        icon: FaToggleOff,
+                        mricon: 'sun-moon',
+                        action: (focused) => { $dark_mode_store = 'dark'; }
+                    });
+            }
+            else
+            {
+                options.push( {
+                        caption: capt,
+                        icon: FaToggleOn,
+                        mricon: 'sun-moon',
+                        action: (focused) => { $dark_mode_store = ''; }
+                    });
+            }
+        }
+
+        const langs = getLanguages()
+        if(langs && langs.length > 1)
+        {
+            const langMenu = langs.map( l => ({
+                caption: l.name,
+                img: l.flag,
+                action: (b) => {setCurrentLanguage(l); reloadWholeApp()},
+                disabled: getCurrentLanguage() == l
+            }))
+
+            options.push( {
+                caption: i18n({en: 'Language', es:'Idioma', pl:'Język'}),
+                menu: langMenu,
+                mricon: 'languages',
+                icon: FaLanguage
+            })
+        }
+
+        if(config && config.operations)
+        {
+            options.push( {
+                    caption: i18n({en:'Toolbar', es:'Barra de herramientas', pl:'Pasek narzędzi'}),
+                    icon: $tools_visible_store ? FaToggleOn : FaToggleOff,
+                    action: (focused) => { $tools_visible_store = !$tools_visible_store; }
+                });
+        }
+
+        if(!isDeviceSmallerThan("sm"))
+        {
+            options.push({
+                caption: i18n({en: 'Floating buttons', es: 'Botones flotantes', pl: 'Pływające przyciski'}),
+                icon: $showFABAlways ? FaToggleOn : FaToggleOff,
+                action: (f) => { $showFABAlways = !$showFABAlways; }
+            })
+
+            options.push({
+                caption: i18n({en: 'Left-handed mode', es: 'Modo para zurdos', pl: 'Tryb dla leworęcznych'}),
+                icon: $leftHandedFAB ? FaToggleOn : FaToggleOff,
+                disabled: !$showFABAlways,
+                action: (f) => { $leftHandedFAB = !$leftHandedFAB; }
+            })
+        }
+
+        if(has_selection_details)
+        {
+            options.push( {
+                        caption: selection_detils_caption,
+                        icon: $bottom_bar_visible_store ? FaToggleOn : FaToggleOff,
+                        action: (focused) => { $bottom_bar_visible_store = !$bottom_bar_visible_store }
+                    });
+        }
+
+        //let anchor = new DOMPoint(rect.right, rect.top)
+        showMenu(rect, options, SHOW_MENU_RIGHT);
+    }
+
+
 </script>
 
 <!-- svelte-ignore a11y-click-events-have-key-events -->
@@ -127,11 +294,11 @@
         {#each tabs as tab}
             {@const isSelected = $navKey == tab.key}
             <button
-                class="w-16 h-full flex justify-center items-center text-stone-300 hover:text-stone-100 relative"
+                class="w-16 h-full flex justify-center items-center relative"
                 class:bg-orange-500={isSelected}
                 on:click={tab.onclick}
                 use:mountNavigator={tab}>
-                
+
                 <Icon s="xl" component={tab.icon}/>
 
                 {#if !isSelected}
@@ -147,9 +314,9 @@
                     {:else if tab.badgeObtainerAsync}
                         {#await tab.badgeObtainerAsync() then badge}
                             {#if badge > 0}
-                                <div class="absolute 
-                                            inline-flex items-center justify-center 
-                                            w-5 h-5 
+                                <div class="absolute
+                                            inline-flex items-center justify-center
+                                            w-5 h-5
                                             text-[10px] font-bold text-white bg-red-500 border-2 border-white rounded-full bottom-2 end-0 dark:border-gray-900">
                                     {#if badge > 9}
                                         9+
@@ -164,9 +331,16 @@
 
             </button>
         {/each}
+
+         <button
+            class="w-16 h-full flex justify-center items-center"
+                on:click|stopPropagation={show_options}>
+                <Icon s="xl" component={FaCog} />
+        </button>
+
     </div>
 
-    
+
 </section>
 
     <!--Menu bind:this={menu}/-->

package/horizontal.nav.tabs.svelte.d.ts

@@ -2,8 +2,8 @@
 /** @typedef {typeof __propDef.events}  HorizontalEvents */
 /** @typedef {typeof __propDef.slots}  HorizontalSlots */
 export default class Horizontal extends SvelteComponentTyped<{
-    appConfig?: any;
     clearsContext?: string | undefined;
+    appConfig?: any;
     definedTabs?: any;
     mainToolbarConfig?: any;
 }, {
@@ -16,8 +16,8 @@ export type HorizontalSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
-        appConfig?: any;
         clearsContext?: string | undefined;
+        appConfig?: any;
         definedTabs?: any;
         mainToolbarConfig?: any;
     };

package/horizontal.toolbar.svelte

@@ -27,11 +27,11 @@
 
     export let definedTabs = undefined
     export let mainToolbarConfig = undefined
-    
+
     let config = null;
     let has_selection_details = false;
     let selection_details_caption = i18n({en: 'Properties', es: 'Propiedades', pl: 'Właściwości'});
-    
+
     let show_sign_in_out_icons = false;
     let is_logged_in = false;
     let sign_in_href = '';
@@ -70,14 +70,14 @@
 
         if(definedTabs && Array.isArray(definedTabs) && definedTabs.length > 0)
         {
-            
+
         }
         else
         {
             tabs = Object.keys(appConfig.sidebar);
             if(tabs.length > 1)
                 icon = FaBars;
-            else    
+            else
             {
                 let first_tab = appConfig.sidebar[tabs[0]];
                 icon = first_tab.icon;
@@ -116,7 +116,7 @@
                 let navKey = navPrevVisibleKey()
                 if(!navKey)
                     navKey = Object.keys(appConfig.sidebar)[0]
-                
+
                 navShow(navKey);
             }
             else
@@ -154,6 +154,7 @@
                     options.push({
                                 caption: caption,
                                 icon: o.icon,
+                                mricon: o.mricon,
                                 action: o.action
                             })
                 }
@@ -167,6 +168,7 @@
                     options.push({
                         caption: i18n( { en: 'Sign in', es: 'Iniciar sesión', pl: 'Zaloguj'}),
                         icon: FaSignInAlt,
+                        mricon: 'log-in',
                         action: (focused) => { push(sign_in_href) }
                     });
                 }
@@ -175,12 +177,13 @@
                     options.push({
                         caption: i18n({en: 'Sign out', es: 'Cerrar sesión', pl: 'Wyloguj' }) ,
                         icon: FaSignOutAlt,
+                        mricon: 'log-out',
                         action: (focused) => { push(sign_out_href) }
                     });
                 }
 
                 options.push({separator: true})
-                
+
         }
 
         if(!config || config.darkMode)
@@ -191,6 +194,7 @@
                 options.push( {
                         caption: capt,
                         icon: FaToggleOff,
+                        mricon: 'sun-moon',
                         action: (focused) => { $dark_mode_store = 'dark'; }
                     });
             }
@@ -199,6 +203,7 @@
                 options.push( {
                         caption: capt,
                         icon: FaToggleOn,
+                        mricon: 'sun-moon',
                         action: (focused) => { $dark_mode_store = ''; }
                     });
             }
@@ -217,7 +222,8 @@
             options.push( {
                 caption: i18n({en: 'Language', es:'Idioma', pl:'Język'}),
                 menu: langMenu,
-                icon: FaLanguage
+                icon: FaLanguage,
+                mricon: 'languages',
             })
         }
 
@@ -244,9 +250,9 @@
                         action: (focused) => { $bottom_bar_visible_store = !$bottom_bar_visible_store }
                     });
         }
-        
+
         let pt = new DOMPoint(rect.left, rect.bottom)
-        showMenu(pt, options);    
+        showMenu(pt, options);
     }
 
     function show_groups(e)
@@ -274,9 +280,9 @@
             })
         )
 
-        
+
         let pt = new DOMPoint(rect.left, rect.bottom)
-        showMenu(pt, options);    
+        showMenu(pt, options);
     }
 
     function clearSelection()
@@ -299,26 +305,27 @@
 
 <!-- svelte-ignore a11y-click-events-have-key-events -->
 <div class="no-print flex flex-row w-full" on:click={clearSelection}>
+    <p>toolbar</p>
     <div class="flex-none left-0 flex h-12 sm:h-10">
         {#if definedTabs && definedTabs.length > 0}
             {#each definedTabs as tab}
                 <button class="w-12 sm:w-10 h-full flex justify-center items-center text-stone-300 hover:text-stone-100" on:click={tab.onclick}>
-                    <Icon s="xl" component={tab.icon}/>
-                </button>    
+                    <Icon s="s" component={tab.icon}/>
+                </button>
             {/each}
         {:else}
             <button class="w-12 sm:w-10 h-full flex justify-center items-center text-stone-300 hover:text-stone-100" on:click|stopPropagation={toggle_navigator}>
-                <Icon s="xl" component={icon}/>
+                <Icon s="s" component={icon}/>
             </button>
         {/if}
     </div>
 
     <div class="grow">
-        
+
         <div class="block sm:hidden mt-4 sm:mt-3 uppercase text-sm text-center">{@html title}</div>
     </div>
 
-    <div class="flex-none ml-auto flex h-12 sm:h-10">   
+    <div class="flex-none ml-auto flex h-12 sm:h-10">
         {#if user_is_in_multiple_groups}
             <button class="h-full w-12 sm:w-10 px-0 flex justify-center items-center   text-stone-300 hover:text-stone-100"
                     on:click|stopPropagation={show_groups}>
@@ -340,8 +347,8 @@
     <div  class="no-print flex-none block fixed left-0 top-[40px] w-[40px] h-screen z-20 inset-0   overflow-hidden">
         <div class="sticky top-0 flex h-full w-10 bg-stone-900 flex-col items-center text-stone-100 shadow">
             <VerticalToolbar {appConfig} mobile={true}/>
-        </div>    
-    </div>    
+        </div>
+    </div>
 {/if}
 
 <!--Menu bind:this={menu}/-->

package/horizontal.toolbar.svelte.d.ts

@@ -2,8 +2,8 @@
 /** @typedef {typeof __propDef.events}  HorizontalEvents */
 /** @typedef {typeof __propDef.slots}  HorizontalSlots */
 export default class Horizontal extends SvelteComponentTyped<{
-    appConfig?: any;
     clearsContext?: string | undefined;
+    appConfig?: any;
     definedTabs?: any;
     mainToolbarConfig?: any;
 }, {
@@ -16,8 +16,8 @@ export type HorizontalSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
 declare const __propDef: {
     props: {
-        appConfig?: any;
         clearsContext?: string | undefined;
+        appConfig?: any;
         definedTabs?: any;
         mainToolbarConfig?: any;
     };

package/index.d.ts

@@ -4,15 +4,22 @@ export { default as Row } from "./tiles.row.svelte";
 export { default as Box } from "./form.box.svelte";
 export { default as Operations } from './operations.svelte';
 export { default as Paper } from './paper.svelte';
+export { default as PaperNav } from './paper.nav.svelte';
+export { default as PaperTable } from './paper.table.svelte';
+export { default as PaperTopMargin } from './paper.top.margin.svelte';
+export { default as PaperHeader } from './paper.header.svelte';
 export { default as Layout } from './desk.svelte';
 export { default as VerticalToolbar } from './vertical.toolbar.svelte';
 export { default as HorizontalToolbar } from './horizontal.toolbar.svelte';
 export { default as Icon } from "./components/icon.svelte";
 export { default as IconT } from "./components/icon.ex.svelte";
+export { default as Ricon } from "./components/r.icon.svelte";
+export { default as REdit } from "./components/r.edit.svelte";
+export { default as Editable } from "./components/r.editable.svelte";
 export { default as Button } from './components/button.svelte';
 export { default as Checkbox } from './components/checkbox.svelte';
 export { default as DatePicker } from './components/date.svelte';
-export { default as Edit } from './components/edit.field.svelte';
+export { default as FieldEdit } from './components/edit.field.svelte';
 export { default as FileLoader } from './components/file.loader.svelte';
 export { default as Input } from './components/inputbox.ltop.svelte';
 export { default as Radio } from './components/radio.svelte';
@@ -64,13 +71,13 @@ export { default as Breadcrumb } from './components/breadcrumb.svelte';
 export { breadcrumbAdd, breadcrumbParse, breadcrumbStringify, breadcrumbClipName } from './components/breadcrumb_utils';
 export { default as EditableSpan } from './components/prose.editable.span.svelte';
 export { default as EditableParagraph } from './components/prose.editable.p.svelte';
-export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, getActiveItems, getActiveCount, addActiveItem, removeActiveItem, editable, startEditing, saveCurrentEditable, selectable, handleSelect, isDeviceSmallerThan, resizeImage, refreshToolbarOperations, reloadPageToolbarOperations, isOnScreenKeyboardVisible, randomString, UI, NAV_MODE_SIDEBAR, NAV_MODE_FULL_PAGE, navGetMode, navIsVisible, navGetKey, navShow, navHide, navToggle, navPrevVisibleKey, navAutoHide, insertAt, insertAfter, getPrev, getNext, getFirst, getLast, removeAt, remove, swapElements, setSelectionAtEnd, isValidEmail, localStorageSave, localStorageRead, sessionStorageSave, sessionStorageRead, hasLocalStorage } from './utils';
+export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, getActiveItems, getActiveCount, addActiveItem, removeActiveItem, editable, startEditing, saveCurrentEditable, focusEditable, selectable, handleSelect, isDeviceSmallerThan, resizeImage, refreshToolbarOperations, reloadPageToolbarOperations, isOnScreenKeyboardVisible, randomString, UI, NAV_MODE_SIDEBAR, NAV_MODE_FULL_PAGE, navGetMode, navIsVisible, navGetKey, navShow, navHide, navToggle, navPrevVisibleKey, navAutoHide, insertAt, insertAfter, getPrev, getNext, getFirst, getLast, removeAt, remove, swapElements, setSelectionAtEnd, isValidEmail, localStorageSave, localStorageRead, sessionStorageSave, sessionStorageRead, hasLocalStorage, getCurrentGroupName, getGroupsMenu } from './utils';
 export { getNiceStringDateTime, getFormattedStringDate, getNiceStringDate, dayName, monthName } from './components/date_utils';
 export { mainContentPageReloader, reloadMainContentPage, reloadWholeApp, wholeAppReloader, alerts, addAlert, onErrorShowAlert, main_sidebar_visible_store, navKey, tagsReloader, reloadVisibleTags, dark_mode_store, showFABAlways } from './stores.js';
 export { data_tick_store, // tmp
 hasSelectedItem, hasDataItem, setNavigatorTitle } from "./stores";
 export { contextToolbarOperations, pageToolbarOperations, contextItemsStore, contextTypesStore } from './stores';
-export { informModification, informModificationEx, informItem, pushChanges, hasModifications } from './updates';
+export { informModification, setjItemProperty, informModificationEx, informItem, pushChanges, hasModifications } from './updates';
 export { default as IcH1 } from './components/document/internal/h1.icon.svelte';
 export { default as IcH2 } from './components/document/internal/h2.icon.svelte';
 export { default as IcH3 } from './components/document/internal/h3.icon.svelte';

package/index.js

@@ -8,16 +8,23 @@ export { default as Box } from "./form.box.svelte";
 //export { default as TilesVerticalRow } from "./tiles.vertical.row.svelte";
 export { default as Operations } from './operations.svelte';
 export { default as Paper } from './paper.svelte';
+export { default as PaperNav } from './paper.nav.svelte';
+export { default as PaperTable } from './paper.table.svelte';
+export { default as PaperTopMargin } from './paper.top.margin.svelte';
+export { default as PaperHeader } from './paper.header.svelte';
 export { default as Layout } from './desk.svelte';
 export { default as VerticalToolbar } from './vertical.toolbar.svelte';
 export { default as HorizontalToolbar } from './horizontal.toolbar.svelte';
 // @ts-ignore
 export { default as Icon } from "./components/icon.svelte";
 export { default as IconT } from "./components/icon.ex.svelte";
+export { default as Ricon } from "./components/r.icon.svelte";
+export { default as REdit } from "./components/r.edit.svelte";
+export { default as Editable } from "./components/r.editable.svelte";
 export { default as Button } from './components/button.svelte';
 export { default as Checkbox } from './components/checkbox.svelte';
 export { default as DatePicker } from './components/date.svelte';
-export { default as Edit } from './components/edit.field.svelte';
+export { default as FieldEdit } from './components/edit.field.svelte';
 export { default as FileLoader } from './components/file.loader.svelte';
 export { default as Input } from './components/inputbox.ltop.svelte';
 export { default as Radio } from './components/radio.svelte';
@@ -70,13 +77,13 @@ export { default as Breadcrumb } from './components/breadcrumb.svelte';
 export { breadcrumbAdd, breadcrumbParse, breadcrumbStringify, breadcrumbClipName } from './components/breadcrumb_utils';
 export { default as EditableSpan } from './components/prose.editable.span.svelte';
 export { default as EditableParagraph } from './components/prose.editable.p.svelte';
-export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, getActiveItems, getActiveCount, addActiveItem, removeActiveItem, editable, startEditing, saveCurrentEditable, selectable, handleSelect, isDeviceSmallerThan, resizeImage, refreshToolbarOperations, reloadPageToolbarOperations, isOnScreenKeyboardVisible, randomString, UI, NAV_MODE_SIDEBAR, NAV_MODE_FULL_PAGE, navGetMode, navIsVisible, navGetKey, navShow, navHide, navToggle, navPrevVisibleKey, navAutoHide, insertAt, insertAfter, getPrev, getNext, getFirst, getLast, removeAt, remove, swapElements, setSelectionAtEnd, isValidEmail, localStorageSave, localStorageRead, sessionStorageSave, sessionStorageRead, hasLocalStorage } from './utils';
+export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, getActiveItems, getActiveCount, addActiveItem, removeActiveItem, editable, startEditing, saveCurrentEditable, focusEditable, selectable, handleSelect, isDeviceSmallerThan, resizeImage, refreshToolbarOperations, reloadPageToolbarOperations, isOnScreenKeyboardVisible, randomString, UI, NAV_MODE_SIDEBAR, NAV_MODE_FULL_PAGE, navGetMode, navIsVisible, navGetKey, navShow, navHide, navToggle, navPrevVisibleKey, navAutoHide, insertAt, insertAfter, getPrev, getNext, getFirst, getLast, removeAt, remove, swapElements, setSelectionAtEnd, isValidEmail, localStorageSave, localStorageRead, sessionStorageSave, sessionStorageRead, hasLocalStorage, getCurrentGroupName, getGroupsMenu } from './utils';
 export { getNiceStringDateTime, getFormattedStringDate, getNiceStringDate, dayName, monthName } from './components/date_utils';
 export { mainContentPageReloader, reloadMainContentPage, reloadWholeApp, wholeAppReloader, alerts, addAlert, onErrorShowAlert, main_sidebar_visible_store, navKey, tagsReloader, reloadVisibleTags, dark_mode_store, showFABAlways } from './stores.js';
 export { data_tick_store, // tmp
 hasSelectedItem, hasDataItem, setNavigatorTitle } from "./stores";
 export { contextToolbarOperations, pageToolbarOperations, contextItemsStore, contextTypesStore } from './stores'; // tmp
-export { informModification, informModificationEx, informItem, pushChanges, hasModifications } from './updates'; // tmp
+export { informModification, setjItemProperty, informModificationEx, informItem, pushChanges, hasModifications } from './updates'; // tmp
 export { default as IcH1 } from './components/document/internal/h1.icon.svelte';
 export { default as IcH2 } from './components/document/internal/h2.icon.svelte';
 export { default as IcH3 } from './components/document/internal/h3.icon.svelte';