@likable-hair/svelte 3.0.67 → 3.0.69

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

@@ -3,7 +3,7 @@
 <script>import Autocomplete from "../../../components/simple/forms/Autocomplete.svelte";
 import debounceStore from "../../../stores/debounce";
 import { writable } from "svelte/store";
-export let items = [], values = [], multiple = false, searcher, searchThreshold = 2, debounceTimeout = 500, searching = false, search = false, searchText = void 0, maxVisibleChips = void 0, menuOpened = false, mobileDrawer = false;
+export let items = [], values = [], multiple = false, searcher, placeholder = void 0, searchThreshold = 2, debounceTimeout = 500, searching = false, search = false, searchText = void 0, maxVisibleChips = void 0, menuOpened = false, mobileDrawer = false, closeOnSelect = false;
 const searchTextValue = writable(searchText);
 $:
   searchTextDebounce = debounceStore(searchTextValue, debounceTimeout);
@@ -38,6 +38,8 @@ $:
   bind:maxVisibleChips
   bind:menuOpened
   bind:mobileDrawer
+  bind:placeholder
+  bind:closeOnSelect
   searchFunction={() => true}
   on:change
 ></Autocomplete>

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

@@ -9,6 +9,7 @@ declare const __propDef: {
         searcher: (params: {
             searchText: string;
         }) => Promise<Item[]>;
+        placeholder?: string | undefined;
         searchThreshold?: number | undefined;
         debounceTimeout?: number | undefined;
         searching?: boolean | undefined;
@@ -17,6 +18,7 @@ declare const __propDef: {
         maxVisibleChips?: number | undefined;
         menuOpened?: boolean | undefined;
         mobileDrawer?: boolean | undefined;
+        closeOnSelect?: boolean | undefined;
     };
     events: {
         change: CustomEvent<any>;

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

@@ -32,6 +32,8 @@ declare const __propDef: {
             maxVisibleChips?: number | undefined;
             menuOpened?: boolean | undefined;
             closeOnSelect?: boolean | undefined;
+            emptySearchTextOnMenuClose?: boolean | undefined;
+            emptySearchTextOnTextfieldBlur?: boolean | undefined;
             menuBoxShadow?: string | undefined;
             menuBorderRadius?: string | undefined;
             mobileDrawer?: boolean | undefined;

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

@@ -0,0 +1,228 @@
+<script>import IMask, { InputMask } from "imask";
+import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
+import DatePicker from "../../simple/dates/DatePicker.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";
+let clazz = {};
+export { clazz as class };
+let dispatch = createEventDispatcher();
+export let menuOpened = false, openingId = "date-picker-text-field", pattern = "dd/MM/yyyy", selectedMonth = void 0, selectedYear = void 0, visibleMonth = void 0, visibleYear = void 0, selectedDate = void 0, placeholder = void 0, mobileDialog = true, maxYearInRange = 2100, minYearInRange = 1970;
+let activator, refreshPosition = false, menuElement, inputElement, 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
+    },
+    MM: {
+      mask: IMask.MaskedRange,
+      from: 1,
+      to: 12
+    },
+    dd: {
+      mask: IMask.MaskedRange,
+      from: 1,
+      to: 31
+    },
+    HH: {
+      mask: IMask.MaskedRange,
+      from: 0,
+      to: 23
+    },
+    mm: {
+      mask: IMask.MaskedRange,
+      from: 0,
+      to: 59
+    }
+  }
+};
+function handleTextFieldFocus(mobile) {
+  if (!mobile || !mobileDialog) {
+    menuOpened = true;
+  }
+}
+onMount(() => {
+  mask = IMask(
+    inputElement,
+    maskFactoryArgs
+  );
+  if (!!selectedDate) {
+    mask.value = DateTime.fromJSDate(selectedDate).toFormat(pattern);
+  }
+});
+function handleInputChange(event) {
+  setTimeout(() => {
+    const typedValue = mask.value;
+    if (typedValue !== void 0 && typedValue !== null) {
+      const dayOfMonthIndex = pattern.indexOf("dd");
+      const dayOfMonth = typedValue.substring(dayOfMonthIndex, dayOfMonthIndex + 2);
+      const monthIndex = pattern.indexOf("MM");
+      const oneBasedMonth = typedValue.substring(monthIndex, monthIndex + 2);
+      if (oneBasedMonth.length == 2) {
+        selectedMonth = Number(oneBasedMonth) - 1;
+        visibleMonth = selectedMonth;
+      }
+      const yearIndex = pattern.indexOf("yyyy");
+      const year = typedValue.substring(yearIndex, yearIndex + 4);
+      if (year.length == 4) {
+        selectedYear = Number(year);
+        visibleYear = selectedYear;
+      }
+      if (typedValue.length == pattern.length) {
+        selectedDate = DateTime.fromObject({
+          day: Number(dayOfMonth),
+          month: Number(oneBasedMonth),
+          year: Number(year)
+        }).toJSDate();
+      } else {
+        selectedDate = void 0;
+      }
+      dispatch("input", {
+        datetime: selectedDate
+      });
+    }
+  }, 30);
+}
+function handleDateSelect(ev) {
+  if (!!selectedDate) {
+    mask.value = DateTime.fromJSDate(selectedDate).toFormat(pattern);
+  }
+  dispatch("day-click", {
+    dateStat: ev.detail.dateStat
+  });
+}
+function handleYearSelect() {
+  mask.value = "";
+}
+function handleMonthSelect() {
+  mask.value = "";
+}
+$:
+  if (!!selectedDate) {
+    setTimeout(() => {
+      if (!!selectedDate) {
+        mask.value = DateTime.fromJSDate(selectedDate).toFormat(pattern);
+      }
+    }, 30);
+  }
+</script>
+
+<MediaQuery let:mAndDown>
+  <div
+    bind:this={activator}
+    class="year-picker-activator {clazz.activator || ''}"
+  >
+    <slot 
+      name="activator"
+      {mask}
+      {handleTextFieldFocus}
+      {handleInputChange}
+      {inputElement}
+      {placeholder}
+    >
+      <SimpleTextField
+        bind:value={mask.value}
+        on:focus={() => handleTextFieldFocus(mAndDown)}
+        on:keydown={handleInputChange}
+        bind:input={inputElement}
+        bind:placeholder
+        class={clazz.textfield}
+      >
+        <svelte:fragment slot="prepend-inner" let:prependInnerIcon let:iconSize>
+          <slot name="prepend-inner" {prependInnerIcon} {iconSize}>
+            <Icon
+              name="mdi-calendar"
+              click
+              on:click={() => menuOpened = !menuOpened}
+            ></Icon>
+          </slot>
+        </svelte:fragment>
+        <svelte:fragment slot="append-inner" let:appendInnerIcon let:iconSize>
+          <slot name="append-inner" {appendInnerIcon} {iconSize}>
+          </slot>
+        </svelte:fragment>
+        <svelte:fragment slot="prepend" let:prependIcon let:iconSize>
+          <slot name="append-inner" {prependIcon} {iconSize}>
+          </slot>
+        </svelte:fragment>
+        <svelte:fragment slot="append" let:appendIcon let:iconSize>
+          <slot name="append-inner" {appendIcon} {iconSize}>
+          </slot>
+        </svelte:fragment>
+      </SimpleTextField>
+    </slot>
+  </div>
+
+  {#if mAndDown && mobileDialog}
+    <Dialog
+      bind:open={menuOpened}
+    >
+      <div
+        style:background-color="rgb(var(--global-color-background-100))"
+        style:width="300px"
+        style:border-radius="10px"
+      >
+        <DatePicker
+          bind:selectedDate={selectedDate}
+          bind:selectedMonth={selectedMonth}
+          bind:selectedYear={selectedYear}
+          bind:visibleMonth
+          bind:visibleYear
+          on:day-click={handleDateSelect}
+          on:year-click={handleYearSelect}
+          on:month-click={handleMonthSelect}
+        ></DatePicker>
+      </div>
+    </Dialog>
+  {:else}
+    <Menu
+      {activator}
+      _width={"300px"}
+      _boxShadow={"rgb(var(--global-color-background-300), .5) 0px 2px 4px"}
+      _borderRadius={"5px"}
+      bind:open={menuOpened}
+      anchor="bottom-center"
+      closeOnClickOutside
+      bind:refreshPosition
+      bind:menuElement
+      bind:openingId={openingId}
+    >
+      <div
+        style:background-color="rgb(var(--global-color-background-100))"
+      >
+        <DatePicker
+          bind:selectedDate={selectedDate}
+          bind:selectedMonth={selectedMonth}
+          bind:selectedYear={selectedYear}
+          bind:visibleMonth
+          bind:visibleYear
+          on:day-click={handleDateSelect}
+          on:year-click={handleYearSelect}
+          on:month-click={handleMonthSelect}
+        ></DatePicker>
+      </div>
+    </Menu>
+  {/if}
+</MediaQuery>
+
+<style>
+  .year-picker-activator {
+    width: fit-content;
+  }
+</style>
+

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

@@ -0,0 +1,58 @@
+import { SvelteComponentTyped } from "svelte";
+import SimpleTextField from "../../simple/forms/SimpleTextField.svelte";
+import { type ComponentProps } from 'svelte';
+declare const __propDef: {
+    props: {
+        class?: {
+            activator?: string | undefined;
+            textfield?: ComponentProps<SimpleTextField>['class'];
+        } | undefined;
+        menuOpened?: boolean | undefined;
+        openingId?: string | undefined;
+        pattern?: string | undefined;
+        selectedMonth?: number | undefined;
+        selectedYear?: number | undefined;
+        visibleMonth?: number | undefined;
+        visibleYear?: number | undefined;
+        selectedDate?: Date | undefined;
+        placeholder?: string | undefined;
+        mobileDialog?: boolean | undefined;
+        maxYearInRange?: number | undefined;
+        minYearInRange?: number | undefined;
+    };
+    events: {
+        'year-click': CustomEvent<{
+            year: number;
+        }>;
+        input: CustomEvent<{
+            datetime: Date | undefined;
+        }>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        activator: {
+            mask: {
+                value: string | undefined;
+            };
+            handleTextFieldFocus: (mobile: boolean) => void;
+            handleInputChange: (event: any) => void;
+            inputElement: HTMLElement;
+            placeholder: string | undefined;
+        };
+        'prepend-inner': {
+            prependInnerIcon: string | undefined;
+            iconSize: string;
+        };
+        'append-inner': {
+            appendIcon: string | undefined;
+            iconSize: string;
+        };
+    };
+};
+export type YearPicketTextfieldProps = typeof __propDef.props;
+export type YearPicketTextfieldEvents = typeof __propDef.events;
+export type YearPicketTextfieldSlots = typeof __propDef.slots;
+export default class YearPicketTextfield extends SvelteComponentTyped<YearPicketTextfieldProps, YearPicketTextfieldEvents, YearPicketTextfieldSlots> {
+}
+export {};

package/dist/components/simple/common/Menu.svelte

@@ -17,17 +17,31 @@ function calculateMenuPosition(params) {
       if (anchor == "bottom") {
         let { left: activatorLeft, top: activatorTop } = params.activator.getBoundingClientRect();
         let activatorHeight = params.activator.offsetHeight;
-        let { top: fixedParentTop, left: fixedParentLeft } = getParentInstanceFromViewport(activator?.parentElement);
-        _top = activatorTop + window.scrollY + activatorHeight + _activatorGap - fixedParentTop;
-        _left = activatorLeft + window.scrollX - fixedParentLeft;
+        _top = activatorTop + activatorHeight + _activatorGap;
+        _left = activatorLeft;
+        let { top: fixedParentTop, left: fixedParentLeft, element } = getParentInstanceFromViewport(activator?.parentElement);
+        if (!!element) {
+          _top = _top - fixedParentTop;
+          _left = _left - fixedParentLeft;
+        } else {
+          _top = _top + window.scrollY;
+          _left = _left + window.scrollX;
+        }
       } else if (anchor == "bottom-center") {
         let { left: activatorLeft, top: activatorTop } = params.activator.getBoundingClientRect();
         let activatorHeight = params.activator.offsetHeight;
         let activatorWidth = params.activator.offsetWidth;
         let menuWidth = params.menuElement.offsetWidth;
-        let { top: fixedParentTop, left: fixedParentLeft } = getParentInstanceFromViewport(activator?.parentElement);
-        _top = activatorTop + window.scrollY + activatorHeight + _activatorGap - fixedParentTop;
-        _left = activatorLeft + window.scrollX - fixedParentLeft;
+        _top = activatorTop + activatorHeight + _activatorGap;
+        _left = activatorLeft;
+        let { top: fixedParentTop, left: fixedParentLeft, element } = getParentInstanceFromViewport(activator?.parentElement);
+        if (!!element) {
+          _top = _top - fixedParentTop;
+          _left = _left - fixedParentLeft;
+        } else {
+          _top = _top + window.scrollY;
+          _left = _left + window.scrollX;
+        }
         if (menuWidth > activatorWidth) {
           _left = _left - (menuWidth - activatorWidth) / 2;
         } else {
@@ -149,7 +163,7 @@ $:
 function getPositionedAncestor(elem) {
   if (!elem)
     return null;
-  if (["fixed", "absolute"].includes(getComputedStyle(elem).position))
+  if (["fixed", "absolute", "sticky"].includes(getComputedStyle(elem).position))
     return elem;
   return getPositionedAncestor(elem.parentElement);
 }
@@ -159,6 +173,7 @@ function handleCloseControllerClick() {
 function getParentInstanceFromViewport(activatorParent) {
   let top = 0;
   let left = 0;
+  let fixedParentElement = void 0;
   while (!!activatorParent && activatorParent.nodeName.toLowerCase() !== "html" && activatorParent.nodeName.toLowerCase() !== "body") {
     const currentParent = activatorParent.parentElement;
     if (!currentParent)
@@ -170,14 +185,19 @@ function getParentInstanceFromViewport(activatorParent) {
       const boundingClientRect = activatorParent.getBoundingClientRect();
       top = top + boundingClientRect.top;
       left = left + boundingClientRect.left;
+      fixedParentElement = activatorParent;
     }
     activatorParent = activatorParent.parentElement;
   }
-  return { top, left };
+  return { top, left, element: fixedParentElement };
 }
 function handleWindowScrollOrResize() {
-  if (open && !!menuElement && !!activator)
+  if (open && !!menuElement && !!activator) {
+    let elem = getPositionedAncestor(menuElement.parentElement);
+    if (!!elem && getComputedStyle(elem).position == "sticky")
+      return;
     calculateMenuPosition({ menuElement, activator });
+  }
 }
 function handleMenuClick(e, zIndex2) {
   let otherMenus = document.querySelectorAll(`[data-menu]`);
@@ -215,7 +235,7 @@ function handleMenuClick(e, zIndex2) {
     data-menu
     data-uid={currentUid}
     style:z-index={zIndex}
-    style:position="absolute"
+    style:position={!!positionedAncestor && getComputedStyle(positionedAncestor).position == 'sticky' ? 'sticky' : 'absolute'}
     style:top={_top + "px"}
     style:box-shadow={_boxShadow}
     style:border-radius={_borderRadius}

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

@@ -139,7 +139,7 @@ function handleMonthChange() {
       />
     {:else if view == "year"}
       <YearSelector
-        --year-selector-height="calc(var(--date-picker-height, var(--date-picker-default-height)) / 8 * 6)"
+        --year-selector-height="calc(var(--date-picker-height, var(--date-picker-default-height)) - calc(var(--date-picker-height, var(--date-picker-default-height)) / 4))"
         bind:selectedYear={visibleYear}
         {selectableYears}
         on:click={handleYearChange}

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

@@ -1,4 +1,5 @@
 :root {
+  --year-selector-default-max-height: 500px;
   --year-selector-default-height: 100%;
   --year-selector-default-width: 100%;
 }

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

@@ -29,6 +29,8 @@ import Button from "../buttons/Button.svelte";
       <div bind:this={targetButtons[year]} style:width="100%">
         <Button
           --button-background-color={year == selectedYear ? "rgb(var(--global-color-primary-500))" : "trasparent"}
+          --button-active-background-color={year == selectedYear ? "rgb(var(--global-color-primary-500))" : "trasparent"}
+          --button-focus-background-color={year == selectedYear ? "rgb(var(--global-color-primary-500))" : "trasparent"}
           --button-hover-background-color={year == selectedYear ? "var(--button-background-color)" : "rgb(var(--global-color-primary-500), .2)"}
           --button-color={year == selectedYear ?  "rgb(var(--global-color-grey-50))" : undefined}
           --button-font-weight="500"
@@ -59,6 +61,10 @@ import Button from "../buttons/Button.svelte";
       --year-selector-height,
       var(--year-selector-default-height)
     );
+    max-height: var(
+      --year-selector-max-height,
+      var(--year-selector-default-max-height)
+    );
     width: var(
       --year-selector-width,
       var(--year-selector-default-width)

package/dist/components/simple/forms/Autocomplete.svelte

@@ -5,7 +5,7 @@ import "./Autocomplete.css";
 import { scrollInMenu } from "../common/scroller";
 let clazz = {};
 export { clazz as class };
-export let values = [], items, searchFunction = void 0, multiple = false, disabled = false, mandatory = false, placeholder = "", width = "auto", height = "auto", maxWidth = void 0, openingId = "autocomplete-menu", searchText = void 0, maxVisibleChips = void 0, menuOpened = false, closeOnSelect = false, menuBoxShadow = "rgb(var(--global-color-background-300), .5) 0px 2px 4px", menuBorderRadius = "5px", mobileDrawer = false;
+export let values = [], items, searchFunction = void 0, multiple = false, disabled = false, mandatory = false, placeholder = "", width = "auto", height = "auto", maxWidth = void 0, openingId = "autocomplete-menu", searchText = void 0, maxVisibleChips = void 0, menuOpened = false, closeOnSelect = !multiple, emptySearchTextOnMenuClose = false, emptySearchTextOnTextfieldBlur = true, menuBoxShadow = "rgb(var(--global-color-background-300), .5) 0px 2px 4px", menuBorderRadius = "5px", mobileDrawer = false;
 let dispatch = createEventDispatcher();
 function select(item) {
   const alreadyPresent = values.findIndex((i) => i.value === item.value) != -1;
@@ -73,6 +73,8 @@ function handleTextFieldFocus() {
   openMenu();
 }
 function handleTextFieldBlur() {
+  if (emptySearchTextOnTextfieldBlur)
+    searchText = void 0;
 }
 let menuElement;
 function handleKeyDown(event) {
@@ -127,6 +129,13 @@ $:
   }
 $:
   notVisibleChipNumber = Math.max((values?.length || 0) - (maxVisibleChips || 0), 0);
+$:
+  if (!menuOpened && emptySearchTextOnMenuClose) {
+    setTimeout(() => {
+      if (!menuOpened && emptySearchTextOnMenuClose)
+        searchText = void 0;
+    }, 80);
+  }
 import Chip from "../navigation/Chip.svelte";
 import Menu from "../common/Menu.svelte";
 import { createEventDispatcher } from "svelte";

package/dist/components/simple/forms/Autocomplete.svelte.d.ts

@@ -30,6 +30,8 @@ declare const __propDef: {
         maxVisibleChips?: number | undefined;
         menuOpened?: boolean | undefined;
         closeOnSelect?: boolean | undefined;
+        emptySearchTextOnMenuClose?: boolean | undefined;
+        emptySearchTextOnTextfieldBlur?: boolean | undefined;
         menuBoxShadow?: string | undefined;
         menuBorderRadius?: string | undefined;
         mobileDrawer?: boolean | undefined;

package/dist/components/simple/forms/SimpleTextField.svelte

@@ -3,7 +3,7 @@ import "./SimpleTextField.css";
 import Icon from "../media/Icon.svelte";
 let clazz = {};
 export { clazz as class };
-export let value = void 0, type = "text", placeholder = void 0, disabled = false, readonly = false, appendIcon = void 0, appendInnerIcon = void 0, prependIcon = void 0, prependInnerIcon = void 0, iconSize = "12pt", name = void 0, hint = void 0, input = void 0;
+export let value = void 0, type = "text", placeholder = void 0, disabled = false, readonly = false, id = void 0, appendIcon = void 0, appendInnerIcon = void 0, prependIcon = void 0, prependInnerIcon = void 0, iconSize = "12pt", name = void 0, hint = void 0, input = void 0;
 </script>
 
 <div
@@ -26,6 +26,7 @@ export let value = void 0, type = "text", placeholder = void 0, disabled = false
           bind:value={value}
           placeholder={placeholder}
           type="text"
+          id={id}
           disabled={disabled}
           readonly={readonly}
           on:change
@@ -46,6 +47,7 @@ export let value = void 0, type = "text", placeholder = void 0, disabled = false
           bind:value={value}
           placeholder={placeholder}
           type="password"
+          id={id}
           disabled={disabled}
           readonly={readonly}
           on:change
@@ -66,6 +68,7 @@ export let value = void 0, type = "text", placeholder = void 0, disabled = false
           bind:value={value}
           placeholder={placeholder}
           type="number"
+          id={id}
           disabled={disabled}
           readonly={readonly}
           on:change
@@ -86,6 +89,7 @@ export let value = void 0, type = "text", placeholder = void 0, disabled = false
           bind:value={value}
           placeholder={placeholder}
           type="time"
+          id={id}
           disabled={disabled}
           readonly={readonly}
           on:change
@@ -106,6 +110,7 @@ export let value = void 0, type = "text", placeholder = void 0, disabled = false
           bind:value={value}
           placeholder={placeholder}
           type="date"
+          id={id}
           disabled={disabled}
           readonly={readonly}
           on:change

package/dist/components/simple/forms/SimpleTextField.svelte.d.ts

@@ -16,6 +16,7 @@ declare const __propDef: {
         placeholder?: string | undefined;
         disabled?: boolean | undefined;
         readonly?: boolean | undefined;
+        id?: string | undefined;
         appendIcon?: string | undefined;
         appendInnerIcon?: string | undefined;
         prependIcon?: string | undefined;

package/dist/components/simple/lists/SelectableVerticalList.svelte

@@ -192,6 +192,7 @@ function handleIconClick(index, element) {
   }
 
   .element {
+    position: relative;
     padding: var(
       --selectable-vertical-list-element-padding,
       var(--selectable-vertical-list-default-element-padding)

package/dist/index.d.ts

@@ -25,6 +25,7 @@ export { default as VerticalTextSwitch } from './components/simple/forms/Vertica
 export { default as TreeEditor } from './components/simple/forms/TreeEditor.svelte';
 export { default as ColorInvertedSelector } from './components/simple/lists/ColorInvertedSelector.svelte';
 export { default as SelectableMenuList } from './components/simple/lists/SelectableMenuList.svelte';
+export { default as SelectableVerticalList } from './components/simple/lists/SelectableVerticalList.svelte';
 export { default as SidebarMenuList } from './components/simple/lists/SidebarMenuList.svelte';
 export { default as SimpleTable } from './components/simple/lists/SimpleTable.svelte';
 export { default as CircularLoader } from './components/simple/loaders/CircularLoader.svelte';

package/dist/index.js

@@ -25,6 +25,7 @@ export { default as VerticalTextSwitch } from './components/simple/forms/Vertica
 export { default as TreeEditor } from './components/simple/forms/TreeEditor.svelte';
 export { default as ColorInvertedSelector } from './components/simple/lists/ColorInvertedSelector.svelte';
 export { default as SelectableMenuList } from './components/simple/lists/SelectableMenuList.svelte';
+export { default as SelectableVerticalList } from './components/simple/lists/SelectableVerticalList.svelte';
 export { default as SidebarMenuList } from './components/simple/lists/SidebarMenuList.svelte';
 export { default as SimpleTable } from './components/simple/lists/SimpleTable.svelte';
 export { default as CircularLoader } from './components/simple/loaders/CircularLoader.svelte';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@likable-hair/svelte",
   "description": "A Svelte component for likablehair",
-  "version": "3.0.67",
+  "version": "3.0.69",
   "scripts": {
     "host": "vite --host",
     "dev": "vite dev",