@humandialog/forms.svelte 1.7.12 → 1.7.13

package/components/list/list.svelte

@@ -1,6 +1,6 @@
 <script>import { setContext, getContext, afterUpdate, tick, onMount } from "svelte";
 import { data_tick_store, contextItemsStore, contextTypesStore } from "../../stores";
-import { activateItem, getActive, clearActiveItem, parseWidthDirective, getPrev, getNext, swapElements, getLast, insertAfter, getActiveCount, addActiveItem } from "../../utils";
+import { activateItem, getActive, clearActiveItem, parseWidthDirective, getPrev, getNext, swapElements, getLast, insertAfter, getActiveCount, addActiveItem, getFirst, insertAt, remove as removeFrom } from "../../utils";
 import Icon from "../icon.svelte";
 import { FaRegCircle, FaRegCheckCircle } from "svelte-icons/fa/";
 import { rList_definition } from "./List";
@@ -139,7 +139,8 @@ export function reload(data, selectElement = KEEP_SELECTION) {
         activate_after_dom_update = itemToActivate;
       }
     }
-  }
+  } else
+    clearActiveItem(selectionKey);
 }
 export async function moveUp(element) {
   if (!orderAttrib)
@@ -169,6 +170,30 @@ export async function moveDown(element) {
   informModification(next, orderAttrib);
   pushChanges();
 }
+export async function moveTop(element) {
+  if (!orderAttrib)
+    return;
+  let current = getFirst(items);
+  if (current == element)
+    return;
+  const firstOrder = current[orderAttrib];
+  while (current != element) {
+    const next = getNext(items, current);
+    const nextOrder = next[orderAttrib];
+    current[orderAttrib] = nextOrder;
+    informModification(current, orderAttrib);
+    current = next;
+  }
+  element[orderAttrib] = firstOrder;
+  informModification(element, orderAttrib);
+  items = removeFrom(items, element);
+  items = insertAt(items, 0, element);
+  await tick();
+  scrollToSelectedElement();
+  pushChanges();
+}
+export async function moveBottom(element) {
+}
 let last_activated_element = null;
 export async function addRowAfter(after = null) {
   if (!definition.can_insert)

package/components/list/list.svelte.d.ts

@@ -26,6 +26,8 @@ declare const __propDef: {
         reload?: ((data: object | object[], selectElement?: number) => void) | undefined;
         moveUp?: ((element: object) => Promise<void>) | undefined;
         moveDown?: ((element: object) => Promise<void>) | undefined;
+        moveTop?: ((element: object) => Promise<void>) | undefined;
+        moveBottom?: ((element: object) => Promise<void>) | undefined;
         addRowAfter?: ((after?: object | null) => Promise<void>) | undefined;
         remove?: ((element: object) => void) | undefined;
         edit?: ((element: object, property_name: string) => void) | undefined;
@@ -59,6 +61,8 @@ export default class List extends SvelteComponentTyped<ListProps, ListEvents, Li
     get reload(): (data: object | object[], selectElement?: number) => void;
     get moveUp(): (element: object) => Promise<void>;
     get moveDown(): (element: object) => Promise<void>;
+    get moveTop(): (element: object) => Promise<void>;
+    get moveBottom(): (element: object) => Promise<void>;
     get addRowAfter(): (after?: object | null) => Promise<void>;
     get remove(): (element: object) => void;
     get edit(): (element: object, property_name: string) => void;

package/dialog.svelte

@@ -0,0 +1,49 @@
+<script>import { afterUpdate, onMount, tick } from "svelte";
+import Icon from "./components/icon.svelte";
+import { pushToolsActionsOperations, popToolsActionsOperations, fabHiddenDueToPopup } from "./stores.js";
+import { isDeviceSmallerThan } from "./utils";
+import { FaTimes } from "svelte-icons/fa";
+import { i18n } from "./i18n.js";
+export let open = false;
+export function show(on_close_callback = void 0) {
+  open = true;
+  close_callback = on_close_callback;
+  if (isDeviceSmallerThan("sm")) {
+    $fabHiddenDueToPopup = true;
+  }
+}
+export function hide() {
+  if (!open)
+    return;
+  open = false;
+  $fabHiddenDueToPopup = false;
+}
+let root;
+afterUpdate(
+  async () => {
+    if (!!root) {
+      let modal_root = document.getElementById("__hd_svelte_modal_root");
+      if (!!modal_root && root.parentElement != modal_root) {
+        await tick();
+        modal_root.appendChild(root);
+      }
+    }
+  }
+);
+let close_callback = void 0;
+</script>
+
+{#if open}
+<div 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 z-30 inset-0 w-screen overflow-y-auto">
+      <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 -->
+            <slot/>
+        </div>
+      </div>
+    </div>
+  </div>
+  {/if}

package/dialog.svelte.d.ts

@@ -0,0 +1,22 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        open?: boolean | undefined;
+        show?: ((on_close_callback?: Function | undefined) => void) | undefined;
+        hide?: (() => void) | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export type DialogProps = typeof __propDef.props;
+export type DialogEvents = typeof __propDef.events;
+export type DialogSlots = typeof __propDef.slots;
+export default class Dialog extends SvelteComponentTyped<DialogProps, DialogEvents, DialogSlots> {
+    get show(): (on_close_callback?: Function | undefined) => void;
+    get hide(): () => void;
+}
+export {};

package/index.d.ts

@@ -42,6 +42,7 @@ export { default as ListComboProperty } from './components/list/list.combo.svelt
 export { default as ListStaticProperty } from './components/list/list.static.svelte';
 export { default as ListTags } from './components/list/list.tags.svelte';
 export { default as Modal } from './modal.svelte';
+export { default as Dialog } from './dialog.svelte';
 export { default as MembersPage } from './tenant.members.svelte';
 export { default as Console } from './console.svelte';
 export { default as Tag } from './components/tag.svelte';

package/index.js

@@ -48,6 +48,7 @@ export { default as ListComboProperty } from './components/list/list.combo.svelt
 export { default as ListStaticProperty } from './components/list/list.static.svelte';
 export { default as ListTags } from './components/list/list.tags.svelte';
 export { default as Modal } from './modal.svelte';
+export { default as Dialog } from './dialog.svelte';
 export { default as MembersPage } from './tenant.members.svelte';
 export { default as Console } from './console.svelte';
 export { default as Tag } from './components/tag.svelte';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@humandialog/forms.svelte",
-  "version": "1.7.12",
+  "version": "1.7.13",
   "description": "Basic Svelte UI components for Object Reef applications",
   "devDependencies": {
     "@playwright/test": "^1.28.1",
@@ -156,6 +156,7 @@
     "./components/tile.title.svelte": "./components/tile.title.svelte",
     "./console.svelte": "./console.svelte",
     "./desk.svelte": "./desk.svelte",
+    "./dialog.svelte": "./dialog.svelte",
     "./form.box.svelte": "./form.box.svelte",
     "./horizontal.toolbar.svelte": "./horizontal.toolbar.svelte",
     "./i18n-preprocess": "./i18n-preprocess.js",