@nuralyui/label 0.0.16 → 0.0.18

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 CHANGED
@@ -1 +1,104 @@
1
- import{css as l,LitElement as a,html as r}from"lit";import{property as o,customElement as e}from"lit/decorators.js";import{NuralyUIBaseMixin as n}from"@nuralyui/common/mixins";var t=l`${l`:host{--nuraly-label-local-font-family:var(--nuraly-typograpnr-label-font-family, var(--nuraly-font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif));--nuraly-label-local-font-weight:var(--nuraly-typograpnr-label-font-weight, var(--nuraly-font-weight-medium, 500));--nuraly-label-local-line-height:var(--nuraly-typograpnr-label-line-height, var(--nuraly-line-height-base, 1.5));--nuraly-label-local-small-font-size:var(--nuraly-typograpnr-label-small-font-size, var(--nuraly-font-size-xs, 12px));--nuraly-label-local-medium-font-size:var(--nuraly-typograpnr-label-medium-font-size, var(--nuraly-font-size-sm, 14px));--nuraly-label-local-large-font-size:var(--nuraly-typograpnr-label-large-font-size, var(--nuraly-font-size-base, 16px));--nuraly-label-local-font-size:var(--nuraly-label-local-medium-font-size);--nuraly-label-local-text-color:var(--nuraly-color-label-text, var(--nuraly-color-text-primary, #000000));--nuraly-label-local-secondary-color:var(--nuraly-color-label-secondary, var(--nuraly-color-text-secondary, #666666));--nuraly-label-local-error-color:var(--nuraly-color-label-error, var(--nuraly-color-error-500, #ff4d4f));--nuraly-label-local-warning-color:var(--nuraly-color-label-warning, var(--nuraly-color-warning-500, #faad14));--nuraly-label-local-success-color:var(--nuraly-color-label-success, var(--nuraly-color-success-500, #52c41a));--nuraly-label-local-required-color:var(--nuraly-color-label-required, var(--nuraly-color-error-500, #ff4d4f));--nuraly-label-local-disabled-color:var(--nuraly-color-label-disabled, var(--nuraly-color-text-disabled, #bfbfbf));--nuraly-label-local-margin-bottom:var(--nuraly-spacing-label-margin-bottom, var(--nuraly-spacing-xs, 4px));--nuraly-label-local-required-margin:var(--nuraly-spacing-label-required-margin, var(--nuraly-spacing-2xs, 2px));--nuraly-label-local-transition-duration:var(--nuraly-transition-label-duration, var(--nuraly-transition-duration-base, 150ms));--nuraly-label-local-transition-timing:var(--nuraly-transition-label-timing, var(--nuraly-transition-timing-ease, ease))}`}:host{display:inline-block;width:fit-content}label{font-family:var(--nuraly-label-local-font-family);font-size:var(--nuraly-label-local-font-size);font-weight:var(--nuraly-label-local-font-weight);line-height:var(--nuraly-label-local-line-height);color:var(--nuraly-label-local-text-color);margin:0;margin-bottom:var(--nuraly-label-local-margin-bottom);display:block;user-select:none;cursor:pointer;transition:color var(--nuraly-label-local-transition-duration) var(--nuraly-label-local-transition-timing)}:host([size=small]) label{font-size:var(--nuraly-label-local-small-font-size)}:host([size=large]) label{font-size:var(--nuraly-label-local-large-font-size)}:host([variant=secondary]) label{color:var(--nuraly-label-local-secondary-color)}:host([variant=error]) label{color:var(--nuraly-label-local-error-color)}:host([variant=warning]) label{color:var(--nuraly-label-local-warning-color)}:host([variant=success]) label{color:var(--nuraly-label-local-success-color)}:host([disabled]) label{color:var(--nuraly-label-local-disabled-color);cursor:not-allowed;opacity:.6}.required-asterisk{color:var(--nuraly-label-local-required-color);margin-left:var(--nuraly-label-local-required-margin);font-weight:400}:host(:focus-within) label:not([disabled]){opacity:.8}`,i=function(l,a,r,o){for(var e,n=arguments.length,t=n<3?a:null===o?o=Object.getOwnPropertyDescriptor(a,r):o,i=l.length-1;i>=0;i--)(e=l[i])&&(t=(n<3?e(t):n>3?e(a,r,t):e(a,r))||t);return n>3&&t&&Object.defineProperty(a,r,t),t};let s=class extends(n(a)){constructor(){super(...arguments),this.size="medium",this.variant="default",this.required=!1,this.disabled=!1,this.value=""}connectedCallback(){super.connectedCallback(),this.updateDataTheme()}updated(){this.updateDataTheme()}updateDataTheme(){this.closest("[data-theme]")||this.setAttribute("data-theme",this.currentTheme)}render(){return r`<label for="${this.for||""}"><slot></slot>${this.required?r`<span class="required-asterisk">*</span>`:""}</label>`}};s.styles=t,i([o({reflect:!0})],s.prototype,"size",void 0),i([o({reflect:!0})],s.prototype,"variant",void 0),i([o({type:Boolean,reflect:!0})],s.prototype,"required",void 0),i([o({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),i([o()],s.prototype,"for",void 0),i([o()],s.prototype,"value",void 0),s=i([e("nr-label")],s);export{s as HyTextLabel};
1
+ import{css as a,LitElement as l,html as r}from"lit";import{property as e,customElement as o}from"lit/decorators.js";import{NuralyUIBaseMixin as n}from"@nuralyui/common/mixins";var t=a`
2
+ ${a`
3
+ :host {
4
+ /* Typography */
5
+ --nuraly-label-font-family: var(--nuraly-font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif);
6
+ --nuraly-label-font-weight: var(--nuraly-font-weight-medium, 300);
7
+ --nuraly-label-line-height: var(--nuraly-line-height-base, auto);
8
+
9
+ /* Size variants */
10
+ --nuraly-label-small-font-size: var(--nuraly-font-size-xs, 12px);
11
+ --nuraly-label-medium-font-size: var(--nuraly-font-size-sm, 14px);
12
+ --nuraly-label-large-font-size: var(--nuraly-font-size-base, 16px);
13
+
14
+ /* Default font size */
15
+ --nuraly-label-font-size: var(--nuraly-label-medium-font-size);
16
+
17
+ /* Colors */
18
+ --nuraly-label-text-color: var(--nuraly-color-text-primary, #000000);
19
+ --nuraly-label-secondary-color: var(--nuraly-color-text-secondary, #666666);
20
+ --nuraly-label-error-color: var(--nuraly-color-error-500, #ff4d4f);
21
+ --nuraly-label-warning-color: var(--nuraly-color-warning-500, #faad14);
22
+ --nuraly-label-success-color: var(--nuraly-color-success-500, #52c41a);
23
+ --nuraly-label-required-color: var(--nuraly-color-error-500, #ff4d4f);
24
+ --nuraly-label-disabled-color: var(--nuraly-color-text-disabled, #bfbfbf);
25
+
26
+ /* Spacing */
27
+ --nuraly-label-margin-bottom: var(--nuraly-spacing-xs, 4px);
28
+ --nuraly-label-required-margin: var(--nuraly-spacing-2xs, 2px);
29
+
30
+ /* Transitions */
31
+ --nuraly-label-transition-duration: var(--nuraly-transition-duration-base, 150ms);
32
+ --nuraly-label-transition-timing: var(--nuraly-transition-timing-ease, ease);
33
+ }
34
+ `}
35
+
36
+ :host {
37
+ display: inline-block;
38
+ width: fit-content;
39
+ }
40
+
41
+ label {
42
+ font-family: var(--nuraly-label-font-family);
43
+ font-size: var(--nuraly-label-font-size);
44
+ font-weight: var(--nuraly-label-font-weight);
45
+ line-height: var(--nuraly-label-line-height);
46
+ color: var(--nuraly-label-text-color);
47
+ margin: 0;
48
+ margin-bottom: var(--nuraly-label-margin-bottom);
49
+ display: block;
50
+ user-select: none;
51
+ cursor: pointer;
52
+ transition: color var(--nuraly-label-transition-duration) var(--nuraly-label-transition-timing);
53
+ }
54
+
55
+ /* Size variants */
56
+ :host([size="small"]) label {
57
+ font-size: var(--nuraly-label-small-font-size);
58
+ }
59
+
60
+ :host([size="large"]) label {
61
+ font-size: var(--nuraly-label-large-font-size);
62
+ }
63
+
64
+ /* Variant colors */
65
+ :host([variant="secondary"]) label {
66
+ color: var(--nuraly-label-secondary-color);
67
+ }
68
+
69
+ :host([variant="error"]) label {
70
+ color: var(--nuraly-label-error-color);
71
+ }
72
+
73
+ :host([variant="warning"]) label {
74
+ color: var(--nuraly-label-warning-color);
75
+ }
76
+
77
+ :host([variant="success"]) label {
78
+ color: var(--nuraly-label-success-color);
79
+ }
80
+
81
+ /* Disabled state */
82
+ :host([disabled]) label {
83
+ color: var(--nuraly-label-disabled-color);
84
+ cursor: not-allowed;
85
+ opacity: 0.6;
86
+ }
87
+
88
+ /* Required asterisk */
89
+ .required-asterisk {
90
+ color: var(--nuraly-label-required-color);
91
+ margin-left: var(--nuraly-label-required-margin);
92
+ font-weight: normal;
93
+ }
94
+
95
+ /* Focus-within for accessibility when label is associated with form elements */
96
+ :host(:focus-within) label:not([disabled]) {
97
+ opacity: 0.8;
98
+ }
99
+ `,i=function(a,l,r,e){for(var o,n=arguments.length,t=n<3?l:null===e?e=Object.getOwnPropertyDescriptor(l,r):e,i=a.length-1;i>=0;i--)(o=a[i])&&(t=(n<3?o(t):n>3?o(l,r,t):o(l,r))||t);return n>3&&t&&Object.defineProperty(l,r,t),t};let s=class extends(n(l)){constructor(){super(...arguments),this.size="medium",this.variant="default",this.required=!1,this.disabled=!1,this.value=""}connectedCallback(){super.connectedCallback(),this.updateDataTheme()}updated(){this.updateDataTheme()}updateDataTheme(){this.closest("[data-theme]")||this.setAttribute("data-theme",this.currentTheme)}render(){return r`
100
+ <label for=${this.for||""}>
101
+ <slot></slot>
102
+ ${this.required?r`<span class="required-asterisk">*</span>`:""}
103
+ </label>
104
+ `}};s.styles=t,i([e({reflect:!0})],s.prototype,"size",void 0),i([e({reflect:!0})],s.prototype,"variant",void 0),i([e({type:Boolean,reflect:!0})],s.prototype,"required",void 0),i([e({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),i([e()],s.prototype,"for",void 0),i([e()],s.prototype,"value",void 0),s=i([o("nr-label")],s);export{s as HyTextLabel};
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/label/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC","sourcesContent":["export * from './label.component.js';"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/label/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC","sourcesContent":["export * from './label.component.js';"]}
@@ -12,7 +12,7 @@ export declare class HyTextLabel extends HyTextLabel_base {
12
12
  connectedCallback(): void;
13
13
  updated(): void;
14
14
  private updateDataTheme;
15
- render(): import("lit").TemplateResult<1>;
15
+ render(): import("lit-html").TemplateResult<1>;
16
16
  }
17
17
  export {};
18
18
  //# sourceMappingURL=label.component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"label.component.js","sourceRoot":"","sources":["../../../src/components/label/label.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAG5D,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,iBAAiB,CAAC,UAAU,CAAC;IAA9D;;QAII,SAAI,GAAc,QAAQ,CAAC;QAG3B,YAAO,GAAiB,SAAS,CAAC;QAGlC,aAAQ,GAAG,KAAK,CAAC;QAGjB,aAAQ,GAAG,KAAK,CAAC;QAMjB,UAAK,GAAG,EAAE,CAAC;IAyBf,CAAC;IAvBY,iBAAiB;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,eAAe,EAAE,CAAC;IAC3B,CAAC;IAEQ,OAAO;QACZ,IAAI,CAAC,eAAe,EAAE,CAAC;IAC3B,CAAC;IAEM,eAAe;QAClB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE;YAC/B,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SACtD;IACL,CAAC;IAEQ,MAAM;QACX,OAAO,IAAI,CAAA;yBACM,IAAI,CAAC,GAAG,IAAI,EAAE;;kBAErB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,0CAA0C,CAAC,CAAC,CAAC,EAAE;;SAE5E,CAAC;IACN,CAAC;CACJ,CAAA;AA3CmB,kBAAM,GAAG,MAAO,CAAA;AAGhC;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCACD;AAG3B;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CACM;AAGlC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAC1B;AAGjB;IADC,QAAQ,EAAE;wCACE;AAGb;IADC,QAAQ,EAAE;0CACA;AAnBF,WAAW;IADvB,aAAa,CAAC,UAAU,CAAC;GACb,WAAW,CA4CvB;SA5CY,WAAW","sourcesContent":["import { html, LitElement } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport styles from \"./label.style.js\";\nimport { LabelSize, LabelVariant } from './label.types.js';\nimport { NuralyUIBaseMixin } from '@nuralyui/common/mixins';\n\n@customElement('nr-label')\nexport class HyTextLabel extends NuralyUIBaseMixin(LitElement) {\n static override styles = styles;\n\n @property({ reflect: true })\n size: LabelSize = 'medium';\n\n @property({ reflect: true })\n variant: LabelVariant = 'default';\n\n @property({ type: Boolean, reflect: true })\n required = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property()\n for?: string;\n\n @property()\n value = '';\n\n override connectedCallback() {\n super.connectedCallback();\n this.updateDataTheme();\n }\n\n override updated() {\n this.updateDataTheme();\n }\n\n private updateDataTheme() {\n if (!this.closest('[data-theme]')) {\n this.setAttribute('data-theme', this.currentTheme);\n }\n }\n\n override render() {\n return html`\n <label for=${this.for || ''}>\n <slot></slot>\n ${this.required ? html`<span class=\"required-asterisk\">*</span>` : ''}\n </label>\n `;\n }\n}"]}
1
+ {"version":3,"file":"label.component.js","sourceRoot":"","sources":["../../../../src/components/label/label.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,MAAM,MAAM,kBAAkB,CAAC;AAEtC,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAG5D,IAAa,WAAW,GAAxB,MAAa,WAAY,SAAQ,iBAAiB,CAAC,UAAU,CAAC;IAA9D;;QAII,SAAI,GAAc,QAAQ,CAAC;QAG3B,YAAO,GAAiB,SAAS,CAAC;QAGlC,aAAQ,GAAG,KAAK,CAAC;QAGjB,aAAQ,GAAG,KAAK,CAAC;QAMjB,UAAK,GAAG,EAAE,CAAC;IAyBf,CAAC;IAvBY,iBAAiB;QACtB,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,eAAe,EAAE,CAAC;IAC3B,CAAC;IAEQ,OAAO;QACZ,IAAI,CAAC,eAAe,EAAE,CAAC;IAC3B,CAAC;IAEM,eAAe;QAClB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE;YAC/B,IAAI,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;SACtD;IACL,CAAC;IAEQ,MAAM;QACX,OAAO,IAAI,CAAA;yBACM,IAAI,CAAC,GAAG,IAAI,EAAE;;kBAErB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,0CAA0C,CAAC,CAAC,CAAC,EAAE;;SAE5E,CAAC;IACN,CAAC;CACJ,CAAA;AA3CmB,kBAAM,GAAG,MAAO,CAAA;AAGhC;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yCACD;AAG3B;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;4CACM;AAGlC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAC1B;AAGjB;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;6CAC1B;AAGjB;IADC,QAAQ,EAAE;wCACE;AAGb;IADC,QAAQ,EAAE;0CACA;AAnBF,WAAW;IADvB,aAAa,CAAC,UAAU,CAAC;GACb,WAAW,CA4CvB;SA5CY,WAAW","sourcesContent":["import { html, LitElement } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport styles from \"./label.style.js\";\nimport { LabelSize, LabelVariant } from './label.types.js';\nimport { NuralyUIBaseMixin } from '@nuralyui/common/mixins';\n\n@customElement('nr-label')\nexport class HyTextLabel extends NuralyUIBaseMixin(LitElement) {\n static override styles = styles;\n\n @property({ reflect: true })\n size: LabelSize = 'medium';\n\n @property({ reflect: true })\n variant: LabelVariant = 'default';\n\n @property({ type: Boolean, reflect: true })\n required = false;\n\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n @property()\n for?: string;\n\n @property()\n value = '';\n\n override connectedCallback() {\n super.connectedCallback();\n this.updateDataTheme();\n }\n\n override updated() {\n this.updateDataTheme();\n }\n\n private updateDataTheme() {\n if (!this.closest('[data-theme]')) {\n this.setAttribute('data-theme', this.currentTheme);\n }\n }\n\n override render() {\n return html`\n <label for=${this.for || ''}>\n <slot></slot>\n ${this.required ? html`<span class=\"required-asterisk\">*</span>` : ''}\n </label>\n `;\n }\n}"]}
package/label.style.js CHANGED
@@ -9,56 +9,56 @@ export default css `
9
9
  }
10
10
 
11
11
  label {
12
- font-family: var(--nuraly-label-local-font-family);
13
- font-size: var(--nuraly-label-local-font-size);
14
- font-weight: var(--nuraly-label-local-font-weight);
15
- line-height: var(--nuraly-label-local-line-height);
16
- color: var(--nuraly-label-local-text-color);
12
+ font-family: var(--nuraly-label-font-family);
13
+ font-size: var(--nuraly-label-font-size);
14
+ font-weight: var(--nuraly-label-font-weight);
15
+ line-height: var(--nuraly-label-line-height);
16
+ color: var(--nuraly-label-text-color);
17
17
  margin: 0;
18
- margin-bottom: var(--nuraly-label-local-margin-bottom);
18
+ margin-bottom: var(--nuraly-label-margin-bottom);
19
19
  display: block;
20
20
  user-select: none;
21
21
  cursor: pointer;
22
- transition: color var(--nuraly-label-local-transition-duration) var(--nuraly-label-local-transition-timing);
22
+ transition: color var(--nuraly-label-transition-duration) var(--nuraly-label-transition-timing);
23
23
  }
24
24
 
25
25
  /* Size variants */
26
26
  :host([size="small"]) label {
27
- font-size: var(--nuraly-label-local-small-font-size);
27
+ font-size: var(--nuraly-label-small-font-size);
28
28
  }
29
29
 
30
30
  :host([size="large"]) label {
31
- font-size: var(--nuraly-label-local-large-font-size);
31
+ font-size: var(--nuraly-label-large-font-size);
32
32
  }
33
33
 
34
34
  /* Variant colors */
35
35
  :host([variant="secondary"]) label {
36
- color: var(--nuraly-label-local-secondary-color);
36
+ color: var(--nuraly-label-secondary-color);
37
37
  }
38
38
 
39
39
  :host([variant="error"]) label {
40
- color: var(--nuraly-label-local-error-color);
40
+ color: var(--nuraly-label-error-color);
41
41
  }
42
42
 
43
43
  :host([variant="warning"]) label {
44
- color: var(--nuraly-label-local-warning-color);
44
+ color: var(--nuraly-label-warning-color);
45
45
  }
46
46
 
47
47
  :host([variant="success"]) label {
48
- color: var(--nuraly-label-local-success-color);
48
+ color: var(--nuraly-label-success-color);
49
49
  }
50
50
 
51
51
  /* Disabled state */
52
52
  :host([disabled]) label {
53
- color: var(--nuraly-label-local-disabled-color);
53
+ color: var(--nuraly-label-disabled-color);
54
54
  cursor: not-allowed;
55
55
  opacity: 0.6;
56
56
  }
57
57
 
58
58
  /* Required asterisk */
59
59
  .required-asterisk {
60
- color: var(--nuraly-label-local-required-color);
61
- margin-left: var(--nuraly-label-local-required-margin);
60
+ color: var(--nuraly-label-required-color);
61
+ margin-left: var(--nuraly-label-required-margin);
62
62
  font-weight: normal;
63
63
  }
64
64
 
@@ -1 +1 @@
1
- {"version":3,"file":"label.style.js","sourceRoot":"","sources":["../../../src/components/label/label.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAE5D,eAAe,GAAG,CAAA;IACd,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEjB,CAAC","sourcesContent":["import { css } from \"lit\";\nimport { styleVariables } from './label.style.variables.js';\n\nexport default css`\n ${styleVariables}\n\n :host {\n display: inline-block;\n width: fit-content;\n }\n\n label {\n font-family: var(--nuraly-label-local-font-family);\n font-size: var(--nuraly-label-local-font-size);\n font-weight: var(--nuraly-label-local-font-weight);\n line-height: var(--nuraly-label-local-line-height);\n color: var(--nuraly-label-local-text-color);\n margin: 0;\n margin-bottom: var(--nuraly-label-local-margin-bottom);\n display: block;\n user-select: none;\n cursor: pointer;\n transition: color var(--nuraly-label-local-transition-duration) var(--nuraly-label-local-transition-timing);\n }\n\n /* Size variants */\n :host([size=\"small\"]) label {\n font-size: var(--nuraly-label-local-small-font-size);\n }\n\n :host([size=\"large\"]) label {\n font-size: var(--nuraly-label-local-large-font-size);\n }\n\n /* Variant colors */\n :host([variant=\"secondary\"]) label {\n color: var(--nuraly-label-local-secondary-color);\n }\n\n :host([variant=\"error\"]) label {\n color: var(--nuraly-label-local-error-color);\n }\n\n :host([variant=\"warning\"]) label {\n color: var(--nuraly-label-local-warning-color);\n }\n\n :host([variant=\"success\"]) label {\n color: var(--nuraly-label-local-success-color);\n }\n\n /* Disabled state */\n :host([disabled]) label {\n color: var(--nuraly-label-local-disabled-color);\n cursor: not-allowed;\n opacity: 0.6;\n }\n\n /* Required asterisk */\n .required-asterisk {\n color: var(--nuraly-label-local-required-color);\n margin-left: var(--nuraly-label-local-required-margin);\n font-weight: normal;\n }\n\n /* Focus-within for accessibility when label is associated with form elements */\n :host(:focus-within) label:not([disabled]) {\n opacity: 0.8;\n }\n`;"]}
1
+ {"version":3,"file":"label.style.js","sourceRoot":"","sources":["../../../../src/components/label/label.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAE5D,eAAe,GAAG,CAAA;IACd,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiEjB,CAAC","sourcesContent":["import { css } from \"lit\";\nimport { styleVariables } from './label.style.variables.js';\n\nexport default css`\n ${styleVariables}\n\n :host {\n display: inline-block;\n width: fit-content;\n }\n\n label {\n font-family: var(--nuraly-label-font-family);\n font-size: var(--nuraly-label-font-size);\n font-weight: var(--nuraly-label-font-weight);\n line-height: var(--nuraly-label-line-height);\n color: var(--nuraly-label-text-color);\n margin: 0;\n margin-bottom: var(--nuraly-label-margin-bottom);\n display: block;\n user-select: none;\n cursor: pointer;\n transition: color var(--nuraly-label-transition-duration) var(--nuraly-label-transition-timing);\n }\n\n /* Size variants */\n :host([size=\"small\"]) label {\n font-size: var(--nuraly-label-small-font-size);\n }\n\n :host([size=\"large\"]) label {\n font-size: var(--nuraly-label-large-font-size);\n }\n\n /* Variant colors */\n :host([variant=\"secondary\"]) label {\n color: var(--nuraly-label-secondary-color);\n }\n\n :host([variant=\"error\"]) label {\n color: var(--nuraly-label-error-color);\n }\n\n :host([variant=\"warning\"]) label {\n color: var(--nuraly-label-warning-color);\n }\n\n :host([variant=\"success\"]) label {\n color: var(--nuraly-label-success-color);\n }\n\n /* Disabled state */\n :host([disabled]) label {\n color: var(--nuraly-label-disabled-color);\n cursor: not-allowed;\n opacity: 0.6;\n }\n\n /* Required asterisk */\n .required-asterisk {\n color: var(--nuraly-label-required-color);\n margin-left: var(--nuraly-label-required-margin);\n font-weight: normal;\n }\n\n /* Focus-within for accessibility when label is associated with form elements */\n :host(:focus-within) label:not([disabled]) {\n opacity: 0.8;\n }\n`;"]}
@@ -2,34 +2,34 @@ import { css } from 'lit';
2
2
  export const styleVariables = css `
3
3
  :host {
4
4
  /* Typography */
5
- --nuraly-label-local-font-family: var(--nuraly-typograpnr-label-font-family, var(--nuraly-font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif));
6
- --nuraly-label-local-font-weight: var(--nuraly-typograpnr-label-font-weight, var(--nuraly-font-weight-medium, 500));
7
- --nuraly-label-local-line-height: var(--nuraly-typograpnr-label-line-height, var(--nuraly-line-height-base, 1.5));
5
+ --nuraly-label-font-family: var(--nuraly-font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif);
6
+ --nuraly-label-font-weight: var(--nuraly-font-weight-medium, 300);
7
+ --nuraly-label-line-height: var(--nuraly-line-height-base, auto);
8
8
 
9
9
  /* Size variants */
10
- --nuraly-label-local-small-font-size: var(--nuraly-typograpnr-label-small-font-size, var(--nuraly-font-size-xs, 12px));
11
- --nuraly-label-local-medium-font-size: var(--nuraly-typograpnr-label-medium-font-size, var(--nuraly-font-size-sm, 14px));
12
- --nuraly-label-local-large-font-size: var(--nuraly-typograpnr-label-large-font-size, var(--nuraly-font-size-base, 16px));
10
+ --nuraly-label-small-font-size: var(--nuraly-font-size-xs, 12px);
11
+ --nuraly-label-medium-font-size: var(--nuraly-font-size-sm, 14px);
12
+ --nuraly-label-large-font-size: var(--nuraly-font-size-base, 16px);
13
13
 
14
14
  /* Default font size */
15
- --nuraly-label-local-font-size: var(--nuraly-label-local-medium-font-size);
15
+ --nuraly-label-font-size: var(--nuraly-label-medium-font-size);
16
16
 
17
17
  /* Colors */
18
- --nuraly-label-local-text-color: var(--nuraly-color-label-text, var(--nuraly-color-text-primary, #000000));
19
- --nuraly-label-local-secondary-color: var(--nuraly-color-label-secondary, var(--nuraly-color-text-secondary, #666666));
20
- --nuraly-label-local-error-color: var(--nuraly-color-label-error, var(--nuraly-color-error-500, #ff4d4f));
21
- --nuraly-label-local-warning-color: var(--nuraly-color-label-warning, var(--nuraly-color-warning-500, #faad14));
22
- --nuraly-label-local-success-color: var(--nuraly-color-label-success, var(--nuraly-color-success-500, #52c41a));
23
- --nuraly-label-local-required-color: var(--nuraly-color-label-required, var(--nuraly-color-error-500, #ff4d4f));
24
- --nuraly-label-local-disabled-color: var(--nuraly-color-label-disabled, var(--nuraly-color-text-disabled, #bfbfbf));
18
+ --nuraly-label-text-color: var(--nuraly-color-text-primary, #000000);
19
+ --nuraly-label-secondary-color: var(--nuraly-color-text-secondary, #666666);
20
+ --nuraly-label-error-color: var(--nuraly-color-error-500, #ff4d4f);
21
+ --nuraly-label-warning-color: var(--nuraly-color-warning-500, #faad14);
22
+ --nuraly-label-success-color: var(--nuraly-color-success-500, #52c41a);
23
+ --nuraly-label-required-color: var(--nuraly-color-error-500, #ff4d4f);
24
+ --nuraly-label-disabled-color: var(--nuraly-color-text-disabled, #bfbfbf);
25
25
 
26
26
  /* Spacing */
27
- --nuraly-label-local-margin-bottom: var(--nuraly-spacing-label-margin-bottom, var(--nuraly-spacing-xs, 4px));
28
- --nuraly-label-local-required-margin: var(--nuraly-spacing-label-required-margin, var(--nuraly-spacing-2xs, 2px));
27
+ --nuraly-label-margin-bottom: var(--nuraly-spacing-xs, 4px);
28
+ --nuraly-label-required-margin: var(--nuraly-spacing-2xs, 2px);
29
29
 
30
30
  /* Transitions */
31
- --nuraly-label-local-transition-duration: var(--nuraly-transition-label-duration, var(--nuraly-transition-duration-base, 150ms));
32
- --nuraly-label-local-transition-timing: var(--nuraly-transition-label-timing, var(--nuraly-transition-timing-ease, ease));
31
+ --nuraly-label-transition-duration: var(--nuraly-transition-duration-base, 150ms);
32
+ --nuraly-label-transition-timing: var(--nuraly-transition-timing-ease, ease);
33
33
  }
34
34
  `;
35
35
  //# sourceMappingURL=label.style.variables.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"label.style.variables.js","sourceRoot":"","sources":["../../../src/components/label/label.style.variables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgChC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styleVariables = css`\n :host {\n /* Typography */\n --nuraly-label-local-font-family: var(--nuraly-typograpnr-label-font-family, var(--nuraly-font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif));\n --nuraly-label-local-font-weight: var(--nuraly-typograpnr-label-font-weight, var(--nuraly-font-weight-medium, 500));\n --nuraly-label-local-line-height: var(--nuraly-typograpnr-label-line-height, var(--nuraly-line-height-base, 1.5));\n\n /* Size variants */\n --nuraly-label-local-small-font-size: var(--nuraly-typograpnr-label-small-font-size, var(--nuraly-font-size-xs, 12px));\n --nuraly-label-local-medium-font-size: var(--nuraly-typograpnr-label-medium-font-size, var(--nuraly-font-size-sm, 14px));\n --nuraly-label-local-large-font-size: var(--nuraly-typograpnr-label-large-font-size, var(--nuraly-font-size-base, 16px));\n\n /* Default font size */\n --nuraly-label-local-font-size: var(--nuraly-label-local-medium-font-size);\n\n /* Colors */\n --nuraly-label-local-text-color: var(--nuraly-color-label-text, var(--nuraly-color-text-primary, #000000));\n --nuraly-label-local-secondary-color: var(--nuraly-color-label-secondary, var(--nuraly-color-text-secondary, #666666));\n --nuraly-label-local-error-color: var(--nuraly-color-label-error, var(--nuraly-color-error-500, #ff4d4f));\n --nuraly-label-local-warning-color: var(--nuraly-color-label-warning, var(--nuraly-color-warning-500, #faad14));\n --nuraly-label-local-success-color: var(--nuraly-color-label-success, var(--nuraly-color-success-500, #52c41a));\n --nuraly-label-local-required-color: var(--nuraly-color-label-required, var(--nuraly-color-error-500, #ff4d4f));\n --nuraly-label-local-disabled-color: var(--nuraly-color-label-disabled, var(--nuraly-color-text-disabled, #bfbfbf));\n\n /* Spacing */\n --nuraly-label-local-margin-bottom: var(--nuraly-spacing-label-margin-bottom, var(--nuraly-spacing-xs, 4px));\n --nuraly-label-local-required-margin: var(--nuraly-spacing-label-required-margin, var(--nuraly-spacing-2xs, 2px));\n\n /* Transitions */\n --nuraly-label-local-transition-duration: var(--nuraly-transition-label-duration, var(--nuraly-transition-duration-base, 150ms));\n --nuraly-label-local-transition-timing: var(--nuraly-transition-label-timing, var(--nuraly-transition-timing-ease, ease));\n }\n`;"]}
1
+ {"version":3,"file":"label.style.variables.js","sourceRoot":"","sources":["../../../../src/components/label/label.style.variables.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgChC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styleVariables = css`\n :host {\n /* Typography */\n --nuraly-label-font-family: var(--nuraly-font-family-base, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif);\n --nuraly-label-font-weight: var(--nuraly-font-weight-medium, 300);\n --nuraly-label-line-height: var(--nuraly-line-height-base, auto);\n\n /* Size variants */\n --nuraly-label-small-font-size: var(--nuraly-font-size-xs, 12px);\n --nuraly-label-medium-font-size: var(--nuraly-font-size-sm, 14px);\n --nuraly-label-large-font-size: var(--nuraly-font-size-base, 16px);\n\n /* Default font size */\n --nuraly-label-font-size: var(--nuraly-label-medium-font-size);\n\n /* Colors */\n --nuraly-label-text-color: var(--nuraly-color-text-primary, #000000);\n --nuraly-label-secondary-color: var(--nuraly-color-text-secondary, #666666);\n --nuraly-label-error-color: var(--nuraly-color-error-500, #ff4d4f);\n --nuraly-label-warning-color: var(--nuraly-color-warning-500, #faad14);\n --nuraly-label-success-color: var(--nuraly-color-success-500, #52c41a);\n --nuraly-label-required-color: var(--nuraly-color-error-500, #ff4d4f);\n --nuraly-label-disabled-color: var(--nuraly-color-text-disabled, #bfbfbf);\n\n /* Spacing */\n --nuraly-label-margin-bottom: var(--nuraly-spacing-xs, 4px);\n --nuraly-label-required-margin: var(--nuraly-spacing-2xs, 2px);\n\n /* Transitions */\n --nuraly-label-transition-duration: var(--nuraly-transition-duration-base, 150ms);\n --nuraly-label-transition-timing: var(--nuraly-transition-timing-ease, ease);\n }\n`;"]}
@@ -1 +1 @@
1
- {"version":3,"file":"label.types.js","sourceRoot":"","sources":["../../../src/components/label/label.types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Label component size variants\n */\nexport type LabelSize = 'small' | 'medium' | 'large';\n\n/**\n * Label component variants\n */\nexport type LabelVariant = 'default' | 'secondary' | 'success' | 'warning' | 'error';\n\n/**\n * Label component props interface\n */\nexport interface LabelProps {\n /**\n * The size of the label\n * @default 'medium'\n */\n size?: LabelSize;\n\n /**\n * The visual variant of the label\n * @default 'default'\n */\n variant?: LabelVariant;\n\n /**\n * Whether the label is required (shows asterisk)\n * @default false\n */\n required?: boolean;\n\n /**\n * Whether the label is disabled\n * @default false\n */\n disabled?: boolean;\n\n /**\n * The for attribute to associate with form elements\n */\n for?: string;\n\n /**\n * Custom CSS class\n */\n className?: string;\n}"]}
1
+ {"version":3,"file":"label.types.js","sourceRoot":"","sources":["../../../../src/components/label/label.types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Label component size variants\n */\nexport type LabelSize = 'small' | 'medium' | 'large';\n\n/**\n * Label component variants\n */\nexport type LabelVariant = 'default' | 'secondary' | 'success' | 'warning' | 'error';\n\n/**\n * Label component props interface\n */\nexport interface LabelProps {\n /**\n * The size of the label\n * @default 'medium'\n */\n size?: LabelSize;\n\n /**\n * The visual variant of the label\n * @default 'default'\n */\n variant?: LabelVariant;\n\n /**\n * Whether the label is required (shows asterisk)\n * @default false\n */\n required?: boolean;\n\n /**\n * Whether the label is disabled\n * @default false\n */\n disabled?: boolean;\n\n /**\n * The for attribute to associate with form elements\n */\n for?: string;\n\n /**\n * Custom CSS class\n */\n className?: string;\n}"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nuralyui/label",
3
- "version": "0.0.16",
3
+ "version": "0.0.18",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "type": "module",
package/react.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../src/components/label/react.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC;IACrC,OAAO,EAAE,UAAU;IACnB,YAAY,EAAE,KAAM,SAAQ,WAAW;KAAG;IAC1C,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,KAAK,EAAE,OAAO;KACf;CACF,CAAC,CAAC","sourcesContent":["import { createComponent } from '@lit-labs/react';\nimport * as React from 'react';\n\nexport const HyLabel = createComponent({\n tagName: 'nr-label',\n elementClass: class extends HTMLElement {},\n react: React,\n events: {\n click: 'click',\n },\n});\n"]}
1
+ {"version":3,"file":"react.js","sourceRoot":"","sources":["../../../../src/components/label/react.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC;IACrC,OAAO,EAAE,UAAU;IACnB,YAAY,EAAE,KAAM,SAAQ,WAAW;KAAG;IAC1C,KAAK,EAAE,KAAK;IACZ,MAAM,EAAE;QACN,KAAK,EAAE,OAAO;KACf;CACF,CAAC,CAAC","sourcesContent":["import { createComponent } from '@lit-labs/react';\nimport * as React from 'react';\n\nexport const HyLabel = createComponent({\n tagName: 'nr-label',\n elementClass: class extends HTMLElement {},\n react: React,\n events: {\n click: 'click',\n },\n});\n"]}