@transcodes/ui-components 0.4.5 → 0.4.6

package/CHANGELOG.md

@@ -5,6 +5,15 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.4.6] - 2026-01-13
+
+### Added
+
+- **tc-text**: `for` 속성 지원 추가 (label 접근성 개선)
+  - `tag="label"`일 때 `for` 속성으로 form control과 연결 가능
+  - 스크린 리더 및 키보드 네비게이션 접근성 향상
+  - Storybook `LabelWithFor` 스토리 추가
+
 ## [0.4.5] - 2025-12-23
 
 ### Fixed

package/dist/primitives/tc-text.d.ts

@@ -18,6 +18,7 @@ export declare class TcText extends LitElement {
     weight?: TextWeight;
     color?: TextColor | string;
     sx: SxProps;
+    for: string;
     static styles: import('lit').CSSResult[];
     private getColorClass;
     private getColorStyle;

package/dist/primitives/tc-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tc-text.d.ts","sourceRoot":"","sources":["../../src/primitives/tc-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,UAAU,EAAE,MAAM,KAAK,CAAC;AAKtC,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE3C,KAAK,OAAO,GACR,GAAG,GACH,MAAM,GACN,KAAK,GACL,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,OAAO,CAAC;AAEZ,KAAK,QAAQ,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACpD,KAAK,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAChD,KAAK,SAAS,GACV,SAAS,GACT,WAAW,GACX,UAAU,GACV,OAAO,GACP,QAAQ,GACR,SAAS,GACT,OAAO,GACP,SAAS,GACT,MAAM,CAAC;AAEX;;;;;;;GAOG;AACH,qBACa,MAAO,SAAQ,UAAU;IACR,GAAG,EAAE,OAAO,CAAO;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,EAAE,EAAE,OAAO,CAAM;IAE7C,OAAgB,MAAM,4BA2EpB;IAEF,OAAO,CAAC,aAAa;IAmBrB,OAAO,CAAC,aAAa;IAgBZ,MAAM;CAwBhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
+{"version":3,"file":"tc-text.d.ts","sourceRoot":"","sources":["../../src/primitives/tc-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,UAAU,EAAW,MAAM,KAAK,CAAC;AAK/C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE3C,KAAK,OAAO,GACR,GAAG,GACH,MAAM,GACN,KAAK,GACL,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,OAAO,CAAC;AAEZ,KAAK,QAAQ,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AACpD,KAAK,UAAU,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;AAChD,KAAK,SAAS,GACV,SAAS,GACT,WAAW,GACX,UAAU,GACV,OAAO,GACP,QAAQ,GACR,SAAS,GACT,OAAO,GACP,SAAS,GACT,MAAM,CAAC;AAEX;;;;;;;GAOG;AACH,qBACa,MAAO,SAAQ,UAAU;IACR,GAAG,EAAE,OAAO,CAAO;IACnB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,GAAG,MAAM,CAAC;IAC3B,EAAE,EAAE,OAAO,CAAM;IACjB,GAAG,SAAM;IAErC,OAAgB,MAAM,4BA2EpB;IAEF,OAAO,CAAC,aAAa;IAmBrB,OAAO,CAAC,aAAa;IAgBZ,MAAM;CA6BhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}

package/dist/primitives/tc-text.js

@@ -1,16 +1,16 @@
-import { css as x, LitElement as p } from "lit";
-import { property as a, customElement as g } from "lit/decorators.js";
-import { styleMap as h } from "lit/directives/style-map.js";
-import { unsafeStatic as f, html as m } from "lit/static-html.js";
-import { sharedStyles as y } from "../styles/shared.js";
-var v = Object.defineProperty, u = Object.getOwnPropertyDescriptor, n = (r, o, s, i) => {
-  for (var e = i > 1 ? void 0 : i ? u(o, s) : o, c = r.length - 1, l; c >= 0; c--)
-    (l = r[c]) && (e = (i ? l(o, s, e) : l(e)) || e);
-  return i && e && v(o, s, e), e;
+import { css as h, LitElement as x, nothing as p } from "lit";
+import { property as a, customElement as f } from "lit/decorators.js";
+import { styleMap as g } from "lit/directives/style-map.js";
+import { unsafeStatic as m, html as y } from "lit/static-html.js";
+import { sharedStyles as v } from "../styles/shared.js";
+var u = Object.defineProperty, d = Object.getOwnPropertyDescriptor, r = (o, s, i, n) => {
+  for (var e = n > 1 ? void 0 : n ? d(s, i) : s, c = o.length - 1, l; c >= 0; c--)
+    (l = o[c]) && (e = (n ? l(s, i, e) : l(e)) || e);
+  return n && e && u(s, i, e), e;
 };
-let t = class extends p {
+let t = class extends x {
   constructor() {
-    super(...arguments), this.tag = "p", this.sx = {};
+    super(...arguments), this.tag = "p", this.sx = {}, this.for = "";
   }
   getColorClass() {
     return this.color && {
@@ -30,25 +30,30 @@ let t = class extends p {
       return this.color;
   }
   render() {
-    const r = f(this.tag), o = [
+    const o = m(this.tag), s = [
       "text",
       this.size ? `text--${this.size}` : "",
       this.weight ? `text--w${this.weight}` : "",
       this.getColorClass()
-    ].filter(Boolean).join(" "), s = this.getColorStyle(), i = {
-      ...s ? { color: s } : {},
+    ].filter(Boolean).join(" "), i = this.getColorStyle(), n = {
+      ...i ? { color: i } : {},
       ...this.sx
     };
-    return m`
-      <${r} part="text" class=${o} style=${h(i)}>
+    return y`
+      <${o}
+        part="text"
+        class=${s}
+        style=${g(n)}
+        for=${this.tag === "label" && this.for ? this.for : p}
+      >
         <slot></slot>
-      </${r}>
+      </${o}>
     `;
   }
 };
 t.styles = [
-  y,
-  x`
+  v,
+  h`
       :host {
         display: contents;
       }
@@ -122,23 +127,26 @@ t.styles = [
       }
     `
 ];
-n([
+r([
   a({ type: String })
 ], t.prototype, "tag", 2);
-n([
+r([
   a({ type: String })
 ], t.prototype, "size", 2);
-n([
+r([
   a({ type: String })
 ], t.prototype, "weight", 2);
-n([
+r([
   a({ type: String })
 ], t.prototype, "color", 2);
-n([
+r([
   a({ type: Object })
 ], t.prototype, "sx", 2);
-t = n([
-  g("tc-text")
+r([
+  a({ type: String })
+], t.prototype, "for", 2);
+t = r([
+  f("tc-text")
 ], t);
 export {
   t as TcText

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transcodes/ui-components",
-  "version": "0.4.5",
+  "version": "0.4.6",
   "private": false,
   "description": "Lit 3.x component library with Reactive Controllers",
   "keywords": [
@@ -75,7 +75,7 @@
     "lit": "^3.0.0"
   },
   "dependencies": {
-    "@transcodes/design-tokens": "^0.4.5"
+    "@transcodes/design-tokens": "^0.4.6"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "^10.1.9",