@kws3/ui 1.6.1 → 1.6.5

package/datagrid/DataSearch/DataSearch.svelte

@@ -166,6 +166,15 @@
       qfilters[qqp[0]] = qqp[1];
     }
 
+    if (hasFilters) {
+      for (let i in _filters) {
+        let filter = _filters[i];
+        if (typeof qfilters[filter.name] == "undefined") {
+          qfilters[filter.name] = "";
+        }
+      }
+    }
+
     filterVals = qfilters;
   }
 

package/forms/select/MultiSelect.svelte

@@ -28,6 +28,10 @@ Instead of listing all the selected items inside the input., Default: `false`
   @param {string} [no_options_msg="No matching options"] - Message to display when no matching options are found, Default: `"No matching options"`
   @param {string} [remove_btn_tip="Remove"] - Tooltip text for Remove Item button. This `string` will precede the selected Item Name in the tooltip., Default: `"Remove"`
   @param {string} [remove_all_tip="Remove all"] - Tooltip text for the Clear All button, Default: `"Remove all"`
+  @param {HTMLElement|string} [dropdown_portal=undefined] - Where to render the dropdown list.
+Can be a DOM element or a `string` with the CSS selector of the element.
+
+By default it renders in a custom container appended to `document.body`., Default: `undefined`
   @param {string} [class=""] - CSS classes for input container, Default: `""`
 
   ### Events
@@ -106,7 +110,7 @@ Default value: `<span>{option[search_key] || option}</span>`
       style={shouldShowClearAll ? "" : "display: none;"} />
   {/if}
   {#if rootContainer}
-    <div class="kws-searchableselect" use:portal={"#" + rootContainerId}>
+    <div class="kws-searchableselect" use:portal={dropdown_portal}>
       <ul
         bind:this={dropdown}
         class="options {single ? 'is-single' : 'is-multi'}"
@@ -159,6 +163,8 @@ Default value: `<span>{option[search_key] || option}</span>`
     },
   };
 
+  const rootContainerId = "kws-overlay-root";
+
   /**
    * Value of the Input
    *
@@ -236,6 +242,15 @@ Default value: `<span>{option[search_key] || option}</span>`
    * Tooltip text for the Clear All button
    */
   export let remove_all_tip = "Remove all";
+  /**
+   * Where to render the dropdown list.
+   * Can be a DOM element or a `string` with the CSS selector of the element.
+   *
+   * By default it renders in a custom container appended to `document.body`.
+   *
+   * @type { HTMLElement|string}
+   */
+  export let dropdown_portal = "#" + rootContainerId;
 
   /**
    * CSS classes for input container
@@ -250,7 +265,7 @@ Default value: `<span>{option[search_key] || option}</span>`
   }
 
   //ensure we have a root container for all our hoisitng related stuff
-  const rootContainerId = "kws-overlay-root";
+
   let rootContainer = document.getElementById(rootContainerId);
   if (!rootContainer) {
     rootContainer = document.createElement("div");
@@ -494,6 +509,7 @@ Default value: `<span>{option[search_key] || option}</span>`
     }
 
     if (event.key === `Enter`) {
+      event.preventDefault();
       if (activeOption) {
         handleOptionMouseDown(activeOption);
         if (!single) {

package/forms/select/SearchableSelect.svelte

@@ -20,6 +20,10 @@ this property of each object will be returned as the value, Default: `"id"`
   @param {string} [selected_icon="check"] - Icon used to mark selected items in dropdown list, Default: `"check"`
   @param {string} [no_options_msg="No matching options"] - Message to display when no matching options are found, Default: `"No matching options"`
   @param {string} [remove_all_tip="Clear Selection"] - Tooltip text for the Clear selection button, Default: `"Clear Selection"`
+  @param {HTMLElement|string} [dropdown_portal=undefined] - Where to render the dropdown list.
+Can be a DOM element or a `string` with the CSS selector of the element.
+
+By default it renders in a custom container appended to `document.body`., Default: `undefined`
   @param {string} [class=""] - CSS classes for input container, Default: `""`
 
   ### Events
@@ -48,6 +52,7 @@ Default value: `<span>{option[search_key] || option}</span>`
   {selected_icon}
   {remove_all_tip}
   {no_options_msg}
+  {dropdown_portal}
   on:change={change}
   on:blur={blur}
   let:option
@@ -67,6 +72,8 @@ Default value: `<span>{option[search_key] || option}</span>`
 
   const fire = createEventDispatcher();
 
+  const rootContainerId = "kws-overlay-root";
+
   /**
    * Value of the Input
    *
@@ -127,6 +134,15 @@ Default value: `<span>{option[search_key] || option}</span>`
    * Tooltip text for the Clear selection button
    */
   export let remove_all_tip = "Clear Selection";
+  /**
+   * Where to render the dropdown list.
+   * Can be a DOM element or a `string` with the CSS selector of the element.
+   *
+   * By default it renders in a custom container appended to `document.body`.
+   *
+   * @type { HTMLElement|string}
+   */
+  export let dropdown_portal = "#" + rootContainerId;
 
   /**
    * CSS classes for input container

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kws3/ui",
-  "version": "1.6.1",
+  "version": "1.6.5",
   "description": "UI components for use with Svelte v3 applications.",
   "main": "index.js",
   "scripts": {
@@ -29,5 +29,5 @@
     "text-mask-core": "^5.1.2",
     "tippy.js": "^6.3.1"
   },
-  "gitHead": "ea18e1e71037d787675491be9c0260b901bf9e7a"
+  "gitHead": "7bd56973e65c032a94e8285e321de06d0a89d051"
 }