@nuraly/lumenui 0.1.0 → 0.2.1

package/dist/src/components/textarea/bundle.js

@@ -1,14 +1,14 @@
-import{css as t,LitElement as e,html as r}from"lit";import{query as a,property as i,state as o,customElement as s}from"lit/decorators.js";import{NuralyUIBaseMixin as n}from"@nuralyui/common/mixins";import{renderValidationIcon as l,renderClearButton as d}from"@nuralyui/common/utils";import{BaseComponentController as h,BaseValidationController as c}from"@nuralyui/common/controllers";const u=t`
+import{css as t,nothing as e,html as i,LitElement as s}from"lit";import{query as r,property as o,state as n,customElement as a}from"lit/decorators.js";import"lit/directives/if-defined.js";const l=t`
   :host {
     display: block;
     position: relative;
-    font-family: var(--nuraly-font-family-textarea, Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif);
+    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif;
   }
 
   .textarea-container {
     display: flex;
     flex-direction: column;
-    gap: var(--nuraly-spacing-textarea-gap, 8px);
+    gap: 8px;
     width: 100%;
   }
 
@@ -16,21 +16,21 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
     display: flex;
     align-items: center;
     gap: 4px;
-    font-size: var(--nuraly-font-size-textarea, 16px);
+    font-size: 16px;
     font-weight: 500;
