@nuralyui/tag 0.0.5 → 0.0.6
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 +2 -2
- package/index.js.map +1 -1
- package/package.json +1 -1
- package/react.js.map +1 -1
- package/tag.component.d.ts +1 -1
- package/tag.component.js.map +1 -1
- package/tag.style.js.map +1 -1
- package/tag.types.js.map +1 -1
package/bundle.js
CHANGED
|
@@ -88,10 +88,10 @@ import{css as o,LitElement as r,html as a,nothing as t}from"lit";import{property
|
|
|
88
88
|
* @license
|
|
89
89
|
* Copyright 2025 Nuraly
|
|
90
90
|
* SPDX-License-Identifier: MIT
|
|
91
|
-
*/;var g=function(o,r,a,t){for(var e,l=arguments.length,c=l<3?r:null===t?t=Object.getOwnPropertyDescriptor(r,a):t,i=o.length-1;i>=0;i--)(e=o[i])&&(c=(l<3?e(c):l>3?e(r,a,c):e(r,a))||c);return l>3&&c&&Object.defineProperty(r,a,c),c};let u=class extends(n(r)){constructor(){super(...arguments),this.bordered=!0,this.size="default",this.closable=!1,this.checkable=!1,this.checked=!1,this.disabled=!1,this.closing=!1}connectedCallback(){super.connectedCallback(),this.lightDomObserver=new MutationObserver((
|
|
91
|
+
*/;var g=function(o,r,a,t){for(var e,l=arguments.length,c=l<3?r:null===t?t=Object.getOwnPropertyDescriptor(r,a):t,i=o.length-1;i>=0;i--)(e=o[i])&&(c=(l<3?e(c):l>3?e(r,a,c):e(r,a))||c);return l>3&&c&&Object.defineProperty(r,a,c),c};let u=class extends(n(r)){constructor(){super(...arguments),this.bordered=!0,this.size="default",this.closable=!1,this.checkable=!1,this.checked=!1,this.disabled=!1,this.closing=!1}connectedCallback(){super.connectedCallback(),this.lightDomObserver=new MutationObserver(()=>{this.requestUpdate()}),this.lightDomObserver.observe(this,{childList:!0,subtree:!1,attributes:!0,attributeFilter:["slot"]})}disconnectedCallback(){var o;null===(o=this.lightDomObserver)||void 0===o||o.disconnect(),this.lightDomObserver=void 0,super.disconnectedCallback()}onCloseClick(o){o.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(o){return!!o&&b.has(o)}render(){const o=!!this.querySelector('[slot="icon"]'),r=!!this.color&&!this.isPreset(this.color),e=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":r}),l={};r&&this.color&&(l["--nr-tag-custom-bg"]=this.color);const c=this.checkable?"switch":"button",n=this.checkable?this.checked?"true":"false":void 0;return a`
|
|
92
92
|
<span
|
|
93
93
|
class=${i(e)}
|
|
94
|
-
style=${Object.entries(l).map((
|
|
94
|
+
style=${Object.entries(l).map(([o,r])=>`${o}: ${r}`).join(";")}
|
|
95
95
|
role=${c}
|
|
96
96
|
aria-pressed=${s(n)}
|
|
97
97
|
aria-disabled=${this.disabled?"true":"false"}
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["
|
|
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
CHANGED
package/react.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react.js","sourceRoot":"","sources":["
|
|
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"]}
|
package/tag.component.d.ts
CHANGED
|
@@ -46,7 +46,7 @@ export declare class NrTagElement extends NrTagElement_base {
|
|
|
46
46
|
private onCloseClick;
|
|
47
47
|
private onToggleChecked;
|
|
48
48
|
private isPreset;
|
|
49
|
-
render(): import("lit").TemplateResult<1>;
|
|
49
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
50
50
|
}
|
|
51
51
|
declare global {
|
|
52
52
|
interface HTMLElementTagNameMap {
|
package/tag.component.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tag.component.js","sourceRoot":"","sources":["
|
|
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 '@nuralyui/common/mixins';\nimport { TagSize, type TagCheckedChangeDetail } from './tag.types.js';\n\n/**\n * Tag component\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 /** Track if an icon is actually provided via slot */\n private lightDomObserver?: MutationObserver;\n\n override connectedCallback(): void {\n super.connectedCallback();\n // Observe light DOM children to detect when an icon slot is added/removed dynamically\n this.lightDomObserver = new MutationObserver(() => {\n // Trigger re-render so we can recompute hasIcon in render()\n this.requestUpdate();\n });\n this.lightDomObserver.observe(this, { childList: true, subtree: false, attributes: true, attributeFilter: ['slot'] });\n }\n\n override disconnectedCallback(): void {\n this.lightDomObserver?.disconnect();\n this.lightDomObserver = undefined;\n super.disconnectedCallback();\n }\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 hasIcon = !!this.querySelector('[slot=\"icon\"]');\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 ${hasIcon ? html`<span class=\"tag__icon\"><slot name=\"icon\"></slot></span>` : nothing}\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.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tag.style.js","sourceRoot":"","sources":["
|
|
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.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tag.types.js","sourceRoot":"","sources":["
|
|
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"]}
|