@likable-hair/svelte 3.0.66 → 3.0.68

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/layouts/UnstableDividedSideBarLayout.svelte

@@ -280,12 +280,18 @@ let sidebarExpanded = false;
 
   .main-section {
     padding-left: var(
-      --unstable-divided-side-bar-layout-side-bar-width,
-      var(--unstable-divided-side-bar-layout-default-side-bar-width)
+      --unstable-divided-side-bar-layout-content-padding-left,
+      var(
+        --unstable-divided-side-bar-layout-side-bar-width,
+        var(--unstable-divided-side-bar-layout-default-side-bar-width)
+      )
     );
     padding-top: var(
-      --unstable-divided-side-bar-layout-header-menu-height,
-      var(--unstable-divided-side-bar-layout-default-header-menu-height,)
+      --unstable-divided-side-bar-layout-content-padding-top,
+      var(
+        --unstable-divided-side-bar-layout-header-menu-height,
+        var(--unstable-divided-side-bar-layout-default-header-menu-height,)
+      )
     );
     transition: all .2s cubic-bezier(.4,0,.2,1);
   }

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/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.66",
+  "version": "3.0.68",
   "scripts": {
     "host": "vite --host",
     "dev": "vite dev",