@aquera/nile-elements 0.0.55 → 0.0.57

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent nile-elements following open-wc recommendations",
   "license": "MIT",
   "author": "nile-elements",
-  "version": "0.0.55",
+  "version": "0.0.57",
   "main": "dist/src/index.js",
   "type": "module",
   "module": "dist/src/index.js",

package/src/nile-input/nile-input.ts

@@ -281,6 +281,7 @@ export class NileInput extends NileElement implements NileFormControl {
   }
 
   firstUpdated() {
+    this.emit('nile-after-init');
     this.formControlController.updateValidity();
   }
 

package/src/nile-select/nile-select.ts

@@ -145,7 +145,7 @@ export class NileSelect extends NileElement implements NileFormControl {
   @property() placeholder = 'Select...';
 
   /** Placeholder text to show as a hint when the select is empty. */
-  @state() searchValue = '';
+  @state() searchValue : string = '';
 
   @property({ type: Boolean, reflect: true }) searchEnabled = false;
 
@@ -868,6 +868,8 @@ export class NileSelect extends NileElement implements NileFormControl {
     } else {
       // Hide
       this.emit('nile-hide', { value: this.value, name: this.name });
+      this.searchValue = '';
+      this.filterOptions(this.searchValue);
       this.removeOpenListeners();
 
       await stopAnimations(this);
@@ -1003,7 +1005,6 @@ export class NileSelect extends NileElement implements NileFormControl {
     const hasClearIcon =
       this.clearable && !this.disabled && this.value.length > 0;
     const isPlaceholderVisible = this.placeholder && this.value.length === 0;
-    const searchValue = this.searchValue || '';
     const hasHelpText = this.helpText ? true : false;
     const hasErrorMessage = this.errorMessage ? true : false;
     const prefixContent = this.selectedOptions[0]
@@ -1250,7 +1251,7 @@ export class NileSelect extends NileElement implements NileFormControl {
                     <nile-input
                       size="small"
                       clearable
-                      .value=${searchValue}
+                      .value=${this.searchValue}
                       placeholder="Search..."
                       @nile-input=${this.handleSearchChange}
                       @nile-focus=${this.handleSearchFocus}

package/src/nile-table-body/nile-table-body.css.ts

@@ -11,14 +11,25 @@ import { css } from 'lit-element';
  * TableBody CSS
  */
 export const styles = css`
+
   :host {
     box-sizing: border-box;
-    --nile-table-background--odd: var(--nile-table-body-row-odd-background-color);
-    --nile-table-background--even: var(--nile-table-body-row-even-background-color);
+    --nile-table-background--odd: var(
+      --nile-table-body-row-odd-background-color
+    );
+    --nile-table-background--even: var(
+      --nile-table-body-row-even-background-color
+    );
   }
+
   .base {
     width: max-content;
     background-color: var(--nile-colors-white-base);
+    border: 1px solid var(--nile-table-row-border-color);
+    border-radius: var(--nile-radius-radius-xl);
+    box-shadow: 0px 1px 3px 0px rgba(16, 24, 40, 0.1),
+      0px 1px 2px 0px rgba(16, 24, 40, 0.06);
+    overflow:hidden;
   }
 
   .table__header {
@@ -32,12 +43,16 @@ export const styles = css`
   }
 
   slot::slotted(nile-table-row:nth-child(odd)) {
-    border-bottom: 1px solid var(--nile-table-row-border-color);
     background: var(--nile-table-background--odd);
   }
+
   slot::slotted(nile-table-row:nth-child(even)) {
     background: var(--nile-table-background--even);
   }
+
+  slot::slotted(nile-table-row:last-child) {
+    border-bottom: 0px;
+  }
 `;
 
 export default [styles];

package/src/nile-table-cell-item/nile-table-cell-item.css.ts

@@ -11,6 +11,7 @@ import { css } from 'lit-element';
  * TableCellItem CSS
  */
 export const styles = css`
+
   :host {
     box-sizing: border-box;
     display: table-cell;
@@ -28,12 +29,8 @@ export const styles = css`
     min-height: var(--min--height);
     height: auto;
     width: auto;
-
-    /**font styling */
     color: var(--nile-colors-dark-900);
-
     font-feature-settings: 'clig' off, 'liga' off;
-    /* New Paragraph/Regular */
     font-size: var(--nile-type-scale-3);
     font-style: normal;
     font-weight: var(--nile-font-weight-regular);

package/src/nile-table-header-item/nile-table-header-item.css.ts

@@ -27,11 +27,8 @@ export const styles = css`
     width: auto;
     min-width: var(--min--width);
     gap: 8px;
-
     color: var(--nile-colors-dark-900);
-
     font-feature-settings: 'clig' off, 'liga' off;
-    /* New Paragraph/Regular */
     font-size: var(--nile-type-scale-3);
     font-style: normal;
     font-weight: var(--nile-font-weight-regular);
@@ -42,6 +39,7 @@ export const styles = css`
   slot {
     cursor: pointer;
   }
+  
   nile-icon {
     cursor: pointer;
   }

package/src/nile-table-row/nile-table-row.css.ts

@@ -13,8 +13,8 @@ import { css } from 'lit-element';
 export const styles = css`
   :host {
     display: table-row;
-    border-bottom: 1px solid #e4e2e4;
     --nile-header-background:var(--nile-table-header-background-color);
+    border-bottom: 1px solid var(--nile-table-row-border-color);
   }
 
   slot::slotted(nile-table-header-item) {