@nysds/nys-badge 1.12.0 → 1.13.0
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/dist/nys-badge.js +9 -0
- package/dist/nys-badge.js.map +1 -1
- package/package.json +2 -2
package/dist/nys-badge.js
CHANGED
|
@@ -22,6 +22,10 @@ const s = (r = class extends l {
|
|
|
22
22
|
set suffixIcon(e) {
|
|
23
23
|
e === "" || e === null ? this._suffixIcon = !0 : e === "false" || e === !1 ? this._suffixIcon = "" : this._suffixIcon = e;
|
|
24
24
|
}
|
|
25
|
+
/**
|
|
26
|
+
* Lifecycle methods
|
|
27
|
+
* --------------------------------------------------------------------------
|
|
28
|
+
*/
|
|
25
29
|
connectedCallback() {
|
|
26
30
|
super.connectedCallback();
|
|
27
31
|
const e = this.getAttribute("prefixicon");
|
|
@@ -29,6 +33,11 @@ const s = (r = class extends l {
|
|
|
29
33
|
const n = this.getAttribute("suffixicon");
|
|
30
34
|
n !== null && this.suffixIcon === "" && (this.suffixIcon = n);
|
|
31
35
|
}
|
|
36
|
+
/**
|
|
37
|
+
* Resolves which icon should be rendered.
|
|
38
|
+
* @param icon The icon property value (string or boolean)
|
|
39
|
+
* @returns Icon name or null if no icon should be rendered
|
|
40
|
+
*/
|
|
32
41
|
resolveIcon(e) {
|
|
33
42
|
return e === !0 ? r.DEFAULT_ICONS[this.intent] ?? "info" : typeof e == "string" && e.trim() !== "" ? e : null;
|
|
34
43
|
}
|
package/dist/nys-badge.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nys-badge.js","sources":["../src/nys-badge.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-badge.scss?inline\";\n\nexport class NysBadge extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n @property({ type: String, reflect: true }) intent:\n | \"neutral\"\n | \"error\"\n | \"success\"\n | \"warning\" = \"neutral\";\n @property({ type: String }) prefixLabel = \"\";\n @property({ type: String }) label = \"\";\n\n // Icons (string or boolean)\n private _prefixIcon: string | boolean = \"\";\n @property({ type: String, attribute: \"prefixicon\" })\n get prefixIcon(): string | boolean {\n return this._prefixIcon;\n }\n set prefixIcon(value: string | boolean) {\n if (value === \"\" || value === null) {\n // boolean attribute without value → true\n this._prefixIcon = true;\n } else if (value === \"false\" || value === false) {\n this._prefixIcon = \"\";\n } else {\n this._prefixIcon = value;\n }\n }\n\n private _suffixIcon: string | boolean = \"\";\n @property({ type: String, attribute: \"suffixicon\" })\n get suffixIcon(): string | boolean {\n return this._suffixIcon;\n }\n set suffixIcon(value: string | boolean) {\n if (value === \"\" || value === null) {\n this._suffixIcon = true;\n } else if (value === \"false\" || value === false) {\n this._suffixIcon = \"\";\n } else {\n this._suffixIcon = value;\n }\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n const attr = this.getAttribute(\"prefixicon\");\n if (attr !== null && this.prefixIcon === \"\") {\n this.prefixIcon = attr;\n }\n\n const suffixAttr = this.getAttribute(\"suffixicon\");\n if (suffixAttr !== null && this.suffixIcon === \"\") {\n this.suffixIcon = suffixAttr;\n }\n }\n\n // Map of default icons by intent\n private static readonly DEFAULT_ICONS: Record<string, string> = {\n neutral: \"info\",\n error: \"emergency_home\",\n success: \"check_circle\",\n warning: \"warning\",\n };\n\n private resolveIcon(icon: string | boolean): string | null {\n if (icon === true) {\n return NysBadge.DEFAULT_ICONS[this.intent] ?? \"info\";\n }\n if (typeof icon === \"string\" && icon.trim() !== \"\") {\n return icon;\n }\n return null;\n }\n\n render() {\n const prefixIconName = this.resolveIcon(this.prefixIcon);\n const suffixIconName = this.resolveIcon(this.suffixIcon);\n\n return html`\n <div class=\"nys-badge\">\n ${prefixIconName\n ? html`<nys-icon size=\"16\" name=${prefixIconName}></nys-icon>`\n : \"\"}\n ${this.prefixLabel\n ? html`<div class=\"nys-badge__prefix\">${this.prefixLabel}</div>`\n : \"\"}\n <div class=\"nys-badge__label\">${this.label}</div>\n ${suffixIconName\n ? html`<nys-icon size=\"16\" name=${suffixIconName}></nys-icon>`\n : \"\"}\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-badge\")) {\n customElements.define(\"nys-badge\", NysBadge);\n}\n"],"names":["_NysBadge","_a","LitElement","value","attr","suffixAttr","icon","prefixIconName","suffixIconName","html","unsafeCSS","styles","__decorateClass","property","NysBadge"],"mappings":";;;;;;;;
|
|
1
|
+
{"version":3,"file":"nys-badge.js","sources":["../src/nys-badge.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-badge.scss?inline\";\n\n/**\n * `<nys-badge>` displays a badge with optional prefix/suffix icons and labels.\n *\n * Features:\n * - Conveys an intent (`neutral`, `error`, `success`, `warning`) which affects default icons and styling.\n * - Supports custom prefix and suffix icons.\n */\n\nexport class NysBadge extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String, reflect: true }) id = \"\";\n @property({ type: String, reflect: true }) name = \"\";\n @property({ type: String, reflect: true }) size: \"sm\" | \"md\" = \"md\";\n @property({ type: String, reflect: true }) intent:\n | \"neutral\"\n | \"error\"\n | \"success\"\n | \"warning\" = \"neutral\";\n @property({ type: String }) prefixLabel = \"\";\n @property({ type: String }) label = \"\";\n\n // Icons (string or boolean)\n private _prefixIcon: string | boolean = \"\";\n @property({ type: String, attribute: \"prefixicon\" })\n get prefixIcon(): string | boolean {\n return this._prefixIcon;\n }\n set prefixIcon(value: string | boolean) {\n if (value === \"\" || value === null) {\n // boolean attribute without value → true\n this._prefixIcon = true;\n } else if (value === \"false\" || value === false) {\n this._prefixIcon = \"\";\n } else {\n this._prefixIcon = value;\n }\n }\n\n private _suffixIcon: string | boolean = \"\";\n @property({ type: String, attribute: \"suffixicon\" })\n get suffixIcon(): string | boolean {\n return this._suffixIcon;\n }\n set suffixIcon(value: string | boolean) {\n if (value === \"\" || value === null) {\n this._suffixIcon = true;\n } else if (value === \"false\" || value === false) {\n this._suffixIcon = \"\";\n } else {\n this._suffixIcon = value;\n }\n }\n\n /**\n * Lifecycle methods\n * --------------------------------------------------------------------------\n */\n\n connectedCallback() {\n super.connectedCallback();\n\n const attr = this.getAttribute(\"prefixicon\");\n if (attr !== null && this.prefixIcon === \"\") {\n this.prefixIcon = attr;\n }\n\n const suffixAttr = this.getAttribute(\"suffixicon\");\n if (suffixAttr !== null && this.suffixIcon === \"\") {\n this.suffixIcon = suffixAttr;\n }\n }\n\n /**\n * Functions\n * --------------------------------------------------------------------------\n */\n\n // Map of default icons by intent\n private static readonly DEFAULT_ICONS: Record<string, string> = {\n neutral: \"info\",\n error: \"emergency_home\",\n success: \"check_circle\",\n warning: \"warning\",\n };\n\n /**\n * Resolves which icon should be rendered.\n * @param icon The icon property value (string or boolean)\n * @returns Icon name or null if no icon should be rendered\n */\n private resolveIcon(icon: string | boolean): string | null {\n if (icon === true) {\n return NysBadge.DEFAULT_ICONS[this.intent] ?? \"info\";\n }\n if (typeof icon === \"string\" && icon.trim() !== \"\") {\n return icon;\n }\n return null;\n }\n\n render() {\n const prefixIconName = this.resolveIcon(this.prefixIcon);\n const suffixIconName = this.resolveIcon(this.suffixIcon);\n\n return html`\n <div class=\"nys-badge\">\n ${prefixIconName\n ? html`<nys-icon size=\"16\" name=${prefixIconName}></nys-icon>`\n : \"\"}\n ${this.prefixLabel\n ? html`<div class=\"nys-badge__prefix\">${this.prefixLabel}</div>`\n : \"\"}\n <div class=\"nys-badge__label\">${this.label}</div>\n ${suffixIconName\n ? html`<nys-icon size=\"16\" name=${suffixIconName}></nys-icon>`\n : \"\"}\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-badge\")) {\n customElements.define(\"nys-badge\", NysBadge);\n}\n"],"names":["_NysBadge","_a","LitElement","value","attr","suffixAttr","icon","prefixIconName","suffixIconName","html","unsafeCSS","styles","__decorateClass","property","NysBadge"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nysds/nys-badge",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.13.0",
|
|
4
4
|
"description": "The Badge component from the NYS Design System.",
|
|
5
5
|
"module": "dist/nys-badge.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"lit-analyze": "lit-analyzer '**/*.ts'"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@nysds/nys-icon": "^1.
|
|
26
|
+
"@nysds/nys-icon": "^1.13.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"lit": "^3.3.1",
|