@aquera/nile-elements 0.1.63-beta-1.0 → 1.0.1-beta-1.0

package/package.json

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

package/src/nile-auto-complete/nile-auto-complete.ts

@@ -71,7 +71,7 @@ export class NileAutoComplete extends NileElement {
   public render(): TemplateResult {
     const content=this.enableVirtualScroll?this.getVirtualizedContent():this.getContent();
     return html`
-      <nile-dropdown class="nile-dropdown--input" ?open=${this.isDropdownOpen} noOpenOnCLick>
+      <nile-dropdown class="nile-dropdown--input" ?open=${this.isDropdownOpen} noOpenOnCLick exportparts="input">
         <nile-input class="nile-auto-complete--input"
           ?no-border=${this.noBorder}
           ?no-outline=${this.noOutline}
@@ -83,6 +83,7 @@ export class NileAutoComplete extends NileElement {
           @click=${this.handleClick}
           slot="trigger"
           placeholder=${this.placeholder}
+          exportparts="input"
         >
           ${this.loading?html`<nile-icon slot="suffix" color="var(--nile-colors-primary-600)" name="button-loading-blue-animated"></nile-icon>`:nothing}
         </nile-input>
@@ -182,4 +183,4 @@ declare global {
   interface HTMLElementTagNameMap {
     'nile-auto-complete': NileAutoComplete;
   }
-}
+}

package/src/nile-checkbox/nile-checkbox.css.ts

@@ -84,7 +84,6 @@ export const styles = css`
     border: 1px solid
       var(--nile-checkbox-color-border-hover, var(--ng-colors-border-primary));
     border-radius: var(--nile-radius-radius-xs, var(--ng-radius-xs));
-    box-shadow: var(--nile-box-shadow-none, var(--ng-focus-ring));
   }
 
   /* Disabled */
@@ -101,6 +100,10 @@ export const styles = css`
     outline-offset: 1px;
   }
 
+  .checkbox--focused .checkbox__control {
+    box-shadow: var(--nile-box-shadow-none, var(--ng-focus-ring));
+  }
+
   /* Checked/indeterminate */
   .checkbox--checked .checkbox__control,
   .checkbox--indeterminate .checkbox__control {
@@ -122,9 +125,6 @@ export const styles = css`
       --nile-checkbox-color-background-checked-hover,
       var(--ng-colors-bg-brand-solid)
     );
-    /* border: 1px solid var(--nile-checkbox-color-border-checked-hover),
-      var(--ng-colors-border-border-disabled); */
-    box-shadow: var(--nile-box-shadow-none, var(--ng-focus-ring));
   }
 
   /* .checkbox.checkbox--indeterminate .checkbox_control:hover {

package/src/nile-chip/nile-chip.css.ts

@@ -171,6 +171,10 @@ export const styles = css`
   .nile-chip__tags {
     margin: var(--nile-margin-size-rem-small);
   }
+
+  nile-auto-complete::part(input) {
+    padding: 0px;
+  }
 `;
 
 export default [styles];

package/src/nile-chip/nile-chip.ts

@@ -214,7 +214,7 @@ export class NileChip extends NileElement {
               .noPadding=${true}
               .disabled=${this.disabled}
               openOnFocus
-              exportparts="options__wrapper"
+              exportparts="options__wrapper, input"
               .placeholder=${this.placeholder}
               @nile-input=${this.handleInputChange}
               @keydown=${this.handleInputKeydown}

package/src/nile-radio/nile-radio.css.ts

@@ -107,6 +107,11 @@ export const styles = css`
     outline-offset: 2px;
   }
 
+  .radio--focused .radio__control {
+    outline: solid var(--nile-outline-none, var(--ng-outline-2px)) var(--nile-outline-none, var(--ng-colors-bg-brand-solid));
+    outline-offset: 1px;
+  }
+
   /* Disabled */
   .radio--disabled {
     opacity: 0.5;