@nysds/nys-label 1.11.4 → 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-label.js +15 -12
- package/dist/nys-label.js.map +1 -1
- package/package.json +3 -3
package/dist/nys-label.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { LitElement as c, unsafeCSS as _, html as i } from "lit";
|
|
2
2
|
import { property as o } from "lit/decorators.js";
|
|
3
|
-
const b = ':host{--_nys-label-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-label-font-weight: var(--nys-font-weight-semibold, 600);--_nys-label-font-size: var(--nys-font-size-ui-md, 16px);--_nys-label-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-label-letter-spacing: var(--nys-font-letterspacing-ui-md, .044px);--_nys-label-color: var(--nys-color-text, #1b1b1b);--_nys-label-cursor: normal;--_nys-description-font-weight: var(--nys-font-weight-regular, 400);--_nys-description-font-style: italic;--_nys-description-font-color: var(--nys-color-text, #1b1b1b);--_nys-required-font-color: var(--nys-color-danger, #b52c2c);--_nys-optional-font-weight: var(--nys-font-weight-regular, 400);--_nys-optional-font-color: var(--nys-color-text-weak, #4a4d4f);--_nys-label-gap: var(--nys-space-4px, 4px)}.nys-label{display:flex;flex-direction:column;align-items:flex-start;font-family:var(--_nys-label-font-family);font-size:var(--_nys-label-font-size);line-height:var(--_nys-label-line-height);letter-spacing:var(--_nys-label-letter-spacing)}.nys-label *{cursor:var(--_nys-label-cursor)}.nys-label__label{display:flex;gap:var(--_nys-label-gap);text-align:left;font-weight:var(--_nys-label-font-weight);color:var(--_nys-label-color)}.nys-label__description{text-align:left;font-weight:var(--_nys-description-font-weight);font-style:var(--_nys-description-font-style);color:var(--_nys-description-font-color)}.nys-label__required{display:contents;font-weight:var(--_nys-label-font-weight);color:var(--_nys-required-font-color)}.nys-label__optional{display:contents;font-weight:var(--_nys-optional-font-weight);color:var(--_nys-optional-font-color)}.nys-label__tooltip-wrapper{display:flex;gap:
|
|
4
|
-
var v = Object.defineProperty,
|
|
5
|
-
for (var e = s > 1 ? void 0 : s ?
|
|
3
|
+
const b = ':host{--_nys-label-font-family: var( --nys-font-family-ui, var( --nys-font-family-sans, "Proxima Nova", "Helvetica Neue", "Helvetica", "Arial", sans-serif ) );--_nys-label-font-weight: var(--nys-font-weight-semibold, 600);--_nys-label-font-size: var(--nys-font-size-ui-md, 16px);--_nys-label-line-height: var(--nys-font-lineheight-ui-md, 24px);--_nys-label-letter-spacing: var(--nys-font-letterspacing-ui-md, .044px);--_nys-label-color: var(--nys-color-text, #1b1b1b);--_nys-label-cursor: normal;--_nys-description-font-weight: var(--nys-font-weight-regular, 400);--_nys-description-font-style: italic;--_nys-description-font-color: var(--nys-color-text, #1b1b1b);--_nys-required-font-color: var(--nys-color-danger, #b52c2c);--_nys-optional-font-weight: var(--nys-font-weight-regular, 400);--_nys-optional-font-color: var(--nys-color-text-weak, #4a4d4f);--_nys-label-gap: var(--nys-space-4px, 4px)}.nys-label{display:flex;flex-direction:column;align-items:flex-start;font-family:var(--_nys-label-font-family);font-size:var(--_nys-label-font-size);line-height:var(--_nys-label-line-height);letter-spacing:var(--_nys-label-letter-spacing)}.nys-label *{cursor:var(--_nys-label-cursor)}.nys-label__label{display:flex;gap:var(--_nys-label-gap);text-align:left;font-weight:var(--_nys-label-font-weight);color:var(--_nys-label-color)}.nys-label__description{text-align:left;font-weight:var(--_nys-description-font-weight);font-style:var(--_nys-description-font-style);color:var(--_nys-description-font-color)}.nys-label__required{display:contents;font-weight:var(--_nys-label-font-weight);color:var(--_nys-required-font-color)}.nys-label__optional{display:contents;font-weight:var(--_nys-optional-font-weight);color:var(--_nys-optional-font-color)}.nys-label__tooltip-wrapper{display:flex;gap:2px;align-items:center}.nys-label.invert .nys-label__label,.nys-label.invert .nys-label__description,.nys-label.invert .nys-label__optional{color:var(--nys-color-text-reverse, #fff)}.nys-label.invert .nys-label__tooltip-icon{color:var(--nys-color-ink-reverse, #fff)}';
|
|
4
|
+
var v = Object.defineProperty, h = Object.getOwnPropertyDescriptor, n = (f, l, r, s) => {
|
|
5
|
+
for (var e = s > 1 ? void 0 : s ? h(l, r) : l, a = f.length - 1, y; a >= 0; a--)
|
|
6
6
|
(y = f[a]) && (e = (s ? y(l, r, e) : y(e)) || e);
|
|
7
7
|
return s && e && v(l, r, e), e;
|
|
8
8
|
};
|
|
@@ -26,15 +26,18 @@ const p = class p extends c {
|
|
|
26
26
|
${this.flag === "optional" ? i`<div class="nys-label__optional">(Optional)</div>` : ""}</label
|
|
27
27
|
>
|
|
28
28
|
${this._tooltip ? i`<nys-tooltip
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
29
|
+
text="${this._tooltip}"
|
|
30
|
+
position="top"
|
|
31
|
+
focusable
|
|
32
|
+
?inverted=${this.inverted}
|
|
33
|
+
for="tooltip-icon-${this.for}"
|
|
34
|
+
>
|
|
35
|
+
</nys-tooltip>
|
|
36
|
+
<nys-icon
|
|
37
|
+
id="tooltip-icon-${this.for}"
|
|
38
|
+
name="info"
|
|
39
|
+
size="3xl"
|
|
40
|
+
></nys-icon> ` : ""}
|
|
38
41
|
</div>
|
|
39
42
|
<label for=${this.for} class="nys-label__description">
|
|
40
43
|
<slot name="description">${this.description}</slot>
|
package/dist/nys-label.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nys-label.js","sources":["../src/nys-label.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-label.scss?inline\";\n\nexport class NysLabel extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String }) for = \"\";\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: String }) flag = \"\";\n @property({ type: Boolean, reflect: true }) inverted = false;\n @property({ type: String })\n get tooltip() {\n return this._tooltip;\n }\n set tooltip(value: string) {\n this._tooltip = value;\n }\n private _tooltip: string = \"\";\n\n render() {\n return html`\n <div class=\"nys-label ${this.inverted ? \"invert\" : \"\"}\">\n <div class=\"nys-label__tooltip-wrapper\">\n <label for=${this.for} class=\"nys-label__label\"\n >${this.label}\n ${this.flag === \"required\"\n ? html`<div class=\"nys-label__required\">*</div>`\n : \"\"}\n ${this.flag === \"optional\"\n ? html`<div class=\"nys-label__optional\">(Optional)</div>`\n : \"\"}</label\n >\n ${this._tooltip\n ? html`<nys-tooltip\n
|
|
1
|
+
{"version":3,"file":"nys-label.js","sources":["../src/nys-label.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-label.scss?inline\";\n\n/**\n * THIS IS A PRIVATE COMPONENT!\n * `NysLabel` is a component for rendering form labels with optional\n * descriptions, flags (required/optional), and tooltips.\n */\nexport class NysLabel extends LitElement {\n static styles = unsafeCSS(styles);\n\n @property({ type: String }) for = \"\";\n @property({ type: String }) label = \"\";\n @property({ type: String }) description = \"\";\n @property({ type: String }) flag = \"\";\n @property({ type: Boolean, reflect: true }) inverted = false;\n @property({ type: String })\n get tooltip() {\n return this._tooltip;\n }\n set tooltip(value: string) {\n this._tooltip = value;\n }\n private _tooltip: string = \"\";\n\n render() {\n return html`\n <div class=\"nys-label ${this.inverted ? \"invert\" : \"\"}\">\n <div class=\"nys-label__tooltip-wrapper\">\n <label for=${this.for} class=\"nys-label__label\"\n >${this.label}\n ${this.flag === \"required\"\n ? html`<div class=\"nys-label__required\">*</div>`\n : \"\"}\n ${this.flag === \"optional\"\n ? html`<div class=\"nys-label__optional\">(Optional)</div>`\n : \"\"}</label\n >\n ${this._tooltip\n ? html`<nys-tooltip\n text=\"${this._tooltip}\"\n position=\"top\"\n focusable\n ?inverted=${this.inverted}\n for=\"tooltip-icon-${this.for}\"\n >\n </nys-tooltip>\n <nys-icon\n id=\"tooltip-icon-${this.for}\"\n name=\"info\"\n size=\"3xl\"\n ></nys-icon> `\n : \"\"}\n </div>\n <label for=${this.for} class=\"nys-label__description\">\n <slot name=\"description\">${this.description}</slot>\n </label>\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-label\")) {\n customElements.define(\"nys-label\", NysLabel);\n}\n"],"names":["_NysLabel","LitElement","value","html","unsafeCSS","styles","NysLabel","__decorateClass","property"],"mappings":";;;;;;;;AAUO,MAAMA,IAAN,MAAMA,UAAiBC,EAAW;AAAA,EAAlC,cAAA;AAAA,UAAA,GAAA,SAAA,GAGuB,KAAA,MAAM,IACN,KAAA,QAAQ,IACR,KAAA,cAAc,IACd,KAAA,OAAO,IACS,KAAA,WAAW,IAQvD,KAAQ,WAAmB;AAAA,EAAA;AAAA,EAN3B,IAAI,UAAU;AACZ,WAAO,KAAK;AAAA,EACd;AAAA,EACA,IAAI,QAAQC,GAAe;AACzB,SAAK,WAAWA;AAAA,EAClB;AAAA,EAGA,SAAS;AACP,WAAOC;AAAA,8BACmB,KAAK,WAAW,WAAW,EAAE;AAAA;AAAA,uBAEpC,KAAK,GAAG;AAAA,eAChB,KAAK,KAAK;AAAA,cACX,KAAK,SAAS,aACZA,8CACA,EAAE;AAAA,cACJ,KAAK,SAAS,aACZA,uDACA,EAAE;AAAA;AAAA,YAEN,KAAK,WACHA;AAAA,0BACY,KAAK,QAAQ;AAAA;AAAA;AAAA,8BAGT,KAAK,QAAQ;AAAA,sCACL,KAAK,GAAG;AAAA;AAAA;AAAA;AAAA,qCAIT,KAAK,GAAG;AAAA;AAAA;AAAA,iCAI/B,EAAE;AAAA;AAAA,qBAEK,KAAK,GAAG;AAAA,qCACQ,KAAK,WAAW;AAAA;AAAA;AAAA;AAAA,EAInD;AACF;AAnDEH,EAAO,SAASI,EAAUC,CAAM;AAD3B,IAAMC,IAANN;AAGuBO,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAHfF,EAGiB,WAAA,OAAA,CAAA;AACAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAJfF,EAIiB,WAAA,SAAA,CAAA;AACAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GALfF,EAKiB,WAAA,eAAA,CAAA;AACAC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GANfF,EAMiB,WAAA,QAAA,CAAA;AACgBC,EAAA;AAAA,EAA3CC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAP/BF,EAOiC,WAAA,YAAA,CAAA;AAExCC,EAAA;AAAA,EADHC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GARfF,EASP,WAAA,WAAA,CAAA;AA6CD,eAAe,IAAI,WAAW,KACjC,eAAe,OAAO,aAAaA,CAAQ;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nysds/nys-label",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.13.0",
|
|
4
4
|
"description": "The Label component from the NYS Design System.",
|
|
5
5
|
"module": "dist/nys-label.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
"lit-analyze": "lit-analyzer '**/*.ts'"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@nysds/nys-icon": "^1.
|
|
27
|
-
"@nysds/nys-tooltip": "^1.
|
|
26
|
+
"@nysds/nys-icon": "^1.13.0",
|
|
27
|
+
"@nysds/nys-tooltip": "^1.13.0"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
30
30
|
"lit": "^3.3.1",
|