@humandialog/forms.svelte 1.1.3 → 1.1.5

package/components/contextmenu.svelte

@@ -26,8 +26,13 @@ afterUpdate(() => {
   let container_rect = new DOMRect(m, 0, window.innerWidth - 2 * m, window.innerHeight);
   if (isDeviceSmallerThan("sm")) {
     const sel = window.getSelection();
+    console.log("sel", sel);
     if (sel && sel.rangeCount > 0 && sel.focusNode && sel.focusNode.nodeType == sel.focusNode.TEXT_NODE) {
-      container_rect.height -= 300;
+      const el = sel.focusNode.parentElement;
+      if (el && (el.isContentEditable || el.contentEditable == "true" || el.tagName == "INPUT")) {
+        console.log("keyboard visible, move menu 300px up", el);
+        container_rect.height -= 300;
+      }
     }
   }
   let xShifted = false;

package/components/sidebar/sidebar.item.svelte

@@ -167,26 +167,42 @@ function activateRow(e) {
         on:keyup
         class="     border border-transparent rounded-lg
                     text-lg sm:text-base font-normal 
-                    text-stone-900 sm:hover:bg-stone-100  
-                    dark:text-white sm:dark:hover:bg-stone-700 {user_class}"
+                    text-stone-900 dark:text-white  {user_class}"
+        class:sm:hover:bg-stone-100={!!href}
+        class:sm:dark:hover:bg-stone-700={!!href}
         class:bg-stone-200={isRowActive}
         class:dark:bg-stone-700={isRowActive}
         class:selected={selected(selectable, context_data)}>
             <div class="flex flex-row justify-between">
-                <a  href={href} 
-                    on:click={on_link_clicked} 
-                    class="flex-1 ml-2 mt-3 sm:mt-2 inline-flex items-center group"
-                    class:mb-3={!summary}
-                    class:sm:mb-2={!summary}
-                    >
-                    {#if icon}
-                        <Icon size={5} component={icon}/>
-                    {/if}
-                    <span   class="ml-3 group-hover:underline"
-                            use:editable_if_needed={editable}>
-                        <slot/>
-                    </span>
-                </a>
+                {#if href}
+                    <a  href={href} 
+                        on:click={on_link_clicked} 
+                        class="flex-1 ml-2 mt-3 sm:mt-2 inline-flex items-center group"
+                        class:mb-3={!summary}
+                        class:sm:mb-2={!summary}
+                        >
+                        {#if icon}
+                            <Icon size={5} component={icon}/>
+                        {/if}
+                        <span   class="ml-3 group-hover:underline"
+                                use:editable_if_needed={editable}>
+                            <slot/>
+                        </span>
+                    </a>
+                {:else}
+                    <p  class="flex-1 ml-2 mt-3 sm:mt-2 inline-flex items-center group cursor-default"
+                        class:mb-3={!summary}
+                        class:sm:mb-2={!summary}
+                        use:selectable_if_needed={selectable}>
+                        {#if icon}
+                            <Icon size={5} component={icon}/>
+                        {/if}
+                        <span   class="ml-3"
+                                use:editable_if_needed={editable}>
+                            <slot/>
+                        </span>
+                    </p>
+                {/if}
 
                 {#if !isOnPage}
                 <section    class="flex-0 w-20 sm:w-12 h-10 flex-0 flex flex-row"

package/desk.svelte

@@ -156,10 +156,18 @@
     }
 
     //$: screen.width = innerWidth;  
+
+    $: switchBodyClass($dark_mode_store);
+    function switchBodyClass(...args)
+    {
+        document.body.className = $dark_mode_store;
+    }
+
 </script>
 
 <svelte:window bind:innerWidth bind:outerWidth bind:innerHeight bind:outerHeight />
 
+
 <!--AuthorizedView {autoRedirectToSignIn}-->
     
     {#key $wholeAppReloader}
@@ -290,6 +298,8 @@
   /* Track */
   /* Handle */
   /* Handle on hover */
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255/var(--tw-bg-opacity));
 }
 #__hd_svelte_layout_root ::-webkit-scrollbar {
   width: 10px;
@@ -309,6 +319,8 @@
   /* Track */
   /* Handle */
   /* Handle on hover */
+  --tw-bg-opacity: 1;
+  background-color: rgb(28 25 23/var(--tw-bg-opacity));
 }
 #__hd_svelte_layout_root.dark ::-webkit-scrollbar {
   width: 10px;
@@ -321,4 +333,15 @@
 }
 #__hd_svelte_layout_root.dark ::-webkit-scrollbar-thumb:hover {
   background: #57534e;
+}
+
+/* bg-white */
+:global(body) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255/var(--tw-bg-opacity));
+}
+
+:global(body.dark) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(28 25 23/var(--tw-bg-opacity));
 }</style>

