@likable-hair/svelte 3.3.21 → 3.3.23

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

@@ -1,45 +1,49 @@
-import { SvelteComponent } from "svelte";
 import '../../../css/main.css';
 import './DatePicker.css';
 import type { Locale } from "./utils";
-declare const __propDef: {
-    props: {
-        class?: {
-            container?: string | undefined;
-            header?: string | undefined;
-            selectorRow?: string | undefined;
-        } | undefined;
-        selectedYear?: number | undefined;
-        selectedMonth?: number | undefined;
-        selectedDate?: Date | null | undefined;
-        visibleMonth?: number | undefined;
-        visibleYear?: number | undefined;
-        view?: "day" | "year" | "month" | undefined;
-        locale?: Locale | undefined;
-        selectableYears?: number[] | undefined;
-        skipTabs?: boolean | undefined;
-        disabled?: boolean | undefined;
+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;
     };
-    events: {
-        'day-click': CustomEvent<{
-            dateStat: import("./utils").DateStat;
-            selected: boolean;
-            extraMonth: boolean;
-        }>;
-        'year-click': CustomEvent<{
-            year: number;
-        }>;
-        'month-click': CustomEvent<{
-            month: number;
-        }>;
-    } & {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type DatePickerProps = typeof __propDef.props;
-export type DatePickerEvents = typeof __propDef.events;
-export type DatePickerSlots = typeof __propDef.slots;
-export default class DatePicker extends SvelteComponent<DatePickerProps, DatePickerEvents, DatePickerSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const DatePicker: $$__sveltets_2_IsomorphicComponent<{
+    class?: {
+        container?: string;
+        header?: string;
+        selectorRow?: string;
+    };
+    selectedYear?: number;
+    selectedMonth?: number;
+    selectedDate?: Date | null | undefined;
+    visibleMonth?: number;
+    visibleYear?: number;
+    view?: "year" | "month" | "day";
+    locale?: Locale;
+    selectableYears?: number[];
+    skipTabs?: boolean;
+    disabled?: boolean;
+}, {
+    'day-click': CustomEvent<{
+        dateStat: import("./utils").DateStat;
+        selected: boolean;
+        extraMonth: boolean;
+    }>;
+    'year-click': CustomEvent<{
+        year: number;
+    }>;
+    'month-click': CustomEvent<{
+        month: number;
+    }>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type DatePicker = InstanceType<typeof DatePicker>;
+export default DatePicker;

package/dist/components/simple/dates/MonthSelector.svelte

@@ -1,18 +1,40 @@
-<script>import "../../../css/main.css";
-import "./MonthSelector.css";
-import { getMonthName } from "./utils";
-let clazz = {};
-export { clazz as class };
-export let selectedMonth = void 0, locale = "it";
-import { createEventDispatcher } from "svelte";
-const dispatch = createEventDispatcher();
-function handleMonthClick(monthIndex) {
-  selectedMonth = monthIndex;
-  dispatch("click", {
-    monthIndex
-  });
-}
-import Button from "../buttons/Button.svelte";
+<script lang="ts">
+  import '../../../css/main.css'
+  import './MonthSelector.css'
+  import type { Locale } from "./utils";
+  import { getMonthName } from "./utils";
+
+  /*
+    Styles
+
+    --month-selector-height
+    --month-selector-width
+  */
+
+  let clazz: {
+    buttons?: string,
+    container?: string,
+  } = {};
+	export { clazz as class };
+
+  export let selectedMonth: number | undefined = undefined,
+    locale: Locale = "it"
+
+  import { createEventDispatcher } from "svelte";
+  const dispatch = createEventDispatcher<{
+    click: {
+      monthIndex: number;
+    };
+  }>();
+
+  function handleMonthClick(monthIndex: number) {
+    selectedMonth = monthIndex;
+
+    dispatch("click", {
+      monthIndex,
+    });
+  }
+  import Button from "../buttons/Button.svelte";
 </script>
 
 <div class="selector-container {clazz.container || ''}">

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

@@ -1,37 +1,41 @@
-import { SvelteComponent } from "svelte";
 import '../../../css/main.css';
 import './MonthSelector.css';
 import type { Locale } from "./utils";
-declare const __propDef: {
-    props: {
-        class?: {
-            buttons?: string | undefined;
-            container?: string | undefined;
-        } | undefined;
-        selectedMonth?: number | undefined;
-        locale?: Locale | undefined;
+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;
     };
-    events: {
-        click: CustomEvent<{
-            monthIndex: number;
-        }>;
-    } & {
-        [evt: string]: CustomEvent<any>;
+    z_$$bindings?: Bindings;
+}
+declare const MonthSelector: $$__sveltets_2_IsomorphicComponent<{
+    class?: {
+        buttons?: string;
+        container?: string;
     };
-    slots: {
-        selector: {
-            month: number;
-            monthName: string;
-        };
-        label: {
-            month: number;
-            monthName: string;
-        };
+    selectedMonth?: number | undefined;
+    locale?: Locale;
+}, {
+    click: CustomEvent<{
+        monthIndex: number;
+    }>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {
+    selector: {
+        month: number;
+        monthName: string;
     };
-};
-export type MonthSelectorProps = typeof __propDef.props;
-export type MonthSelectorEvents = typeof __propDef.events;
-export type MonthSelectorSlots = typeof __propDef.slots;
-export default class MonthSelector extends SvelteComponent<MonthSelectorProps, MonthSelectorEvents, MonthSelectorSlots> {
-}
-export {};
+    label: {
+        month: number;
+        monthName: string;
+    };
+}, {}, string>;
+type MonthSelector = InstanceType<typeof MonthSelector>;
+export default MonthSelector;

package/dist/components/simple/dates/TimePicker.svelte

@@ -1,36 +1,50 @@
-<script>import "../../../css/main.css";
-import "./TimePicker.css";
-import { DateTime } from "luxon";
-import { createEventDispatcher } from "svelte";
-import Icon from "../media/Icon.svelte";
-let clazz = {};
-export { clazz as class };
-export let selectedTime = void 0, locale = "it-IT";
-let hours = "00";
-let dispatch = createEventDispatcher();
-let buildUpHours = hours;
-function handleHoursInput(e) {
-  setTimeout(() => {
-    let inserted = e.key;
-    if (inserted == "Backspace") {
-      if (Number(buildUpHours) < 10) {
-        buildUpHours = "00";
-      } else {
-        buildUpHours = "0" + (buildUpHours.at(0) || "0");
+<script lang="ts">
+  import '../../../css/main.css'
+  import './TimePicker.css'
+  import { DateTime } from 'luxon';
+  import { createEventDispatcher } from 'svelte';
+  import Icon from '../media/Icon.svelte';
+
+  let clazz: {
+    container?: string,
+    header?: string,
+    selectorRow?: string
+  } = {};
+	export { clazz as class };
+
+  export let selectedTime: Date | null | undefined = undefined,
+    locale: "it-IT" | "en-EN" = 'it-IT'
+
+  let hours: string = '00'
+
+  let dispatch = createEventDispatcher<{}>()
+
+  let buildUpHours: string = hours
+  function handleHoursInput(e: KeyboardEvent) {
+    setTimeout(() => {
+      let inserted = e.key
+  
+      if(inserted == 'Backspace') {
+        if(Number(buildUpHours) < 10) {
+          buildUpHours = '00'
+        } else {
+          buildUpHours = '0' + (buildUpHours.at(0) || '0')
+        }
       }
-    }
-    if (["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"].includes(inserted)) {
-      if (Number(buildUpHours) < 10) {
-        buildUpHours = `${Number(buildUpHours)}${inserted}`;
-      } else {
-        buildUpHours = `${buildUpHours.at(1)}${inserted}`;
+  
+      if(['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'].includes(inserted)) {
+        if(Number(buildUpHours) < 10) {
+          buildUpHours = `${Number(buildUpHours)}${inserted}`
+        } else {
+          buildUpHours = `${buildUpHours.at(1)}${inserted}`
+        }
       }
-    }
-    hours = buildUpHours;
-  }, 10);
-}
-$:
-  hours = buildUpHours;
+
+      hours = buildUpHours
+    }, 10);
+  }
+
+  $: hours = buildUpHours
 </script>
 
 <div

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

@@ -1,24 +1,28 @@
-import { SvelteComponent } from "svelte";
 import '../../../css/main.css';
 import './TimePicker.css';
-declare const __propDef: {
-    props: {
-        class?: {
-            container?: string | undefined;
-            header?: string | undefined;
-            selectorRow?: string | undefined;
-        } | undefined;
-        selectedTime?: Date | null | undefined;
-        locale?: "it-IT" | "en-EN" | undefined;
+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;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type TimePickerProps = typeof __propDef.props;
-export type TimePickerEvents = typeof __propDef.events;
-export type TimePickerSlots = typeof __propDef.slots;
-export default class TimePicker extends SvelteComponent<TimePickerProps, TimePickerEvents, TimePickerSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const TimePicker: $$__sveltets_2_IsomorphicComponent<{
+    class?: {
+        container?: string;
+        header?: string;
+        selectorRow?: string;
+    };
+    selectedTime?: Date | null | undefined;
+    locale?: "it-IT" | "en-EN";
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type TimePicker = InstanceType<typeof TimePicker>;
+export default TimePicker;

package/dist/components/simple/dates/TimePickerTextField.svelte

@@ -1,39 +1,60 @@
-<script>import Textfield from "../forms/Textfield.svelte";
-import VerticalTextSwitch from "../forms/VerticalTextSwitch.svelte";
-export let hourFormat = "24", dayPeriod = "am", time = void 0, text = "", fieldSeparator = ":", placeholder = "Insert time...", focusedBoxShadow = "#C0D6FF 0px 2px 10px", borderColor = "", borderWeight = "1px", fontSize = "16px", width = "100%";
-let minutes = void 0, hours = void 0, switchValue = false;
-function checkHour(hour) {
-  if (hourFormat == "12")
-    return hour > 0 && hour <= 12;
-  else
-    return hour >= 0 && hour < 24;
-}
-function checkMinute(minute) {
-  return minute >= 0 && minute < 60;
-}
-$:
-  dayPeriod = switchValue ? "pm" : "am";
-$: {
-  let fields = text.split(fieldSeparator);
-  hours = +fields[0];
-  minutes = +fields[1];
-  if (fields[1]?.length != 2) {
-    time = void 0;
-  } else {
-    if (!isNaN(hours) && !isNaN(minutes) && checkHour(hours) && checkMinute(minutes) && fields.length == 2) {
-      if (hourFormat == "12") {
-        if (dayPeriod == "am" && hours == 12)
-          hours = 0;
-        else if (dayPeriod == "pm" && hours != 12)
-          hours += 12;
-      }
-      time = /* @__PURE__ */ new Date();
-      time.setHours(hours, minutes, 0);
-    } else
-      time = void 0;
+<script lang="ts">
+  import Textfield from "../forms/Textfield.svelte";
+  import VerticalTextSwitch from "../forms/VerticalTextSwitch.svelte";
+
+  export let hourFormat: "12" | "24" = "24",
+    dayPeriod: "am" | "pm" = "am",
+    time: Date | undefined = undefined,
+    text = "",
+    fieldSeparator = ":",
+    placeholder = "Insert time...",
+    focusedBoxShadow = "#C0D6FF 0px 2px 10px",
+    borderColor = "",
+    borderWeight = "1px",
+    fontSize = "16px",
+    width = "100%";
+
+  let minutes: number | undefined = undefined,
+    hours: number | undefined = undefined,
+    switchValue = false;
+
+  function checkHour(hour: number): boolean {
+    if (hourFormat == "12") return hour > 0 && hour <= 12;
+    else return hour >= 0 && hour < 24;
+  }
+
+  function checkMinute(minute: number): boolean {
+    return minute >= 0 && minute < 60;
   }
-}
-let fontSizeNumeric = parseInt(fontSize, 10);
+
+  $: dayPeriod = switchValue ? "pm" : "am";
+  $: {
+    let fields = text.split(fieldSeparator);
+    hours = +fields[0];
+    minutes = +fields[1];
+
+    if (fields[1]?.length != 2) {
+      time = undefined;
+    } else {
+      if (
+        !isNaN(hours) &&
+        !isNaN(minutes) &&
+        checkHour(hours) &&
+        checkMinute(minutes) &&
+        fields.length == 2
+      ) {
+        if (hourFormat == "12") {
+          if (dayPeriod == "am" && hours == 12) hours = 0;
+          else if (dayPeriod == "pm" && hours != 12) hours += 12;
+        }
+
+        time = new Date();
+        time.setHours(hours, minutes, 0);
+      } else time = undefined;
+    }
+  }
+
+  let fontSizeNumeric: number = parseInt(fontSize, 10);
 </script>
 
 <div class="container" style:width>

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

@@ -1,26 +1,30 @@
-import { SvelteComponent } from "svelte";
-declare const __propDef: {
-    props: {
-        hourFormat?: "12" | "24" | undefined;
-        dayPeriod?: "pm" | "am" | undefined;
-        time?: Date | undefined;
-        text?: string | undefined;
-        fieldSeparator?: string | undefined;
-        placeholder?: string | undefined;
-        focusedBoxShadow?: string | undefined;
-        borderColor?: string | undefined;
-        borderWeight?: string | undefined;
-        fontSize?: string | undefined;
-        width?: string | undefined;
+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;
     };
-    events: {
-        [evt: string]: CustomEvent<any>;
-    };
-    slots: {};
-};
-export type TimePickerTextFieldProps = typeof __propDef.props;
-export type TimePickerTextFieldEvents = typeof __propDef.events;
-export type TimePickerTextFieldSlots = typeof __propDef.slots;
-export default class TimePickerTextField extends SvelteComponent<TimePickerTextFieldProps, TimePickerTextFieldEvents, TimePickerTextFieldSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const TimePickerTextField: $$__sveltets_2_IsomorphicComponent<{
+    hourFormat?: "12" | "24";
+    dayPeriod?: "am" | "pm";
+    time?: Date | undefined;
+    text?: string;
+    fieldSeparator?: string;
+    placeholder?: string;
+    focusedBoxShadow?: string;
+    borderColor?: string;
+    borderWeight?: string;
+    fontSize?: string;
+    width?: string;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type TimePickerTextField = InstanceType<typeof TimePickerTextField>;
+export default TimePickerTextField;

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

@@ -1,33 +1,58 @@
-<script>import "../../../css/main.css";
-import "./YearSelector.css";
-import { scrollAtCenter } from "../common/scroller";
-import { createEventDispatcher, onMount } from "svelte";
-let clazz = void 0;
-export { clazz as class };
-export let selectedYear = void 0, selectableYears = [...Array(150).keys()].map(
-  (i) => i + ((/* @__PURE__ */ new Date()).getFullYear() - 75)
-), disabled = false;
-let container, targetButtons = {};
-onMount(() => {
-  if (selectedYear)
-    scrollAtCenter(container, targetButtons[selectedYear], "auto");
-});
-const dispatch = createEventDispatcher();
-function handleYearClick(year) {
-  if (selectedYear === year) {
-    selectedYear = void 0;
-  } else {
-    selectedYear = year;
-    scrollAtCenter(container, targetButtons[selectedYear], "smooth");
-  }
-  dispatch("click", {
-    year
-  });
-  dispatch("change", {
-    year: selectedYear
+<script lang="ts">
+  import '../../../css/main.css'
+  import './YearSelector.css'
+  import { scrollAtCenter } from "../common/scroller";
+  import { createEventDispatcher, onMount } from "svelte";
+
+  /*
+    Styles
+
+    --year-selector-height
+    --year-selector-width
+  */
+
+  let clazz: string | undefined = undefined;
+	export { clazz as class };
+
+  export let selectedYear: number | undefined = undefined,
+    selectableYears: number[] = [...Array(150).keys()].map(
+      (i) => i + (new Date().getFullYear() - 75)
+    ),
+    disabled: boolean = false
+
+  let container: HTMLElement,
+    targetButtons: { [k: string]: HTMLElement } = {};
+
+  onMount(() => {
+    if (selectedYear)
+      scrollAtCenter(container, targetButtons[selectedYear], "auto");
   });
-}
-import Button from "../buttons/Button.svelte";
+
+  const dispatch = createEventDispatcher<{
+    click: {
+      year: number;
+    };
+    change: {
+      year: number | undefined
+    }
+  }>();
+
+  function handleYearClick(year: number) {
+    if(selectedYear === year) {
+      selectedYear = undefined
+    } else {
+      selectedYear = year;
+      scrollAtCenter(container, targetButtons[selectedYear], "smooth");
+    }
+
+    dispatch("click", {
+      year,
+    })
+    dispatch("change", {
+      year: selectedYear
+    })
+  }
+  import Button from "../buttons/Button.svelte";
 </script>
 
 <div bind:this={container} class="selector-container {clazz || ''}">