@dile/ui 2.16.2 → 2.17.1

package/components/card/src/DileCard.js

@@ -8,14 +8,10 @@ export class DileCard extends LitElement {
         }
         :host {
           display: block;
-          align-items: stretch;
-        }
-        section {
           border: var(--dile-card-border, 1px solid #ccc);
           border-radius: var(--dile-card-border-radius, 0.5rem);
           background-color: var(--dile-card-background-color, #fff);
           color: var(--dile-card-text-color, #303030);
-          width: 100%;
           text-align: var(--dile-card-text-align, left);
           font-weight: var(--dile-card-font-weight, normal);
           box-shadow: var(--dile-card-box-shadow, 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1));
@@ -45,22 +41,22 @@ export class DileCard extends LitElement {
           border-bottom-left-radius: var(--dile-card-border-radius, 0.5rem);
           border-bottom-right-radius: var(--dile-card-border-radius, 0.5rem);
         }
-        :host([shadow-none]) section {
+        :host([shadow-none]) {
           box-shadow: var(--dile-card-box-shadow, 0 0 #0000);
         }
-        :host([shadow-sm]) section {
+        :host([shadow-sm]) {
           box-shadow: var(--dile-card-box-shadow, 0 1px 2px 0 rgb(0 0 0 / 0.05));
         }
-        :host([shadow-md]) section {
+        :host([shadow-md]) {
           box-shadow: var(--dile-card-box-shadow, 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1));
         }
-        :host([shadow-lg]) section {
+        :host([shadow-lg]) {
           box-shadow: var(--dile-card-box-shadow, 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1));
         }
-        :host([shadow-xl]) section {
+        :host([shadow-xl]) {
           box-shadow: var(--dile-card-box-shadow, 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1));
         }
-        :host([shadow-2xl]) section {
+        :host([shadow-2xl]) {
           box-shadow: var(--dile-card-box-shadow, 0 25px 50px -12px rgb(0 0 0 / 0.25));
         }
 
@@ -75,13 +71,11 @@ export class DileCard extends LitElement {
 
     render() {
       return html`
-        <section>
-          ${this.titleTemplate}
-          <main>
-            <slot></slot>
-          </main>
-          ${this.footerTemplate}
-        </section>
+        ${this.titleTemplate}
+        <main>
+          <slot></slot>
+        </main>
+        ${this.footerTemplate}
       `;
     }
 

package/components/checkbox/src/DileCheckbox.js

@@ -2,6 +2,7 @@ import { html, css, LitElement } from "lit";
 import { DileEmmitChange } from '../../../mixins/form/index.js'; 
 import { checkboxBlankIcon, checkboxCheckedIcon } from '@dile/icons';
 import '../../icon/icon.js';
+import '../../input/input-message.js';
 
 export class DileCheckbox extends DileEmmitChange(LitElement) {
   static get properties() {
@@ -10,6 +11,9 @@ export class DileCheckbox extends DileEmmitChange(LitElement) {
       disabled: { type: Boolean, reflect: true, },
       _hasInner: { type: Boolean },
       name: { type: String },
+      message: { type: String },
+      errored: { type: Boolean },
+      hideErrorOnInput: { type: Boolean },
     };
   }
 
@@ -22,6 +26,7 @@ export class DileCheckbox extends DileEmmitChange(LitElement) {
     this.checked = false;
     this.name = '';
     this.internals = this.attachInternals();
+    this.message = ''
   }
 
   static get styles() {
@@ -86,6 +91,10 @@ export class DileCheckbox extends DileEmmitChange(LitElement) {
         </a>
         ${this.innerTemplate}
       </div>
+      ${this.message
+        ? html`<dile-input-message message="${this.message}" ?errored=${this.errored}></dile-input-message>`
+        : ''
+      }
     `;
   }
 
@@ -104,6 +113,10 @@ export class DileCheckbox extends DileEmmitChange(LitElement) {
     if (this.disabled) {
       return;
     }
+    if(this.hideErrorOnInput && this.errored) {
+      this.message = '';
+      this.errored = false;
+    }
     this.checked = !this.checked;
     this.dispatchEvent(
       new CustomEvent("dile-checkbox-changed", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dile/ui",
-  "version": "2.16.2",
+  "version": "2.17.1",
   "description": "UI Core components from dile-components.",
   "main": "index.js",
   "scripts": {
@@ -26,5 +26,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "8ef9bee84a3a5b6acaf22dc3b9d39550f5ceeb80"
+  "gitHead": "465b457fe94482e1db3ea69d2cfa7bf0713f3a11"
 }