@likable-hair/svelte 3.3.21 → 3.3.23

package/dist/components/composed/list/PaginatedTable.svelte

@@ -1,85 +1,148 @@
-<script context="module">import SimpleTable, {} from "../../simple/lists/SimpleTable.svelte";
-import Icon from "../../simple/media/Icon.svelte";
-import Paginator from "../../simple/lists/Paginator.svelte";
-import Dropdown from "../forms/Dropdown.svelte";
-import { createEventDispatcher } from "svelte";
+<script lang="ts" context="module">
+  import SimpleTable, { type CalculateRowClasses, type CalculateRowStyles } from "../../simple/lists/SimpleTable.svelte";
+  import Icon from "../../simple/media/Icon.svelte";
+  import Paginator from "../../simple/lists/Paginator.svelte";
+  import Dropdown from "../forms/Dropdown.svelte";
+  import { createEventDispatcher, type ComponentEvents, type ComponentProps } from "svelte";
+
+  type ArrayElement<ArrayType extends readonly unknown[]> =
+    ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
+
+  export type Header = ArrayElement<
+    NonNullable<ComponentProps<SimpleTable>["headers"]>
+  >;
 </script>
 
-<script>import Filters from "../search/Filters.svelte";
-import SearchBar from "../search/SearchBar.svelte";
-import Converter from "../../../utils/filters/filters";
-let clazz = {};
-export { clazz as class };
-export let headers = [], items = [], sortedBy = void 0, sortDirection = void 0, page = 1, maxPage = void 0, rowsPerPageOptions = [
-  { label: "20", value: 20 },
-  { label: "50", value: 50 },
-  { label: "100", value: 100 }
-], hideRowsPerPage = false, totalElements = void 0, rowsPerPage = 20, filters = [], searchBarColumns = void 0, searchBarVisible = true, searchBarPlaceholder = "Type something to search...", lang = "en", editFilterMode = "one-edit", showActiveFilters = true, resizableColumns = false, resizedColumnSizeWithPadding = {}, pointerOnRowHover = void 0, doubleClickActive = false, doubleClickDelay = 250;
-export let calculateRowStyles = void 0;
-export let calculateRowClasses = void 0;
-let searchBarInput, searchText = void 0, sortModify;
-let dispatch = createEventDispatcher();
-let rowsPerPageSelection = [];
-$:
-  rowsPerPageSelection = [
+<script lang="ts">
+  import Filters from "../search/Filters.svelte";
+  import SearchBar from "../search/SearchBar.svelte";
+  import type Builder from "../../../utils/filters/builder";
+  import Converter from "../../../utils/filters/filters";
+
+  let clazz: {
+    simpleTable?: ComponentProps<SimpleTable>['class']
+  } = {};
+  export { clazz as class };
+
+  export let headers: ComponentProps<SimpleTable>['headers'] = [],
+    items: ComponentProps<SimpleTable>['items'] = [],
+    sortedBy: ComponentProps<SimpleTable>['sortedBy'] = undefined,
+    sortDirection: ComponentProps<SimpleTable>['sortDirection'] = undefined,
+    page: NonNullable<ComponentProps<Paginator>['page']> = 1,
+    maxPage: ComponentProps<Paginator>['maxPage'] = undefined,
+    rowsPerPageOptions: ComponentProps<Dropdown>['items'] = [
+      { label: '20', value: 20 },
+      { label: '50', value: 50 },
+      { label: '100', value: 100 },
+    ],
+    hideRowsPerPage: boolean = false,
+    totalElements: number | undefined = undefined,
+    rowsPerPage: number = 20,
+    filters:  ComponentProps<Filters>['filters'] = [],
+    searchBarColumns: string[] | undefined = undefined,
+    searchBarVisible: boolean = true,
+    searchBarPlaceholder: string = "Type something to search...",
+    lang: 'it' | 'en' = 'en',
+    editFilterMode: 'one-edit' | 'multi-edit' = 'one-edit',
+    showActiveFilters: boolean = true,
+    resizableColumns: boolean = false,
+    resizedColumnSizeWithPadding: { [value: string]: number } = {},
+    pointerOnRowHover: boolean | undefined = undefined,
+    doubleClickActive: ComponentProps<SimpleTable>['doubleClickActive'] = false,
+    doubleClickDelay: ComponentProps<SimpleTable>['doubleClickDelay'] = 250;
+
+
+  export let calculateRowStyles: CalculateRowStyles | undefined = undefined;
+  export let calculateRowClasses: CalculateRowClasses | undefined = undefined;
+
+  let searchBarInput: HTMLElement,
+    searchText: string | undefined = undefined,
+    sortModify: Header['sortModify']
+
+  let dispatch = createEventDispatcher<{
+    paginationChange: {
+      rowsPerPage: number,
+      page: number,
+      builder: Builder
+    },
+    filtersChange: {
+      builder: Builder
+    }
+  }>()
+
+  let rowsPerPageSelection: ComponentProps<Dropdown>['values'] = []
+
+  $: rowsPerPageSelection = [
     { label: rowsPerPage.toString(), value: rowsPerPage }
-  ];
-$:
-  if (totalElements !== void 0)
-    maxPage = Math.max(Math.round(totalElements / rowsPerPage), 1);
-function handleRowsPerPageChange(e) {
-  rowsPerPage = Number(e.detail.selection?.[0].value);
-  handlePaginationChange();
-}
-function handlePaginationChange() {
-  let builder = buildFilters();
-  dispatch("paginationChange", {
-    rowsPerPage,
-    page,
-    builder
-  });
-}
-function handleSearchChange(searchText2) {
-  let builder = buildFilters({ searchText: searchText2 });
-  dispatch("filtersChange", {
-    builder
-  });
-}
-$:
-  handleSearchChange(searchText);
-function handleSort(e) {
-  sortModify = e.detail.sortModify;
-  handleFiltersChange();
-}
-function handleFiltersChange() {
-  let builder = buildFilters({ searchText });
-  dispatch("filtersChange", {
-    builder
-  });
-}
-function buildFilters(params) {
-  let converter = new Converter();
-  let builder;
-  builder = converter.createBuilder({
-    filters: filters || []
-  });
-  if (!!params?.searchText && !!searchBarColumns && searchBarColumns.length > 0) {
-    builder.where((b) => {
-      b.where(searchBarColumns[0], "ilike", "%" + params?.searchText + "%");
-      for (let i = 1; i < searchBarColumns.length; i += 1) {
-        b.orWhere(searchBarColumns[i], "ilike", "%" + params?.searchText + "%");
-      }
-    });
+  ]
+
+  $: if(totalElements !== undefined) maxPage = Math.max(Math.round(totalElements/rowsPerPage), 1)
+
+  function handleRowsPerPageChange(e: CustomEvent<{ selection: ComponentProps<Dropdown>['items']}>) {
+    rowsPerPage = Number(e.detail.selection?.[0].value)
+    handlePaginationChange()
   }
-  if (!!sortedBy) {
-    if (sortModify) {
-      builder = sortModify({ builder, sortDirection: sortDirection || "asc" });
-    } else {
-      builder.orderBy(sortedBy, sortDirection || "asc");
+
+  function handlePaginationChange() {
+    let builder = buildFilters()
+
+    dispatch('paginationChange', {
+      rowsPerPage, page, builder
+    })
+  }
+
+  function handleSearchChange(searchText: string | undefined) {
+    let builder = buildFilters({searchText})
+
+    dispatch('filtersChange', {
+      builder
+    })
+  }
+
+  $: handleSearchChange(searchText)
+
+  function handleSort(e: ComponentEvents<SimpleTable>['sort']) {
+    sortModify = e.detail.sortModify
+    handleFiltersChange()
+  }
+
+  function handleFiltersChange() {
+    let builder = buildFilters({searchText})
+
+    dispatch('filtersChange', {
+      builder
+    })
+  }
+
+  function buildFilters(params?:{searchText?:string | undefined}){
+    let converter = new Converter()
+    let builder: Builder
+    builder = converter.createBuilder({
+      filters: filters || []
+    })
+
+    if(!!params?.searchText && !!searchBarColumns && searchBarColumns.length > 0) {
+
+      builder.where(b => {
+        b.where(searchBarColumns![0], 'ilike', '%' + params?.searchText + '%')
+        for(let i = 1; i < searchBarColumns!.length; i += 1) {
+          b.orWhere(searchBarColumns![i], 'ilike', '%' + params?.searchText + '%')
+        }
+      })
+    }
+
+    if (!!sortedBy) {
+      if(sortModify){
+        builder = sortModify({ builder, sortDirection: sortDirection || 'asc' })
+      }
+      else {
+        builder.orderBy(sortedBy, sortDirection || "asc");
+      }
     }
+
+    return builder
   }
-  return builder;
-}
+
 </script>
 
 <div class="paginated-table">

package/dist/components/composed/list/PaginatedTable.svelte.d.ts

@@ -1,4 +1,3 @@
-import { SvelteComponent } from "svelte";
 import SimpleTable, { type CalculateRowClasses, type CalculateRowStyles } from "../../simple/lists/SimpleTable.svelte";
 import Paginator from "../../simple/lists/Paginator.svelte";
 import Dropdown from "../forms/Dropdown.svelte";
@@ -6,113 +5,114 @@ import { type ComponentProps } from "svelte";
 type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
 export type Header = ArrayElement<NonNullable<ComponentProps<SimpleTable>["headers"]>>;
 import Filters from "../search/Filters.svelte";
-import type Builder from "../../../utils/filters/builder";
-declare const __propDef: {
-    props: {
-        class?: {
-            simpleTable?: ComponentProps<SimpleTable>['class'];
-        } | undefined;
-        headers?: ComponentProps<SimpleTable>['headers'];
-        items?: ComponentProps<SimpleTable>['items'];
-        sortedBy?: ComponentProps<SimpleTable>['sortedBy'];
-        sortDirection?: ComponentProps<SimpleTable>['sortDirection'];
-        page?: number | undefined;
-        maxPage?: ComponentProps<Paginator>['maxPage'];
-        rowsPerPageOptions?: ComponentProps<Dropdown>['items'];
-        hideRowsPerPage?: boolean | undefined;
-        totalElements?: number | undefined;
-        rowsPerPage?: number | undefined;
-        filters?: ComponentProps<Filters>['filters'];
-        searchBarColumns?: string[] | undefined;
-        searchBarVisible?: boolean | undefined;
-        searchBarPlaceholder?: string | undefined;
-        lang?: "it" | "en" | undefined;
-        editFilterMode?: "one-edit" | "multi-edit" | undefined;
-        showActiveFilters?: boolean | undefined;
-        resizableColumns?: boolean | undefined;
-        resizedColumnSizeWithPadding?: {
-            [value: string]: number;
-        } | undefined;
-        pointerOnRowHover?: boolean | undefined;
-        doubleClickActive?: ComponentProps<SimpleTable>['doubleClickActive'];
-        doubleClickDelay?: ComponentProps<SimpleTable>['doubleClickDelay'];
-        calculateRowStyles?: CalculateRowStyles | undefined;
-        calculateRowClasses?: CalculateRowClasses | 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: {
-        removeFilter: CustomEvent<{
-            filter: import("../../../utils/filters/filters").Filter;
-        }>;
-        removeAllFilters: CustomEvent<undefined>;
-        sort: CustomEvent<{
-            sortedBy: string | undefined;
-            sortDirection: string;
-            sortModify: ((params: {
-                builder: Builder;
-                sortDirection: "desc" | "asc";
-            }) => Builder) | undefined;
-        }>;
-        rowClick: CustomEvent<{
-            item: import("../../simple/lists/SimpleTable.svelte").Item;
-        }>;
-        rowDoubleClick: CustomEvent<{
-            item: import("../../simple/lists/SimpleTable.svelte").Item;
-        }>;
-    } & {
-        [evt: string]: CustomEvent<any>;
+    z_$$bindings?: Bindings;
+}
+declare const PaginatedTable: $$__sveltets_2_IsomorphicComponent<{
+    class?: {
+        simpleTable?: ComponentProps<SimpleTable>["class"];
     };
-    slots: {
-        'search-bar': {
-            handleSearchChange: (searchText: string | undefined) => void;
-        };
-        'filter-append': {};
-        'custom-filter-chip': {
-            filter: import("../../../utils/filters/filters").Filter;
-        };
-        'custom-filter': {
-            filter: import("../../../utils/filters/filters").Filter;
-            updateFunction: (filterName: string, newValue: any, newValid: boolean) => void;
-            mAndDown: boolean;
-        };
-        header: {
-            head: import("../../simple/lists/SimpleTable.svelte").Header;
-        };
-        headerLabel: {};
-        custom: {
-            index: any;
-            columnIndex: any;
-            header: import("../../simple/lists/SimpleTable.svelte").Header;
-            item: import("../../simple/lists/SimpleTable.svelte").Item;
-        };
-        rowActions: {
-            index: any;
-            item: import("../../simple/lists/SimpleTable.svelte").Item;
-        };
-        append: {
-            index: any;
-            item: import("../../simple/lists/SimpleTable.svelte").Item;
-        };
-        footer: {
-            hideRowsPerPage: boolean;
-            rowsPerPageOptions: import("../forms/Dropdown.svelte").Item[] | undefined;
-            rowsPerPageSelection: import("../forms/Dropdown.svelte").Item[];
-            totalElements: number | undefined;
-            page: number;
-            maxPage: number | undefined;
-            rowsPerPage: number;
-            handlePaginationChange: () => void;
-        };
-        rangeDescriptor: {
-            page: number;
-            maxPage: number | undefined;
-            rowsPerPage: number;
-            totalElements: number | undefined;
-        };
+    headers?: ComponentProps<SimpleTable>["headers"];
+    items?: ComponentProps<SimpleTable>["items"];
+    sortedBy?: ComponentProps<SimpleTable>["sortedBy"];
+    sortDirection?: ComponentProps<SimpleTable>["sortDirection"];
+    page?: NonNullable<ComponentProps<Paginator>["page"]>;
+    maxPage?: ComponentProps<Paginator>["maxPage"];
+    rowsPerPageOptions?: ComponentProps<Dropdown>["items"];
+    hideRowsPerPage?: boolean;
+    totalElements?: number | undefined;
+    rowsPerPage?: number;
+    filters?: ComponentProps<Filters>["filters"];
+    searchBarColumns?: string[] | undefined;
+    searchBarVisible?: boolean;
+    searchBarPlaceholder?: string;
+    lang?: "it" | "en";
+    editFilterMode?: "one-edit" | "multi-edit";
+    showActiveFilters?: boolean;
+    resizableColumns?: boolean;
+    resizedColumnSizeWithPadding?: {
+        [value: string]: number;
     };
-};
-export type PaginatedTableProps = typeof __propDef.props;
-export type PaginatedTableEvents = typeof __propDef.events;
-export type PaginatedTableSlots = typeof __propDef.slots;
-export default class PaginatedTable extends SvelteComponent<PaginatedTableProps, PaginatedTableEvents, PaginatedTableSlots> {
-}
-export {};
+    pointerOnRowHover?: boolean | undefined;
+    doubleClickActive?: ComponentProps<SimpleTable>["doubleClickActive"];
+    doubleClickDelay?: ComponentProps<SimpleTable>["doubleClickDelay"];
+    calculateRowStyles?: CalculateRowStyles | undefined;
+    calculateRowClasses?: CalculateRowClasses | undefined;
+}, {
+    removeFilter: CustomEvent<{
+        filter: import("../../../utils/filters/filters").Filter;
+    }>;
+    removeAllFilters: CustomEvent<undefined>;
+    sort: CustomEvent<{
+        sortedBy: string | undefined;
+        sortDirection: string;
+        sortModify: import("../../simple/lists/SimpleTable.svelte").Header["sortModify"];
+    }>;
+    rowClick: CustomEvent<{
+        item: import("../../simple/lists/SimpleTable.svelte").Item;
+    }>;
+    rowDoubleClick: CustomEvent<{
+        item: import("../../simple/lists/SimpleTable.svelte").Item;
+    }>;
+} & {
+    [evt: string]: CustomEvent<any>;
+}, {
+    'search-bar': {
+        handleSearchChange: (searchText: string | undefined) => void;
+    };
+    'filter-append': {};
+    'custom-filter-chip': {
+        filter: import("../../../utils/filters/filters").Filter;
+    };
+    'custom-filter': {
+        filter: import("../../../utils/filters/filters").Filter;
+        updateFunction: (filterName: string, newValue: any, newValid: boolean) => void;
+        mAndDown: boolean;
+    };
+    header: {
+        head: import("../../simple/lists/SimpleTable.svelte").Header;
+    };
+    headerLabel: {};
+    custom: {
+        index: any;
+        columnIndex: any;
+        header: import("../../simple/lists/SimpleTable.svelte").Header;
+        item: import("../../simple/lists/SimpleTable.svelte").Item;
+    };
+    rowActions: {
+        index: any;
+        item: import("../../simple/lists/SimpleTable.svelte").Item;
+    };
+    append: {
+        index: any;
+        item: import("../../simple/lists/SimpleTable.svelte").Item;
+    };
+    footer: {
+        hideRowsPerPage: boolean;
+        rowsPerPageOptions: import("../forms/Dropdown.svelte").Item[] | undefined;
+        rowsPerPageSelection: import("../forms/Dropdown.svelte").Item[];
+        totalElements: number | undefined;
+        page: number;
+        maxPage: number | undefined;
+        rowsPerPage: number;
+        handlePaginationChange: () => void;
+    };
+    rangeDescriptor: {
+        page: number;
+        maxPage: number | undefined;
+        rowsPerPage: number;
+        totalElements: number | undefined;
+    };
+}, {}, string>;
+type PaginatedTable = InstanceType<typeof PaginatedTable>;
+export default PaginatedTable;

package/dist/components/composed/progress/HorizontalStackedProgress.svelte

@@ -1,41 +1,69 @@
-<script context="module">export function isProgressItem(obj) {
-  return (obj.label === void 0 || typeof obj.label === "string") && (obj.color === void 0 || typeof obj.color === "string") && typeof obj.value === "number";
-}
+<script lang="ts" context="module">
+  export type ProgressItem = {
+    label?: string,
+    color?: string,
+    value: number,
+    valueLabel?: string | number
+  };
+
+  export function isProgressItem(obj: any): obj is ProgressItem {
+    return (
+      (obj.label === undefined || typeof obj.label === 'string') &&
+      (obj.color === undefined || typeof obj.color === 'string') &&
+      typeof obj.value === 'number'
+    );
+  }
 </script>
 
-<script>import "./HorizontalStackedProgress.css";
-import ProgressBar from "../../simple/progress/ProgressBar.svelte";
-export let progresses = [], labelVisible = true, labelValueVisible = true, labelTextVisible = true, legendVisible = false, legendValueVisible = true, legendTextVisible = true, hideLabelUnderPercentage = void 0;
-let colors = [
-  "rgb(var(--global-color-primary-500))",
-  "rgb(var(--global-color-primary-300))",
-  "rgb(var(--global-color-primary-700))",
-  "rgb(var(--global-color-primary-500), .5)",
-  "rgb(var(--global-color-primary-600), .5)",
-  "rgb(var(--global-color-primary-700), .5)"
-];
-$:
-  total = progresses.reduce((p, c, i, a) => {
-    if (isProgressItem(c)) {
-      return p + c.value;
+<script lang="ts">
+  import './HorizontalStackedProgress.css'
+  import ProgressBar from "../../simple/progress/ProgressBar.svelte";
+
+  export let progresses: (
+      number | 
+      ProgressItem
+    )[] = [],
+    labelVisible: boolean = true,
+    labelValueVisible: boolean = true,
+    labelTextVisible: boolean = true,
+    legendVisible: boolean = false,
+    legendValueVisible: boolean = true,
+    legendTextVisible: boolean = true,
+    hideLabelUnderPercentage: number | undefined = undefined
+
+  let colors = [
+    'rgb(var(--global-color-primary-500))',
+    'rgb(var(--global-color-primary-300))',
+    'rgb(var(--global-color-primary-700))',
+    'rgb(var(--global-color-primary-500), .5)',
+    'rgb(var(--global-color-primary-600), .5)',
+    'rgb(var(--global-color-primary-700), .5)'
+  ]
+
+  $: total = progresses.reduce<number>((p, c, i, a) => {
+    if(isProgressItem(c)) {
+      return p + c.value
     } else {
-      return p + c;
+      return p + c
     }
-  }, 0);
-$:
-  progressesItems = progresses.map((p, i) => {
-    let item;
-    let value = isProgressItem(p) ? p.value : p;
-    let percentage = Number((100 * value / total).toFixed(2));
-    let color = isProgressItem(p) ? p.color : colors[i % colors.length];
+  }, 0)
+
+  $: progressesItems = progresses.map((p, i) => {
+    let item: ProgressItem & { percentage: number }
+    let value = isProgressItem(p) ? p.value : p
+    // x : 100 = value : total
+    let percentage = Number(((100 * value) / total).toFixed(2))
+    let color = isProgressItem(p) ? p.color : colors[i % colors.length]
+
     item = {
-      ...isProgressItem(p) ? p : {},
+      ...(isProgressItem(p) ? p : {}),
       color,
       value,
       percentage
-    };
-    return item;
-  }).filter((p) => p.value !== 0);
+    }
+
+    return item
+  }).filter(p => p.value !== 0)
 </script>
 
 <div class="horizontal-stacked-progress">

package/dist/components/composed/progress/HorizontalStackedProgress.svelte.d.ts

@@ -1,4 +1,3 @@
-import { SvelteComponent } from "svelte";
 export type ProgressItem = {
     label?: string;
     color?: string;
@@ -7,25 +6,30 @@ export type ProgressItem = {
 };
 export declare function isProgressItem(obj: any): obj is ProgressItem;
 import './HorizontalStackedProgress.css';
-declare const __propDef: {
-    props: {
-        progresses?: (number | ProgressItem)[] | undefined;
-        labelVisible?: boolean | undefined;
-        labelValueVisible?: boolean | undefined;
-        labelTextVisible?: boolean | undefined;
-        legendVisible?: boolean | undefined;
-        legendValueVisible?: boolean | undefined;
-        legendTextVisible?: boolean | undefined;
-        hideLabelUnderPercentage?: number | 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 HorizontalStackedProgressProps = typeof __propDef.props;
-export type HorizontalStackedProgressEvents = typeof __propDef.events;
-export type HorizontalStackedProgressSlots = typeof __propDef.slots;
-export default class HorizontalStackedProgress extends SvelteComponent<HorizontalStackedProgressProps, HorizontalStackedProgressEvents, HorizontalStackedProgressSlots> {
+    z_$$bindings?: Bindings;
 }
-export {};
+declare const HorizontalStackedProgress: $$__sveltets_2_IsomorphicComponent<{
+    progresses?: (number | ProgressItem)[];
+    labelVisible?: boolean;
+    labelValueVisible?: boolean;
+    labelTextVisible?: boolean;
+    legendVisible?: boolean;
+    legendValueVisible?: boolean;
+    legendTextVisible?: boolean;
+    hideLabelUnderPercentage?: number | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type HorizontalStackedProgress = InstanceType<typeof HorizontalStackedProgress>;
+export default HorizontalStackedProgress;