@nuralyui/tag 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/bundle.js ADDED
@@ -0,0 +1,180 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2019 Google LLC
4
+ * SPDX-License-Identifier: BSD-3-Clause
5
+ */
6
+ const t=window,i=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s=Symbol(),e=new WeakMap;class o{constructor(t,i,e){if(this._$cssResult$=!0,e!==s)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=i}get styleSheet(){let t=this.o;const s=this.t;if(i&&void 0===t){const i=void 0!==s&&1===s.length;i&&(t=e.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&e.set(s,t))}return t}toString(){return this.cssText}}const r=i?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let i="";for(const s of t.cssRules)i+=s.cssText;return(t=>new o("string"==typeof t?t:t+"",void 0,s))(i)})(t):t
7
+ /**
8
+ * @license
9
+ * Copyright 2017 Google LLC
10
+ * SPDX-License-Identifier: BSD-3-Clause
11
+ */;var n;const l=window,a=l.trustedTypes,h=a?a.emptyScript:"",c=l.reactiveElementPolyfillSupport,d={toAttribute(t,i){switch(i){case Boolean:t=t?h:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,i){let s=t;switch(i){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(t){s=null}}return s}},u=(t,i)=>i!==t&&(i==i||t==t),v={attribute:!0,type:String,converter:d,reflect:!1,hasChanged:u},g="finalized";class f extends HTMLElement{constructor(){super(),this._$Ei=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$El=null,this._$Eu()}static addInitializer(t){var i;this.finalize(),(null!==(i=this.h)&&void 0!==i?i:this.h=[]).push(t)}static get observedAttributes(){this.finalize();const t=[];return this.elementProperties.forEach(((i,s)=>{const e=this._$Ep(s,i);void 0!==e&&(this._$Ev.set(e,s),t.push(e))})),t}static createProperty(t,i=v){if(i.state&&(i.attribute=!1),this.finalize(),this.elementProperties.set(t,i),!i.noAccessor&&!this.prototype.hasOwnProperty(t)){const s="symbol"==typeof t?Symbol():"__"+t,e=this.getPropertyDescriptor(t,s,i);void 0!==e&&Object.defineProperty(this.prototype,t,e)}}static getPropertyDescriptor(t,i,s){return{get(){return this[i]},set(e){const o=this[t];this[i]=e,this.requestUpdate(t,o,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||v}static finalize(){if(this.hasOwnProperty(g))return!1;this[g]=!0;const t=Object.getPrototypeOf(this);if(t.finalize(),void 0!==t.h&&(this.h=[...t.h]),this.elementProperties=new Map(t.elementProperties),this._$Ev=new Map,this.hasOwnProperty("properties")){const t=this.properties,i=[...Object.getOwnPropertyNames(t),...Object.getOwnPropertySymbols(t)];for(const s of i)this.createProperty(s,t[s])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){const i=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const t of s)i.unshift(r(t))}else void 0!==t&&i.push(r(t));return i}static _$Ep(t,i){const s=i.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}_$Eu(){var t;this._$E_=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$Eg(),this.requestUpdate(),null===(t=this.constructor.h)||void 0===t||t.forEach((t=>t(this)))}addController(t){var i,s;(null!==(i=this._$ES)&&void 0!==i?i:this._$ES=[]).push(t),void 0!==this.renderRoot&&this.isConnected&&(null===(s=t.hostConnected)||void 0===s||s.call(t))}removeController(t){var i;null===(i=this._$ES)||void 0===i||i.splice(this._$ES.indexOf(t)>>>0,1)}_$Eg(){this.constructor.elementProperties.forEach(((t,i)=>{this.hasOwnProperty(i)&&(this._$Ei.set(i,this[i]),delete this[i])}))}createRenderRoot(){var s;const e=null!==(s=this.shadowRoot)&&void 0!==s?s:this.attachShadow(this.constructor.shadowRootOptions);return((s,e)=>{i?s.adoptedStyleSheets=e.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet)):e.forEach((i=>{const e=document.createElement("style"),o=t.litNonce;void 0!==o&&e.setAttribute("nonce",o),e.textContent=i.cssText,s.appendChild(e)}))})(e,this.constructor.elementStyles),e}connectedCallback(){var t;void 0===this.renderRoot&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostConnected)||void 0===i?void 0:i.call(t)}))}enableUpdating(t){}disconnectedCallback(){var t;null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostDisconnected)||void 0===i?void 0:i.call(t)}))}attributeChangedCallback(t,i,s){this._$AK(t,s)}_$EO(t,i,s=v){var e;const o=this.constructor._$Ep(t,s);if(void 0!==o&&!0===s.reflect){const r=(void 0!==(null===(e=s.converter)||void 0===e?void 0:e.toAttribute)?s.converter:d).toAttribute(i,s.type);this._$El=t,null==r?this.removeAttribute(o):this.setAttribute(o,r),this._$El=null}}_$AK(t,i){var s;const e=this.constructor,o=e._$Ev.get(t);if(void 0!==o&&this._$El!==o){const t=e.getPropertyOptions(o),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==(null===(s=t.converter)||void 0===s?void 0:s.fromAttribute)?t.converter:d;this._$El=o,this[o]=r.fromAttribute(i,t.type),this._$El=null}}requestUpdate(t,i,s){let e=!0;void 0!==t&&(((s=s||this.constructor.getPropertyOptions(t)).hasChanged||u)(this[t],i)?(this._$AL.has(t)||this._$AL.set(t,i),!0===s.reflect&&this._$El!==t&&(void 0===this._$EC&&(this._$EC=new Map),this._$EC.set(t,s))):e=!1),!this.isUpdatePending&&e&&(this._$E_=this._$Ej())}async _$Ej(){this.isUpdatePending=!0;try{await this._$E_}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Ei&&(this._$Ei.forEach(((t,i)=>this[i]=t)),this._$Ei=void 0);let i=!1;const s=this._$AL;try{i=this.shouldUpdate(s),i?(this.willUpdate(s),null===(t=this._$ES)||void 0===t||t.forEach((t=>{var i;return null===(i=t.hostUpdate)||void 0===i?void 0:i.call(t)})),this.update(s)):this._$Ek()}catch(t){throw i=!1,this._$Ek(),t}i&&this._$AE(s)}willUpdate(t){}_$AE(t){var i;null===(i=this._$ES)||void 0===i||i.forEach((t=>{var i;return null===(i=t.hostUpdated)||void 0===i?void 0:i.call(t)})),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$Ek(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$E_}shouldUpdate(t){return!0}update(t){void 0!==this._$EC&&(this._$EC.forEach(((t,i)=>this._$EO(i,this[i],t))),this._$EC=void 0),this._$Ek()}updated(t){}firstUpdated(t){}}
12
+ /**
13
+ * @license
14
+ * Copyright 2017 Google LLC
15
+ * SPDX-License-Identifier: BSD-3-Clause
16
+ */
17
+ var p;f[g]=!0,f.elementProperties=new Map,f.elementStyles=[],f.shadowRootOptions={mode:"open"},null==c||c({ReactiveElement:f}),(null!==(n=l.reactiveElementVersions)&&void 0!==n?n:l.reactiveElementVersions=[]).push("1.6.3");const b=window,y=b.trustedTypes,m=y?y.createPolicy("lit-html",{createHTML:t=>t}):void 0,w="$lit$",$=`lit$${(Math.random()+"").slice(9)}$`,k="?"+$,_=`<${k}>`,A=document,S=()=>A.createComment(""),x=t=>null===t||"object"!=typeof t&&"function"!=typeof t,E=Array.isArray,C="[ \t\n\f\r]",j=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,O=/-->/g,T=/>/g,U=RegExp(`>|${C}(?:([^\\s"'>=/]+)(${C}*=${C}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),M=/'/g,R=/"/g,z=/^(?:script|style|textarea|title)$/i,N=Symbol.for("lit-noChange"),D=Symbol.for("lit-nothing"),P=new WeakMap,I=A.createTreeWalker(A,129,null,!1);function B(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==m?m.createHTML(i):i}class L{constructor({strings:t,_$litType$:i},s){let e;this.parts=[];let o=0,r=0;const n=t.length-1,l=this.parts,[a,h]=((t,i)=>{const s=t.length-1,e=[];let o,r=2===i?"<svg>":"",n=j;for(let i=0;i<s;i++){const s=t[i];let l,a,h=-1,c=0;for(;c<s.length&&(n.lastIndex=c,a=n.exec(s),null!==a);)c=n.lastIndex,n===j?"!--"===a[1]?n=O:void 0!==a[1]?n=T:void 0!==a[2]?(z.test(a[2])&&(o=RegExp("</"+a[2],"g")),n=U):void 0!==a[3]&&(n=U):n===U?">"===a[0]?(n=null!=o?o:j,h=-1):void 0===a[1]?h=-2:(h=n.lastIndex-a[2].length,l=a[1],n=void 0===a[3]?U:'"'===a[3]?R:M):n===R||n===M?n=U:n===O||n===T?n=j:(n=U,o=void 0);const d=n===U&&t[i+1].startsWith("/>")?" ":"";r+=n===j?s+_:h>=0?(e.push(l),s.slice(0,h)+w+s.slice(h)+$+d):s+$+(-2===h?(e.push(void 0),i):d)}return[B(t,r+(t[s]||"<?>")+(2===i?"</svg>":"")),e]})(t,i);if(this.el=L.createElement(a,s),I.currentNode=this.el.content,2===i){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(e=I.nextNode())&&l.length<n;){if(1===e.nodeType){if(e.hasAttributes()){const t=[];for(const i of e.getAttributeNames())if(i.endsWith(w)||i.startsWith($)){const s=h[r++];if(t.push(i),void 0!==s){const t=e.getAttribute(s.toLowerCase()+w).split($),i=/([.?@])?(.*)/.exec(s);l.push({type:1,index:o,name:i[2],strings:t,ctor:"."===i[1]?V:"?"===i[1]?Z:"@"===i[1]?J:H})}else l.push({type:6,index:o})}for(const i of t)e.removeAttribute(i)}if(z.test(e.tagName)){const t=e.textContent.split($),i=t.length-1;if(i>0){e.textContent=y?y.emptyScript:"";for(let s=0;s<i;s++)e.append(t[s],S()),I.nextNode(),l.push({type:2,index:++o});e.append(t[i],S())}}}else if(8===e.nodeType)if(e.data===k)l.push({type:2,index:o});else{let t=-1;for(;-1!==(t=e.data.indexOf($,t+1));)l.push({type:7,index:o}),t+=$.length-1}o++}}static createElement(t,i){const s=A.createElement("template");return s.innerHTML=t,s}}function K(t,i,s=t,e){var o,r,n,l;if(i===N)return i;let a=void 0!==e?null===(o=s._$Co)||void 0===o?void 0:o[e]:s._$Cl;const h=x(i)?void 0:i._$litDirective$;return(null==a?void 0:a.constructor)!==h&&(null===(r=null==a?void 0:a._$AO)||void 0===r||r.call(a,!1),void 0===h?a=void 0:(a=new h(t),a._$AT(t,s,e)),void 0!==e?(null!==(n=(l=s)._$Co)&&void 0!==n?n:l._$Co=[])[e]=a:s._$Cl=a),void 0!==a&&(i=K(t,a._$AS(t,i.values),a,e)),i}class q{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var i;const{el:{content:s},parts:e}=this._$AD,o=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:A).importNode(s,!0);I.currentNode=o;let r=I.nextNode(),n=0,l=0,a=e[0];for(;void 0!==a;){if(n===a.index){let i;2===a.type?i=new F(r,r.nextSibling,this,t):1===a.type?i=new a.ctor(r,a.name,a.strings,this,t):6===a.type&&(i=new G(r,this,t)),this._$AV.push(i),a=e[++l]}n!==(null==a?void 0:a.index)&&(r=I.nextNode(),n++)}return I.currentNode=A,o}v(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++}}class F{constructor(t,i,s,e){var o;this.type=2,this._$AH=D,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cp=null===(o=null==e?void 0:e.isConnected)||void 0===o||o}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cp}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===(null==t?void 0:t.nodeType)&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=K(this,t,i),x(t)?t===D||null==t||""===t?(this._$AH!==D&&this._$AR(),this._$AH=D):t!==this._$AH&&t!==N&&this._(t):void 0!==t._$litType$?this.g(t):void 0!==t.nodeType?this.$(t):(t=>E(t)||"function"==typeof(null==t?void 0:t[Symbol.iterator]))(t)?this.T(t):this._(t)}k(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}$(t){this._$AH!==t&&(this._$AR(),this._$AH=this.k(t))}_(t){this._$AH!==D&&x(this._$AH)?this._$AA.nextSibling.data=t:this.$(A.createTextNode(t)),this._$AH=t}g(t){var i;const{values:s,_$litType$:e}=t,o="number"==typeof e?this._$AC(t):(void 0===e.el&&(e.el=L.createElement(B(e.h,e.h[0]),this.options)),e);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===o)this._$AH.v(s);else{const t=new q(o,this),i=t.u(this.options);t.v(s),this.$(i),this._$AH=t}}_$AC(t){let i=P.get(t.strings);return void 0===i&&P.set(t.strings,i=new L(t)),i}T(t){E(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const o of t)e===i.length?i.push(s=new F(this.k(S()),this.k(S()),this,this.options)):s=i[e],s._$AI(o),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e)}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cp=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class H{constructor(t,i,s,e,o){this.type=1,this._$AH=D,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=o,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=D}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,e){const o=this.strings;let r=!1;if(void 0===o)t=K(this,t,i,0),r=!x(t)||t!==this._$AH&&t!==N,r&&(this._$AH=t);else{const e=t;let n,l;for(t=o[0],n=0;n<o.length-1;n++)l=K(this,e[s+n],i,n),l===N&&(l=this._$AH[n]),r||(r=!x(l)||l!==this._$AH[n]),l===D?t=D:t!==D&&(t+=(null!=l?l:"")+o[n+1]),this._$AH[n]=l}r&&!e&&this.j(t)}j(t){t===D?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class V extends H{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===D?void 0:t}}const W=y?y.emptyScript:"";class Z extends H{constructor(){super(...arguments),this.type=4}j(t){t&&t!==D?this.element.setAttribute(this.name,W):this.element.removeAttribute(this.name)}}class J extends H{constructor(t,i,s,e,o){super(t,i,s,e,o),this.type=5}_$AI(t,i=this){var s;if((t=null!==(s=K(this,t,i,0))&&void 0!==s?s:D)===N)return;const e=this._$AH,o=t===D&&e!==D||t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive,r=t!==D&&(e===D||o);o&&this.element.removeEventListener(this.name,this,e),r&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class G{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){K(this,t)}}const Q=b.litHtmlPolyfillSupport;
18
+ /**
19
+ * @license
20
+ * Copyright 2017 Google LLC
21
+ * SPDX-License-Identifier: BSD-3-Clause
22
+ */
23
+ var X;null==Q||Q(L,F),(null!==(p=b.litHtmlVersions)&&void 0!==p?p:b.litHtmlVersions=[]).push("2.8.0");const Y=window,tt=Y.trustedTypes,it=tt?tt.createPolicy("lit-html",{createHTML:t=>t}):void 0,st="$lit$",et=`lit$${(Math.random()+"").slice(9)}$`,ot="?"+et,rt=`<${ot}>`,nt=document,lt=()=>nt.createComment(""),at=t=>null===t||"object"!=typeof t&&"function"!=typeof t,ht=Array.isArray,ct="[ \t\n\f\r]",dt=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,ut=/-->/g,vt=/>/g,gt=RegExp(`>|${ct}(?:([^\\s"'>=/]+)(${ct}*=${ct}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),ft=/'/g,pt=/"/g,bt=/^(?:script|style|textarea|title)$/i,yt=(t=>(i,...s)=>({_$litType$:t,strings:i,values:s}))(1),mt=Symbol.for("lit-noChange"),wt=Symbol.for("lit-nothing"),$t=new WeakMap,kt=nt.createTreeWalker(nt,129,null,!1);function _t(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==it?it.createHTML(i):i}const At=(t,i)=>{const s=t.length-1,e=[];let o,r=2===i?"<svg>":"",n=dt;for(let i=0;i<s;i++){const s=t[i];let l,a,h=-1,c=0;for(;c<s.length&&(n.lastIndex=c,a=n.exec(s),null!==a);)c=n.lastIndex,n===dt?"!--"===a[1]?n=ut:void 0!==a[1]?n=vt:void 0!==a[2]?(bt.test(a[2])&&(o=RegExp("</"+a[2],"g")),n=gt):void 0!==a[3]&&(n=gt):n===gt?">"===a[0]?(n=null!=o?o:dt,h=-1):void 0===a[1]?h=-2:(h=n.lastIndex-a[2].length,l=a[1],n=void 0===a[3]?gt:'"'===a[3]?pt:ft):n===pt||n===ft?n=gt:n===ut||n===vt?n=dt:(n=gt,o=void 0);const d=n===gt&&t[i+1].startsWith("/>")?" ":"";r+=n===dt?s+rt:h>=0?(e.push(l),s.slice(0,h)+st+s.slice(h)+et+d):s+et+(-2===h?(e.push(void 0),i):d)}return[_t(t,r+(t[s]||"<?>")+(2===i?"</svg>":"")),e]};class St{constructor({strings:t,_$litType$:i},s){let e;this.parts=[];let o=0,r=0;const n=t.length-1,l=this.parts,[a,h]=At(t,i);if(this.el=St.createElement(a,s),kt.currentNode=this.el.content,2===i){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(e=kt.nextNode())&&l.length<n;){if(1===e.nodeType){if(e.hasAttributes()){const t=[];for(const i of e.getAttributeNames())if(i.endsWith(st)||i.startsWith(et)){const s=h[r++];if(t.push(i),void 0!==s){const t=e.getAttribute(s.toLowerCase()+st).split(et),i=/([.?@])?(.*)/.exec(s);l.push({type:1,index:o,name:i[2],strings:t,ctor:"."===i[1]?Ot:"?"===i[1]?Ut:"@"===i[1]?Mt:jt})}else l.push({type:6,index:o})}for(const i of t)e.removeAttribute(i)}if(bt.test(e.tagName)){const t=e.textContent.split(et),i=t.length-1;if(i>0){e.textContent=tt?tt.emptyScript:"";for(let s=0;s<i;s++)e.append(t[s],lt()),kt.nextNode(),l.push({type:2,index:++o});e.append(t[i],lt())}}}else if(8===e.nodeType)if(e.data===ot)l.push({type:2,index:o});else{let t=-1;for(;-1!==(t=e.data.indexOf(et,t+1));)l.push({type:7,index:o}),t+=et.length-1}o++}}static createElement(t,i){const s=nt.createElement("template");return s.innerHTML=t,s}}function xt(t,i,s=t,e){var o,r,n,l;if(i===mt)return i;let a=void 0!==e?null===(o=s._$Co)||void 0===o?void 0:o[e]:s._$Cl;const h=at(i)?void 0:i._$litDirective$;return(null==a?void 0:a.constructor)!==h&&(null===(r=null==a?void 0:a._$AO)||void 0===r||r.call(a,!1),void 0===h?a=void 0:(a=new h(t),a._$AT(t,s,e)),void 0!==e?(null!==(n=(l=s)._$Co)&&void 0!==n?n:l._$Co=[])[e]=a:s._$Cl=a),void 0!==a&&(i=xt(t,a._$AS(t,i.values),a,e)),i}class Et{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){var i;const{el:{content:s},parts:e}=this._$AD,o=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:nt).importNode(s,!0);kt.currentNode=o;let r=kt.nextNode(),n=0,l=0,a=e[0];for(;void 0!==a;){if(n===a.index){let i;2===a.type?i=new Ct(r,r.nextSibling,this,t):1===a.type?i=new a.ctor(r,a.name,a.strings,this,t):6===a.type&&(i=new Rt(r,this,t)),this._$AV.push(i),a=e[++l]}n!==(null==a?void 0:a.index)&&(r=kt.nextNode(),n++)}return kt.currentNode=nt,o}v(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++}}class Ct{constructor(t,i,s,e){var o;this.type=2,this._$AH=wt,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cp=null===(o=null==e?void 0:e.isConnected)||void 0===o||o}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cp}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===(null==t?void 0:t.nodeType)&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=xt(this,t,i),at(t)?t===wt||null==t||""===t?(this._$AH!==wt&&this._$AR(),this._$AH=wt):t!==this._$AH&&t!==mt&&this._(t):void 0!==t._$litType$?this.g(t):void 0!==t.nodeType?this.$(t):(t=>ht(t)||"function"==typeof(null==t?void 0:t[Symbol.iterator]))(t)?this.T(t):this._(t)}k(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}$(t){this._$AH!==t&&(this._$AR(),this._$AH=this.k(t))}_(t){this._$AH!==wt&&at(this._$AH)?this._$AA.nextSibling.data=t:this.$(nt.createTextNode(t)),this._$AH=t}g(t){var i;const{values:s,_$litType$:e}=t,o="number"==typeof e?this._$AC(t):(void 0===e.el&&(e.el=St.createElement(_t(e.h,e.h[0]),this.options)),e);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===o)this._$AH.v(s);else{const t=new Et(o,this),i=t.u(this.options);t.v(s),this.$(i),this._$AH=t}}_$AC(t){let i=$t.get(t.strings);return void 0===i&&$t.set(t.strings,i=new St(t)),i}T(t){ht(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const o of t)e===i.length?i.push(s=new Ct(this.k(lt()),this.k(lt()),this,this.options)):s=i[e],s._$AI(o),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e)}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cp=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class jt{constructor(t,i,s,e,o){this.type=1,this._$AH=wt,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=o,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=wt}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,e){const o=this.strings;let r=!1;if(void 0===o)t=xt(this,t,i,0),r=!at(t)||t!==this._$AH&&t!==mt,r&&(this._$AH=t);else{const e=t;let n,l;for(t=o[0],n=0;n<o.length-1;n++)l=xt(this,e[s+n],i,n),l===mt&&(l=this._$AH[n]),r||(r=!at(l)||l!==this._$AH[n]),l===wt?t=wt:t!==wt&&(t+=(null!=l?l:"")+o[n+1]),this._$AH[n]=l}r&&!e&&this.j(t)}j(t){t===wt?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class Ot extends jt{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===wt?void 0:t}}const Tt=tt?tt.emptyScript:"";class Ut extends jt{constructor(){super(...arguments),this.type=4}j(t){t&&t!==wt?this.element.setAttribute(this.name,Tt):this.element.removeAttribute(this.name)}}class Mt extends jt{constructor(t,i,s,e,o){super(t,i,s,e,o),this.type=5}_$AI(t,i=this){var s;if((t=null!==(s=xt(this,t,i,0))&&void 0!==s?s:wt)===mt)return;const e=this._$AH,o=t===wt&&e!==wt||t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive,r=t!==wt&&(e===wt||o);o&&this.element.removeEventListener(this.name,this,e),r&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class Rt{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){xt(this,t)}}const zt=Y.litHtmlPolyfillSupport;null==zt||zt(St,Ct),(null!==(X=Y.litHtmlVersions)&&void 0!==X?X:Y.litHtmlVersions=[]).push("2.8.0");
24
+ /**
25
+ * @license
26
+ * Copyright 2017 Google LLC
27
+ * SPDX-License-Identifier: BSD-3-Clause
28
+ */
29
+ var Nt,Dt;class Pt extends f{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t,i;const s=super.createRenderRoot();return null!==(t=(i=this.renderOptions).renderBefore)&&void 0!==t||(i.renderBefore=s.firstChild),s}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=((t,i,s)=>{var e,o;const r=null!==(e=null==s?void 0:s.renderBefore)&&void 0!==e?e:i;let n=r._$litPart$;if(void 0===n){const t=null!==(o=null==s?void 0:s.renderBefore)&&void 0!==o?o:null;r._$litPart$=n=new Ct(i.insertBefore(lt(),t),t,void 0,null!=s?s:{})}return n._$AI(t),n})(i,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),null===(t=this._$Do)||void 0===t||t.setConnected(!1)}render(){return mt}}Pt.finalized=!0,Pt._$litElement$=!0,null===(Nt=globalThis.litElementHydrateSupport)||void 0===Nt||Nt.call(globalThis,{LitElement:Pt});const It=globalThis.litElementPolyfillSupport;null==It||It({LitElement:Pt}),(null!==(Dt=globalThis.litElementVersions)&&void 0!==Dt?Dt:globalThis.litElementVersions=[]).push("3.3.3");
30
+ /**
31
+ * @license
32
+ * Copyright 2017 Google LLC
33
+ * SPDX-License-Identifier: BSD-3-Clause
34
+ */
35
+ const Bt=(t,i)=>"method"===i.kind&&i.descriptor&&!("value"in i.descriptor)?{...i,finisher(s){s.createProperty(i.key,t)}}:{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:i.key,initializer(){"function"==typeof i.initializer&&(this[i.key]=i.initializer.call(this))},finisher(s){s.createProperty(i.key,t)}},Lt=(t,i,s)=>{i.constructor.createProperty(s,t)};
36
+ /**
37
+ * @license
38
+ * Copyright 2017 Google LLC
39
+ * SPDX-License-Identifier: BSD-3-Clause
40
+ */function Kt(t){return(i,s)=>void 0!==s?Lt(t,i,s):Bt(t,i)
41
+ /**
42
+ * @license
43
+ * Copyright 2017 Google LLC
44
+ * SPDX-License-Identifier: BSD-3-Clause
45
+ */}
46
+ /**
47
+ * @license
48
+ * Copyright 2021 Google LLC
49
+ * SPDX-License-Identifier: BSD-3-Clause
50
+ */
51
+ var qt;null===(qt=window.HTMLSlotElement)||void 0===qt||qt.prototype.assignedElements;
52
+ /**
53
+ * @license
54
+ * Copyright 2017 Google LLC
55
+ * SPDX-License-Identifier: BSD-3-Clause
56
+ */
57
+ const Ft=1;class Ht{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,i,s){this._$Ct=t,this._$AM=i,this._$Ci=s}_$AS(t,i){return this.update(t,i)}update(t,i){return this.render(...i)}}
58
+ /**
59
+ * @license
60
+ * Copyright 2018 Google LLC
61
+ * SPDX-License-Identifier: BSD-3-Clause
62
+ */const Vt=(t=>(...i)=>({_$litDirective$:t,values:i}))(class extends Ht{constructor(t){var i;if(super(t),t.type!==Ft||"class"!==t.name||(null===(i=t.strings)||void 0===i?void 0:i.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter((i=>t[i])).join(" ")+" "}update(t,[i]){var s,e;if(void 0===this.it){this.it=new Set,void 0!==t.strings&&(this.nt=new Set(t.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!(null===(s=this.nt)||void 0===s?void 0:s.has(t))&&this.it.add(t);return this.render(i)}const o=t.element.classList;this.it.forEach((t=>{t in i||(o.remove(t),this.it.delete(t))}));for(const t in i){const s=!!i[t];s===this.it.has(t)||(null===(e=this.nt)||void 0===e?void 0:e.has(t))||(s?(o.add(t),this.it.add(t)):(o.remove(t),this.it.delete(t)))}return N}}),Wt=((t,...i)=>{const e=1===t.length?t[0]:i.reduce(((i,s,e)=>i+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[e+1]),t[0]);return new o(e,t,s)})`
63
+ :host { display: inline-block; }
64
+
65
+ .tag {
66
+ display: inline-flex;
67
+ align-items: center;
68
+ gap: var(--nuraly-tag-gap, 6px);
69
+ height: var(--nuraly-tag-height, auto);
70
+ padding: var(--nuraly-tag-padding-y, 0px) var(--nuraly-tag-padding-x, 8px);
71
+ font-family: var(--nuraly-font-family);
72
+ font-size: var(--nuraly-tag-font-size, var(--nuraly-font-size-sm));
73
+ line-height: 1;
74
+ color: var(--nuraly-tag-color, var(--nuraly-color-text));
75
+ background-color: var(--nuraly-tag-bg, var(--nuraly-color-background));
76
+ border: 1px solid var(--nuraly-tag-border-color, var(--nuraly-color-border));
77
+ border-radius: var(--nuraly-tag-radius, var(--nuraly-border-radius-sm));
78
+ transition: all var(--nuraly-transition-fast) ease;
79
+ user-select: none;
80
+ }
81
+
82
+ .tag--borderless { border-color: transparent; }
83
+
84
+ .tag--small {
85
+ padding: var(--nuraly-tag-padding-y-sm, 0px) var(--nuraly-tag-padding-x-sm, 6px);
86
+ font-size: var(--nuraly-tag-font-size-sm, var(--nuraly-font-size-xs));
87
+ }
88
+
89
+ /* Checkable behavior */
90
+ .tag--checkable { cursor: pointer; }
91
+ .tag--checkable:not(.tag--disabled):hover {
92
+ background-color: var(--nuraly-tag-checkable-hover-bg, var(--nuraly-color-background-hover));
93
+ }
94
+ .tag--checkable.tag--checked {
95
+ background-color: var(--nuraly-tag-checked-bg, var(--nuraly-color-primary-light));
96
+ color: var(--nuraly-tag-checked-color, var(--nuraly-color-primary-dark));
97
+ border-color: var(--nuraly-tag-checked-border-color, var(--nuraly-color-border-brand));
98
+ }
99
+
100
+ .tag--disabled { opacity: 0.6; cursor: not-allowed; }
101
+
102
+ .tag__icon { display: inline-flex; align-items: center; }
103
+ .tag__content { display: inline-flex; align-items: center; }
104
+
105
+ .tag__close {
106
+ display: inline-flex;
107
+ align-items: center;
108
+ justify-content: center;
109
+ width: 16px;
110
+ height: 16px;
111
+ line-height: 1;
112
+ padding: 0;
113
+ border: none;
114
+ background: transparent;
115
+ color: currentColor;
116
+ cursor: pointer;
117
+ border-radius: var(--nuraly-border-radius-xs);
118
+ transition: background-color var(--nuraly-transition-fast) ease, opacity var(--nuraly-transition-fast) ease;
119
+ }
120
+ .tag__close:hover { background-color: var(--nuraly-color-background-hover); }
121
+ .tag__close:disabled { cursor: not-allowed; opacity: 0.6; }
122
+
123
+ /* Closing animation (height/opacity collapse) */
124
+ @keyframes tagFadeOut { from { opacity: 1; } to { opacity: 0; } }
125
+ .tag--closing { animation: tagFadeOut 0.2s ease forwards; }
126
+
127
+ /* Preset solid color tags similar to AntD */
128
+ .tag--magenta { background-color: #f759ab; border-color: #f759ab; color: #fff; }
129
+ .tag--red { background-color: #ff4d4f; border-color: #ff4d4f; color: #fff; }
130
+ .tag--volcano { background-color: #fa541c; border-color: #fa541c; color: #fff; }
131
+ .tag--orange { background-color: #fa8c16; border-color: #fa8c16; color: #fff; }
132
+ .tag--gold { background-color: #faad14; border-color: #faad14; color: rgba(0,0,0,0.88); }
133
+ .tag--lime { background-color: #a0d911; border-color: #a0d911; color: rgba(0,0,0,0.88); }
134
+ .tag--green { background-color: #52c41a; border-color: #52c41a; color: #fff; }
135
+ .tag--cyan { background-color: #13c2c2; border-color: #13c2c2; color: #fff; }
136
+ .tag--blue { background-color: #1677ff; border-color: #1677ff; color: #fff; }
137
+ .tag--geekblue { background-color: #2f54eb; border-color: #2f54eb; color: #fff; }
138
+ .tag--purple { background-color: #722ed1; border-color: #722ed1; color: #fff; }
139
+
140
+ /* Custom color tag hue via inline CSS variable */
141
+ .tag--custom { background-color: var(--nr-tag-custom-bg); border-color: var(--nr-tag-custom-bg); color: var(--nuraly-color-text-on-color, #fff); }
142
+ `
143
+ /**
144
+ * @license
145
+ * Copyright 2023 Nuraly, Laabidi Aymen
146
+ * SPDX-License-Identifier: MIT
147
+ */,Zt=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,i,s;super.disconnectedCallback(),null===(t=this.themeObserver)||void 0===t||t.disconnect(),null===(i=this.designSystemObserver)||void 0===i||i.disconnect(),null===(s=this.mediaQuery)||void 0===s||s.removeEventListener("change",this.handleSystemThemeChange)}get currentTheme(){var t,i;const s=(null===(t=this.closest("[data-theme]"))||void 0===t?void 0:t.getAttribute("data-theme"))||document.documentElement.getAttribute("data-theme");return s||((null===(i=window.matchMedia)||void 0===i?void 0:i.call(window,"(prefers-color-scheme: dark)").matches)?"dark":"light")}get currentDesignSystem(){var t;const i=(null===(t=this.closest("[design-system]"))||void 0===t?void 0:t.getAttribute("design-system"))||document.documentElement.getAttribute("design-system");return"carbon"===i?i:"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))}},Jt=()=>{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)},Gt=t=>class extends t{constructor(){super(...arguments),this.requiredComponents=[]}validateDependencies(){if(Jt())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(!Jt())return!0;let i=!0;for(const s of this.requiredComponents)if(!this.isComponentAvailable(s)){i=!1;const e=new Error(`Required component "${s}" is not registered. Please import and register the component before using ${this.tagName.toLowerCase()}.`);t?t(s,e):console.error(e.message)}return i}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 i=this.requiredComponents.indexOf(t);i>-1&&this.requiredComponents.splice(i,1)}},Qt=t=>class extends t{dispatchCustomEvent(t,i){this.dispatchEvent(new CustomEvent(t,{detail:i,bubbles:!0,composed:!0}))}dispatchEventWithMetadata(t,i){var s;const e=Object.assign(Object.assign({},i),{timestamp:Date.now(),componentName:(null===(s=this.tagName)||void 0===s?void 0:s.toLowerCase())||"unknown"});this.dispatchCustomEvent(t,e)}dispatchInputEvent(t,i){const s=Object.assign({target:i.target||this,value:i.value,originalEvent:i.originalEvent},i);this.dispatchCustomEvent(t,s)}dispatchFocusEvent(t,i){const s=Object.assign({target:i.target||this,value:i.value,focused:i.focused,cursorPosition:i.cursorPosition,selectedText:i.selectedText},i);this.dispatchCustomEvent(t,s)}dispatchValidationEvent(t,i){var s;const e=Object.assign({target:i.target||this,value:i.value,isValid:null!==(s=i.isValid)&&void 0!==s&&s,error:i.error},i);this.dispatchCustomEvent(t,e)}dispatchActionEvent(t,i){const s=Object.assign({target:i.target||this,action:i.action,previousValue:i.previousValue,newValue:i.newValue},i);this.dispatchCustomEvent(t,s)}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}};
148
+ /**
149
+ * @license
150
+ * Copyright 2018 Google LLC
151
+ * SPDX-License-Identifier: BSD-3-Clause
152
+ */
153
+ /**
154
+ * @license
155
+ * Copyright 2025 Nuraly
156
+ * SPDX-License-Identifier: MIT
157
+ */
158
+ var Xt=function(t,i,s,e){for(var o,r=arguments.length,n=r<3?i:null===e?e=Object.getOwnPropertyDescriptor(i,s):e,l=t.length-1;l>=0;l--)(o=t[l])&&(n=(r<3?o(n):r>3?o(i,s,n):o(i,s))||n);return r>3&&n&&Object.defineProperty(i,s,n),n};let Yt=class extends((t=>Gt(Zt(Qt(t))))(Pt)){constructor(){super(...arguments),this.bordered=!0,this.size="default",this.closable=!1,this.checkable=!1,this.checked=!1,this.disabled=!1,this.closing=!1}onCloseClick(t){t.stopPropagation(),this.closable&&!this.disabled&&(this.closing=!0,setTimeout((()=>{this.dispatchEvent(new CustomEvent("nr-tag-close",{bubbles:!0,composed:!0})),this.closing=!1}),200))}onToggleChecked(){this.checkable&&!this.disabled&&(this.checked=!this.checked,this.dispatchEvent(new CustomEvent("nr-tag-checked-change",{detail:{checked:this.checked},bubbles:!0,composed:!0})))}isPreset(t){return!!t&&ti.has(t)}render(){const t=!!this.color&&!this.isPreset(this.color),i=Object.assign(Object.assign({tag:!0,"tag--small":"small"===this.size,"tag--borderless":!this.bordered,"tag--closable":this.closable,"tag--checkable":this.checkable,"tag--checked":this.checkable&&this.checked,"tag--disabled":this.disabled,"tag--closing":this.closing},this.color&&this.isPreset(this.color)?{[`tag--${this.color}`]:!0}:{}),{"tag--custom":t}),s={};t&&this.color&&(s["--nr-tag-custom-bg"]=this.color);const e=this.checkable?"switch":"button",o=this.checkable?this.checked?"true":"false":void 0;return yt`
159
+ <span
160
+ class=${Vt(i)}
161
+ style=${Object.entries(s).map((([t,i])=>`${t}: ${i}`)).join(";")}
162
+ role=${e}
163
+ aria-pressed=${(t=>null!=t?t:D)
164
+ /**
165
+ * @license
166
+ * Copyright 2025 Nuraly
167
+ * SPDX-License-Identifier: MIT
168
+ */(o)}
169
+ aria-disabled=${this.disabled?"true":"false"}
170
+ @click=${this.checkable?this.onToggleChecked:void 0}
171
+ >
172
+ <span class="tag__icon"><slot name="icon"></slot></span>
173
+ <span class="tag__content"><slot></slot></span>
174
+ ${this.closable?yt`
175
+ <button class="tag__close" part="close" aria-label="close" ?disabled=${this.disabled} @click=${this.onCloseClick}>
176
+ ×
177
+ </button>
178
+ `:wt}
179
+ </span>
180
+ `}};Yt.styles=Wt,Xt([Kt({type:String})],Yt.prototype,"color",void 0),Xt([Kt({type:Boolean,reflect:!0})],Yt.prototype,"bordered",void 0),Xt([Kt({type:String})],Yt.prototype,"size",void 0),Xt([Kt({type:Boolean})],Yt.prototype,"closable",void 0),Xt([Kt({type:Boolean})],Yt.prototype,"checkable",void 0),Xt([Kt({type:Boolean,reflect:!0})],Yt.prototype,"checked",void 0),Xt([Kt({type:Boolean,reflect:!0})],Yt.prototype,"disabled",void 0),Xt([function(t){return Kt({...t,state:!0})}()],Yt.prototype,"closing",void 0),Yt=Xt([(t=>i=>"function"==typeof i?((t,i)=>(customElements.define(t,i),i))(t,i):((t,i)=>{const{kind:s,elements:e}=i;return{kind:s,elements:e,finisher(i){customElements.define(t,i)}}})(t,i))("nr-tag")],Yt);const ti=new Set(["magenta","red","volcano","orange","gold","lime","green","cyan","blue","geekblue","purple"]);export{Yt as NrTagElement};
package/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export * from './tag.component.js';
2
+ //# sourceMappingURL=index.d.ts.map
package/index.js ADDED
@@ -0,0 +1,2 @@
1
+ export * from './tag.component.js';
2
+ //# sourceMappingURL=index.js.map
package/index.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/tag/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './tag.component.js';\n"]}
package/package.json ADDED
@@ -0,0 +1,28 @@
1
+ {
2
+ "name": "@nuralyui/tag",
3
+ "version": "0.0.1",
4
+ "description": "Tag component for NuralyUI library",
5
+ "main": "index.js",
6
+ "type": "module",
7
+ "exports": {
8
+ ".": { "import": "./index.js" },
9
+ "./bundle": { "import": "./bundle.js" }
10
+ },
11
+ "files": [
12
+ "*.js",
13
+ "*.d.ts",
14
+ "*.js.map",
15
+ "tag.bundled.js",
16
+ "bundle.js"
17
+ ],
18
+ "repository": {
19
+ "type": "git",
20
+ "url": "https://github.com/NuralyUI/NuralyUI.git",
21
+ "directory": "src/components/tag"
22
+ },
23
+ "keywords": ["tag", "label", "chip", "web-components", "lit", "nuralyui"],
24
+ "author": "Nuraly",
25
+ "license": "MIT",
26
+ "bugs": { "url": "https://github.com/NuralyUI/NuralyUI/issues" },
27
+ "homepage": "https://github.com/NuralyUI/NuralyUI#readme"
28
+ }
package/react.d.ts ADDED
@@ -0,0 +1,6 @@
1
+ import { NrTagElement } from './tag.component.js';
2
+ export declare const NrTag: import("@lit-labs/react").ReactWebComponent<NrTagElement, {
3
+ 'nr-tag-close': string;
4
+ 'nr-tag-checked-change': string;
5
+ }>;
6
+ //# sourceMappingURL=react.d.ts.map
package/react.js ADDED
@@ -0,0 +1,13 @@
1
+ import { createComponent } from '@lit-labs/react';
2
+ import * as React from 'react';
3
+ import { NrTagElement } from './tag.component.js';
4
+ export const NrTag = createComponent({
5
+ tagName: 'nr-tag',
6
+ elementClass: NrTagElement,
7
+ react: React,
8
+ events: {
9
+ 'nr-tag-close': 'nr-tag-close',
10
+ 'nr-tag-checked-change': 'nr-tag-checked-change',
11
+ },
12
+ });
13
+ //# sourceMappingURL=react.js.map
package/react.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../src/components/tag/react.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAElD,MAAM,CAAC,MAAM,KAAK,GAAG,eAAe,CAAC;IACnC,OAAO,EAAE,QAAQ;IACjB,YAAY,EAAE,YAAY;IAC1B,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,cAAc,EAAE,cAAc;QAC9B,uBAAuB,EAAE,uBAAuB;KACjD;CACF,CAAC,CAAC","sourcesContent":["import { createComponent } from '@lit-labs/react';\nimport * as React from 'react';\nimport { NrTagElement } from './tag.component.js';\n\nexport const NrTag = createComponent({\n tagName: 'nr-tag',\n elementClass: NrTagElement,\n react: React,\n events: {\n 'nr-tag-close': 'nr-tag-close',\n 'nr-tag-checked-change': 'nr-tag-checked-change',\n },\n});\n"]}
@@ -0,0 +1,55 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2025 Nuraly
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ import { LitElement } from 'lit';
7
+ import { TagSize } from './tag.types.js';
8
+ declare const NrTagElement_base: (new (...args: any[]) => import("../../shared/dependency-mixin.js").DependencyAware) & (new (...args: any[]) => import("../../shared/theme-mixin.js").ThemeAware) & (new (...args: any[]) => import("../../shared/event-handler-mixin.js").EventHandlerCapable) & typeof LitElement;
9
+ /**
10
+ * Tag component
11
+ * Inspired by Ant Design Tag: https://ant.design/components/tag
12
+ *
13
+ * Features:
14
+ * - Preset colors and custom color support
15
+ * - Closable tags with onClose event
16
+ * - Checkable tags with checked state and change event
17
+ * - Small size variant
18
+ * - Disabled state
19
+ * - Theme-aware through CSS variables
20
+ *
21
+ * @slot - Tag content
22
+ * @slot icon - Optional leading icon
23
+ * @fires nr-tag-close - when the close icon is clicked
24
+ * @fires nr-tag-checked-change - when a checkable tag toggles
25
+ */
26
+ export declare class NrTagElement extends NrTagElement_base {
27
+ static styles: import("lit").CSSResult;
28
+ /** Tag color preset or custom color string (hex/rgb) */
29
+ color?: string;
30
+ /** Bordered style */
31
+ bordered: boolean;
32
+ /** Small size */
33
+ size: TagSize;
34
+ /** Closable */
35
+ closable: boolean;
36
+ /** Checkable */
37
+ checkable: boolean;
38
+ /** Checked (for checkable) */
39
+ checked: boolean;
40
+ /** Disabled */
41
+ disabled: boolean;
42
+ /** Internal closing anim state */
43
+ private closing;
44
+ private onCloseClick;
45
+ private onToggleChecked;
46
+ private isPreset;
47
+ render(): import("lit").TemplateResult<1>;
48
+ }
49
+ declare global {
50
+ interface HTMLElementTagNameMap {
51
+ 'nr-tag': NrTagElement;
52
+ }
53
+ }
54
+ export {};
55
+ //# sourceMappingURL=tag.component.d.ts.map
@@ -0,0 +1,143 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2025 Nuraly
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
7
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
8
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
9
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
10
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
11
+ };
12
+ import { LitElement, html, nothing } from 'lit';
13
+ import { customElement, property, state } from 'lit/decorators.js';
14
+ import { classMap } from 'lit/directives/class-map.js';
15
+ import { ifDefined } from 'lit/directives/if-defined.js';
16
+ import { styles } from './tag.style.js';
17
+ import { NuralyUIBaseMixin } from '../../shared/base-mixin.js';
18
+ /**
19
+ * Tag component
20
+ * Inspired by Ant Design Tag: https://ant.design/components/tag
21
+ *
22
+ * Features:
23
+ * - Preset colors and custom color support
24
+ * - Closable tags with onClose event
25
+ * - Checkable tags with checked state and change event
26
+ * - Small size variant
27
+ * - Disabled state
28
+ * - Theme-aware through CSS variables
29
+ *
30
+ * @slot - Tag content
31
+ * @slot icon - Optional leading icon
32
+ * @fires nr-tag-close - when the close icon is clicked
33
+ * @fires nr-tag-checked-change - when a checkable tag toggles
34
+ */
35
+ let NrTagElement = class NrTagElement extends NuralyUIBaseMixin(LitElement) {
36
+ constructor() {
37
+ super(...arguments);
38
+ /** Bordered style */
39
+ this.bordered = true;
40
+ /** Small size */
41
+ this.size = "default" /* TagSize.Default */;
42
+ /** Closable */
43
+ this.closable = false;
44
+ /** Checkable */
45
+ this.checkable = false;
46
+ /** Checked (for checkable) */
47
+ this.checked = false;
48
+ /** Disabled */
49
+ this.disabled = false;
50
+ /** Internal closing anim state */
51
+ this.closing = false;
52
+ }
53
+ onCloseClick(e) {
54
+ e.stopPropagation();
55
+ if (!this.closable || this.disabled)
56
+ return;
57
+ this.closing = true;
58
+ // match CSS animation duration ~200ms
59
+ setTimeout(() => {
60
+ this.dispatchEvent(new CustomEvent('nr-tag-close', { bubbles: true, composed: true }));
61
+ // Consumers can remove the element on event; keep visible otherwise
62
+ this.closing = false;
63
+ }, 200);
64
+ }
65
+ onToggleChecked() {
66
+ if (!this.checkable || this.disabled)
67
+ return;
68
+ this.checked = !this.checked;
69
+ this.dispatchEvent(new CustomEvent('nr-tag-checked-change', {
70
+ detail: { checked: this.checked },
71
+ bubbles: true,
72
+ composed: true,
73
+ }));
74
+ }
75
+ isPreset(color) {
76
+ if (!color)
77
+ return false;
78
+ return PRESET_COLOR_SET.has(color);
79
+ }
80
+ render() {
81
+ const isCustom = !!this.color && !this.isPreset(this.color);
82
+ const classes = Object.assign(Object.assign({ tag: true, 'tag--small': this.size === "small" /* TagSize.Small */, 'tag--borderless': !this.bordered, 'tag--closable': this.closable, 'tag--checkable': this.checkable, 'tag--checked': this.checkable && this.checked, 'tag--disabled': this.disabled, 'tag--closing': this.closing }, (this.color && this.isPreset(this.color) ? { [`tag--${this.color}`]: true } : {})), {
83
+ // custom color modifier
84
+ 'tag--custom': isCustom });
85
+ const styleMap = {};
86
+ if (isCustom && this.color) {
87
+ styleMap['--nr-tag-custom-bg'] = this.color;
88
+ }
89
+ const role = this.checkable ? 'switch' : 'button';
90
+ const ariaPressed = this.checkable ? (this.checked ? 'true' : 'false') : undefined;
91
+ return html `
92
+ <span
93
+ class=${classMap(classes)}
94
+ style=${Object.entries(styleMap).map(([k, v]) => `${k}: ${v}`).join(';')}
95
+ role=${role}
96
+ aria-pressed=${ifDefined(ariaPressed)}
97
+ aria-disabled=${this.disabled ? 'true' : 'false'}
98
+ @click=${this.checkable ? this.onToggleChecked : undefined}
99
+ >
100
+ <span class="tag__icon"><slot name="icon"></slot></span>
101
+ <span class="tag__content"><slot></slot></span>
102
+ ${this.closable ? html `
103
+ <button class="tag__close" part="close" aria-label="close" ?disabled=${this.disabled} @click=${this.onCloseClick}>
104
+ ×
105
+ </button>
106
+ ` : nothing}
107
+ </span>
108
+ `;
109
+ }
110
+ };
111
+ NrTagElement.styles = styles;
112
+ __decorate([
113
+ property({ type: String })
114
+ ], NrTagElement.prototype, "color", void 0);
115
+ __decorate([
116
+ property({ type: Boolean, reflect: true })
117
+ ], NrTagElement.prototype, "bordered", void 0);
118
+ __decorate([
119
+ property({ type: String })
120
+ ], NrTagElement.prototype, "size", void 0);
121
+ __decorate([
122
+ property({ type: Boolean })
123
+ ], NrTagElement.prototype, "closable", void 0);
124
+ __decorate([
125
+ property({ type: Boolean })
126
+ ], NrTagElement.prototype, "checkable", void 0);
127
+ __decorate([
128
+ property({ type: Boolean, reflect: true })
129
+ ], NrTagElement.prototype, "checked", void 0);
130
+ __decorate([
131
+ property({ type: Boolean, reflect: true })
132
+ ], NrTagElement.prototype, "disabled", void 0);
133
+ __decorate([
134
+ state()
135
+ ], NrTagElement.prototype, "closing", void 0);
136
+ NrTagElement = __decorate([
137
+ customElement('nr-tag')
138
+ ], NrTagElement);
139
+ export { NrTagElement };
140
+ const PRESET_COLOR_SET = new Set([
141
+ 'magenta', 'red', 'volcano', 'orange', 'gold', 'lime', 'green', 'cyan', 'blue', 'geekblue', 'purple'
142
+ ]);
143
+ //# sourceMappingURL=tag.component.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tag.component.js","sourceRoot":"","sources":["../../../src/components/tag/tag.component.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2025 Nuraly\n * SPDX-License-Identifier: MIT\n */\n\nimport { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { styles } from './tag.style.js';\nimport { NuralyUIBaseMixin } from '../../shared/base-mixin.js';\nimport { TagSize, type TagCheckedChangeDetail } from './tag.types.js';\n\n/**\n * Tag component\n * Inspired by Ant Design Tag: https://ant.design/components/tag\n *\n * Features:\n * - Preset colors and custom color support\n * - Closable tags with onClose event\n * - Checkable tags with checked state and change event\n * - Small size variant\n * - Disabled state\n * - Theme-aware through CSS variables\n *\n * @slot - Tag content\n * @slot icon - Optional leading icon\n * @fires nr-tag-close - when the close icon is clicked\n * @fires nr-tag-checked-change - when a checkable tag toggles\n */\n@customElement('nr-tag')\nexport class NrTagElement extends NuralyUIBaseMixin(LitElement) {\n static override styles = styles;\n\n /** Tag color preset or custom color string (hex/rgb) */\n @property({ type: String })\n color?: string;\n\n /** Bordered style */\n @property({ type: Boolean, reflect: true })\n bordered = true;\n\n /** Small size */\n @property({ type: String })\n size: TagSize = TagSize.Default;\n\n /** Closable */\n @property({ type: Boolean })\n closable = false;\n\n /** Checkable */\n @property({ type: Boolean })\n checkable = false;\n\n /** Checked (for checkable) */\n @property({ type: Boolean, reflect: true })\n checked = false;\n\n /** Disabled */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /** Internal closing anim state */\n @state() private closing = false;\n\n private onCloseClick(e: Event) {\n e.stopPropagation();\n if (!this.closable || this.disabled) return;\n this.closing = true;\n // match CSS animation duration ~200ms\n setTimeout(() => {\n this.dispatchEvent(new CustomEvent('nr-tag-close', { bubbles: true, composed: true }));\n // Consumers can remove the element on event; keep visible otherwise\n this.closing = false;\n }, 200);\n }\n\n private onToggleChecked() {\n if (!this.checkable || this.disabled) return;\n this.checked = !this.checked;\n this.dispatchEvent(new CustomEvent<TagCheckedChangeDetail>('nr-tag-checked-change', {\n detail: { checked: this.checked },\n bubbles: true,\n composed: true,\n }));\n }\n\n private isPreset(color?: string): boolean {\n if (!color) return false;\n return PRESET_COLOR_SET.has(color as string);\n }\n\n override render() {\n const isCustom = !!this.color && !this.isPreset(this.color as string);\n\n const classes = {\n tag: true,\n 'tag--small': this.size === TagSize.Small,\n 'tag--borderless': !this.bordered,\n 'tag--closable': this.closable,\n 'tag--checkable': this.checkable,\n 'tag--checked': this.checkable && this.checked,\n 'tag--disabled': this.disabled,\n 'tag--closing': this.closing,\n // preset color class e.g., tag--red\n ...(this.color && this.isPreset(this.color as string) ? { [`tag--${this.color}`]: true } : {}),\n // custom color modifier\n 'tag--custom': isCustom,\n };\n\n const styleMap: Record<string, string> = {};\n if (isCustom && this.color) {\n styleMap['--nr-tag-custom-bg'] = this.color as string;\n }\n\n const role = this.checkable ? 'switch' : 'button';\n const ariaPressed: 'true' | 'false' | undefined = this.checkable ? (this.checked ? 'true' : 'false') : undefined;\n\n return html`\n <span\n class=${classMap(classes)}\n style=${Object.entries(styleMap).map(([k, v]) => `${k}: ${v}`).join(';')}\n role=${role}\n aria-pressed=${ifDefined(ariaPressed)}\n aria-disabled=${this.disabled ? 'true' : 'false'}\n @click=${this.checkable ? this.onToggleChecked : undefined}\n >\n <span class=\"tag__icon\"><slot name=\"icon\"></slot></span>\n <span class=\"tag__content\"><slot></slot></span>\n ${this.closable ? html`\n <button class=\"tag__close\" part=\"close\" aria-label=\"close\" ?disabled=${this.disabled} @click=${this.onCloseClick}>\n ×\n </button>\n ` : nothing}\n </span>\n `;\n }\n}\n\nconst PRESET_COLOR_SET: Set<string> = new Set([\n 'magenta','red','volcano','orange','gold','lime','green','cyan','blue','geekblue','purple'\n]);\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'nr-tag': NrTagElement;\n }\n}\n"]}
package/tag.style.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2025 Nuraly
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ export declare const styles: import("lit").CSSResult;
7
+ //# sourceMappingURL=tag.style.d.ts.map
package/tag.style.js ADDED
@@ -0,0 +1,88 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2025 Nuraly
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ import { css } from 'lit';
7
+ export const styles = css `
8
+ :host { display: inline-block; }
9
+
10
+ .tag {
11
+ display: inline-flex;
12
+ align-items: center;
13
+ gap: var(--nuraly-tag-gap, 6px);
14
+ height: var(--nuraly-tag-height, auto);
15
+ padding: var(--nuraly-tag-padding-y, 0px) var(--nuraly-tag-padding-x, 8px);
16
+ font-family: var(--nuraly-font-family);
17
+ font-size: var(--nuraly-tag-font-size, var(--nuraly-font-size-sm));
18
+ line-height: 1;
19
+ color: var(--nuraly-tag-color, var(--nuraly-color-text));
20
+ background-color: var(--nuraly-tag-bg, var(--nuraly-color-background));
21
+ border: 1px solid var(--nuraly-tag-border-color, var(--nuraly-color-border));
22
+ border-radius: var(--nuraly-tag-radius, var(--nuraly-border-radius-sm));
23
+ transition: all var(--nuraly-transition-fast) ease;
24
+ user-select: none;
25
+ }
26
+
27
+ .tag--borderless { border-color: transparent; }
28
+
29
+ .tag--small {
30
+ padding: var(--nuraly-tag-padding-y-sm, 0px) var(--nuraly-tag-padding-x-sm, 6px);
31
+ font-size: var(--nuraly-tag-font-size-sm, var(--nuraly-font-size-xs));
32
+ }
33
+
34
+ /* Checkable behavior */
35
+ .tag--checkable { cursor: pointer; }
36
+ .tag--checkable:not(.tag--disabled):hover {
37
+ background-color: var(--nuraly-tag-checkable-hover-bg, var(--nuraly-color-background-hover));
38
+ }
39
+ .tag--checkable.tag--checked {
40
+ background-color: var(--nuraly-tag-checked-bg, var(--nuraly-color-primary-light));
41
+ color: var(--nuraly-tag-checked-color, var(--nuraly-color-primary-dark));
42
+ border-color: var(--nuraly-tag-checked-border-color, var(--nuraly-color-border-brand));
43
+ }
44
+
45
+ .tag--disabled { opacity: 0.6; cursor: not-allowed; }
46
+
47
+ .tag__icon { display: inline-flex; align-items: center; }
48
+ .tag__content { display: inline-flex; align-items: center; }
49
+
50
+ .tag__close {
51
+ display: inline-flex;
52
+ align-items: center;
53
+ justify-content: center;
54
+ width: 16px;
55
+ height: 16px;
56
+ line-height: 1;
57
+ padding: 0;
58
+ border: none;
59
+ background: transparent;
60
+ color: currentColor;
61
+ cursor: pointer;
62
+ border-radius: var(--nuraly-border-radius-xs);
63
+ transition: background-color var(--nuraly-transition-fast) ease, opacity var(--nuraly-transition-fast) ease;
64
+ }
65
+ .tag__close:hover { background-color: var(--nuraly-color-background-hover); }
66
+ .tag__close:disabled { cursor: not-allowed; opacity: 0.6; }
67
+
68
+ /* Closing animation (height/opacity collapse) */
69
+ @keyframes tagFadeOut { from { opacity: 1; } to { opacity: 0; } }
70
+ .tag--closing { animation: tagFadeOut 0.2s ease forwards; }
71
+
72
+ /* Preset solid color tags similar to AntD */
73
+ .tag--magenta { background-color: #f759ab; border-color: #f759ab; color: #fff; }
74
+ .tag--red { background-color: #ff4d4f; border-color: #ff4d4f; color: #fff; }
75
+ .tag--volcano { background-color: #fa541c; border-color: #fa541c; color: #fff; }
76
+ .tag--orange { background-color: #fa8c16; border-color: #fa8c16; color: #fff; }
77
+ .tag--gold { background-color: #faad14; border-color: #faad14; color: rgba(0,0,0,0.88); }
78
+ .tag--lime { background-color: #a0d911; border-color: #a0d911; color: rgba(0,0,0,0.88); }
79
+ .tag--green { background-color: #52c41a; border-color: #52c41a; color: #fff; }
80
+ .tag--cyan { background-color: #13c2c2; border-color: #13c2c2; color: #fff; }
81
+ .tag--blue { background-color: #1677ff; border-color: #1677ff; color: #fff; }
82
+ .tag--geekblue { background-color: #2f54eb; border-color: #2f54eb; color: #fff; }
83
+ .tag--purple { background-color: #722ed1; border-color: #722ed1; color: #fff; }
84
+
85
+ /* Custom color tag hue via inline CSS variable */
86
+ .tag--custom { background-color: var(--nr-tag-custom-bg); border-color: var(--nr-tag-custom-bg); color: var(--nuraly-color-text-on-color, #fff); }
87
+ `;
88
+ //# sourceMappingURL=tag.style.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tag.style.js","sourceRoot":"","sources":["../../../src/components/tag/tag.style.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgFxB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2025 Nuraly\n * SPDX-License-Identifier: MIT\n */\n\nimport { css } from 'lit';\n\nexport const styles = css`\n :host { display: inline-block; }\n\n .tag {\n display: inline-flex;\n align-items: center;\n gap: var(--nuraly-tag-gap, 6px);\n height: var(--nuraly-tag-height, auto);\n padding: var(--nuraly-tag-padding-y, 0px) var(--nuraly-tag-padding-x, 8px);\n font-family: var(--nuraly-font-family);\n font-size: var(--nuraly-tag-font-size, var(--nuraly-font-size-sm));\n line-height: 1;\n color: var(--nuraly-tag-color, var(--nuraly-color-text));\n background-color: var(--nuraly-tag-bg, var(--nuraly-color-background));\n border: 1px solid var(--nuraly-tag-border-color, var(--nuraly-color-border));\n border-radius: var(--nuraly-tag-radius, var(--nuraly-border-radius-sm));\n transition: all var(--nuraly-transition-fast) ease;\n user-select: none;\n }\n\n .tag--borderless { border-color: transparent; }\n\n .tag--small {\n padding: var(--nuraly-tag-padding-y-sm, 0px) var(--nuraly-tag-padding-x-sm, 6px);\n font-size: var(--nuraly-tag-font-size-sm, var(--nuraly-font-size-xs));\n }\n\n /* Checkable behavior */\n .tag--checkable { cursor: pointer; }\n .tag--checkable:not(.tag--disabled):hover {\n background-color: var(--nuraly-tag-checkable-hover-bg, var(--nuraly-color-background-hover));\n }\n .tag--checkable.tag--checked {\n background-color: var(--nuraly-tag-checked-bg, var(--nuraly-color-primary-light));\n color: var(--nuraly-tag-checked-color, var(--nuraly-color-primary-dark));\n border-color: var(--nuraly-tag-checked-border-color, var(--nuraly-color-border-brand));\n }\n\n .tag--disabled { opacity: 0.6; cursor: not-allowed; }\n\n .tag__icon { display: inline-flex; align-items: center; }\n .tag__content { display: inline-flex; align-items: center; }\n\n .tag__close {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n line-height: 1;\n padding: 0;\n border: none;\n background: transparent;\n color: currentColor;\n cursor: pointer;\n border-radius: var(--nuraly-border-radius-xs);\n transition: background-color var(--nuraly-transition-fast) ease, opacity var(--nuraly-transition-fast) ease;\n }\n .tag__close:hover { background-color: var(--nuraly-color-background-hover); }\n .tag__close:disabled { cursor: not-allowed; opacity: 0.6; }\n\n /* Closing animation (height/opacity collapse) */\n @keyframes tagFadeOut { from { opacity: 1; } to { opacity: 0; } }\n .tag--closing { animation: tagFadeOut 0.2s ease forwards; }\n\n /* Preset solid color tags similar to AntD */\n .tag--magenta { background-color: #f759ab; border-color: #f759ab; color: #fff; }\n .tag--red { background-color: #ff4d4f; border-color: #ff4d4f; color: #fff; }\n .tag--volcano { background-color: #fa541c; border-color: #fa541c; color: #fff; }\n .tag--orange { background-color: #fa8c16; border-color: #fa8c16; color: #fff; }\n .tag--gold { background-color: #faad14; border-color: #faad14; color: rgba(0,0,0,0.88); }\n .tag--lime { background-color: #a0d911; border-color: #a0d911; color: rgba(0,0,0,0.88); }\n .tag--green { background-color: #52c41a; border-color: #52c41a; color: #fff; }\n .tag--cyan { background-color: #13c2c2; border-color: #13c2c2; color: #fff; }\n .tag--blue { background-color: #1677ff; border-color: #1677ff; color: #fff; }\n .tag--geekblue { background-color: #2f54eb; border-color: #2f54eb; color: #fff; }\n .tag--purple { background-color: #722ed1; border-color: #722ed1; color: #fff; }\n\n /* Custom color tag hue via inline CSS variable */\n .tag--custom { background-color: var(--nr-tag-custom-bg); border-color: var(--nr-tag-custom-bg); color: var(--nuraly-color-text-on-color, #fff); }\n`;\n"]}
package/tag.types.d.ts ADDED
@@ -0,0 +1,28 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2025 Nuraly
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ /** Preset color names for Tag component */
7
+ export declare const enum TagPresetColor {
8
+ Magenta = "magenta",
9
+ Red = "red",
10
+ Volcano = "volcano",
11
+ Orange = "orange",
12
+ Gold = "gold",
13
+ Lime = "lime",
14
+ Green = "green",
15
+ Cyan = "cyan",
16
+ Blue = "blue",
17
+ Geekblue = "geekblue",
18
+ Purple = "purple"
19
+ }
20
+ /** Tag sizes */
21
+ export declare const enum TagSize {
22
+ Default = "default",
23
+ Small = "small"
24
+ }
25
+ export interface TagCheckedChangeDetail {
26
+ checked: boolean;
27
+ }
28
+ //# sourceMappingURL=tag.types.d.ts.map
package/tag.types.js ADDED
@@ -0,0 +1,7 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2025 Nuraly
4
+ * SPDX-License-Identifier: MIT
5
+ */
6
+ export {};
7
+ //# sourceMappingURL=tag.types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tag.types.js","sourceRoot":"","sources":["../../../src/components/tag/tag.types.ts"],"names":[],"mappings":"AAAA;;;;GAIG","sourcesContent":["/**\n * @license\n * Copyright 2025 Nuraly\n * SPDX-License-Identifier: MIT\n */\n\n/** Preset color names for Tag component */\nexport const enum TagPresetColor {\n Magenta = 'magenta',\n Red = 'red',\n Volcano = 'volcano',\n Orange = 'orange',\n Gold = 'gold',\n Lime = 'lime',\n Green = 'green',\n Cyan = 'cyan',\n Blue = 'blue',\n Geekblue = 'geekblue',\n Purple = 'purple',\n}\n\n/** Tag sizes */\nexport const enum TagSize {\n Default = 'default',\n Small = 'small',\n}\n\nexport interface TagCheckedChangeDetail {\n checked: boolean;\n}\n"]}