@dile/ui 2.20.0 → 2.21.0

package/components/copy-markdown-url/src/DileCopyMarkdownUrl.js

@@ -33,27 +33,32 @@ export class DileCopyMarkdownUrl extends LitElement {
         .feedbackText="${this.feedbackText}"
         .copiedDuration="${this.copiedDuration}"
         ?hideIcon="${this.hideIcon}"
-        @click="${this.handleClick}"
       >
         <slot></slot>
       </dile-copy-text>
     `;
   }
 
-  async handleClick(e) {
-    if (this.loading) {
-      e.preventDefault();
-      return;
-    }
+  connectedCallback() {
+    super.connectedCallback();
+    // Listen in capture phase to intercept click before dile-copy-text handles it
+    this.addEventListener('click', (e) => this.handleClickCapture(e), true);
+  }
 
+  async handleClickCapture(e) {
+    // If no content yet and URL is set, fetch before letting dile-copy-text handle the copy
     if (!this.content && this.url) {
       e.preventDefault();
+      e.stopPropagation();
+      
       await this.fetchContent();
       
-      // After fetching, trigger copy on the component using its public API
-      const copyComponent = this.shadowRoot.querySelector('#copy-component');
-      if (copyComponent && this.content) {
-        await copyComponent.copy();
+      // Only trigger copy if fetch was successful
+      if (this.content && !this.error) {
+        const copyComponent = this.shadowRoot.querySelector('#copy-component');
+        if (copyComponent) {
+          await copyComponent.copy();
+        }
       }
     }
   }
@@ -61,13 +66,7 @@ export class DileCopyMarkdownUrl extends LitElement {
   async fetchContent() {
     if (!this.url) {
       this.error = 'URL is not set';
-      this.dispatchEvent(
-        new CustomEvent('dile-copy-markdown-url-error', {
-          detail: { message: this.error },
-          bubbles: true,
-          composed: true
-        })
-      );
+      this.dispatchError(this.error);
       return;
     }
 
@@ -84,16 +83,19 @@ export class DileCopyMarkdownUrl extends LitElement {
       this.content = await response.text();
     } catch (err) {
       this.error = err.message || 'Error fetching content';
-      
-      this.dispatchEvent(
-        new CustomEvent('dile-copy-markdown-url-error', {
-          detail: { message: this.error },
-          bubbles: true,
-          composed: true
-        })
-      );
+      this.dispatchError(this.error);
     } finally {
       this.loading = false;
     }
   }
+
+  dispatchError(message) {
+    this.dispatchEvent(
+      new CustomEvent('dile-copy-markdown-url-error', {
+        detail: { message },
+        bubbles: true,
+        composed: true
+      })
+    );
+  }
 }

package/components/radio-group/src/DileRadioGroup.js

@@ -1,6 +1,7 @@
 import { LitElement, html, css } from 'lit';
 import { DileEmmitChange } from '../../../mixins/form/index.js';
 import '../radio.js';
+import '../input/input-message.js';
 
 export class DileRadioGroup extends DileEmmitChange(LitElement) {
   static styles = [
@@ -31,6 +32,9 @@ export class DileRadioGroup extends DileEmmitChange(LitElement) {
       label: { type: String },
       value: { type: String },
       name: { type: String },
+      message: { type: String },
+      errored: { type: Boolean },
+      hideErrorOnInput: { type: Boolean },
       disabled: { 
         type: Boolean,
         reflect: true
@@ -43,6 +47,7 @@ export class DileRadioGroup extends DileEmmitChange(LitElement) {
     this.init = false;
     this.disabled = false;
     this.internals = this.attachInternals();
+    this.message = '';
   }
 
   updated(changedProperties) {
@@ -72,11 +77,19 @@ export class DileRadioGroup extends DileEmmitChange(LitElement) {
         }
         <slot></slot>
       </div>
+      ${this.message
+        ? html`<dile-input-message message="${this.message}" ?errored=${this.errored}></dile-input-message>`
+        : ''
+      }
     `;
   }
 
   changeValue(e) {
     if(!this.disabled) {
+      if(this.hideErrorOnInput && this.errored) {
+        this.message = '';
+        this.errored = false;
+      }
       this.value = e.detail.value;
     }
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dile/ui",
-  "version": "2.20.0",
+  "version": "2.21.0",
   "description": "UI Core components from dile-components.",
   "main": "index.js",
   "scripts": {
@@ -26,5 +26,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "cd0b6acfaed41004ccd714f0ad586bc66b303479"
+  "gitHead": "d5039b0bd0663c1d5e863cd1a0e65f6a183645ab"
 }

package/styles/colors.css

@@ -20,7 +20,7 @@
   --dile-link-color: #3399ff;
 
   /* Color variations */
-  --dile-primary-light-color: #fbfbe9;
+  --dile-primary-light-color: #fafadf;
   --dile-on-primary-light-color: #303030;
   --dile-primary-dark-color: #d7d353;
   --dile-on-primary-dark-color: #303030;