@likable-hair/svelte 3.3.30 → 3.3.32

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

@@ -1,70 +1,100 @@
-<script>import "../../../css/main.css";
-import "./DatePicker.css";
-import { getMonthName, dateToString } from "./utils";
-import YearSelector from "./YearSelector.svelte";
-import MonthSelector from "./MonthSelector.svelte";
-import Calendar from "./Calendar.svelte";
-import Button from "../buttons/Button.svelte";
-import { createEventDispatcher } from "svelte";
-let clazz = {};
-export { clazz as class };
-export let selectedYear = (/* @__PURE__ */ new Date()).getFullYear(), selectedMonth = (/* @__PURE__ */ new Date()).getMonth(), selectedDate = void 0, visibleMonth = selectedMonth, visibleYear = selectedYear, view = "day", locale = "it", selectableYears = [...Array(150).keys()].map(
-  (i) => i + ((/* @__PURE__ */ new Date()).getFullYear() - 75)
-), skipTabs = false, disabled = false;
-let dispatch = createEventDispatcher();
-let selectorText = void 0;
-let elementDisabled = "date";
-$:
-  visibleSelector = view == "day" || view == "month";
-$: {
-  selectorText = view == "day" ? getMonthName(visibleMonth, locale) + " " + visibleYear : visibleYear.toString();
-}
-$:
-  elementDisabled = view == "year" ? "year" : "date";
-function next() {
-  if (view == "day") {
-    if (visibleMonth == 11) {
-      visibleMonth = 0;
-      visibleYear += 1;
+<script lang="ts">
+  import '../../../css/main.css'
+  import './DatePicker.css'
+  import { getMonthName, dateToString } from "./utils";
+  import type { Locale } from "./utils";
+  import YearSelector from "./YearSelector.svelte";
+  import MonthSelector from "./MonthSelector.svelte";
+  import Calendar from "./Calendar.svelte";
+  import Button from "../buttons/Button.svelte";
+  import { createEventDispatcher } from 'svelte';
+
+  let clazz: {
+    container?: string,
+    header?: string,
+    selectorRow?: string
+  } = {};
+	export { clazz as class };
+
+  export let selectedYear: number = new Date().getFullYear(),
+    selectedMonth: number = new Date().getMonth(),
+    selectedDate: Date | null | undefined = undefined,
+    visibleMonth: number = selectedMonth,
+    visibleYear: number = selectedYear,
+    view: "year" | "month" | "day" = "day",
+    locale: Locale = "it",
+    selectableYears: number[] = [...Array(150).keys()].map(
+      (i) => i + (new Date().getFullYear() - 75)
+    ),
+    skipTabs: boolean = false,
+    disabled: boolean = false
+
+  let dispatch = createEventDispatcher<{
+    'year-click': {
+      year: number
+    },
+    'month-click': {
+      month: number
+    }
+  }>()
+
+  let selectorText: string | undefined = undefined;
+  let elementDisabled: "year" | "date" = "date";
+
+  $: visibleSelector = view == "day" || view == "month";
+  $: {
+    selectorText =
+      view == "day"
+        ? getMonthName(visibleMonth, locale) + " " + visibleYear
+        : visibleYear.toString();
+  }
+  $: elementDisabled = view == "year" ? "year" : "date";
+
+  function next() {
+    if (view == "day") {
+      if (visibleMonth == 11) {
+        visibleMonth = 0;
+        visibleYear += 1;
+      } else {
+        visibleMonth += 1;
+      }
     } else {
-      visibleMonth += 1;
+      if (visibleYear != selectableYears[selectableYears.length - 1])
+        visibleYear++;
     }
-  } else {
-    if (visibleYear != selectableYears[selectableYears.length - 1])
-      visibleYear++;
   }
-}
-function previous() {
-  if (view == "day") {
-    if (visibleMonth == 0) {
-      visibleMonth = 11;
-      visibleYear -= 1;
+
+  function previous() {
+    if (view == "day") {
+      if (visibleMonth == 0) {
+        visibleMonth = 11;
+        visibleYear -= 1;
+      } else {
+        visibleMonth -= 1;
+      }
     } else {
-      visibleMonth -= 1;
+      if (visibleYear != selectableYears[0]) visibleYear--;
     }
-  } else {
-    if (visibleYear != selectableYears[0])
-      visibleYear--;
   }
-}
-function SelectorHandler() {
-  if (view == "month")
-    view = "year";
-  else
+
+  function SelectorHandler() {
+    if (view == "month") view = "year";
+    else view = "month";
+  }
+
+  function handleYearChange() {
+    dispatch('year-click', {
+      year: selectedYear
+    })
     view = "month";
-}
-function handleYearChange() {
-  dispatch("year-click", {
-    year: selectedYear
-  });
-  view = "month";
-}
-function handleMonthChange() {
-  dispatch("month-click", {
-    month: selectedMonth
-  });
-  view = "day";
-}
+  }
+
+  function handleMonthChange() {
+    dispatch('month-click', {
+      month: selectedMonth
+    })
+    view = "day";
+  }
 </script>
 
 <div

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>