@likable-hair/svelte 3.3.20 → 3.3.21

package/dist/components/composed/search/DynamicFilters.svelte

@@ -1,109 +1,88 @@
-<script lang="ts">
-	import { FilterEditor, Icon } from "../../..";
-	import type { DateMode, Filter, NumberMode, SelectMode, StringMode } from "../../../utils/filters/filters";
-	import { createEventDispatcher } from "svelte"
-
-
-	export let filters: Filter[] = [],
-		lang: "it" | "en" = "en",
-		mAndDown: boolean = false,
-		updateMultiFilterValues: (filterName: string, newValue: any, newValid: boolean, mode?: NumberMode | StringMode | SelectMode | DateMode) => void;		
-
-	let selectedFilter: Filter | undefined;
-	let tmpFilters: { [filterName: string]: Filter } = filters.reduce((acc, f) => {
-    if (f.active) {
-        acc[f.name] = f; 
-    }
-    return acc;
-	}, {} as { [filterName: string]: Filter });
-
-  const dispatch = createEventDispatcher<{
-		'change': { filter: Filter }
-  }>()
-
-	type LabelMapper = {
-		[label: string]: { extended?: string; short: string };
-	};
-	
-	let labelsMapper: LabelMapper = lang == 'en' ? {
-		equal: { extended: "equal to", short: "equal" },
-		like: { short: "includes" },
-		ilike: { short: "includes" },
-		contains: { short: "contains" },
-		greater: { short: "greater", extended: "greater than" },
-		lower: { short: "lower", extended: "lower than" },
-		between: { short: "between", extended: "is between" },
-		different: { short: "different", extended: "different from" },
-	} : {
-		equal: { extended: "uguale a", short: "uguale" },
-		like: { short: "include" },
-		ilike: { short: "include" },
-		contains: { short: "contiene" },
-		greater: { short: "maggiore", extended: "maggiore di" },
-		lower: { short: "minore", extended: "minore di" },
-		between: { short: "compreso", extended: "è compreso tra" },
-		different: { short: "diverso", extended: "diverso da" },
-	};
-
-	function selectFilter(filter: Filter) {
-		selectedFilter = filter === selectedFilter ? undefined : filter;
-	}
-	
-	function handleKeyPress(event: any, filter: Filter) {
-		if (event.key === "Enter" || event.key === " ") {
-			selectFilter(filter);
-		}
-	}
-
-	function handleFilterChange() {
-		if(!!selectedFilter){
-			dispatch('change', { filter: tmpFilters[selectedFilter.name] })
-			filters = filters.map(f => {
-				if (f.name === selectedFilter?.name) {
-					return tmpFilters[selectedFilter.name]
-				}
-				return f
-			})
-		}
-	}
-
-	function isActiveFilter(filter: Filter) {
-    let newValue: any = {},
-      newValid: boolean = false
-    if(filter.type == 'select') {
-      newValue = filter.values 
-      if(!!newValue && newValue.length > 0) {
-        newValid = true
-      }
-    } else if('mode' in filter && filter.mode == 'between') {
-      newValue.to = filter.to
-      newValue.from = filter.from
-      if(!!newValue.from || !!newValue.to) {
-        newValid = true
-      }
-    } else if (filter.type == 'custom') {
-      newValue = filter.value
-			if ((Array.isArray(newValue) && newValue.length > 0) || (!Array.isArray(newValue) && !!newValue)) {
-				newValid = true;
-			}
-		} else {
-      newValue = filter.value
-      if(!!newValue) {
-        newValid = true
+<script>import { FilterEditor, Icon } from "../../..";
+import { createEventDispatcher } from "svelte";
+export let filters = [], lang = "en", mAndDown = false, updateMultiFilterValues;
+let selectedFilter;
+let tmpFilters = filters.reduce((acc, f) => {
+  if (f.active) {
+    acc[f.name] = f;
+  }
+  return acc;
+}, {});
+const dispatch = createEventDispatcher();
+let labelsMapper = lang == "en" ? {
+  equal: { extended: "equal to", short: "equal" },
+  like: { short: "includes" },
+  ilike: { short: "includes" },
+  contains: { short: "contains" },
+  greater: { short: "greater", extended: "greater than" },
+  lower: { short: "lower", extended: "lower than" },
+  between: { short: "between", extended: "is between" },
+  different: { short: "different", extended: "different from" }
+} : {
+  equal: { extended: "uguale a", short: "uguale" },
+  like: { short: "include" },
+  ilike: { short: "include" },
+  contains: { short: "contiene" },
+  greater: { short: "maggiore", extended: "maggiore di" },
+  lower: { short: "minore", extended: "minore di" },
+  between: { short: "compreso", extended: "\xE8 compreso tra" },
+  different: { short: "diverso", extended: "diverso da" }
+};
+function selectFilter(filter) {
+  selectedFilter = filter === selectedFilter ? void 0 : filter;
+}
+function handleKeyPress(event, filter) {
+  if (event.key === "Enter" || event.key === " ") {
+    selectFilter(filter);
+  }
+}
+function handleFilterChange() {
+  if (!!selectedFilter) {
+    dispatch("change", { filter: tmpFilters[selectedFilter.name] });
+    filters = filters.map((f) => {
+      if (f.name === selectedFilter?.name) {
+        return tmpFilters[selectedFilter.name];
       }
-    }
-
-		return newValid
+      return f;
+    });
   }
-
-	function updateCustomFilterValues(filterName: string, newValue: any, newValid: boolean, mode?: NumberMode | StringMode | SelectMode | DateMode) {
-    let filter = filters.find(f => f.name === filterName)
-    if(!filter) throw new Error('cannot find filter with name ' + filterName)
-    if(filter.type != 'custom') throw new Error('filter is not custom')
-    filter.value = newValue
-    filter.active = newValid
-		updateMultiFilterValues(filterName, newValue, newValid, mode)
+}
+function isActiveFilter(filter) {
+  let newValue = {}, newValid = false;
+  if (filter.type == "select") {
+    newValue = filter.values;
+    if (!!newValue && newValue.length > 0) {
+      newValid = true;
+    }
+  } else if ("mode" in filter && filter.mode == "between") {
+    newValue.to = filter.to;
+    newValue.from = filter.from;
+    if (!!newValue.from || !!newValue.to) {
+      newValid = true;
+    }
+  } else if (filter.type == "custom") {
+    newValue = filter.value;
+    if (Array.isArray(newValue) && newValue.length > 0 || !Array.isArray(newValue) && !!newValue) {
+      newValid = true;
+    }
+  } else {
+    newValue = filter.value;
+    if (!!newValue) {
+      newValid = true;
+    }
   }
+  return newValid;
+}
+function updateCustomFilterValues(filterName, newValue, newValid, mode) {
+  let filter = filters.find((f) => f.name === filterName);
+  if (!filter)
+    throw new Error("cannot find filter with name " + filterName);
+  if (filter.type != "custom")
+    throw new Error("filter is not custom");
+  filter.value = newValue;
+  filter.active = newValid;
+  updateMultiFilterValues(filterName, newValue, newValid, mode);
+}
 </script>
 
 <div class="custom-filters-container" class:yscroll={mAndDown}>

package/dist/components/composed/search/DynamicFilters.svelte.d.ts

@@ -1,34 +1,30 @@
+import { SvelteComponent } from "svelte";
 import type { DateMode, Filter, NumberMode, SelectMode, StringMode } from "../../../utils/filters/filters";
-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: {
+        filters?: Filter[] | undefined;
+        lang?: "it" | "en" | undefined;
+        mAndDown?: boolean | undefined;
+        updateMultiFilterValues: (filterName: string, newValue: any, newValid: boolean, mode?: NumberMode | StringMode | SelectMode | DateMode) => void;
     };
-    z_$$bindings?: Bindings;
-}
-declare const DynamicFilters: $$__sveltets_2_IsomorphicComponent<{
-    filters?: Filter[];
-    lang?: "it" | "en";
-    mAndDown?: boolean;
-    updateMultiFilterValues: (filterName: string, newValue: any, newValid: boolean, mode?: NumberMode | StringMode | SelectMode | DateMode) => void;
-}, {
-    change: CustomEvent<{
-        filter: Filter;
-    }>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    custom: {
-        filter: Filter | undefined;
-        mAndDown: boolean;
-        updateCustomFilterValues: (filterName: string, newValue: any, newValid: boolean, mode?: NumberMode | StringMode | SelectMode | DateMode) => void;
+    events: {
+        change: CustomEvent<{
+            filter: Filter;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        custom: {
+            filter: Filter | undefined;
+            mAndDown: boolean;
+            updateCustomFilterValues: (filterName: string, newValue: any, newValid: boolean, mode?: NumberMode | StringMode | SelectMode | DateMode) => void;
+        };
     };
-}, {}, string>;
-type DynamicFilters = InstanceType<typeof DynamicFilters>;
-export default DynamicFilters;
+};
+export type DynamicFiltersProps = typeof __propDef.props;
+export type DynamicFiltersEvents = typeof __propDef.events;
+export type DynamicFiltersSlots = typeof __propDef.slots;
+export default class DynamicFilters extends SvelteComponent<DynamicFiltersProps, DynamicFiltersEvents, DynamicFiltersSlots> {
+}
+export {};

package/dist/components/composed/search/FilterEditor.svelte

@@ -1,124 +1,95 @@
-<script lang="ts">
-  import type { Filter, NumberMode, SelectMode, StringMode } from "../../../utils/filters/filters";
-  import Dropdown, { type Item } from "../forms/Dropdown.svelte";
-  import { GENERIC_MODES, SELECT_MODES, STRING_MODES } from '../../../utils/filters/filters';
-  import type { DateMode } from "../../../utils/filters/filters";
-  import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
-  import DatePickerTextField from "../forms/DatePickerTextField.svelte";
-  import Validator from "../../../utils/filters/validator";
-  import Autocomplete from "../../simple/forms/Autocomplete.svelte";
-  import Checkbox from "../../simple/forms/Checkbox.svelte";
-  import type { LabelMapper } from "./Filters.svelte";
-  import Icon from "../../simple/media/Icon.svelte";
-  import ToggleList from "../forms/ToggleList.svelte";
-  import { createEventDispatcher } from "svelte";
-
-  export let filter: Filter | undefined = undefined,
-    lang: 'en' | 'it' = 'en',
-    betweenFromLabel: string = lang == 'en' ? "From" : "Da",
-    betweenToLabel: string = lang == 'en' ? "To" : "A",
-    labelsMapper: LabelMapper,
-    forceApplyValid: boolean = false,
-    editFilterMode: 'one-edit' | 'multi-edit' = 'one-edit',
-    tmpFilter: Filter | undefined = undefined,
-    mobile: boolean = false;
-
-  let advancedModeOptions: Item[],
-    advancedModeSelectedOptions: Item[] | undefined
-
-  function initTmpFilter() {
-    tmpFilter = filter === undefined ? undefined : {...filter}
-    if(!!tmpFilter && ['string', 'number', 'date', 'select'].includes(tmpFilter.type) && Object.keys(tmpFilter).includes('mode')) {
-      //@ts-ignore
-      if((tmpFilter.mode == 'between' && tmpFilter.from !== undefined && tmpFilter.to !== undefined) || tmpFilter.value !== undefined || (tmpFilter.type == 'select' && tmpFilter.values !== undefined && tmpFilter.values.length > 0)) {
-        advancedModeSelectedOptions = [{
-          //@ts-ignore
-          value: tmpFilter.mode, label: labelsMapper[tmpFilter.mode].short || tmpFilter.mode
-        }]
-      }
+<script>import Dropdown, {} from "../forms/Dropdown.svelte";
+import { GENERIC_MODES, SELECT_MODES, STRING_MODES } from "../../../utils/filters/filters";
+import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
+import DatePickerTextField from "../forms/DatePickerTextField.svelte";
+import Validator from "../../../utils/filters/validator";
+import Autocomplete from "../../simple/forms/Autocomplete.svelte";
+import Checkbox from "../../simple/forms/Checkbox.svelte";
+import Icon from "../../simple/media/Icon.svelte";
+import ToggleList from "../forms/ToggleList.svelte";
+import { createEventDispatcher } from "svelte";
+export let filter = void 0, lang = "en", betweenFromLabel = lang == "en" ? "From" : "Da", betweenToLabel = lang == "en" ? "To" : "A", labelsMapper, forceApplyValid = false, editFilterMode = "one-edit", tmpFilter = void 0, mobile = false;
+let advancedModeOptions, advancedModeSelectedOptions;
+function initTmpFilter() {
+  tmpFilter = filter === void 0 ? void 0 : { ...filter };
+  if (!!tmpFilter && ["string", "number", "date", "select"].includes(tmpFilter.type) && Object.keys(tmpFilter).includes("mode")) {
+    if (tmpFilter.mode == "between" && tmpFilter.from !== void 0 && tmpFilter.to !== void 0 || tmpFilter.value !== void 0 || tmpFilter.type == "select" && tmpFilter.values !== void 0 && tmpFilter.values.length > 0) {
+      advancedModeSelectedOptions = [{
+        //@ts-ignore
+        value: tmpFilter.mode,
+        label: labelsMapper[tmpFilter.mode].short || tmpFilter.mode
+      }];
     }
   }
-
-
-  function closeDropDown() {
-    dropdownOpened = false
+}
+function closeDropDown() {
+  dropdownOpened = false;
+}
+$:
+  if (!!filter) {
+    initTmpFilter();
+    closeDropDown();
   }
-
-  $: if(!!filter) {
-    initTmpFilter()
-    closeDropDown()
-  }
-
-  $: if(!!tmpFilter) {
-    let modes
-    if(tmpFilter.type == 'string') {
-      modes = STRING_MODES
-    } else if(tmpFilter.type == 'date') {
-      modes = GENERIC_MODES
-    } else if(tmpFilter.type == 'number') {
-      modes = GENERIC_MODES
-    } else if(tmpFilter.type == 'select') {
-      modes = SELECT_MODES
-    } else if(tmpFilter.type == 'bool') {
-      modes = undefined
+$:
+  if (!!tmpFilter) {
+    let modes;
+    if (tmpFilter.type == "string") {
+      modes = STRING_MODES;
+    } else if (tmpFilter.type == "date") {
+      modes = GENERIC_MODES;
+    } else if (tmpFilter.type == "number") {
+      modes = GENERIC_MODES;
+    } else if (tmpFilter.type == "select") {
+      modes = SELECT_MODES;
+    } else if (tmpFilter.type == "bool") {
+      modes = void 0;
     }
-
-    if(!!modes) {
-      advancedModeOptions = modes.map(mode => {
+    if (!!modes) {
+      advancedModeOptions = modes.map((mode) => {
         return {
           value: mode,
           label: labelsMapper[mode].short || mode
-        }
-      })
+        };
+      });
     }
   }
-
-  $: if(!tmpFilter?.advanced) {
-    advancedModeSelectedOptions = undefined
+$:
+  if (!tmpFilter?.advanced) {
+    advancedModeSelectedOptions = void 0;
   }
-
-  let dropdownOpened: boolean = false,
-    calendarOpened: boolean = false,
-    calendarOpened2: boolean = false
-
-  // TODO I don't like that there is a singlo dropdow to handle all filter advance mode.
-  // In some case would be necessary to handle more than one selection and this code
-  // could become non sense
-  function handleAdvancedModeSelection() {
-    if(!!advancedModeSelectedOptions && advancedModeSelectedOptions.length > 0 && !!tmpFilter) {
-      if(tmpFilter.type == 'date') tmpFilter.mode = advancedModeSelectedOptions[0].value as DateMode
-      else if(tmpFilter.type == 'number') tmpFilter.mode = advancedModeSelectedOptions[0].value as NumberMode
-      else if(tmpFilter.type == 'string') tmpFilter.mode = advancedModeSelectedOptions[0].value as StringMode
-      else if(tmpFilter.type == 'select') tmpFilter.mode = advancedModeSelectedOptions[0].value as SelectMode
-    }
-
-    dropdownOpened = false;
-    handleChangeValue()
+let dropdownOpened = false, calendarOpened = false, calendarOpened2 = false;
+function handleAdvancedModeSelection() {
+  if (!!advancedModeSelectedOptions && advancedModeSelectedOptions.length > 0 && !!tmpFilter) {
+    if (tmpFilter.type == "date")
+      tmpFilter.mode = advancedModeSelectedOptions[0].value;
+    else if (tmpFilter.type == "number")
+      tmpFilter.mode = advancedModeSelectedOptions[0].value;
+    else if (tmpFilter.type == "string")
+      tmpFilter.mode = advancedModeSelectedOptions[0].value;
+    else if (tmpFilter.type == "select")
+      tmpFilter.mode = advancedModeSelectedOptions[0].value;
   }
-
-  $: applyFilterDisabled = !Validator.isValid(tmpFilter) && !forceApplyValid
-
-  $: if(!!tmpFilter && tmpFilter.type == 'bool') {
-    if(tmpFilter.value === undefined) {
-      tmpFilter.value = false
+  dropdownOpened = false;
+  handleChangeValue();
+}
+$:
+  applyFilterDisabled = !Validator.isValid(tmpFilter) && !forceApplyValid;
+$:
+  if (!!tmpFilter && tmpFilter.type == "bool") {
+    if (tmpFilter.value === void 0) {
+      tmpFilter.value = false;
     }
   }
-
-  $: if(!!tmpFilter && tmpFilter.type == 'select') {
-    if(tmpFilter.values === undefined) {
-      tmpFilter.values = []
+$:
+  if (!!tmpFilter && tmpFilter.type == "select") {
+    if (tmpFilter.values === void 0) {
+      tmpFilter.values = [];
     }
   }
-
-  const dispatch = createEventDispatcher<{
-		change: Filter | undefined
-	}>()
-  
-  function handleChangeValue() {       
-   dispatch('change', tmpFilter)  
-  }
-
-
+const dispatch = createEventDispatcher();
+function handleChangeValue() {
+  dispatch("change", tmpFilter);
+}
 </script>
 
 

package/dist/components/composed/search/FilterEditor.svelte.d.ts

@@ -1,42 +1,38 @@
+import { SvelteComponent } from "svelte";
 import type { Filter } from "../../../utils/filters/filters";
 import type { LabelMapper } from "./Filters.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: {
+        filter?: Filter | undefined;
+        lang?: "it" | "en" | undefined;
+        betweenFromLabel?: string | undefined;
+        betweenToLabel?: string | undefined;
+        labelsMapper: LabelMapper;
+        forceApplyValid?: boolean | undefined;
+        editFilterMode?: "one-edit" | "multi-edit" | undefined;
+        tmpFilter?: Filter | undefined;
+        mobile?: boolean | undefined;
     };
-    z_$$bindings?: Bindings;
-}
-declare const FilterEditor: $$__sveltets_2_IsomorphicComponent<{
-    filter?: Filter | undefined;
-    lang?: "en" | "it";
-    betweenFromLabel?: string;
-    betweenToLabel?: string;
-    labelsMapper: LabelMapper;
-    forceApplyValid?: boolean;
-    editFilterMode?: "one-edit" | "multi-edit";
-    tmpFilter?: Filter | undefined;
-    mobile?: boolean;
-}, {
-    click: MouseEvent;
-    keypress: KeyboardEvent;
-    change: CustomEvent<Filter | undefined>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {
-    custom: {
-        filter: Filter | undefined;
+    events: {
+        click: MouseEvent;
+        keypress: KeyboardEvent;
+        change: CustomEvent<Filter | undefined>;
+    } & {
+        [evt: string]: CustomEvent<any>;
     };
-    'filter-actions': {
-        applyFilterDisabled: boolean;
-        filter: Filter | undefined;
+    slots: {
+        custom: {
+            filter: Filter | undefined;
+        };
+        'filter-actions': {
+            applyFilterDisabled: boolean;
+            filter: Filter | undefined;
+        };
     };
-}, {}, string>;
-type FilterEditor = InstanceType<typeof FilterEditor>;
-export default FilterEditor;
+};
+export type FilterEditorProps = typeof __propDef.props;
+export type FilterEditorEvents = typeof __propDef.events;
+export type FilterEditorSlots = typeof __propDef.slots;
+export default class FilterEditor extends SvelteComponent<FilterEditorProps, FilterEditorEvents, FilterEditorSlots> {
+}
+export {};