@likable-hair/svelte 3.3.20 → 3.3.21

package/dist/components/composed/forms/YearPickerTextField.svelte

@@ -1,124 +1,84 @@
-<script lang="ts">
-  import IMask, { InputMask } from 'imask';
-  import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
-  import Menu from "../../simple/common/Menu.svelte";
-  import Icon from "../../simple/media/Icon.svelte";
-  import { onMount, type ComponentProps } from 'svelte';
-  import { DateTime } from 'luxon'
-  import { createEventDispatcher } from 'svelte';
-  import MediaQuery from '../../simple/common/MediaQuery.svelte';
-  import Dialog from '../../simple/dialogs/Dialog.svelte';
-    import YearSelector from '../../simple/dates/YearSelector.svelte';
-
-  let clazz: {
-    activator?: string,
-    textfield?: ComponentProps<SimpleTextField>['class']
-  } = {};
-	export { clazz as class };
-
-  let dispatch = createEventDispatcher<{
-    'year-click': {
-      year: number
-    },
-    input: {
-      year: number | undefined
-    }
-  }>()
-
-  export let menuOpened: boolean = false,
-    openingId: string = 'year-picker-text-field',
-    selectedYear: number | undefined = undefined,
-    placeholder: string | undefined = undefined,
-    mobileDialog: boolean = true,
-    maxYearInRange: number = 2100,
-    minYearInRange: number = 1900,
-    disabled: boolean = false
-
-  let activator: HTMLElement,
-    refreshPosition = false,
-    menuElement: HTMLElement,
-    inputElement: HTMLElement,
-    pattern: string = "yyyy",
-    mask: InputMask<typeof maskFactoryArgs> | { value: string | undefined } = {
-      value: undefined
-    },
-    maskFactoryArgs = {
-      mask: Date,
-      pattern: pattern,
-      format: function (date: any): string {
-        return DateTime.fromJSDate(date).toFormat(pattern)
-      },
-      parse: function (str: string): Date {
-        return DateTime.fromFormat(str, pattern).toJSDate()
-      },
-      blocks: {
-        yyyy: {
-          mask: IMask.MaskedRange,
-          from: minYearInRange,
-          to: maxYearInRange
-        }
-      }
-    }
-
-  function handleTextFieldFocus(mobile: boolean) {
-    if(!mobile || !mobileDialog) {
-      menuOpened = true
+<script>import IMask, { InputMask } from "imask";
+import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
+import Menu from "../../simple/common/Menu.svelte";
+import Icon from "../../simple/media/Icon.svelte";
+import { onMount } from "svelte";
+import { DateTime } from "luxon";
+import { createEventDispatcher } from "svelte";
+import MediaQuery from "../../simple/common/MediaQuery.svelte";
+import Dialog from "../../simple/dialogs/Dialog.svelte";
+import YearSelector from "../../simple/dates/YearSelector.svelte";
+let clazz = {};
+export { clazz as class };
+let dispatch = createEventDispatcher();
+export let menuOpened = false, openingId = "year-picker-text-field", selectedYear = void 0, placeholder = void 0, mobileDialog = true, maxYearInRange = 2100, minYearInRange = 1900, disabled = false;
+let activator, refreshPosition = false, menuElement, inputElement, pattern = "yyyy", mask = {
+  value: void 0
+}, maskFactoryArgs = {
+  mask: Date,
+  pattern,
+  format: function(date) {
+    return DateTime.fromJSDate(date).toFormat(pattern);
+  },
+  parse: function(str) {
+    return DateTime.fromFormat(str, pattern).toJSDate();
+  },
+  blocks: {
+    yyyy: {
+      mask: IMask.MaskedRange,
+      from: minYearInRange,
+      to: maxYearInRange
     }
   }
-
-  onMount(() => {
-    mask = IMask(
-      inputElement, maskFactoryArgs
-    )
-
-    if(selectedYear !== undefined && selectedYear !== null) {
-      mask.value = selectedYear.toString()
-    }
-  })
-
-  function handleInputChange(event: any) {
-    setTimeout(() => {
-      const typedValue = mask.value
-
-      if(typedValue !== undefined && typedValue !== null) {
-        // find year
-        const yearIndex = pattern.indexOf('yyyy')
-        const year = typedValue.substring(yearIndex, yearIndex + 4)
-        if(year.length == 4) {
-          selectedYear = Number(year)
-        } else if(year.length == 0) {
-          selectedYear = undefined
-        }
-
-        dispatch('input', {
-          year: selectedYear
-        })
-      }
-    }, 30);
+};
+function handleTextFieldFocus(mobile) {
+  if (!mobile || !mobileDialog) {
+    menuOpened = true;
   }
-
-  function handleYearClick(ev: CustomEvent<{
-    year: number
-  }>) {
-    dispatch('year-click', {
-      year: ev.detail.year
-    })
+}
+onMount(() => {
+  mask = IMask(
+    inputElement,
+    maskFactoryArgs
+  );
+  if (selectedYear !== void 0 && selectedYear !== null) {
+    mask.value = selectedYear.toString();
   }
-
-  function handleYearChange(ev: CustomEvent<{
-    year: number | undefined
-  }>) {
-    if(!!selectedYear) {
-      mask.value = selectedYear.toString()
-    } else {
-      mask.value = ''
+});
+function handleInputChange(event) {
+  setTimeout(() => {
+    const typedValue = mask.value;
+    if (typedValue !== void 0 && typedValue !== null) {
+      const yearIndex = pattern.indexOf("yyyy");
+      const year = typedValue.substring(yearIndex, yearIndex + 4);
+      if (year.length == 4) {
+        selectedYear = Number(year);
+      } else if (year.length == 0) {
+        selectedYear = void 0;
+      }
+      dispatch("input", {
+        year: selectedYear
+      });
     }
+  }, 30);
+}
+function handleYearClick(ev) {
+  dispatch("year-click", {
+    year: ev.detail.year
+  });
+}
+function handleYearChange(ev) {
+  if (!!selectedYear) {
+    mask.value = selectedYear.toString();
+  } else {
+    mask.value = "";
   }
-
-  $: if(!!selectedYear) {
+}
+$:
+  if (!!selectedYear) {
     setTimeout(() => {
-      if(!!selectedYear) {
-        mask.value = selectedYear.toString()
+      if (!!selectedYear) {
+        mask.value = selectedYear.toString();
       }
     }, 30);
   }

package/dist/components/composed/forms/YearPickerTextField.svelte.d.ts

@@ -1,59 +1,55 @@
+import { SvelteComponent } from "svelte";
 import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
 import { type ComponentProps } from '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: {
+        class?: {
+            activator?: string | undefined;
+            textfield?: ComponentProps<SimpleTextField>['class'];
+        } | undefined;
+        menuOpened?: boolean | undefined;
+        openingId?: string | undefined;
+        selectedYear?: number | undefined;
+        placeholder?: string | undefined;
+        mobileDialog?: boolean | undefined;
+        maxYearInRange?: number | undefined;
+        minYearInRange?: number | undefined;
+        disabled?: boolean | undefined;
     };
-    z_$$bindings?: Bindings;
-}
-declare const YearPickerTextField: $$__sveltets_2_IsomorphicComponent<{
-    class?: {
-        activator?: string;
-        textfield?: ComponentProps<SimpleTextField>["class"];
+    events: {
+        'year-click': CustomEvent<{
+            year: number;
+        }>;
+        input: CustomEvent<{
+            year: number | undefined;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
     };
-    menuOpened?: boolean;
-    openingId?: string;
-    selectedYear?: number | undefined;
-    placeholder?: string | undefined;
-    mobileDialog?: boolean;
-    maxYearInRange?: number;
-    minYearInRange?: number;
-    disabled?: boolean;
-}, {
-    'year-click': CustomEvent<{
-        year: number;
-    }>;
-    input: CustomEvent<{
-        year: number | undefined;
-    }>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    activator: {
-        mask: {
-            value: string | undefined;
+    slots: {
+        activator: {
+            mask: {
+                value: string | undefined;
+            };
+            handleTextFieldFocus: (mobile: boolean) => void;
+            handleInputChange: (event: any) => void;
+            inputElement: HTMLElement;
+            placeholder: string | undefined;
+            disabled: boolean;
+        };
+        'prepend-inner': {
+            prependInnerIcon: string | undefined;
+            iconSize: string;
+        };
+        'append-inner': {
+            appendIcon: string | undefined;
+            iconSize: string;
         };
-        handleTextFieldFocus: (mobile: boolean) => void;
-        handleInputChange: (event: any) => void;
-        inputElement: HTMLElement;
-        placeholder: string | undefined;
-        disabled: boolean;
-    };
-    'prepend-inner': {
-        prependInnerIcon: string | undefined;
-        iconSize: string;
-    };
-    'append-inner': {
-        appendIcon: string | undefined;
-        iconSize: string;
     };
-}, {}, string>;
-type YearPickerTextField = InstanceType<typeof YearPickerTextField>;
-export default YearPickerTextField;
+};
+export type YearPickerTextFieldProps = typeof __propDef.props;
+export type YearPickerTextFieldEvents = typeof __propDef.events;
+export type YearPickerTextFieldSlots = typeof __propDef.slots;
+export default class YearPickerTextField extends SvelteComponent<YearPickerTextFieldProps, YearPickerTextFieldEvents, YearPickerTextFieldSlots> {
+}
+export {};