package/horizontal.toolbar.svelte

@@ -53,7 +53,7 @@
         show_sign_in_out_icons = config.signin ? true : false;
         sign_in_href = $signInHRef;
         sign_out_href = $signOutHRef;
-        user_is_in_multiple_groups = $session.tenants.length > 1
+        //user_is_in_multiple_groups = $session.tenants.length > 1
 
         tabs = Object.keys(appConfig.sidebar);
         if(tabs.length > 1)

package/index.d.ts

@@ -53,7 +53,7 @@ export { default as KanbanTagsProperty } from './components/kanban/kanban.tags.s
 export { default as KanbanCallbacks } from './components/kanban/kanban.callbacks.svelte';
 export { KanbanColumnTop, KanbanColumnBottom } from './components/kanban/Kanban';
 export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, editable, startEditing, saveCurrentEditable, selectable, handleSelect, isDeviceSmallerThan } from './utils';
-export { mainContentPageReloader, reloadMainContentPage } from './stores.js';
+export { mainContentPageReloader, reloadMainContentPage, reloadWholeApp } from './stores.js';
 export { data_tick_store, // tmp
 hasSelectedItem, hasDataItem, setNavigatorTitle } from "./stores";
 export { contextToolbarOperations, pageToolbarOperations, contextItemsStore, contextTypesStore } from './stores';

package/index.js

@@ -59,7 +59,7 @@ export { default as KanbanTagsProperty } from './components/kanban/kanban.tags.s
 export { default as KanbanCallbacks } from './components/kanban/kanban.callbacks.svelte';
 export { KanbanColumnTop, KanbanColumnBottom } from './components/kanban/Kanban';
 export { selectItem, activateItem, clearActiveItem, isActive, isSelected, getActive, editable, startEditing, saveCurrentEditable, selectable, handleSelect, isDeviceSmallerThan } from './utils';
-export { mainContentPageReloader, reloadMainContentPage } from './stores.js';
+export { mainContentPageReloader, reloadMainContentPage, reloadWholeApp } from './stores.js';
 export { data_tick_store, // tmp
 hasSelectedItem, hasDataItem, setNavigatorTitle } from "./stores";
 export { contextToolbarOperations, pageToolbarOperations, contextItemsStore, contextTypesStore } from './stores'; // tmp

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@humandialog/forms.svelte",
-  "version": "1.1.3",
+  "version": "1.1.5",
   "description": "Basic Svelte UI components for Object Reef applications",
   "devDependencies": {
     "@playwright/test": "^1.28.1",
@@ -26,7 +26,7 @@
   },
   "type": "module",
   "dependencies": {
-    "@humandialog/auth.svelte": "^1.8.1",
+    "@humandialog/auth.svelte": "^1.8.2",
     "flowbite-svelte": "^0.44.4",
     "svelte-icons": "^2.1.0",
     "svelte-spa-router": "^4.0.1"

package/vertical.toolbar.svelte

@@ -76,7 +76,7 @@
             }
         }
        
-        show_groups_switch_menu = $session.tenants.length > 1
+        /*show_groups_switch_menu = $session.tenants.length > 1
 
         if($session.configuration.tenant)
         {
@@ -89,6 +89,7 @@
             }))
             
         } 
+        */
         
     }