@likable-hair/svelte 3.3.20 → 3.3.21

package/dist/components/simple/dates/YearSelector.svelte.d.ts

@@ -1,40 +1,36 @@
+import { SvelteComponent } from "svelte";
 import '../../../css/main.css';
 import './YearSelector.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: {
+        class?: string | undefined;
+        selectedYear?: number | undefined;
+        selectableYears?: number[] | undefined;
+        disabled?: boolean | undefined;
     };
-    z_$$bindings?: Bindings;
-}
-declare const YearSelector: $$__sveltets_2_IsomorphicComponent<{
-    class?: string | undefined;
-    selectedYear?: number | undefined;
-    selectableYears?: number[];
-    disabled?: boolean;
-}, {
-    click: CustomEvent<{
-        year: number;
-    }>;
-    change: CustomEvent<{
-        year: number | undefined;
-    }>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    selector: {
-        year: number;
-        handleYearClick: (year: number) => void;
+    events: {
+        click: CustomEvent<{
+            year: number;
+        }>;
+        change: CustomEvent<{
+            year: number | undefined;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
     };
-    label: {
-        year: number;
+    slots: {
+        selector: {
+            year: number;
+            handleYearClick: (year: number) => void;
+        };
+        label: {
+            year: number;
+        };
     };
-}, {}, string>;
-type YearSelector = InstanceType<typeof YearSelector>;
-export default YearSelector;
+};
+export type YearSelectorProps = typeof __propDef.props;
+export type YearSelectorEvents = typeof __propDef.events;
+export type YearSelectorSlots = typeof __propDef.slots;
+export default class YearSelector extends SvelteComponent<YearSelectorProps, YearSelectorEvents, YearSelectorSlots> {
+}
+export {};

package/dist/components/simple/dialogs/Dialog.svelte

@@ -1,100 +1,70 @@
-<script lang="ts">
-  import Teleporter from '../../../utils/teleporter';
-  import { BROWSER } from 'esm-env';
-  import { beforeUpdate, onMount } from "svelte";
-  import Keyboarder, { type CallbackFunction } from '../../../utils/keyboarder';
-
-  export let open = false,
-    transition: 'fly-down' | 'fly-up' | 'fly-horizontal' | 'scale' | 'fade' = 'fly-up'
-
-  export let _overlayOpacity: string = "30%",
-    _overlayColor: string = "#282828",
-    _overlayBackdropFilter: string | undefined = undefined,
-    _transitionTimingFunction: string = 'cubic-bezier(0.075, 0.82, 0.165, 1)',
-    _transitionDuration: string = '0.5s'
-
-
-  let zIndex = 50,
-    localOpen: boolean = open,
-    dialogElement: HTMLElement,
-    teleportedUid: string | undefined = undefined,
-    hasBeenOpened: boolean = false;
-
-  onMount(() => {
-    if(!teleportedUid) {
-      let tp = new Teleporter()
-      teleportedUid = tp.attachNode(dialogElement)
+<script>import Teleporter from "../../../utils/teleporter";
+import { BROWSER } from "esm-env";
+import { beforeUpdate, onMount } from "svelte";
+import Keyboarder, {} from "../../../utils/keyboarder";
+export let open = false, transition = "fly-up";
+export let _overlayOpacity = "30%", _overlayColor = "#282828", _overlayBackdropFilter = void 0, _transitionTimingFunction = "cubic-bezier(0.075, 0.82, 0.165, 1)", _transitionDuration = "0.5s";
+let zIndex = 50, localOpen = open, dialogElement, teleportedUid = void 0, hasBeenOpened = false;
+onMount(() => {
+  if (!teleportedUid) {
+    let tp = new Teleporter();
+    teleportedUid = tp.attachNode(dialogElement);
+  }
+  let keyboarderHandler = (params) => {
+    if (params.key == "Escape" && localOpen)
+      closeDialog();
+  };
+  Keyboarder.on(keyboarderHandler);
+  return () => {
+    if (!!teleportedUid) {
+      let tp = new Teleporter();
+      tp.destroyNode(teleportedUid);
     }
-
-    let keyboarderHandler: CallbackFunction = (params) => {
-      if(params.key == 'Escape' && localOpen) closeDialog()
-    }
-    Keyboarder.on(keyboarderHandler)
-
-    return () => {
-      if(!!teleportedUid) {
-        let tp = new Teleporter()
-        tp.destroyNode(teleportedUid)
+    Keyboarder.off(keyboarderHandler);
+  };
+});
+beforeUpdate(() => {
+  if (BROWSER) {
+    if (open && localOpen != open) {
+      hasBeenOpened = true;
+      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;
       }
-
-      Keyboarder.off(keyboarderHandler)
-    }
-  })
-
-  beforeUpdate(() => {
-    if (BROWSER) {
-      if (open && localOpen != open) {
-        hasBeenOpened = true
-
-        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;
-        }
-
-        document.body.style.overflow = "hidden";
-      } else if (!open) {
-        let otherDialogs: NodeListOf<HTMLElement> =
-          document.querySelectorAll("[data-dialog=true]");
-        if (otherDialogs.length <= 1) {
-          document.body.style.overflow = "auto";
-        }
+      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;
+      }
+      document.body.style.overflow = "hidden";
+    } else if (!open) {
+      let otherDialogs = document.querySelectorAll("[data-dialog=true]");
+      if (otherDialogs.length <= 1) {
+        document.body.style.overflow = "auto";
       }
     }
-
-    localOpen = open;
-  });
-
-  function closeDialog() {
-    open = false;
-    localOpen = false;
-  }
-
-  function handleOverlayClick() {
-    closeDialog();
   }
+  localOpen = open;
+});
+function closeDialog() {
+  open = false;
+  localOpen = false;
+}
+function handleOverlayClick() {
+  closeDialog();
+}
 </script>
 
 <div

package/dist/components/simple/dialogs/Dialog.svelte.d.ts

@@ -1,44 +1,30 @@
-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;
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: {
+        open?: boolean | undefined;
+        transition?: "fly-down" | "fly-up" | "fly-horizontal" | "scale" | "fade" | undefined;
+        _overlayOpacity?: string | undefined;
+        _overlayColor?: string | undefined;
+        _overlayBackdropFilter?: string | undefined;
+        _transitionTimingFunction?: string | undefined;
+        _transitionDuration?: string | undefined;
     };
-    z_$$bindings?: Bindings;
+    events: {
+        click: MouseEvent;
+        keypress: KeyboardEvent;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        'top-right': {};
+        'center-left': {};
+        default: {};
+        'center-right': {};
+    };
+};
+export type DialogProps = typeof __propDef.props;
+export type DialogEvents = typeof __propDef.events;
+export type DialogSlots = typeof __propDef.slots;
+export default class Dialog extends SvelteComponent<DialogProps, DialogEvents, DialogSlots> {
 }
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const Dialog: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    open?: boolean;
-    transition?: "fly-down" | "fly-up" | "fly-horizontal" | "scale" | "fade";
-    _overlayOpacity?: string;
-    _overlayColor?: string;
-    _overlayBackdropFilter?: string | undefined;
-    _transitionTimingFunction?: string;
-    _transitionDuration?: string;
-}, {
-    'top-right': {};
-    'center-left': {};
-    default: {};
-    'center-right': {};
-}>, {
-    click: MouseEvent;
-    keypress: KeyboardEvent;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    'top-right': {};
-    'center-left': {};
-    default: {};
-    'center-right': {};
-}, {}, string>;
-type Dialog = InstanceType<typeof Dialog>;
-export default Dialog;
+export {};

package/dist/components/simple/forms/Autocomplete.svelte

@@ -1,224 +1,165 @@
-<script context="module" lang="ts">
-  export type Item = {
-    value: string | number;
-    label?: string | number;
-    /* eslint-disable  @typescript-eslint/no-explicit-any */
-    data?: any;
-  };
-</script>
-
-<script lang="ts">
-  import '../../../css/main.css'
-  import './Autocomplete.css'
-  import { scrollInMenu } from '../common/scroller';
-
-  let clazz: {
-    activator?: string,
-    menu?: string,
-    simpleTextfield?: ComponentProps<SimpleTextField>['class']
-  } = {};
-	export { clazz as class };
-
-  export let values: Item[] = [],
-    items: Item[],
-    searchFunction: ((item: Item, searchText: string | undefined) => boolean) | undefined =
-      undefined,
-    multiple = false,
-    disabled = false,
-    mandatory = false,
-    placeholder = "",
-    width = "auto",
-    height = "auto",
-    maxWidth: string | undefined = undefined,
-    minWidth: string | undefined = "200px",
-    openingId: string = "autocomplete-menu",
-    searchText: string | undefined = undefined,
-    maxVisibleChips: number | undefined = undefined,
-    menuOpened: boolean = false,
-    closeOnSelect: boolean = !multiple,
-    emptySearchTextOnMenuClose: boolean = true,
-    // menu
-    menuBoxShadow = "rgb(var(--global-color-background-300), .5) 0px 2px 4px",
-    menuBorderRadius = "5px",
-    mobileDrawer: boolean = false,
-    menuWidth: string | undefined | null = undefined,
-    menuAnchor: "bottom" | "bottom-center" | "right-center" | undefined = 'bottom-center'
-
-  let dispatch = createEventDispatcher<{
-    change: {
-      unselect: Item | undefined;
-      select: Item | undefined;
-      selection: Item[];
-    }
-  }>();
-
-  function select(item: Item) {
-    if(disabled) return
-
-    const alreadyPresent =
-      values.findIndex((i) => i.value === item.value) != -1;
-
-    if (!alreadyPresent) {
-      if (multiple) values = [...values, item];
-      else values = [item];
-      refreshMenuWidth();
-
-      dispatch("change", {
-        unselect: undefined,
-        select: item,
-        selection: values,
-      });
-    }
-
-    if (!multiple && closeOnSelect) menuOpened = false
-  }
-
-  function unselect(item: Item) {
-    if(disabled) return
-
-    if(values.length == 1 && mandatory) return
-    values = values.filter((i) => i.value != item.value);
+<script context="module"></script>
+
+<script>import "../../../css/main.css";
+import "./Autocomplete.css";
+import { scrollInMenu } from "../common/scroller";
+let clazz = {};
+export { clazz as class };
+export let values = [], items, searchFunction = void 0, multiple = false, disabled = false, mandatory = false, placeholder = "", width = "auto", height = "auto", maxWidth = void 0, minWidth = "200px", openingId = "autocomplete-menu", searchText = void 0, maxVisibleChips = void 0, menuOpened = false, closeOnSelect = !multiple, emptySearchTextOnMenuClose = true, menuBoxShadow = "rgb(var(--global-color-background-300), .5) 0px 2px 4px", menuBorderRadius = "5px", mobileDrawer = false, menuWidth = void 0, menuAnchor = "bottom-center";
+let dispatch = createEventDispatcher();
+function select(item) {
+  if (disabled)
+    return;
+  const alreadyPresent = values.findIndex((i) => i.value === item.value) != -1;
+  if (!alreadyPresent) {
+    if (multiple)
+      values = [...values, item];
+    else
+      values = [item];
     refreshMenuWidth();
-
-    dispatch("change", {
-      unselect: item,
-      select: undefined,
-      selection: values,
-    });
-  }
-
-  function pop() {
-    if(values.length == 1 && mandatory) return
-    let poppedElement = values.pop()
-    values = [...values]
-    refreshMenuWidth()
-
     dispatch("change", {
-      unselect: poppedElement,
-      select: undefined,
-      selection: values,
+      unselect: void 0,
+      select: item,
+      selection: values
     });
   }
-
-  function toggle(item: Item) {
-    const alreadyPresent =
-      values.findIndex((i) => i.value === item.value) != -1;
-
-    if (alreadyPresent) unselect(item);
-    else select(item);
-  }
-
-  let localMenuWidth: string | undefined | null = undefined,
-    menuHeight = "auto",
-    refreshPosition = false;
-
-  function openMenu() {
-    refreshMenuWidth();
-    menuOpened = true;
-  }
-
-  function refreshMenuWidth() {
+  if (!multiple && closeOnSelect)
+    menuOpened = false;
+}
+function unselect(item) {
+  if (disabled)
+    return;
+  if (values.length == 1 && mandatory)
+    return;
+  values = values.filter((i) => i.value != item.value);
+  refreshMenuWidth();
+  dispatch("change", {
+    unselect: item,
+    select: void 0,
+    selection: values
+  });
+}
+function pop() {
+  if (values.length == 1 && mandatory)
+    return;
+  let poppedElement = values.pop();
+  values = [...values];
+  refreshMenuWidth();
+  dispatch("change", {
+    unselect: poppedElement,
+    select: void 0,
+    selection: values
+  });
+}
+function toggle(item) {
+  const alreadyPresent = values.findIndex((i) => i.value === item.value) != -1;
+  if (alreadyPresent)
+    unselect(item);
+  else
+    select(item);
+}
+let localMenuWidth = void 0, menuHeight = "auto", refreshPosition = false;
+function openMenu() {
+  refreshMenuWidth();
+  menuOpened = true;
+}
+function refreshMenuWidth() {
+  setTimeout(() => {
+    if (menuWidth !== void 0)
+      localMenuWidth = menuWidth;
+    else
+      localMenuWidth = activator.offsetWidth + "px";
     setTimeout(() => {
-      if(menuWidth !== undefined) localMenuWidth = menuWidth
-      else localMenuWidth = activator.offsetWidth + "px"
-
-      setTimeout(() => {
-        refreshPosition = true;
-      }, 1);
+      refreshPosition = true;
     }, 1);
+  }, 1);
+}
+let activator, focusedIndex = void 0;
+function handleTextFieldFocus() {
+  if (disabled)
+    return;
+  focusedIndex = void 0;
+  openMenu();
+}
+function handleTextFieldBlur() {
+}
+let menuElement;
+function handleKeyDown(event) {
+  if (disabled)
+    return;
+  if (event.key == "ArrowDown" && (focusedIndex === void 0 || focusedIndex < filteredItems.length - 1)) {
+    if (focusedIndex === void 0)
+      focusedIndex = 0;
+    else
+      focusedIndex += 1;
+  } else if (event.key == "ArrowUp" && (focusedIndex === void 0 || focusedIndex > 0)) {
+    if (focusedIndex === void 0)
+      focusedIndex = filteredItems.length - 1;
+    else
+      focusedIndex -= 1;
+  } else if (event.key == "Enter" && focusedIndex != void 0) {
+    toggle(filteredItems[focusedIndex]);
+  } else if (event.key == "Backspace" && searchText == "") {
+    pop();
+  } else if (event.key == "Escape" || event.key == "Tab") {
+    searchText = "";
+    if (!!input)
+      input.blur();
+    menuOpened = false;
   }
-
-  let activator: HTMLElement,
-    focusedIndex: number | undefined = undefined;
-  function handleTextFieldFocus() {
-    if(disabled) return
-    focusedIndex = undefined;
-    openMenu();
-  }
-
-  function handleTextFieldBlur() {
-    // closeMenu()
-  }
-
-  let menuElement: HTMLElement;
-  function handleKeyDown(event: { key: string }) {
-    if(disabled) return
-
-    if (
-      event.key == "ArrowDown" &&
-      (focusedIndex === undefined || focusedIndex < filteredItems.length - 1)
-    ) {
-      if (focusedIndex === undefined) focusedIndex = 0;
-      else focusedIndex += 1;
-    } else if (
-      event.key == "ArrowUp" &&
-      (focusedIndex === undefined || focusedIndex > 0)
-    ) {
-      if (focusedIndex === undefined) focusedIndex = filteredItems.length - 1;
-      else focusedIndex -= 1;
-    } else if (event.key == "Enter" && focusedIndex != undefined) {
-      toggle(filteredItems[focusedIndex]);
-    } else if(event.key == 'Backspace' && searchText == '') {
-      pop()
-    } else if(event.key == 'Escape' || event.key == 'Tab') {
-      searchText = ''
-      if(!!input) input.blur()
-      menuOpened = false
-    }
-
-    if(focusedIndex !== undefined && !!menuElement) {
-      let child = menuElement.querySelector<HTMLElement>('.item-' + focusedIndex)
-
-      if(!!child) scrollInMenu(menuElement, child, 'instant')
-    }
+  if (focusedIndex !== void 0 && !!menuElement) {
+    let child = menuElement.querySelector(".item-" + focusedIndex);
+    if (!!child)
+      scrollInMenu(menuElement, child, "instant");
   }
-
-  let input: HTMLElement;
-  function handleContainerClick() {
-    if(disabled) return
-    
-    if (!menuOpened) {
-      if(!!input) input.focus();
-
-      // had to timeout because it was catching click outside
-      setTimeout(() => {
-        openMenu();
-      }, 50);
-    }
+}
+let input;
+function handleContainerClick() {
+  if (disabled)
+    return;
+  if (!menuOpened) {
+    if (!!input)
+      input.focus();
+    setTimeout(() => {
+      openMenu();
+    }, 50);
   }
-
-  let filteredItems: Item[] = items;
-  $: if (searchText) {
-    focusedIndex = undefined;
+}
+let filteredItems = items;
+$:
+  if (searchText) {
+    focusedIndex = void 0;
     filteredItems = items.filter((it) => {
-      if (searchFunction) return searchFunction(it, searchText);
-      else return !!searchText && it.label?.toString().toLowerCase().includes((searchText).toLowerCase());
+      if (searchFunction)
+        return searchFunction(it, searchText);
+      else
+        return !!searchText && it.label?.toString().toLowerCase().includes(searchText.toLowerCase());
     });
   } else {
     filteredItems = items;
   }
-
-  $: notVisibleChipNumber = Math.max((values?.length || 0) - (maxVisibleChips || 0), 0)
-
-  $: if(!menuOpened && emptySearchTextOnMenuClose) {
+$:
+  notVisibleChipNumber = Math.max((values?.length || 0) - (maxVisibleChips || 0), 0);
+$:
+  if (!menuOpened && emptySearchTextOnMenuClose) {
     setTimeout(() => {
-      if(!menuOpened && emptySearchTextOnMenuClose) searchText = undefined
+      if (!menuOpened && emptySearchTextOnMenuClose)
+        searchText = void 0;
     }, 10);
   }
-
-  $: if(!!input) {
-    if(!disabled && values.length != 0) {
-      input.style.width = Math.max(searchText?.length || placeholder?.length, 1) + 'ch'
+$:
+  if (!!input) {
+    if (!disabled && values.length != 0) {
+      input.style.width = Math.max(searchText?.length || placeholder?.length, 1) + "ch";
     } else {
-      input.style.width = 'auto'
+      input.style.width = "auto";
     }
   }
-
-  import Chip from "../navigation/Chip.svelte";
-  import Menu from "../common/Menu.svelte";
-  import { createEventDispatcher, type ComponentProps } from "svelte";
-  import SimpleTextField from "./SimpleTextField.svelte";
-  import MenuOrDrawer from '../../composed/common/MenuOrDrawer.svelte';
+import Chip from "../navigation/Chip.svelte";
+import Menu from "../common/Menu.svelte";
+import { createEventDispatcher } from "svelte";
+import SimpleTextField from "./SimpleTextField.svelte";
+import MenuOrDrawer from "../../composed/common/MenuOrDrawer.svelte";
 </script>
 
 <svelte:window />