-    color: var(--nuraly-color-textarea-label, #262626);
-    line-height: var(--nuraly-line-height-textarea, 1.5);
+    color: #262626;
+    line-height: 1.5;
   }
 
   .required-indicator {
-    color: var(--nuraly-color-textarea-error, #ef4444);
+    color: #ef4444;
     font-weight: 600;
   }
 
   .textarea-wrapper {
     display: flex;
     align-items: flex-start;
-    gap: var(--nuraly-spacing-textarea-gap, 8px);
+    gap: 8px;
     position: relative;
   }
 
@@ -38,7 +38,7 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
   .addon-after {
     display: flex;
     align-items: flex-start;
-    padding-top: var(--nuraly-padding-textarea, 12px);
+    padding-top: 12px;
   }
 
   .textarea-input-container {
@@ -51,89 +51,89 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
   .textarea-element {
     width: 100%;
     min-height: 80px;
-    padding: var(--nuraly-padding-textarea, 12px);
-    border-top: var(--nuraly-border-width-textarea, 1px) solid var(--nuraly-color-textarea-border, #d9d9d9);
-    border-left: var(--nuraly-border-width-textarea, 1px) solid var(--nuraly-color-textarea-border, #d9d9d9);
-    border-right: var(--nuraly-border-width-textarea, 1px) solid var(--nuraly-color-textarea-border, #d9d9d9);
-    border-bottom: var(--nuraly-border-width-textarea, 1px) solid var(--nuraly-color-textarea-border-bottom, var(--nuraly-color-textarea-border, #d9d9d9));
-    border-radius: var(--nuraly-border-radius-textarea, 6px);
-    background-color: var(--nuraly-color-textarea-background, #ffffff);
-    color: var(--nuraly-color-textarea-text, #262626);
-    font-family: var(--nuraly-font-family-textarea, Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif);
-    font-size: var(--nuraly-font-size-textarea, 16px);
-    line-height: var(--nuraly-line-height-textarea, 1.5);
+    padding: 12px;
+    border-top: 1px solid #d9d9d9;
+    border-left: 1px solid #d9d9d9;
+    border-right: 1px solid #d9d9d9;
+    border-bottom: 1px solid #d9d9d9;
+    border-radius: 6px;
+    background-color: #ffffff;
+    color: #262626;
+    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif;
+    font-size: 16px;
+    line-height: 1.5;
     outline: none;
     transition: border-color 0.2s ease-in-out;
     box-sizing: border-box;
   }
 
   .textarea-element::placeholder {
-    color: var(--nuraly-color-textarea-placeholder, #8c8c8c);
+    color: #8c8c8c;
   }
 
   .textarea-element:hover:not(:disabled):not(:focus) {
-    border-top-color: var(--nuraly-color-textarea-border-hover, #7c3aed);
-    border-left-color: var(--nuraly-color-textarea-border-hover, #7c3aed);
-    border-right-color: var(--nuraly-color-textarea-border-hover, #7c3aed);
-    border-bottom-color: var(--nuraly-color-textarea-border-hover, #7c3aed);
+    border-top-color: #7c3aed;
+    border-left-color: #7c3aed;
+    border-right-color: #7c3aed;
+    border-bottom-color: #7c3aed;
   }
 
   .textarea-element:focus {
-    border-top-color: var(--nuraly-color-textarea-border-focus, #7c3aed);
-    border-left-color: var(--nuraly-color-textarea-border-focus, #7c3aed);
-    border-right-color: var(--nuraly-color-textarea-border-focus, #7c3aed);
-    border-bottom-color: var(--nuraly-color-textarea-border-focus, #7c3aed);
-    box-shadow: 0 0 0 1px var(--nuraly-color-textarea-border-focus, #7c3aed);
+    border-top-color: #7c3aed;
+    border-left-color: #7c3aed;
+    border-right-color: #7c3aed;
+    border-bottom-color: #7c3aed;
+    box-shadow: 0 0 0 1px #7c3aed;
   }
 
   .textarea-element:disabled {
-    background-color: var(--nuraly-color-surface-disabled, #f5f5f5);
-    color: var(--nuraly-color-text-disabled, #8c8c8c);
-    border-color: var(--nuraly-color-border-disabled, #d9d9d9);
+    background-color: #f5f5f5;
+    color: #8c8c8c;
+    border-color: #d9d9d9;
     cursor: not-allowed;
     resize: none;
   }
 
   .textarea-element:disabled {
-    background-color: var(--nuraly-color-surface-disabled, #f5f5f5);
-    color: var(--nuraly-color-text-disabled, #8c8c8c);
-    border-color: var(--nuraly-color-border-disabled, #d9d9d9);
+    background-color: #f5f5f5;
+    color: #8c8c8c;
+    border-color: #d9d9d9;
     cursor: not-allowed;
     resize: none;
   }
 
   .textarea-element:read-only {
-    background-color: var(--nuraly-color-surface-readonly, #f9f9f9);
+    background-color: #f9f9f9;
     cursor: default;
   }
 
   /* Size variants */
   .size-small .textarea-element {
-    font-size: var(--nuraly-font-size-textarea-small, 14px);
-    padding: calc(var(--nuraly-padding-textarea, 12px) * 0.75);
+    font-size: 14px;
+    padding: calc(12px * 0.75);
     min-height: 60px;
   }
 
   .size-large .textarea-element {
-    font-size: var(--nuraly-font-size-textarea-large, 18px);
-    padding: calc(var(--nuraly-padding-textarea, 12px) * 1.25);
+    font-size: 18px;
+    padding: calc(12px * 1.25);
     min-height: 100px;
   }
 
   /* Variant styles */
   .variant-outlined .textarea-element {
-    border: var(--nuraly-border-width-textarea, 1px) solid var(--nuraly-color-textarea-border, #d9d9d9);
-    background-color: var(--nuraly-color-textarea-background, #ffffff);
+    border: 1px solid #d9d9d9;
+    background-color: #ffffff;
   }
 
   .variant-filled .textarea-element {
-    border: var(--nuraly-border-width-textarea, 1px) solid transparent;
-    background-color: var(--nuraly-color-surface-secondary, #f5f5f5);
+    border: 1px solid transparent;
+    background-color: #f5f5f5;
   }
 
   .variant-filled .textarea-element:focus {
-    background-color: var(--nuraly-color-textarea-background, #ffffff);
-    border-color: var(--nuraly-color-textarea-border-focus, #7c3aed);
+    background-color: #ffffff;
+    border-color: #7c3aed;
   }
 
   .variant-borderless .textarea-element {
@@ -145,7 +145,7 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
 
   .variant-underlined .textarea-element {
     border: none;
-    border-bottom: var(--nuraly-border-width-textarea, 1px) solid var(--nuraly-color-textarea-border, #d9d9d9);
+    border-bottom: 1px solid #d9d9d9;
     border-radius: 0;
     background-color: transparent;
     padding-left: 0;
@@ -153,57 +153,57 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
   }
 
   .variant-underlined .textarea-element:focus {
-    border-bottom-color: var(--nuraly-color-textarea-border-focus, #7c3aed);
+    border-bottom-color: #7c3aed;
     box-shadow: none;
   }
 
   /* State styles */
   .state-error .textarea-element,
   .validation-error .textarea-element {
-    border-color: var(--nuraly-color-textarea-error, #ef4444);
+    border-color: #ef4444;
   }
 
   .state-error .textarea-element:focus,
   .validation-error .textarea-element:focus {
-    border-color: var(--nuraly-color-textarea-error, #ef4444);
-    box-shadow: 0 0 0 1px var(--nuraly-color-textarea-error, #ef4444);
+    border-color: #ef4444;
+    box-shadow: 0 0 0 1px #ef4444;
   }
 
   .state-warning .textarea-element,
   .validation-warning .textarea-element {
-    border-color: var(--nuraly-color-textarea-warning, #f59e0b);
+    border-color: #f59e0b;
   }
 
   .state-warning .textarea-element:focus,
   .validation-warning .textarea-element:focus {
-    border-color: var(--nuraly-color-textarea-warning, #f59e0b);
-    box-shadow: 0 0 0 1px var(--nuraly-color-textarea-warning, #f59e0b);
+    border-color: #f59e0b;
+    box-shadow: 0 0 0 1px #f59e0b;
   }
 
   /* Icons */
   .validation-icon,
   .clear-button {
     position: absolute;
-    top: var(--nuraly-padding-textarea, 12px);
-    right: var(--nuraly-padding-textarea, 12px);
+    top: 12px;
+    right: 12px;
     z-index: 1;
   }
 
   .validation-icon {
-    color: var(--nuraly-color-textarea-icon, #8c8c8c);
+    color: #8c8c8c;
     pointer-events: none;
   }
 
   .validation-icon.error {
-    color: var(--nuraly-color-textarea-error, #ef4444);
+    color: #ef4444;
   }
 
   .validation-icon.warning {
-    color: var(--nuraly-color-textarea-warning, #f59e0b);
+    color: #f59e0b;
   }
 
   .validation-icon.success {
-    color: var(--nuraly-color-textarea-success, #10b981);
+    color: #10b981;
   }
 
   .clear-button {
@@ -213,25 +213,25 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
     background: none;
     border: none;
     cursor: pointer;
-    color: var(--nuraly-color-textarea-icon, #8c8c8c);
+    color: #8c8c8c;
     padding: 2px;
     border-radius: 4px;
     transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
   }
 
   .clear-button:hover {
-    color: var(--nuraly-color-textarea-icon-hover, #7c3aed);
-    background-color: var(--nuraly-color-surface-hover, rgba(0, 0, 0, 0.05));
+    color: #7c3aed;
+    background-color: rgba(0, 0, 0, 0.05);
   }
 
   .clear-button:active {
-    color: var(--nuraly-color-textarea-icon-active, #6d28d9);
+    color: #6d28d9;
   }
 
   /* Adjust textarea padding when icons are present */
   :host([allow-clear]) .textarea-element,
   :host([has-feedback]) .textarea-element {
-    padding-right: calc(var(--nuraly-padding-textarea, 12px) + 16px + 8px);
+    padding-right: calc(12px + 16px + 8px);
   }
 
   /* Footer */
@@ -239,15 +239,15 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
     display: flex;
     justify-content: space-between;
     align-items: flex-start;
-    gap: var(--nuraly-spacing-textarea-gap, 8px);
+    gap: 8px;
     min-height: 20px;
   }
 
   .helper-text {
     flex: 1;
-    font-size: var(--nuraly-font-size-textarea-small, 14px);
+    font-size: 14px;
     line-height: 1.4;
-    color: var(--nuraly-color-textarea-helper-text, #666666);
+    color: #666666;
   }
 
   .validation-message {
@@ -259,26 +259,26 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
   }
 
   .validation-message.error {
-    color: var(--nuraly-color-textarea-error, #ef4444);
+    color: #ef4444;
   }
 
   .validation-message.warning {
-    color: var(--nuraly-color-textarea-warning, #f59e0b);
+    color: #f59e0b;
   }
 
   .validation-message.success {
-    color: var(--nuraly-color-textarea-success, #10b981);
+    color: #10b981;
   }
 
   .character-count {
-    font-size: var(--nuraly-font-size-textarea-small, 14px);
-    color: var(--nuraly-color-textarea-counter, #666666);
+    font-size: 14px;
+    color: #666666;
     white-space: nowrap;
     line-height: 1.4;
   }
 
   .character-count.over-limit {
-    color: var(--nuraly-color-textarea-counter-over, #ef4444);
+    color: #ef4444;
     font-weight: 500;
   }
 
@@ -288,7 +288,7 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
       flex-direction: column;
       align-items: stretch;
     }
-    
+
     .character-count {
       text-align: right;
     }
@@ -296,7 +296,7 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
 
   /* Focus-visible for accessibility */
   .textarea-element:focus-visible {
-    outline: 2px solid var(--nuraly-color-textarea-border-focus, #7c3aed);
+    outline: 2px solid #7c3aed;
     outline-offset: 2px;
   }
 
@@ -305,9 +305,9 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
     .textarea-element {
       border-width: 2px;
     }
-    
+
     .textarea-element:focus {
-      box-shadow: 0 0 0 2px var(--nuraly-color-textarea-border-focus, #7c3aed);
+      box-shadow: 0 0 0 2px #7c3aed;
     }
   }
 
@@ -324,35 +324,57 @@ import{css as t,LitElement as e,html as r}from"lit";import{query as a,property a
    * ======================================== */
 
   /* No theme-specific overrides - themes handle styling through CSS variables */
-`,v=3,p=50;
+`,h=3,d=50,c=t=>class extends t{constructor(){super(...arguments),this.handleSystemThemeChange=()=>{this.closest("[data-theme]")||document.documentElement.hasAttribute("data-theme")||this.requestUpdate()}}connectedCallback(){super.connectedCallback(),this.setupThemeObserver(),this.setupDesignSystemObserver(),this.setupSystemThemeListener()}disconnectedCallback(){var t,e,i;super.disconnectedCallback(),null===(t=this.themeObserver)||void 0===t||t.disconnect(),null===(e=this.designSystemObserver)||void 0===e||e.disconnect(),null===(i=this.mediaQuery)||void 0===i||i.removeEventListener("change",this.handleSystemThemeChange)}get currentTheme(){var t,e;const i=(null===(t=this.closest("[data-theme]"))||void 0===t?void 0:t.getAttribute("data-theme"))||document.documentElement.getAttribute("data-theme");return i||((null===(e=window.matchMedia)||void 0===e?void 0:e.call(window,"(prefers-color-scheme: dark)").matches)?"dark":"light")}get currentDesignSystem(){var t;const e=(null===(t=this.closest("[design-system]"))||void 0===t?void 0:t.getAttribute("design-system"))||document.documentElement.getAttribute("design-system");return"carbon"===e?e:"default"}setupThemeObserver(){this.themeObserver=new MutationObserver(()=>{this.requestUpdate()}),this.themeObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["data-theme"]})}setupDesignSystemObserver(){this.designSystemObserver=new MutationObserver(()=>{this.requestUpdate()}),this.designSystemObserver.observe(document.documentElement,{attributes:!0,attributeFilter:["design-system"]})}setupSystemThemeListener(){window.matchMedia&&(this.mediaQuery=window.matchMedia("(prefers-color-scheme: dark)"),this.mediaQuery.addEventListener("change",this.handleSystemThemeChange))}},u=()=>{var t;return void 0!==globalThis.litElementVersions||"undefined"!=typeof process&&"development"===(null===(t=process.env)||void 0===t?void 0:t.NODE_ENV)||"undefined"!=typeof window&&("localhost"===window.location.hostname||"127.0.0.1"===window.location.hostname)},v=t=>class extends t{constructor(){super(...arguments),this.requiredComponents=[]}validateDependencies(){if(u())for(const t of this.requiredComponents)if(!this.isComponentAvailable(t))throw new Error(`Required component "${t}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}. Example: import '@nuralyui/${t}';`)}validateDependenciesWithHandler(t){if(!u())return!0;let e=!0;for(const i of this.requiredComponents)if(!this.isComponentAvailable(i)){e=!1;const s=new Error(`Required component "${i}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}.`);t?t(i,s):console.error(s.message)}return e}isComponentAvailable(t){return!!customElements.get(t)}getMissingDependencies(){return this.requiredComponents.filter(t=>!this.isComponentAvailable(t))}areDependenciesAvailable(){return this.requiredComponents.every(t=>this.isComponentAvailable(t))}addRequiredComponent(t){this.requiredComponents.includes(t)||this.requiredComponents.push(t)}removeRequiredComponent(t){const e=this.requiredComponents.indexOf(t);e>-1&&this.requiredComponents.splice(e,1)}},p=t=>class extends t{dispatchCustomEvent(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}dispatchEventWithMetadata(t,e){var i;const s=Object.assign(Object.assign({},e),{timestamp:Date.now(),componentName:(null===(i=this.tagName)||void 0===i?void 0:i.toLowerCase())||"unknown"});this.dispatchCustomEvent(t,s)}dispatchInputEvent(t,e){const i=Object.assign({target:e.target||this,value:e.value,originalEvent:e.originalEvent},e);this.dispatchCustomEvent(t,i)}dispatchFocusEvent(t,e){const i=Object.assign({target:e.target||this,value:e.value,focused:e.focused,cursorPosition:e.cursorPosition,selectedText:e.selectedText},e);this.dispatchCustomEvent(t,i)}dispatchValidationEvent(t,e){var i;const s=Object.assign({target:e.target||this,value:e.value,isValid:null!==(i=e.isValid)&&void 0!==i&&i,error:e.error},e);this.dispatchCustomEvent(t,s)}dispatchActionEvent(t,e){const i=Object.assign({target:e.target||this,action:e.action,previousValue:e.previousValue,newValue:e.newValue},e);this.dispatchCustomEvent(t,i)}isReadonlyKeyAllowed(t){if(t.ctrlKey||t.metaKey){return["KeyA","KeyC"].includes(t.code)}return["Tab","Escape","ArrowLeft","ArrowRight","ArrowUp","ArrowDown","Home","End","PageUp","PageDown"].includes(t.key)}isActivationKey(t){return"Enter"===t.key||" "===t.key}},b=new Set,m=new Map;
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
+const f=t=>{class e extends t{constructor(){super(...arguments),this.t=null}createRenderRoot(){return this.constructor.useShadowDom?super.createRenderRoot():this}connectedCallback(){const t=this.constructor.useShadowDom;if(!t&&null===this.t)for(this.t=[];this.firstChild;)this.t.push(this.removeChild(this.firstChild));if(super.connectedCallback(),!t){const t=this.constructor,e=this.tagName.toLowerCase(),i=t.styles;if(i){const t=g(i);t&&function(t,e,i){var s;if(!m.has(t)){const i=new CSSStyleSheet;i.replaceSync(e),m.set(t,i)}const r=m.get(t),o=`doc:${t}`;if(b.has(o)||(document.adoptedStyleSheets=[...document.adoptedStyleSheets,r],b.add(o)),i){let e=i;for(;e;){const i=e.getRootNode();if(!(i instanceof ShadowRoot))break;{const o=`shadow:${((null===(s=i.host)||void 0===s?void 0:s.tagName)||"").toLowerCase()}:${t}`;b.has(o)||(i.adoptedStyleSheets=[...i.adoptedStyleSheets,r],b.add(o)),e=i.host}}}}(e,t,this)}}}get lightChildren(){return this.t?this.t.filter(t=>!(t instanceof Element&&t.hasAttribute("slot"))):[]}lightChildrenNamed(t){return this.t?this.t.filter(e=>e instanceof Element&&e.getAttribute("slot")===t):[]}}return e.useShadowDom=!1,e};function g(t){return Array.isArray(t)?t.map(t=>g(t)).filter(Boolean).join("\n"):t&&"string"==typeof t.cssText?t.cssText:"string"==typeof t?t:""}
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */
 /**
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
  * SPDX-License-Identifier: MIT
  */
-class x extends h{requestHostUpdate(){this.requestUpdate()}}
+class x{constructor(t){this._host=t,t.addController(this)}get host(){return this._host}hostConnected(){}hostDisconnected(){}hostUpdate(){}hostUpdated(){}requestUpdate(){try{this._host.requestUpdate()}catch(t){this.handleError(t,"requestUpdate")}}dispatchEvent(t){try{return this._host.dispatchEvent(t)}catch(t){return this.handleError(t,"dispatchEvent"),!1}}handleError(t,e){console.error(`[${this.constructor.name}] Error in ${e}:`,t);try{this._host.dispatchEvent(new CustomEvent("nr-controller-error",{detail:{error:t.message,context:e,controller:this.constructor.name},bubbles:!0,composed:!0}))}catch(t){}}safeExecute(t,e,i){try{return t()}catch(t){return this.handleError(t,e),i}}debounce(t,e){let i;const s=(...s)=>{void 0!==i&&clearTimeout(i),i=setTimeout(()=>{i=void 0,t.apply(this,s)},e)};return s.cancel=()=>{void 0!==i&&(clearTimeout(i),i=void 0)},s}}
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */class w extends x{constructor(){super(...arguments),this._isValid=!0,this._validationMessage="",this._validationState="pristine",this._rules=[]}get isValid(){return this._isValid}get validationMessage(){return this._validationMessage}get validationState(){return this._validationState}addRule(t){this._rules.push(t),this.requestUpdate()}removeRule(t){this._rules=this._rules.filter(e=>!t(e)),this.requestUpdate()}clearRules(){this._rules=[],this.clearValidation()}clearValidation(){this._isValid=!0,this._validationMessage="",this._validationState="pristine",this.requestUpdate(),this.dispatchValidationEvent()}checkValidity(){return this.validate()}reportValidity(){const t=this.checkValidity();return t||this.dispatchValidationEvent(),t}dispatchValidationEvent(){this.dispatchEvent(new CustomEvent("nr-validation",{detail:{isValid:this._isValid,validationMessage:this._validationMessage,validationState:this._validationState},bubbles:!0,composed:!0}))}}
+/**
+ * @license
+ * Copyright 2023 Nuraly, Laabidi Aymen
+ * SPDX-License-Identifier: MIT
+ */class y extends x{requestHostUpdate(){this.requestUpdate()}}
 /**
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
  * SPDX-License-Identifier: MIT
- */var b=function(t,e,r,a){return new(r||(r=Promise))(function(i,o){function s(t){try{l(a.next(t))}catch(t){o(t)}}function n(t){try{l(a.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof r?e:new r(function(t){t(e)})).then(s,n)}l((a=a.apply(t,e||[])).next())})};class f extends c{constructor(){super(...arguments),this._validationDebounceMs=300}get validationHost(){return this._host}get validationResult(){return this._validationResult}setValidationDebounce(t){this._validationDebounceMs=t}validate(){return b(this,void 0,void 0,function*(){return(yield this.validateTextarea()).isValid})}validateTextarea(t){return b(this,void 0,void 0,function*(){const e=null!=t?t:this.validationHost.value,r=this.validationHost.rules||[];if(0===r.length)return this._validationResult=void 0,{isValid:!0,messages:[],level:"success",blocking:!1};const a=[];let i=!1,o=!1,s=!1;for(const t of r)try{(yield t.validator(e))||(a.push(t.message),"error"!==t.level&&t.level?"warning"===t.level&&(o=!0):(i=!0,!1!==t.blocking&&(s=!0)))}catch(t){this.handleError(t,"validation"),a.push(`Validation error: ${t}`),i=!0,s=!0}const n=i?"error":o?"warning":"success";return this._validationResult={isValid:!i&&!o,messages:a,level:n,blocking:s},this._isValid=this._validationResult.isValid,this._validationMessage=a.join(", "),this._validationState="success"===n?"valid":n,this.updateHostValidationState(),this.dispatchTextareaValidationEvent(),this._validationResult})}validateDebounced(t){return new Promise(e=>{this._validationTimeout&&clearTimeout(this._validationTimeout),this._validationTimeout=setTimeout(()=>b(this,void 0,void 0,function*(){const r=yield this.validateTextarea(t);e(r)}),this._validationDebounceMs)})}validateOnChangeIfEnabled(t){return b(this,void 0,void 0,function*(){if(this.validationHost.validateOnChange&&(this.validationHost.rules||[]).length>0)return yield this.validateDebounced(t)})}validateOnBlurIfEnabled(t){return b(this,void 0,void 0,function*(){if(this.validationHost.validateOnBlur&&(this.validationHost.rules||[]).length>0)return yield this.validateTextarea(t)})}clearValidation(){this._validationResult=void 0,this._isValid=!0,this._validationMessage="",this._validationState="pristine",this._validationTimeout&&(clearTimeout(this._validationTimeout),this._validationTimeout=void 0),"default"!==this.validationHost.state&&(this.validationHost.state="default",this.requestUpdate()),this.dispatchTextareaValidationEvent()}isCurrentlyValid(){var t,e;return null===(e=null===(t=this._validationResult)||void 0===t?void 0:t.isValid)||void 0===e||e}isBlocking(){var t,e;return null!==(e=null===(t=this._validationResult)||void 0===t?void 0:t.blocking)&&void 0!==e&&e}getValidationMessages(){var t,e;return null!==(e=null===(t=this._validationResult)||void 0===t?void 0:t.messages)&&void 0!==e?e:[]}addRule(t){const e=this.validationHost.rules||[];e.push(t),this.validationHost.rules=e,this.requestUpdate()}removeRule(t){const e=this.validationHost.rules||[];this.validationHost.rules=e.filter(e=>!t(e)),this.requestUpdate()}clearRules(){this.validationHost.rules=[],this.clearValidation()}static createRequiredRule(t="This field is required"){return{validator:t=>t.trim().length>0,message:t,level:"error",blocking:!0}}static createMinLengthRule(t,e){return{validator:e=>e.length>=t,message:e||`Minimum ${t} characters required`,level:"error",blocking:!0}}static createMaxLengthRule(t,e){return{validator:e=>e.length<=t,message:e||`Maximum ${t} characters allowed`,level:"error",blocking:!0}}static createPatternRule(t,e){return{validator:e=>t.test(e),message:e,level:"error",blocking:!0}}updateHostValidationState(){if(!this._validationResult)return;const{level:t}=this._validationResult;"error"===t?this.validationHost.state="error":"warning"===t?this.validationHost.state="warning":this.validationHost.rules.length>0&&(this.validationHost.state="success"),this.requestUpdate()}dispatchTextareaValidationEvent(){var t,e,r,a,i,o,s,n;const l={isValid:null===(e=null===(t=this._validationResult)||void 0===t?void 0:t.isValid)||void 0===e||e,validationMessage:null!==(a=null===(r=this._validationResult)||void 0===r?void 0:r.messages.join(", "))&&void 0!==a?a:"",errors:null!==(o=null===(i=this._validationResult)||void 0===i?void 0:i.messages.filter(()=>{var t;return"error"===(null===(t=this._validationResult)||void 0===t?void 0:t.level)}))&&void 0!==o?o:[],warnings:null!==(n=null===(s=this._validationResult)||void 0===s?void 0:s.messages.filter(()=>{var t;return"warning"===(null===(t=this._validationResult)||void 0===t?void 0:t.level)}))&&void 0!==n?n:[],validationResult:this._validationResult||{isValid:!0,messages:[],level:"success",blocking:!1}};this.safeExecute(()=>this.dispatchEvent(new CustomEvent("nr-validation",{detail:l,bubbles:!0,composed:!0})),"dispatchValidationEvent")}hostDisconnected(){this._validationTimeout&&(clearTimeout(this._validationTimeout),this._validationTimeout=void 0)}}
+ */var E=function(t,e,i,s){return new(i||(i=Promise))(function(r,o){function n(t){try{l(s.next(t))}catch(t){o(t)}}function a(t){try{l(s.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i(function(t){t(e)})).then(n,a)}l((s=s.apply(t,e||[])).next())})};class C extends w{constructor(){super(...arguments),this._validationDebounceMs=300}get validationHost(){return this._host}get validationResult(){return this._validationResult}setValidationDebounce(t){this._validationDebounceMs=t}validate(){return E(this,void 0,void 0,function*(){return(yield this.validateTextarea()).isValid})}validateTextarea(t){return E(this,void 0,void 0,function*(){const e=null!=t?t:this.validationHost.value,i=this.validationHost.rules||[];if(0===i.length)return this._validationResult=void 0,{isValid:!0,messages:[],level:"success",blocking:!1};const s=[];let r=!1,o=!1,n=!1;for(const t of i)try{(yield t.validator(e))||(s.push(t.message),"error"!==t.level&&t.level?"warning"===t.level&&(o=!0):(r=!0,!1!==t.blocking&&(n=!0)))}catch(t){this.handleError(t,"validation"),s.push(`Validation error: ${t}`),r=!0,n=!0}const a=r?"error":o?"warning":"success";return this._validationResult={isValid:!r&&!o,messages:s,level:a,blocking:n},this._isValid=this._validationResult.isValid,this._validationMessage=s.join(", "),this._validationState="success"===a?"valid":a,this.updateHostValidationState(),this.dispatchTextareaValidationEvent(),this._validationResult})}validateDebounced(t){return new Promise(e=>{this._validationTimeout&&clearTimeout(this._validationTimeout),this._validationTimeout=setTimeout(()=>E(this,void 0,void 0,function*(){const i=yield this.validateTextarea(t);e(i)}),this._validationDebounceMs)})}validateOnChangeIfEnabled(t){return E(this,void 0,void 0,function*(){if(this.validationHost.validateOnChange&&(this.validationHost.rules||[]).length>0)return yield this.validateDebounced(t)})}validateOnBlurIfEnabled(t){return E(this,void 0,void 0,function*(){if(this.validationHost.validateOnBlur&&(this.validationHost.rules||[]).length>0)return yield this.validateTextarea(t)})}clearValidation(){this._validationResult=void 0,this._isValid=!0,this._validationMessage="",this._validationState="pristine",this._validationTimeout&&(clearTimeout(this._validationTimeout),this._validationTimeout=void 0),"default"!==this.validationHost.state&&(this.validationHost.state="default",this.requestUpdate()),this.dispatchTextareaValidationEvent()}isCurrentlyValid(){var t,e;return null===(e=null===(t=this._validationResult)||void 0===t?void 0:t.isValid)||void 0===e||e}isBlocking(){var t,e;return null!==(e=null===(t=this._validationResult)||void 0===t?void 0:t.blocking)&&void 0!==e&&e}getValidationMessages(){var t,e;return null!==(e=null===(t=this._validationResult)||void 0===t?void 0:t.messages)&&void 0!==e?e:[]}addRule(t){const e=this.validationHost.rules||[];e.push(t),this.validationHost.rules=e,this.requestUpdate()}removeRule(t){const e=this.validationHost.rules||[];this.validationHost.rules=e.filter(e=>!t(e)),this.requestUpdate()}clearRules(){this.validationHost.rules=[],this.clearValidation()}static createRequiredRule(t="This field is required"){return{validator:t=>t.trim().length>0,message:t,level:"error",blocking:!0}}static createMinLengthRule(t,e){return{validator:e=>e.length>=t,message:e||`Minimum ${t} characters required`,level:"error",blocking:!0}}static createMaxLengthRule(t,e){return{validator:e=>e.length<=t,message:e||`Maximum ${t} characters allowed`,level:"error",blocking:!0}}static createPatternRule(t,e){return{validator:e=>t.test(e),message:e,level:"error",blocking:!0}}updateHostValidationState(){if(!this._validationResult)return;const{level:t}=this._validationResult;"error"===t?this.validationHost.state="error":"warning"===t?this.validationHost.state="warning":this.validationHost.rules.length>0&&(this.validationHost.state="success"),this.requestUpdate()}dispatchTextareaValidationEvent(){var t,e,i,s,r,o,n,a;const l={isValid:null===(e=null===(t=this._validationResult)||void 0===t?void 0:t.isValid)||void 0===e||e,validationMessage:null!==(s=null===(i=this._validationResult)||void 0===i?void 0:i.messages.join(", "))&&void 0!==s?s:"",errors:null!==(o=null===(r=this._validationResult)||void 0===r?void 0:r.messages.filter(()=>{var t;return"error"===(null===(t=this._validationResult)||void 0===t?void 0:t.level)}))&&void 0!==o?o:[],warnings:null!==(a=null===(n=this._validationResult)||void 0===n?void 0:n.messages.filter(()=>{var t;return"warning"===(null===(t=this._validationResult)||void 0===t?void 0:t.level)}))&&void 0!==a?a:[],validationResult:this._validationResult||{isValid:!0,messages:[],level:"success",blocking:!1}};this.safeExecute(()=>this.dispatchEvent(new CustomEvent("nr-validation",{detail:l,bubbles:!0,composed:!0})),"dispatchValidationEvent")}hostDisconnected(){this._validationTimeout&&(clearTimeout(this._validationTimeout),this._validationTimeout=void 0)}}
 /**
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
  * SPDX-License-Identifier: MIT
- */class m extends x{constructor(t){super(t),this._hasFocus=!1,this._inputDebounceMs=150}get eventHost(){return this._host}get hasFocus(){return this._hasFocus}setInputDebounce(t){this._inputDebounceMs=t}hostConnected(){super.hostConnected(),this.setupEventListeners()}hostDisconnected(){super.hostDisconnected(),this.cleanupEventListeners()}setupEventListeners(){this.safeExecute(()=>{var t,e;const r=this._host;this._textareaElement=null===(t=r.shadowRoot)||void 0===t?void 0:t.querySelector("textarea"),this._clearButtonElement=null===(e=r.shadowRoot)||void 0===e?void 0:e.querySelector(".clear-button"),this._textareaElement&&this.addTextareaEventListeners(),this._clearButtonElement&&this.eventHost.clearable&&this.addClearButtonEventListeners()},"setupEventListeners")}cleanupEventListeners(){this._inputTimeout&&(clearTimeout(this._inputTimeout),this._inputTimeout=void 0)}handleInput(t){if(this.eventHost.readonly||this.eventHost.disabled)return;const e=t.target,r=e.value;this._inputTimeout&&clearTimeout(this._inputTimeout),this.eventHost.value=r,this.eventHost.autoResize&&this.handleAutoResize(e),this._inputTimeout=setTimeout(()=>{this.dispatchInputEvent(r,t)},this._inputDebounceMs),this.requestHostUpdate()}handleFocus(t){this.eventHost.disabled||(this._hasFocus=!0,this.requestHostUpdate(),this.dispatchFocusEvent(t))}handleBlur(t){this._hasFocus=!1,this.requestHostUpdate(),this.dispatchBlurEvent(t)}handleKeyDown(t){if(this.eventHost.readonly||this.eventHost.disabled)return;const{key:e,ctrlKey:r,metaKey:a}=t;"Escape"!==e?"Enter"!==e||!r&&!a?this.dispatchKeydownEvent(t):this.handleSubmit(t):this.handleEscape(t)}handleKeyUp(t){this.dispatchKeyupEvent(t)}handlePaste(t){this.eventHost.readonly||this.eventHost.disabled?t.preventDefault():this.dispatchPasteEvent(t)}handleClear(t){if(this.eventHost.readonly||this.eventHost.disabled)return;const e=this.eventHost.value;this.eventHost.value="",this._textareaElement&&this._textareaElement.focus(),this.requestHostUpdate(),this.dispatchClearEvent(e,t)}handleAutoResize(t){if(!this.eventHost.autoResize)return;const e=t||this._textareaElement;e&&this.safeExecute(()=>{e.style.height="auto",e.style.height=`${e.scrollHeight}px`},"handleAutoResize")}focus(){this.safeExecute(()=>{var t;null===(t=this._textareaElement)||void 0===t||t.focus()},"focus")}blur(){this.safeExecute(()=>{var t;null===(t=this._textareaElement)||void 0===t||t.blur()},"blur")}selectAll(){this.safeExecute(()=>{var t;null===(t=this._textareaElement)||void 0===t||t.select()},"selectAll")}setCursorPosition(t){this.safeExecute(()=>{this._textareaElement&&this._textareaElement.setSelectionRange(t,t)},"setCursorPosition")}getCursorPosition(){var t,e;return null!==(e=null===(t=this._textareaElement)||void 0===t?void 0:t.selectionStart)&&void 0!==e?e:0}addTextareaEventListeners(){if(!this._textareaElement)return;const t=this._textareaElement;t.addEventListener("input",this.handleInput.bind(this)),t.addEventListener("focus",this.handleFocus.bind(this)),t.addEventListener("blur",this.handleBlur.bind(this)),t.addEventListener("keydown",this.handleKeyDown.bind(this)),t.addEventListener("keyup",this.handleKeyUp.bind(this)),t.addEventListener("paste",this.handlePaste.bind(this))}addClearButtonEventListeners(){this._clearButtonElement&&this._clearButtonElement.addEventListener("click",this.handleClear.bind(this))}handleEscape(t){this.blur(),this.dispatchEscapeEvent(t)}handleSubmit(t){this.dispatchSubmitEvent(t)}dispatchInputEvent(t,e){const r=new CustomEvent("textarea-input",{detail:{value:t,originalEvent:e,cursorPosition:this.getCursorPosition()},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(r),"dispatchInputEvent")}dispatchFocusEvent(t){const e=new CustomEvent("textarea-focus",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchFocusEvent")}dispatchBlurEvent(t){const e=new CustomEvent("textarea-blur",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchBlurEvent")}dispatchKeydownEvent(t){const e=new CustomEvent("textarea-keydown",{detail:{originalEvent:t,key:t.key,ctrlKey:t.ctrlKey,metaKey:t.metaKey,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchKeydownEvent")}dispatchKeyupEvent(t){const e=new CustomEvent("textarea-keyup",{detail:{originalEvent:t,key:t.key,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchKeyupEvent")}dispatchPasteEvent(t){const e=new CustomEvent("textarea-paste",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchPasteEvent")}dispatchClearEvent(t,e){const r=new CustomEvent("textarea-clear",{detail:{previousValue:t,originalEvent:e,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(r),"dispatchClearEvent")}dispatchEscapeEvent(t){const e=new CustomEvent("textarea-escape",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchEscapeEvent")}dispatchSubmitEvent(t){const e=new CustomEvent("textarea-submit",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchSubmitEvent")}}
+ */class $ extends y{constructor(t){super(t),this._hasFocus=!1,this._inputDebounceMs=150}get eventHost(){return this._host}get hasFocus(){return this._hasFocus}setInputDebounce(t){this._inputDebounceMs=t}hostConnected(){super.hostConnected(),this.setupEventListeners()}hostDisconnected(){super.hostDisconnected(),this.cleanupEventListeners()}setupEventListeners(){this.safeExecute(()=>{var t,e;const i=this._host;this._textareaElement=null===(t=i.shadowRoot)||void 0===t?void 0:t.querySelector("textarea"),this._clearButtonElement=null===(e=i.shadowRoot)||void 0===e?void 0:e.querySelector(".clear-button"),this._textareaElement&&this.addTextareaEventListeners(),this._clearButtonElement&&this.eventHost.clearable&&this.addClearButtonEventListeners()},"setupEventListeners")}cleanupEventListeners(){this._inputTimeout&&(clearTimeout(this._inputTimeout),this._inputTimeout=void 0)}handleInput(t){if(this.eventHost.readonly||this.eventHost.disabled)return;const e=t.target,i=e.value;this._inputTimeout&&clearTimeout(this._inputTimeout),this.eventHost.value=i,this.eventHost.autoResize&&this.handleAutoResize(e),this._inputTimeout=setTimeout(()=>{this.dispatchInputEvent(i,t)},this._inputDebounceMs),this.requestHostUpdate()}handleFocus(t){this.eventHost.disabled||(this._hasFocus=!0,this.requestHostUpdate(),this.dispatchFocusEvent(t))}handleBlur(t){this._hasFocus=!1,this.requestHostUpdate(),this.dispatchBlurEvent(t)}handleKeyDown(t){if(this.eventHost.readonly||this.eventHost.disabled)return;const{key:e,ctrlKey:i,metaKey:s}=t;"Escape"!==e?"Enter"!==e||!i&&!s?this.dispatchKeydownEvent(t):this.handleSubmit(t):this.handleEscape(t)}handleKeyUp(t){this.dispatchKeyupEvent(t)}handlePaste(t){this.eventHost.readonly||this.eventHost.disabled?t.preventDefault():this.dispatchPasteEvent(t)}handleClear(t){if(this.eventHost.readonly||this.eventHost.disabled)return;const e=this.eventHost.value;this.eventHost.value="",this._textareaElement&&this._textareaElement.focus(),this.requestHostUpdate(),this.dispatchClearEvent(e,t)}handleAutoResize(t){if(!this.eventHost.autoResize)return;const e=t||this._textareaElement;e&&this.safeExecute(()=>{e.style.height="auto",e.style.height=`${e.scrollHeight}px`},"handleAutoResize")}focus(){this.safeExecute(()=>{var t;null===(t=this._textareaElement)||void 0===t||t.focus()},"focus")}blur(){this.safeExecute(()=>{var t;null===(t=this._textareaElement)||void 0===t||t.blur()},"blur")}selectAll(){this.safeExecute(()=>{var t;null===(t=this._textareaElement)||void 0===t||t.select()},"selectAll")}setCursorPosition(t){this.safeExecute(()=>{this._textareaElement&&this._textareaElement.setSelectionRange(t,t)},"setCursorPosition")}getCursorPosition(){var t,e;return null!==(e=null===(t=this._textareaElement)||void 0===t?void 0:t.selectionStart)&&void 0!==e?e:0}addTextareaEventListeners(){if(!this._textareaElement)return;const t=this._textareaElement;t.addEventListener("input",this.handleInput.bind(this)),t.addEventListener("focus",this.handleFocus.bind(this)),t.addEventListener("blur",this.handleBlur.bind(this)),t.addEventListener("keydown",this.handleKeyDown.bind(this)),t.addEventListener("keyup",this.handleKeyUp.bind(this)),t.addEventListener("paste",this.handlePaste.bind(this))}addClearButtonEventListeners(){this._clearButtonElement&&this._clearButtonElement.addEventListener("click",this.handleClear.bind(this))}handleEscape(t){this.blur(),this.dispatchEscapeEvent(t)}handleSubmit(t){this.dispatchSubmitEvent(t)}dispatchInputEvent(t,e){const i=new CustomEvent("textarea-input",{detail:{value:t,originalEvent:e,cursorPosition:this.getCursorPosition()},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(i),"dispatchInputEvent")}dispatchFocusEvent(t){const e=new CustomEvent("textarea-focus",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchFocusEvent")}dispatchBlurEvent(t){const e=new CustomEvent("textarea-blur",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchBlurEvent")}dispatchKeydownEvent(t){const e=new CustomEvent("textarea-keydown",{detail:{originalEvent:t,key:t.key,ctrlKey:t.ctrlKey,metaKey:t.metaKey,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchKeydownEvent")}dispatchKeyupEvent(t){const e=new CustomEvent("textarea-keyup",{detail:{originalEvent:t,key:t.key,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchKeyupEvent")}dispatchPasteEvent(t){const e=new CustomEvent("textarea-paste",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchPasteEvent")}dispatchClearEvent(t,e){const i=new CustomEvent("textarea-clear",{detail:{previousValue:t,originalEvent:e,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(i),"dispatchClearEvent")}dispatchEscapeEvent(t){const e=new CustomEvent("textarea-escape",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchEscapeEvent")}dispatchSubmitEvent(t){const e=new CustomEvent("textarea-submit",{detail:{originalEvent:t,value:this.eventHost.value},bubbles:!0,composed:!0});this.safeExecute(()=>this._host.dispatchEvent(e),"dispatchSubmitEvent")}}
 /**
  * @license
  * Copyright 2023 Nuraly, Laabidi Aymen
  * SPDX-License-Identifier: MIT
- */var g=function(t,e,r,a){for(var i,o=arguments.length,s=o<3?e:null===a?a=Object.getOwnPropertyDescriptor(e,r):a,n=t.length-1;n>=0;n--)(i=t[n])&&(s=(o<3?i(s):o>3?i(e,r,s):i(e,r))||s);return o>3&&s&&Object.defineProperty(e,r,s),s},y=function(t,e,r,a){return new(r||(r=Promise))(function(i,o){function s(t){try{l(a.next(t))}catch(t){o(t)}}function n(t){try{l(a.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?i(t.value):(e=t.value,e instanceof r?e:new r(function(t){t(e)})).then(s,n)}l((a=a.apply(t,e||[])).next())})};let w=class extends(n(e)){get clearable(){return this.allowClear}constructor(){super(),this.validationController=new f(this),this.eventController=new m(this),this.disabled=!1,this.readonly=!1,this.state="default",this.value="",this.size="medium",this.variant="underlined",this.resize="vertical",this.rows=v,this.cols=p,this.placeholder="",this.autocomplete="off",this.allowClear=!1,this.showCount=!1,this.autoResize=!1,this.rules=[],this.validateOnChange=!0,this.validateOnBlur=!0,this.hasFeedback=!1,this.isFocused=!1,this.characterCount=0,this.characterCount=this.value.length,this.setupControllerListeners()}setupControllerListeners(){this.addEventListener("nr-validation",t=>{this.validationResult=t.detail.validationResult}),this.addEventListener("textarea-input",t=>{this.handleControllerInput(t.detail.value)}),this.addEventListener("textarea-focus",()=>{this.isFocused=!0}),this.addEventListener("textarea-blur",()=>{this.isFocused=!1,this.validateOnBlur&&this.validationController.validateOnBlurIfEnabled()}),this.addEventListener("textarea-clear",t=>{this.handleControllerClear(t.detail.previousValue)})}handleControllerInput(t){this.maxLength&&t.length>this.maxLength?this.value=t.slice(0,this.maxLength):this.value=t,this.characterCount=this.value.length,this.autoResizeIfNeeded(),this.dispatchChangeEvent(),this.validateOnChange&&this.validationController.validateOnChangeIfEnabled(this.value)}handleControllerClear(t){this.characterCount=0,this.dispatchChangeEvent(),this.dispatchEvent(new CustomEvent("nr-clear",{detail:{value:this.value,previousValue:t},bubbles:!0}))}connectedCallback(){super.connectedCallback(),this.setupResizeObserver()}disconnectedCallback(){super.disconnectedCallback(),this.cleanupResizeObserver()}firstUpdated(t){super.firstUpdated(t),this.updateTextareaValue(),this.autoResizeIfNeeded(),this.resizeObserver&&this.textareaElement&&this.resizeObserver.observe(this.textareaElement),this.eventController.setupEventListeners()}updated(t){super.updated(t),t.has("value")&&(this.characterCount=this.value.length,this.updateTextareaValue(),this.autoResizeIfNeeded()),t.has("autoResize")&&this.autoResizeIfNeeded(),t.has("rules")&&(this.validationController.clearValidation(),this.rules.length>0&&this.value&&this.validationController.validateTextarea(this.value))}setupResizeObserver(){"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver(t=>{for(const e of t){const{width:t,height:r}=e.contentRect;this.dispatchResizeEvent(t,r)}}))}cleanupResizeObserver(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=void 0)}updateTextareaValue(){this.textareaElement&&this.textareaElement.value!==this.value&&(this.textareaElement.value=this.value)}autoResizeIfNeeded(){if(!this.autoResize||!this.textareaElement)return;this.textareaElement.style.height="auto";let t=this.textareaElement.scrollHeight;this.minHeight&&t<this.minHeight&&(t=this.minHeight),this.maxHeight&&t>this.maxHeight&&(t=this.maxHeight),this.textareaElement.style.height=`${t}px`}handleInput(t){this.eventController.handleInput(t)}handleFocus(t){this.eventController.handleFocus(t),this.dispatchEvent(new CustomEvent("nr-focus",{detail:{focused:!0,originalEvent:t},bubbles:!0}))}handleBlur(t){this.eventController.handleBlur(t),this.dispatchEvent(new CustomEvent("nr-blur",{detail:{focused:!1,originalEvent:t},bubbles:!0}))}handleClear(){this.eventController.handleClear()}dispatchChangeEvent(){const t={value:this.value,length:this.characterCount,exceedsMaxLength:!!this.maxLength&&this.characterCount>this.maxLength,validation:this.validationResult};this.dispatchEvent(new CustomEvent("nr-textarea-change",{detail:t,bubbles:!0}))}dispatchResizeEvent(t,e){const r={width:t,height:e,direction:this.resize};this.dispatchEvent(new CustomEvent("nr-resize",{detail:r,bubbles:!0}))}focus(t){this.eventController.focus(),(void 0!==(null==t?void 0:t.cursor)||(null==t?void 0:t.select))&&setTimeout(()=>{this.textareaElement&&(void 0!==(null==t?void 0:t.cursor)?"number"==typeof t.cursor?this.eventController.setCursorPosition(t.cursor):"start"===t.cursor?this.eventController.setCursorPosition(0):"end"===t.cursor?this.eventController.setCursorPosition(this.value.length):"all"===t.cursor&&this.eventController.selectAll():(null==t?void 0:t.select)&&this.eventController.selectAll())})}blur(){this.eventController.blur()}getValidationResult(){return this.validationController.validationResult}validate(){return y(this,void 0,void 0,function*(){return(yield this.validationController.validateTextarea(this.value)).isValid})}clearValidation(){this.validationController.clearValidation()}clear(){this.eventController.handleClear()}addRule(t){this.validationController.addRule(t)}removeRule(t){this.validationController.removeRule(t)}clearRules(){this.validationController.clearRules()}getValidationStatus(){var t;const e=this.validationController.validationResult;return{isValid:null===(t=null==e?void 0:e.isValid)||void 0===t||t,errors:"error"===(null==e?void 0:e.level)?e.messages:[],warnings:"warning"===(null==e?void 0:e.level)?e.messages:[]}}isValid(){return this.validationController.isCurrentlyValid()}checkValidity(){return this.validationController.isCurrentlyValid()}reportValidity(){const t=this.validationController.isCurrentlyValid();return t||this.validationController.validateTextarea(this.value),t}setCustomValidity(t){t?this.validationController.addRule({validator:()=>!1,message:t,level:"error",blocking:!0}):this.validationController.removeRule(e=>e.message===t)}validateTextarea(){return y(this,void 0,void 0,function*(){return(yield this.validationController.validateTextarea(this.value)).isValid})}setValidationStatus(t){this.validationResult=t,"error"===t.level?this.state="error":"warning"===t.level?this.state="warning":t.isValid&&(this.state="success"),this.requestUpdate()}renderLabel(){return r`
-      <div class="textarea-label">
+ */var k=function(t,e,i,s){for(var r,o=arguments.length,n=o<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s,a=t.length-1;a>=0;a--)(r=t[a])&&(n=(o<3?r(n):o>3?r(e,i,n):r(e,i))||n);return o>3&&n&&Object.defineProperty(e,i,n),n},R=function(t,e,i,s){return new(i||(i=Promise))(function(r,o){function n(t){try{l(s.next(t))}catch(t){o(t)}}function a(t){try{l(s.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?r(t.value):(e=t.value,e instanceof i?e:new i(function(t){t(e)})).then(n,a)}l((s=s.apply(t,e||[])).next())})};let S=class extends((t=>v(c(p(f(t)))))(s)){get clearable(){return this.allowClear}constructor(){super(),this.validationController=new C(this),this.eventController=new $(this),this.disabled=!1,this.readonly=!1,this.state="default",this.value="",this.size="medium",this.variant="underlined",this.resize="vertical",this.rows=h,this.cols=d,this.placeholder="",this.autocomplete="off",this.allowClear=!1,this.showCount=!1,this.autoResize=!1,this.rules=[],this.validateOnChange=!0,this.validateOnBlur=!0,this.hasFeedback=!1,this.isFocused=!1,this.characterCount=0,this.characterCount=this.value.length,this.setupControllerListeners()}setupControllerListeners(){this.addEventListener("nr-validation",t=>{this.validationResult=t.detail.validationResult}),this.addEventListener("textarea-input",t=>{this.handleControllerInput(t.detail.value)}),this.addEventListener("textarea-focus",()=>{this.isFocused=!0}),this.addEventListener("textarea-blur",()=>{this.isFocused=!1,this.validateOnBlur&&this.validationController.validateOnBlurIfEnabled()}),this.addEventListener("textarea-clear",t=>{this.handleControllerClear(t.detail.previousValue)})}handleControllerInput(t){this.maxLength&&t.length>this.maxLength?this.value=t.slice(0,this.maxLength):this.value=t,this.characterCount=this.value.length,this.autoResizeIfNeeded(),this.dispatchChangeEvent(),this.validateOnChange&&this.validationController.validateOnChangeIfEnabled(this.value)}handleControllerClear(t){this.characterCount=0,this.dispatchChangeEvent(),this.dispatchEvent(new CustomEvent("nr-clear",{detail:{value:this.value,previousValue:t},bubbles:!0}))}connectedCallback(){super.connectedCallback(),this.setupResizeObserver()}disconnectedCallback(){super.disconnectedCallback(),this.cleanupResizeObserver()}firstUpdated(t){super.firstUpdated(t),this.updateTextareaValue(),this.autoResizeIfNeeded(),this.resizeObserver&&this.textareaElement&&this.resizeObserver.observe(this.textareaElement),this.eventController.setupEventListeners()}updated(t){super.updated(t),t.has("value")&&(this.characterCount=this.value.length,this.updateTextareaValue(),this.autoResizeIfNeeded()),t.has("autoResize")&&this.autoResizeIfNeeded(),t.has("rules")&&(this.validationController.clearValidation(),this.rules.length>0&&this.value&&this.validationController.validateTextarea(this.value))}setupResizeObserver(){"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver(t=>{for(const e of t){const{width:t,height:i}=e.contentRect;this.dispatchResizeEvent(t,i)}}))}cleanupResizeObserver(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=void 0)}updateTextareaValue(){this.textareaElement&&this.textareaElement.value!==this.value&&(this.textareaElement.value=this.value)}autoResizeIfNeeded(){if(!this.autoResize||!this.textareaElement)return;this.textareaElement.style.height="auto";let t=this.textareaElement.scrollHeight;this.minHeight&&t<this.minHeight&&(t=this.minHeight),this.maxHeight&&t>this.maxHeight&&(t=this.maxHeight),this.textareaElement.style.height=`${t}px`}handleInput(t){this.eventController.handleInput(t)}handleFocus(t){this.eventController.handleFocus(t),this.dispatchEvent(new CustomEvent("nr-focus",{detail:{focused:!0,originalEvent:t},bubbles:!0}))}handleBlur(t){this.eventController.handleBlur(t),this.dispatchEvent(new CustomEvent("nr-blur",{detail:{focused:!1,originalEvent:t},bubbles:!0}))}handleClear(){this.eventController.handleClear()}dispatchChangeEvent(){const t={value:this.value,length:this.characterCount,exceedsMaxLength:!!this.maxLength&&this.characterCount>this.maxLength,validation:this.validationResult};this.dispatchEvent(new CustomEvent("nr-textarea-change",{detail:t,bubbles:!0}))}dispatchResizeEvent(t,e){const i={width:t,height:e,direction:this.resize};this.dispatchEvent(new CustomEvent("nr-resize",{detail:i,bubbles:!0}))}focus(t){this.eventController.focus(),(void 0!==(null==t?void 0:t.cursor)||(null==t?void 0:t.select))&&setTimeout(()=>{this.textareaElement&&(void 0!==(null==t?void 0:t.cursor)?"number"==typeof t.cursor?this.eventController.setCursorPosition(t.cursor):"start"===t.cursor?this.eventController.setCursorPosition(0):"end"===t.cursor?this.eventController.setCursorPosition(this.value.length):"all"===t.cursor&&this.eventController.selectAll():(null==t?void 0:t.select)&&this.eventController.selectAll())})}blur(){this.eventController.blur()}getValidationResult(){return this.validationController.validationResult}validate(){return R(this,void 0,void 0,function*(){return(yield this.validationController.validateTextarea(this.value)).isValid})}clearValidation(){this.validationController.clearValidation()}clear(){this.eventController.handleClear()}addRule(t){this.validationController.addRule(t)}removeRule(t){this.validationController.removeRule(t)}clearRules(){this.validationController.clearRules()}getValidationStatus(){var t;const e=this.validationController.validationResult;return{isValid:null===(t=null==e?void 0:e.isValid)||void 0===t||t,errors:"error"===(null==e?void 0:e.level)?e.messages:[],warnings:"warning"===(null==e?void 0:e.level)?e.messages:[]}}isValid(){return this.validationController.isCurrentlyValid()}checkValidity(){return this.validationController.isCurrentlyValid()}reportValidity(){const t=this.validationController.isCurrentlyValid();return t||this.validationController.validateTextarea(this.value),t}setCustomValidity(t){t?this.validationController.addRule({validator:()=>!1,message:t,level:"error",blocking:!0}):this.validationController.removeRule(e=>e.message===t)}validateTextarea(){return R(this,void 0,void 0,function*(){return(yield this.validationController.validateTextarea(this.value)).isValid})}setValidationStatus(t){this.validationResult=t,"error"===t.level?this.state="error":"warning"===t.level?this.state="warning":t.isValid&&(this.state="success"),this.requestUpdate()}renderLabel(){return i`
+      <div class="textarea-label" part="label">
         <slot name="label"></slot>
-        ${this.required?r`<span class="required-indicator">*</span>`:""}
+        ${this.required?i`<span class="required-indicator">*</span>`:""}
       </div>
-    `}renderTextarea(){return r`
+    `}renderTextarea(){return i`
       <textarea
         class="textarea-element"
+        part="input"
         .value=${this.value}
         .disabled=${this.disabled}
         .readOnly=${this.readonly}
@@ -368,16 +390,31 @@ class x extends h{requestHostUpdate(){this.requestUpdate()}}
         @focus=${this.handleFocus}
         @blur=${this.handleBlur}
       ></textarea>
-    `}renderValidationIcon(){var t;return l(null===(t=this.validationResult)||void 0===t?void 0:t.level,this.hasFeedback&&!!this.validationResult)}renderClearButton(){return d({allowClear:this.allowClear,value:this.value,disabled:this.disabled,readonly:this.readonly,onClear:this.handleClear,ariaLabel:"Clear textarea"})}renderCharacterCount(){if(!this.showCount)return"";const t=this.maxLength?` / ${this.maxLength}`:"",e=this.maxLength&&this.characterCount>this.maxLength;return r`
+    `}renderValidationIcon(){var t;return function(t,s){if(!s||!t)return e;let r="",o="";switch(t){case"error":r="error",o="validation-error";break;case"warning":r="warning",o="validation-warning";break;case"success":r="check-circle",o="validation-success";break;default:return e}return i`
+    <nr-icon
+      class="validation-icon ${o}"
+      name="${r}"
+      size="small"
+    ></nr-icon>
+  `}(null===(t=this.validationResult)||void 0===t?void 0:t.level,this.hasFeedback&&!!this.validationResult)}renderClearButton(){return function(t){const{allowClear:s,value:r,disabled:o=!1,readonly:n=!1,onClear:a,ariaLabel:l="Clear value",iconName:h="x",iconSize:d="small",cssClass:c="clear-button"}=t;return!s||!r||o||n?e:i`
+    <button
+      class="${c}"
+      type="button"
+      @click=${a}
+      aria-label="${l}"
+    >
+      <nr-icon name="${h}" size="${d}"></nr-icon>
+    </button>
+  `}({allowClear:this.allowClear,value:this.value,disabled:this.disabled,readonly:this.readonly,onClear:this.handleClear,ariaLabel:"Clear textarea"})}renderCharacterCount(){if(!this.showCount)return"";const t=this.maxLength?` / ${this.maxLength}`:"",e=this.maxLength&&this.characterCount>this.maxLength;return i`
       <div class="character-count ${e?"over-limit":""}">
         ${this.characterCount}${t}
       </div>
-    `}renderHelperText(){var t,e;const a=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('slot[name="helper-text"]'),i=null==a?void 0:a.assignedNodes().length,o=null===(e=this.validationResult)||void 0===e?void 0:e.messages.length;return i||o?r`
-      <div class="helper-text">
-        ${o?this.validationResult.messages.map(t=>r`<div class="validation-message ${this.validationResult.level}">${t}</div>`):r`<slot name="helper-text"></slot>`}
+    `}renderHelperText(){var t,e;const s=null===(t=this.shadowRoot)||void 0===t?void 0:t.querySelector('slot[name="helper-text"]'),r=null==s?void 0:s.assignedNodes().length,o=null===(e=this.validationResult)||void 0===e?void 0:e.messages.length;return r||o?i`
+      <div class="helper-text" part="helper-text">
+        ${o?this.validationResult.messages.map(t=>i`<div class="validation-message ${this.validationResult.level}">${t}</div>`):i`<slot name="helper-text"></slot>`}
       </div>
-    `:""}render(){const t=["textarea-container",`size-${this.size}`,`variant-${this.variant}`,`state-${this.state}`,this.isFocused?"focused":"",this.disabled?"disabled":"",this.readonly?"readonly":"",this.validationResult?`validation-${this.validationResult.level}`:""].filter(Boolean).join(" ");return r`
-      <div class="${t}">
+    `:""}render(){const t=["textarea-container",`size-${this.size}`,`variant-${this.variant}`,`state-${this.state}`,this.isFocused?"focused":"",this.disabled?"disabled":"",this.readonly?"readonly":"",this.validationResult?`validation-${this.validationResult.level}`:""].filter(Boolean).join(" ");return i`
+      <div class="${t}" part="container">
         ${this.renderLabel()}
         
         <div class="textarea-wrapper">
@@ -401,4 +438,4 @@ class x extends h{requestHostUpdate(){this.requestUpdate()}}
           ${this.renderCharacterCount()}
         </div>
       </div>
-    `}};w.styles=u,g([a("textarea")],w.prototype,"textareaElement",void 0),g([i({type:Boolean,reflect:!0})],w.prototype,"disabled",void 0),g([i({type:Boolean,reflect:!0})],w.prototype,"readonly",void 0),g([i({type:String,reflect:!0})],w.prototype,"state",void 0),g([i({type:String})],w.prototype,"value",void 0),g([i({type:String})],w.prototype,"size",void 0),g([i({type:String,reflect:!0})],w.prototype,"variant",void 0),g([i({type:String})],w.prototype,"resize",void 0),g([i({type:Number})],w.prototype,"rows",void 0),g([i({type:Number})],w.prototype,"cols",void 0),g([i({type:String})],w.prototype,"placeholder",void 0),g([i({type:String})],w.prototype,"autocomplete",void 0),g([i({type:String})],w.prototype,"name",void 0),g([i({type:Boolean})],w.prototype,"required",void 0),g([i({type:Boolean,reflect:!0})],w.prototype,"allowClear",void 0),g([i({type:Boolean,reflect:!0})],w.prototype,"showCount",void 0),g([i({type:Number})],w.prototype,"maxLength",void 0),g([i({type:Number})],w.prototype,"minHeight",void 0),g([i({type:Number})],w.prototype,"maxHeight",void 0),g([i({type:Boolean})],w.prototype,"autoResize",void 0),g([i({type:Array})],w.prototype,"rules",void 0),g([i({type:Boolean,attribute:"validate-on-change"})],w.prototype,"validateOnChange",void 0),g([i({type:Boolean,attribute:"validate-on-blur"})],w.prototype,"validateOnBlur",void 0),g([i({type:Boolean,attribute:"has-feedback"})],w.prototype,"hasFeedback",void 0),g([i({type:String,attribute:"validation-message"})],w.prototype,"validationMessage",void 0),g([o()],w.prototype,"isFocused",void 0),g([o()],w.prototype,"validationResult",void 0),g([o()],w.prototype,"characterCount",void 0),w=g([s("nr-textarea")],w);export{w as NrTextareaElement};
+    `}};S.useShadowDom=!0,S.styles=l,k([r("textarea")],S.prototype,"textareaElement",void 0),k([o({type:Boolean,reflect:!0})],S.prototype,"disabled",void 0),k([o({type:Boolean,reflect:!0})],S.prototype,"readonly",void 0),k([o({type:String,reflect:!0})],S.prototype,"state",void 0),k([o({type:String})],S.prototype,"value",void 0),k([o({type:String})],S.prototype,"size",void 0),k([o({type:String,reflect:!0})],S.prototype,"variant",void 0),k([o({type:String})],S.prototype,"resize",void 0),k([o({type:Number})],S.prototype,"rows",void 0),k([o({type:Number})],S.prototype,"cols",void 0),k([o({type:String})],S.prototype,"placeholder",void 0),k([o({type:String})],S.prototype,"autocomplete",void 0),k([o({type:String})],S.prototype,"name",void 0),k([o({type:Boolean})],S.prototype,"required",void 0),k([o({type:Boolean,reflect:!0})],S.prototype,"allowClear",void 0),k([o({type:Boolean,reflect:!0})],S.prototype,"showCount",void 0),k([o({type:Number})],S.prototype,"maxLength",void 0),k([o({type:Number})],S.prototype,"minHeight",void 0),k([o({type:Number})],S.prototype,"maxHeight",void 0),k([o({type:Boolean})],S.prototype,"autoResize",void 0),k([o({type:Array})],S.prototype,"rules",void 0),k([o({type:Boolean,attribute:"validate-on-change"})],S.prototype,"validateOnChange",void 0),k([o({type:Boolean,attribute:"validate-on-blur"})],S.prototype,"validateOnBlur",void 0),k([o({type:Boolean,attribute:"has-feedback"})],S.prototype,"hasFeedback",void 0),k([o({type:String,attribute:"validation-message"})],S.prototype,"validationMessage",void 0),k([n()],S.prototype,"isFocused",void 0),k([n()],S.prototype,"validationResult",void 0),k([n()],S.prototype,"characterCount",void 0),S=k([a("nr-textarea")],S);export{S as NrTextareaElement};

package/dist/src/components/textarea/textarea.component.d.ts

@@ -7,7 +7,7 @@ import { LitElement, type PropertyValues } from 'lit';
 import { TEXTAREA_STATE, TEXTAREA_SIZE, TEXTAREA_VARIANT, TEXTAREA_RESIZE, ValidationRule, TextareaValidationResult, FocusOptions } from './textarea.types.js';
 import { ValidatableComponent, ValidationStatus } from '@nuralyui/common/mixins';
 import { type TextareaValidationHost, type TextareaEventHost } from './controllers/index.js';
-declare const NrTextareaElement_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & typeof LitElement;
+declare const NrTextareaElement_base: (new (...args: any[]) => import("@nuralyui/common/mixins").DependencyAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").ThemeAware) & (new (...args: any[]) => import("@nuralyui/common/mixins").EventHandlerCapable) & (new (...args: any[]) => import("packages/common/src/shared/base-mixin.js").LightDomContent) & typeof LitElement;
 /**
  * Versatile textarea component with validation, resize options, and interactive features.
  *
@@ -28,8 +28,14 @@ declare const NrTextareaElement_base: (new (...args: any[]) => import("@nuralyui
  * @slot helper-text - Helper text
  * @slot addon-before - Content before textarea
  * @slot addon-after - Content after textarea
+ *
+ * @csspart container - The outermost wrapper div
+ * @csspart label - The label wrapper div
+ * @csspart input - The native textarea element
+ * @csspart helper-text - The helper/error text wrapper div
  */
 export declare class NrTextareaElement extends NrTextareaElement_base implements TextareaValidationHost, TextareaEventHost, ValidatableComponent {
+    static useShadowDom: boolean;
     static styles: import("lit").CSSResult;
     private textareaElement;
     private validationController;