@likable-hair/svelte 3.3.20 → 3.3.21

package/dist/components/simple/navigation/Drawer.svelte

@@ -1,115 +1,73 @@
-<script lang="ts">
-  import '../../../css/main.css'
-  import './Drawer.css'
-  import Navigator from "./Navigator.svelte";
-  import type { Item } from "./Navigator.svelte";
-  import { createEventDispatcher, onMount, beforeUpdate } from 'svelte';
-  import Teleporter from '../../../utils/teleporter';
-  import Keyboarder, { type CallbackFunction } from '../../../utils/keyboarder';
-  import { BROWSER } from 'esm-env';
-
-  export let open = false,
-    position: "left" | "top" | "right" | "bottom" = "left",
-    overlay = false,
-    closeOnClickOutside = true,
-    items: Item[] = [],
-    teleportedUid: string | undefined = undefined,
-    _space: string | undefined = undefined,
-    _openingSpeed: string | undefined = undefined,
-    _backgroundColor: string | undefined = undefined,
-    _color: string | undefined = undefined,
-    _overflow: string | undefined = undefined,
-    _borderRadius: string | undefined = undefined,
-    _margin: string | undefined = undefined,
-    _overlaySpeed: string | undefined = undefined,
-    _overlayBackgroundColor: string | undefined = undefined,
-    _overlayOpacity: string | undefined = undefined
-
-  let drawerElement: HTMLElement,
-    localOpen: boolean = false
-
-  const dispatch = createEventDispatcher<{
-    'close': {}
-  }>()
-
-  onMount(() => {
-    if(!teleportedUid) {
-      // let oldCssVars = {
-      //   '--drawer-space': getComputedStyle(drawerElement).getPropertyValue('--drawer-space')
-      // }
-
-      let tp = new Teleporter()
-      teleportedUid = tp.attachNode(drawerElement)
-
-      // drawerElement.style.setProperty('--drawer-space', oldCssVars['--drawer-space'])
-    }
-
-    let keyboarderHandler: CallbackFunction = (params) => {
-      if(params.key == 'Escape' && open) closeDrawer()
-    }
-    Keyboarder.on(keyboarderHandler)
-
-    return () => {
-      if(!!teleportedUid) {
-        let tp = new Teleporter()
-        tp.destroyNode(teleportedUid)
-      }
-
-      Keyboarder.off(keyboarderHandler)
+<script>import "../../../css/main.css";
+import "./Drawer.css";
+import Navigator from "./Navigator.svelte";
+import { createEventDispatcher, onMount, beforeUpdate } from "svelte";
+import Teleporter from "../../../utils/teleporter";
+import Keyboarder, {} from "../../../utils/keyboarder";
+import { BROWSER } from "esm-env";
+export let open = false, position = "left", overlay = false, closeOnClickOutside = true, items = [], teleportedUid = void 0, _space = void 0, _openingSpeed = void 0, _backgroundColor = void 0, _color = void 0, _overflow = void 0, _borderRadius = void 0, _margin = void 0, _overlaySpeed = void 0, _overlayBackgroundColor = void 0, _overlayOpacity = void 0;
+let drawerElement, localOpen = false;
+const dispatch = createEventDispatcher();
+onMount(() => {
+  if (!teleportedUid) {
+    let tp = new Teleporter();
+    teleportedUid = tp.attachNode(drawerElement);
+  }
+  let keyboarderHandler = (params) => {
+    if (params.key == "Escape" && open)
+      closeDrawer();
+  };
+  Keyboarder.on(keyboarderHandler);
+  return () => {
+    if (!!teleportedUid) {
+      let tp = new Teleporter();
+      tp.destroyNode(teleportedUid);
     }
-  })
-
-  function closeDrawer() {
+    Keyboarder.off(keyboarderHandler);
+  };
+});
+function closeDrawer() {
+  open = false;
+  overlay = false;
+  dispatch("close", {});
+}
+function handleClickOverlay() {
+  if (closeOnClickOutside) {
     open = false;
     overlay = false;
-    dispatch('close', {})
-  }
-
-  function handleClickOverlay() {
-    if(closeOnClickOutside) {
-      open = false;
-      overlay = false;
-      dispatch('close', {})
+    dispatch("close", {});
+  }
+}
+let zIndex = 50;
+beforeUpdate(() => {
+  if (BROWSER && open && localOpen !== open) {
+    let otherDialogs = document.querySelectorAll("[data-dialog=true]");
+    let maxZIndex = 0;
+    if (otherDialogs.length > 0) {
+      otherDialogs.forEach((dialog) => {
+        let computedStyle = getComputedStyle(dialog);
+        let currentZIndex = computedStyle.getPropertyValue("--dialog-z-index");
+        if (!maxZIndex || maxZIndex < Number(currentZIndex))
+          maxZIndex = Number(currentZIndex);
+      });
+      zIndex = maxZIndex + 2;
     }
-  }
-
-  let zIndex: number = 50
-  beforeUpdate(() => {
-    if(BROWSER && open && localOpen !== open) {
-      let otherDialogs: NodeListOf<HTMLElement> =
-      document.querySelectorAll("[data-dialog=true]");
-
-      let maxZIndex = 0;
-
-      if (otherDialogs.length > 0) {
-        otherDialogs.forEach((dialog) => {
-          let computedStyle = getComputedStyle(dialog)
-          let currentZIndex = computedStyle.getPropertyValue('--dialog-z-index')
-          if (!maxZIndex || maxZIndex < Number(currentZIndex))
-            maxZIndex = Number(currentZIndex);
-        });
-        zIndex = maxZIndex + 2;
-      }
-
-      let otherDrawers: NodeListOf<HTMLElement> =
-        document.querySelectorAll("[data-drawer=true]");
-
-      if (otherDrawers.length > 0) {
-        otherDrawers.forEach((dialog) => {
-          let computedStyle = getComputedStyle(dialog)
-          let currentZIndex = computedStyle.getPropertyValue('--drawer-z-index')
-          if (!maxZIndex || maxZIndex < Number(currentZIndex))
-            maxZIndex = Number(currentZIndex);
-        });
-        zIndex = maxZIndex + 2;
-      }
-
-      overlay = true
-      localOpen = true
-    } else if(BROWSER && !open && localOpen !== open) {
-      localOpen = false
+    let otherDrawers = document.querySelectorAll("[data-drawer=true]");
+    if (otherDrawers.length > 0) {
+      otherDrawers.forEach((dialog) => {
+        let computedStyle = getComputedStyle(dialog);
+        let currentZIndex = computedStyle.getPropertyValue("--drawer-z-index");
+        if (!maxZIndex || maxZIndex < Number(currentZIndex))
+          maxZIndex = Number(currentZIndex);
+      });
+      zIndex = maxZIndex + 2;
     }
-  })
+    overlay = true;
+    localOpen = true;
+  } else if (BROWSER && !open && localOpen !== open) {
+    localOpen = false;
+  }
+});
 </script>
 
 <div

package/dist/components/simple/navigation/Drawer.svelte.d.ts

@@ -1,56 +1,43 @@
+import { SvelteComponent } from "svelte";
 import '../../../css/main.css';
 import './Drawer.css';
 import type { Item } from "./Navigator.svelte";
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
+declare const __propDef: {
+    props: {
+        open?: boolean | undefined;
+        position?: "left" | "right" | "bottom" | "top" | undefined;
+        overlay?: boolean | undefined;
+        closeOnClickOutside?: boolean | undefined;
+        items?: Item[] | undefined;
+        teleportedUid?: string | undefined;
+        _space?: string | undefined;
+        _openingSpeed?: string | undefined;
+        _backgroundColor?: string | undefined;
+        _color?: string | undefined;
+        _overflow?: string | undefined;
+        _borderRadius?: string | undefined;
+        _margin?: string | undefined;
+        _overlaySpeed?: string | undefined;
+        _overlayBackgroundColor?: string | undefined;
+        _overlayOpacity?: string | undefined;
     };
-    z_$$bindings?: Bindings;
-}
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const Drawer: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    open?: boolean;
-    position?: "left" | "top" | "right" | "bottom";
-    overlay?: boolean;
-    closeOnClickOutside?: boolean;
-    items?: Item[];
-    teleportedUid?: string | undefined;
-    _space?: string | undefined;
-    _openingSpeed?: string | undefined;
-    _backgroundColor?: string | undefined;
-    _color?: string | undefined;
-    _overflow?: string | undefined;
-    _borderRadius?: string | undefined;
-    _margin?: string | undefined;
-    _overlaySpeed?: string | undefined;
-    _overlayBackgroundColor?: string | undefined;
-    _overlayOpacity?: string | undefined;
-}, {
-    default: {
-        open: boolean;
+    events: {
+        'item-click': CustomEvent<{
+            item: Item;
+        }>;
+        close: CustomEvent<{}>;
+    } & {
+        [evt: string]: CustomEvent<any>;
     };
-}>, {
-    'item-click': CustomEvent<{
-        item: Item;
-    }>;
-    close: CustomEvent<{}>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {
-        open: boolean;
+    slots: {
+        default: {
+            open: boolean;
+        };
     };
-}, {}, string>;
-type Drawer = InstanceType<typeof Drawer>;
-export default Drawer;
+};
+export type DrawerProps = typeof __propDef.props;
+export type DrawerEvents = typeof __propDef.events;
+export type DrawerSlots = typeof __propDef.slots;
+export default class Drawer extends SvelteComponent<DrawerProps, DrawerEvents, DrawerSlots> {
+}
+export {};

package/dist/components/simple/navigation/HeaderMenu.svelte

@@ -1,45 +1,28 @@
-<script lang="ts">
-  import '../../../css/main.css'
-  import './HeaderMenu.css'
-  import Button from "../buttons/Button.svelte";
-  import Drawer from "./Drawer.svelte";
-  import { createEventDispatcher } from 'svelte';
-
-  let dispatch = createEventDispatcher<{
-    'drawer-change': {
-      opened: boolean
-    }
-  }>()
-
-  export let title = "",
-    hideOnScroll = true,
-    initialRemoveShadow = false,
-    color: string | undefined = undefined,
-    mobileMenu = true,
-    zIndex = 25;
-
-  let scrollY: number,
-    lastScrollY: number,
-    visible = true;
-  function handleScroll() {
-    if (hideOnScroll) {
-      if (scrollY > lastScrollY) {
-        visible = false;
-      } else {
-        visible = true;
-      }
+<script>import "../../../css/main.css";
+import "./HeaderMenu.css";
+import Button from "../buttons/Button.svelte";
+import Drawer from "./Drawer.svelte";
+import { createEventDispatcher } from "svelte";
+let dispatch = createEventDispatcher();
+export let title = "", hideOnScroll = true, initialRemoveShadow = false, color = void 0, mobileMenu = true, zIndex = 25;
+let scrollY, lastScrollY, visible = true;
+function handleScroll() {
+  if (hideOnScroll) {
+    if (scrollY > lastScrollY) {
+      visible = false;
+    } else {
+      visible = true;
     }
-
-    lastScrollY = scrollY;
-  }
-
-  export let openDrawer = false;
-  function toggleDrawer() {
-    openDrawer = !openDrawer;
-    dispatch('drawer-change', {
-      opened: openDrawer
-    })
   }
+  lastScrollY = scrollY;
+}
+export let openDrawer = false;
+function toggleDrawer() {
+  openDrawer = !openDrawer;
+  dispatch("drawer-change", {
+    opened: openDrawer
+  });
+}
 </script>
 
 <svelte:window bind:scrollY on:scroll={handleScroll} />

package/dist/components/simple/navigation/HeaderMenu.svelte.d.ts

@@ -1,43 +1,39 @@
+import { SvelteComponent } from "svelte";
 import '../../../css/main.css';
 import './HeaderMenu.css';
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
+declare const __propDef: {
+    props: {
+        title?: string | undefined;
+        hideOnScroll?: boolean | undefined;
+        initialRemoveShadow?: boolean | undefined;
+        color?: string | undefined;
+        mobileMenu?: boolean | undefined;
+        zIndex?: number | undefined;
+        openDrawer?: boolean | undefined;
     };
-    z_$$bindings?: Bindings;
-}
-declare const HeaderMenu: $$__sveltets_2_IsomorphicComponent<{
-    title?: string;
-    hideOnScroll?: boolean;
-    initialRemoveShadow?: boolean;
-    color?: string | undefined;
-    mobileMenu?: boolean;
-    zIndex?: number;
-    openDrawer?: boolean;
-}, {
-    'item-click': CustomEvent<{
-        item: import("./Navigator.svelte").Item;
-    }>;
-    'drawer-change': CustomEvent<{
-        opened: boolean;
-    }>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    drawer: {};
-    prepend: {
-        toggleDrawer: () => void;
-        openDrawer: boolean;
+    events: {
+        'item-click': CustomEvent<{
+            item: import("./Navigator.svelte").Item;
+        }>;
+        'drawer-change': CustomEvent<{
+            opened: boolean;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        drawer: {};
+        prepend: {
+            toggleDrawer: () => void;
+            openDrawer: boolean;
+        };
+        title: {};
+        append: {};
     };
-    title: {};
-    append: {};
-}, {}, string>;
-type HeaderMenu = InstanceType<typeof HeaderMenu>;
-export default HeaderMenu;
+};
+export type HeaderMenuProps = typeof __propDef.props;
+export type HeaderMenuEvents = typeof __propDef.events;
+export type HeaderMenuSlots = typeof __propDef.slots;
+export default class HeaderMenu extends SvelteComponent<HeaderMenuProps, HeaderMenuEvents, HeaderMenuSlots> {
+}
+export {};

package/dist/components/simple/navigation/Navigator.svelte

@@ -1,34 +1,12 @@
-<script context="module" lang="ts">
-  export type Item = {
-    title?: string;
-    icon?: string;
-    name: string;
-    url?: string;
-    detail?: object;
-  };
-</script>
-
-<script lang="ts">
-  import { createEventDispatcher } from "svelte";
-  import Icon from "../media/Icon.svelte"
-  
-  export let items: Item[] = [],
-    color: string | undefined = undefined,
-    vertical = false,
-    variant: 'standard' | 'underlined' = 'underlined',
-    textColor: string | undefined = '',
-    hoverTextColor: string | undefined = undefined,
-    space = "20px";
+<script context="module"></script>
 
-  const dispatch = createEventDispatcher<{
-    "item-click": {
-      item: Item;
-    };
-  }>();
-
-  function handleItemClick(item: Item) {
-    dispatch("item-click", { item });
-  }
+<script>import { createEventDispatcher } from "svelte";
+import Icon from "../media/Icon.svelte";
+export let items = [], color = void 0, vertical = false, variant = "underlined", textColor = "", hoverTextColor = void 0, space = "20px";
+const dispatch = createEventDispatcher();
+function handleItemClick(item) {
+  dispatch("item-click", { item });
+}
 </script>
 
 <div 

package/dist/components/simple/navigation/Navigator.svelte.d.ts

@@ -1,3 +1,4 @@
+import { SvelteComponent } from "svelte";
 export type Item = {
     title?: string;
     icon?: string;
@@ -5,33 +6,28 @@ export type Item = {
     url?: string;
     detail?: object;
 };
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
+declare const __propDef: {
+    props: {
+        items?: Item[] | undefined;
+        color?: string | undefined;
+        vertical?: boolean | undefined;
+        variant?: "standard" | "underlined" | undefined;
+        textColor?: string | undefined;
+        hoverTextColor?: string | undefined;
+        space?: string | undefined;
     };
-    z_$$bindings?: Bindings;
+    events: {
+        "item-click": CustomEvent<{
+            item: Item;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export type NavigatorProps = typeof __propDef.props;
+export type NavigatorEvents = typeof __propDef.events;
+export type NavigatorSlots = typeof __propDef.slots;
+export default class Navigator extends SvelteComponent<NavigatorProps, NavigatorEvents, NavigatorSlots> {
 }
-declare const Navigator: $$__sveltets_2_IsomorphicComponent<{
-    items?: Item[];
-    color?: string | undefined;
-    vertical?: boolean;
-    variant?: "standard" | "underlined";
-    textColor?: string | undefined;
-    hoverTextColor?: string | undefined;
-    space?: string;
-}, {
-    "item-click": CustomEvent<{
-        item: Item;
-    }>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type Navigator = InstanceType<typeof Navigator>;
-export default Navigator;
+export {};

package/dist/components/simple/navigation/TabSwitcher.svelte

@@ -1,90 +1,54 @@
-<script lang="ts" context="module">
-  export type Tab = {
-    name: string;
-    label: string;
-    icon?: string;
-  };
-</script>
-
-<script lang="ts">
-  import { afterUpdate, onMount } from "svelte";
-  import './TabSwitcher.css'
-  import { BROWSER } from 'esm-env';
-
-  let clazz: {
-    container?: string,
-    tabs?: string,
-    selected?: string,
-    bookmark?: string,
-    guide?: string
-  } = {};
-	export { clazz as class };
-
-  export let tabs: Tab[] = [],
-    selected: string | undefined = undefined,
-    mandatory = true
-
-  let tabButtons: Record<string, HTMLElement> = {};
-  onMount(() => {
-    if (mandatory && !selected && tabs.length > 0) selected = tabs[0].name;
-
-    if (selected) {
-      setBookmarkPosition();
-    }
-  });
-
-  afterUpdate(() => {
-    setBookmarkPosition();
-  });
-
-  import { createEventDispatcher } from "svelte";
-  import Icon from "../media/Icon.svelte";
-  const dispatch = createEventDispatcher<{
-    "tab-click": {
-      nativeEvent: MouseEvent;
-      tab: Tab;
-    };
-    "tab-keypress": {
-      nativeEvent: KeyboardEvent;
-      tab: Tab;
-    };
-  }>();
-
-  let bookmarkWidth = 0,
-    bookmarkLeft = 0;
-
-  function handleTabClick(clickedTab: Tab, nativeEvent: MouseEvent) {
-    selected = clickedTab.name;
-    setBookmarkPosition();
-    dispatch("tab-click", {
-      nativeEvent: nativeEvent,
-      tab: clickedTab,
-    });
-  }
-
-  function handleTabKeypress(clickedTab: Tab, nativeEvent: KeyboardEvent) {
-    selected = clickedTab.name;
+<script context="module"></script>
+
+<script>import { afterUpdate, onMount } from "svelte";
+import "./TabSwitcher.css";
+import { BROWSER } from "esm-env";
+let clazz = {};
+export { clazz as class };
+export let tabs = [], selected = void 0, mandatory = true;
+let tabButtons = {};
+onMount(() => {
+  if (mandatory && !selected && tabs.length > 0)
+    selected = tabs[0].name;
+  if (selected) {
     setBookmarkPosition();
-    dispatch("tab-keypress", {
-      nativeEvent: nativeEvent,
-      tab: clickedTab,
-    });
   }
-
-  function setBookmarkPosition() {
-    if(BROWSER) {
-      let tabButton: HTMLElement | undefined = selected
-        ? tabButtons[selected]
-        : undefined;
-  
-      if (tabButton) {
-        bookmarkWidth = tabButton.offsetWidth - 10;
-        bookmarkLeft = tabButton.offsetLeft + 5;
-      }
+});
+afterUpdate(() => {
+  setBookmarkPosition();
+});
+import { createEventDispatcher } from "svelte";
+import Icon from "../media/Icon.svelte";
+const dispatch = createEventDispatcher();
+let bookmarkWidth = 0, bookmarkLeft = 0;
+function handleTabClick(clickedTab, nativeEvent) {
+  selected = clickedTab.name;
+  setBookmarkPosition();
+  dispatch("tab-click", {
+    nativeEvent,
+    tab: clickedTab
+  });
+}
+function handleTabKeypress(clickedTab, nativeEvent) {
+  selected = clickedTab.name;
+  setBookmarkPosition();
+  dispatch("tab-keypress", {
+    nativeEvent,
+    tab: clickedTab
+  });
+}
+function setBookmarkPosition() {
+  if (BROWSER) {
+    let tabButton = selected ? tabButtons[selected] : void 0;
+    if (tabButton) {
+      bookmarkWidth = tabButton.offsetWidth - 10;
+      bookmarkLeft = tabButton.offsetLeft + 5;
     }
   }
-
-  $: if(!!selected) setBookmarkPosition()
+}
+$:
+  if (!!selected)
+    setBookmarkPosition();
 </script>
 
 <div