@transcodes/ui-components 0.4.3 → 0.4.5

package/CHANGELOG.md

@@ -5,6 +5,18 @@ 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.5] - 2025-12-23
+
+### Fixed
+
+- **tc-success-screen**: 아이콘 배경색 복구 (`background: var(--alpha-primary10)`)
+
+## [0.4.4] - 2025-12-23
+
+### Added
+
+- `prepublishOnly` 스크립트 추가: npm publish 시 자동으로 clean → build 수행
+
 ## [0.4.3] - 2025-12-23
 
 ### Changed

package/dist/controllers/animation.controller.d.ts

@@ -0,0 +1,48 @@
+import { ReactiveControllerHost } from 'lit';
+import { BaseController } from './base.controller.js';
+export type AnimationState = 'hidden' | 'showing' | 'visible' | 'hiding';
+/**
+ * Controller for managing show/hide animation states.
+ * Provides a state machine for coordinating CSS transitions.
+ *
+ * @example
+ * ```ts
+ * class MyModal extends LitElement {
+ *   private animation = new AnimationController(this);
+ *
+ *   async open() {
+ *     await this.animation.show();
+ *   }
+ *
+ *   async close() {
+ *     await this.animation.hide();
+ *   }
+ *
+ *   render() {
+ *     return html`
+ *       <div class="modal modal--${this.animation.state}">
+ *         <slot></slot>
+ *       </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+export interface AnimationControllerOptions {
+    showDuration?: number;
+    hideDuration?: number;
+}
+export declare class AnimationController extends BaseController {
+    private _state;
+    private showDuration;
+    private hideDuration;
+    constructor(host: ReactiveControllerHost, options?: AnimationControllerOptions | number);
+    get state(): AnimationState;
+    get isVisible(): boolean;
+    get isHidden(): boolean;
+    show(): Promise<void>;
+    hide(): Promise<void>;
+    toggle(): Promise<void>;
+    private waitForTransition;
+}
+//# sourceMappingURL=animation.controller.d.ts.map

package/dist/controllers/animation.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/animation.controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAEzE;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,WAAW,0BAA0B;IACzC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,qBAAa,mBAAoB,SAAQ,cAAc;IACrD,OAAO,CAAC,MAAM,CAA4B;IAC1C,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,YAAY,CAAS;gBAG3B,IAAI,EAAE,sBAAsB,EAC5B,OAAO,GAAE,0BAA0B,GAAG,MAAY;IAYpD,IAAI,KAAK,IAAI,cAAc,CAE1B;IAED,IAAI,SAAS,IAAI,OAAO,CAEvB;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAEK,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAcrB,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAc3B,MAAM,IAAI,OAAO,CAAC,IAAI,CAAC;IAIvB,OAAO,CAAC,iBAAiB;CAK1B"}

package/dist/controllers/animation.controller.js

@@ -0,0 +1,32 @@
+import { BaseController as s } from "./base.controller.js";
+class r extends s {
+  constructor(i, t = 300) {
+    super(i), this._state = "hidden", typeof t == "number" ? (this.showDuration = t, this.hideDuration = t) : (this.showDuration = t.showDuration ?? 300, this.hideDuration = t.hideDuration ?? 300);
+  }
+  get state() {
+    return this._state;
+  }
+  get isVisible() {
+    return this._state === "visible" || this._state === "showing";
+  }
+  get isHidden() {
+    return this._state === "hidden";
+  }
+  async show() {
+    this._state === "visible" || this._state === "showing" || (this._state = "showing", this.host.requestUpdate(), await this.waitForTransition(this.showDuration), this._state = "visible", this.host.requestUpdate());
+  }
+  async hide() {
+    this._state === "hidden" || this._state === "hiding" || (this._state = "hiding", this.host.requestUpdate(), await this.waitForTransition(this.hideDuration), this._state = "hidden", this.host.requestUpdate());
+  }
+  toggle() {
+    return this.isVisible ? this.hide() : this.show();
+  }
+  waitForTransition(i) {
+    return new Promise((t) => {
+      setTimeout(t, i);
+    });
+  }
+}
+export {
+  r as AnimationController
+};

package/dist/controllers/base.controller.d.ts

@@ -0,0 +1,14 @@
+import { ReactiveController, ReactiveControllerHost } from 'lit';
+/**
+ * Base controller class that all reactive controllers extend from.
+ * Provides common functionality for registering with a host element.
+ */
+export declare abstract class BaseController implements ReactiveController {
+    protected host: ReactiveControllerHost;
+    constructor(host: ReactiveControllerHost);
+    hostConnected?(): void;
+    hostDisconnected?(): void;
+    hostUpdate?(): void;
+    hostUpdated?(): void;
+}
+//# sourceMappingURL=base.controller.d.ts.map

package/dist/controllers/base.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/base.controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAEtE;;;GAGG;AACH,8BAAsB,cAAe,YAAW,kBAAkB;IAChE,SAAS,CAAC,IAAI,EAAE,sBAAsB,CAAC;gBAE3B,IAAI,EAAE,sBAAsB;IAKxC,aAAa,CAAC,IAAI,IAAI;IACtB,gBAAgB,CAAC,IAAI,IAAI;IACzB,UAAU,CAAC,IAAI,IAAI;IACnB,WAAW,CAAC,IAAI,IAAI;CACrB"}

package/dist/controllers/base.controller.js

@@ -0,0 +1,8 @@
+class s {
+  constructor(t) {
+    this.host = t, this.host.addController(this);
+  }
+}
+export {
+  s as BaseController
+};

package/dist/controllers/history.controller.d.ts

@@ -0,0 +1,34 @@
+import { BaseController } from './base.controller.js';
+/**
+ * Controller for managing browser history for modals and overlays.
+ * Adds a history entry when opened and handles back button navigation.
+ *
+ * @example
+ * ```ts
+ * class MyModal extends LitElement {
+ *   private history = new HistoryController(this);
+ *
+ *   open() {
+ *     this.history.push({ modal: 'my-modal' });
+ *     this.history.onPopState(() => this.close());
+ *     // show modal
+ *   }
+ *
+ *   close() {
+ *     this.history.pop();
+ *     // hide modal
+ *   }
+ * }
+ * ```
+ */
+export declare class HistoryController extends BaseController {
+    private hasAddedEntry;
+    private onPopCallback?;
+    push(state?: object): void;
+    pop(): void;
+    onPopState(callback: () => void): void;
+    private handlePopState;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+//# sourceMappingURL=history.controller.d.ts.map

package/dist/controllers/history.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"history.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/history.controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,qBAAa,iBAAkB,SAAQ,cAAc;IACnD,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,aAAa,CAAC,CAAa;IAEnC,IAAI,CAAC,KAAK,GAAE,MAAwB,GAAG,IAAI;IAO3C,GAAG,IAAI,IAAI;IAMX,UAAU,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,IAAI;IAItC,OAAO,CAAC,cAAc,CAKpB;IAEO,aAAa,IAAI,IAAI;IAIrB,gBAAgB,IAAI,IAAI;CAIlC"}

package/dist/controllers/history.controller.js

@@ -0,0 +1,26 @@
+import { BaseController as e } from "./base.controller.js";
+class d extends e {
+  constructor() {
+    super(...arguments), this.hasAddedEntry = !1, this.handlePopState = () => {
+      this.hasAddedEntry && (this.hasAddedEntry = !1, this.onPopCallback?.());
+    };
+  }
+  push(t = { modal: !0 }) {
+    this.hasAddedEntry || (history.pushState(t, ""), this.hasAddedEntry = !0);
+  }
+  pop() {
+    this.hasAddedEntry && (this.hasAddedEntry = !1);
+  }
+  onPopState(t) {
+    this.onPopCallback = t;
+  }
+  hostConnected() {
+    window.addEventListener("popstate", this.handlePopState);
+  }
+  hostDisconnected() {
+    window.removeEventListener("popstate", this.handlePopState), this.onPopCallback = void 0;
+  }
+}
+export {
+  d as HistoryController
+};

package/dist/controllers/index.d.ts

@@ -0,0 +1,9 @@
+export type { AnimationControllerOptions, AnimationState, } from './animation.controller.js';
+export { AnimationController } from './animation.controller.js';
+export { BaseController } from './base.controller.js';
+export { HistoryController } from './history.controller.js';
+export { LoadingController } from './loading.controller.js';
+export { MatchMediaController } from './match-media.controller.js';
+export { MessageBusController } from './message-bus.controller.js';
+export { StorageController } from './storage.controller.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/controllers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/controllers/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,0BAA0B,EAC1B,cAAc,GACf,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/controllers/index.js

@@ -0,0 +1,16 @@
+import { AnimationController as e } from "./animation.controller.js";
+import { BaseController as l } from "./base.controller.js";
+import { HistoryController as m } from "./history.controller.js";
+import { LoadingController as f } from "./loading.controller.js";
+import { MatchMediaController as x } from "./match-media.controller.js";
+import { MessageBusController as i } from "./message-bus.controller.js";
+import { StorageController as g } from "./storage.controller.js";
+export {
+  e as AnimationController,
+  l as BaseController,
+  m as HistoryController,
+  f as LoadingController,
+  x as MatchMediaController,
+  i as MessageBusController,
+  g as StorageController
+};

package/dist/controllers/loading.controller.d.ts

@@ -0,0 +1,36 @@
+import { BaseController } from './base.controller.js';
+/**
+ * Controller for managing loading states and progress.
+ *
+ * @example
+ * ```ts
+ * class MyComponent extends LitElement {
+ *   private loading = new LoadingController(this);
+ *
+ *   async handleSubmit() {
+ *     this.loading.start();
+ *     await doSomething();
+ *     this.loading.complete();
+ *   }
+ *
+ *   render() {
+ *     return html`
+ *       <button ?disabled=${this.loading.isLoading}>
+ *         ${this.loading.isLoading ? 'Loading...' : 'Submit'}
+ *       </button>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+export declare class LoadingController extends BaseController {
+    private _isLoading;
+    private _progress;
+    get isLoading(): boolean;
+    get progress(): number;
+    start(): void;
+    setProgress(value: number): void;
+    complete(): void;
+    reset(): void;
+}
+//# sourceMappingURL=loading.controller.d.ts.map

package/dist/controllers/loading.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loading.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/loading.controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBAAa,iBAAkB,SAAQ,cAAc;IACnD,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,SAAS,CAAK;IAEtB,IAAI,SAAS,IAAI,OAAO,CAEvB;IAED,IAAI,QAAQ,IAAI,MAAM,CAErB;IAED,KAAK,IAAI,IAAI;IAMb,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKhC,QAAQ,IAAI,IAAI;IAMhB,KAAK,IAAI,IAAI;CAKd"}

package/dist/controllers/loading.controller.js

@@ -0,0 +1,27 @@
+import { BaseController as t } from "./base.controller.js";
+class i extends t {
+  constructor() {
+    super(...arguments), this._isLoading = !1, this._progress = 0;
+  }
+  get isLoading() {
+    return this._isLoading;
+  }
+  get progress() {
+    return this._progress;
+  }
+  start() {
+    this._isLoading = !0, this._progress = 0, this.host.requestUpdate();
+  }
+  setProgress(s) {
+    this._progress = Math.max(0, Math.min(100, s)), this.host.requestUpdate();
+  }
+  complete() {
+    this._progress = 100, this._isLoading = !1, this.host.requestUpdate();
+  }
+  reset() {
+    this._isLoading = !1, this._progress = 0, this.host.requestUpdate();
+  }
+}
+export {
+  i as LoadingController
+};

package/dist/controllers/match-media.controller.d.ts

@@ -0,0 +1,32 @@
+import { ReactiveControllerHost } from 'lit';
+import { BaseController } from './base.controller.js';
+/**
+ * Controller for reactive media query matching.
+ * Automatically updates the host when the media query matches or unmatches.
+ *
+ * @example
+ * ```ts
+ * class MyComponent extends LitElement {
+ *   private mobile = new MatchMediaController(this, '(max-width: 768px)');
+ *   private darkMode = new MatchMediaController(this, '(prefers-color-scheme: dark)');
+ *
+ *   render() {
+ *     return html`
+ *       <div class=${this.mobile.matches ? 'mobile' : 'desktop'}>
+ *         ${this.darkMode.matches ? 'Dark mode' : 'Light mode'}
+ *       </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+export declare class MatchMediaController extends BaseController {
+    private mediaQuery;
+    private _matches;
+    constructor(host: ReactiveControllerHost, query: string);
+    get matches(): boolean;
+    private handleChange;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+//# sourceMappingURL=match-media.controller.d.ts.map

package/dist/controllers/match-media.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"match-media.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/match-media.controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBAAa,oBAAqB,SAAQ,cAAc;IACtD,OAAO,CAAC,UAAU,CAAiB;IACnC,OAAO,CAAC,QAAQ,CAAS;gBAEb,IAAI,EAAE,sBAAsB,EAAE,KAAK,EAAE,MAAM;IAMvD,IAAI,OAAO,IAAI,OAAO,CAErB;IAED,OAAO,CAAC,YAAY,CAGlB;IAEO,aAAa,IAAI,IAAI;IAIrB,gBAAgB,IAAI,IAAI;CAGlC"}

package/dist/controllers/match-media.controller.js

@@ -0,0 +1,20 @@
+import { BaseController as h } from "./base.controller.js";
+class n extends h {
+  constructor(e, t) {
+    super(e), this._matches = !1, this.handleChange = (s) => {
+      this._matches = s.matches, this.host.requestUpdate();
+    }, this.mediaQuery = window.matchMedia(t), this._matches = this.mediaQuery.matches;
+  }
+  get matches() {
+    return this._matches;
+  }
+  hostConnected() {
+    this.mediaQuery.addEventListener("change", this.handleChange);
+  }
+  hostDisconnected() {
+    this.mediaQuery.removeEventListener("change", this.handleChange);
+  }
+}
+export {
+  n as MatchMediaController
+};

package/dist/controllers/message-bus.controller.d.ts

@@ -0,0 +1,45 @@
+import { ReactiveControllerHost } from 'lit';
+import { BaseController } from './base.controller.js';
+export type MessageHandler = (payload: unknown) => void;
+export type WildcardMessageHandler = (type: string, payload: unknown) => void;
+/**
+ * Controller for postMessage communication with iframes or other windows.
+ *
+ * @example
+ * ```ts
+ * class MyIframeHost extends LitElement {
+ *   private messageBus = new MessageBusController(this);
+ *
+ *   connectedCallback() {
+ *     super.connectedCallback();
+ *     this.messageBus.onMessage('READY', (payload) => {
+ *       console.log('Iframe is ready', payload);
+ *     });
+ *   }
+ *
+ *   sendToIframe() {
+ *     this.messageBus.send('COMMAND', { action: 'do-something' });
+ *   }
+ * }
+ * ```
+ */
+export declare class MessageBusController extends BaseController {
+    private handlers;
+    private wildcardHandlers;
+    private targetOrigin;
+    /**
+     * @param host - The reactive controller host
+     * @param targetOrigin - The origin to accept messages from and send messages to.
+     *   SECURITY NOTE: Using '*' accepts messages from any origin which can be dangerous.
+     *   Always specify an explicit origin in production environments.
+     */
+    constructor(host: ReactiveControllerHost, targetOrigin?: string);
+    send(type: string, payload: unknown, targetWindow?: Window): void;
+    sendToFrame(iframe: HTMLIFrameElement, type: string, payload: unknown): void;
+    onMessage(type: string, handler: MessageHandler): () => void;
+    onMessage(type: '*', handler: WildcardMessageHandler): () => void;
+    private handleMessage;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+//# sourceMappingURL=message-bus.controller.d.ts.map

package/dist/controllers/message-bus.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-bus.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/message-bus.controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;AACxD,MAAM,MAAM,sBAAsB,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;AAE9E;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,qBAAa,oBAAqB,SAAQ,cAAc;IACtD,OAAO,CAAC,QAAQ,CAA0C;IAC1D,OAAO,CAAC,gBAAgB,CAAqC;IAC7D,OAAO,CAAC,YAAY,CAAS;IAE7B;;;;;OAKG;gBACS,IAAI,EAAE,sBAAsB,EAAE,YAAY,SAAM;IAgB5D,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,YAAY,GAAE,MAAe,GAAG,IAAI;IAIzE,WAAW,CAAC,MAAM,EAAE,iBAAiB,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAI5E,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,GAAG,MAAM,IAAI;IAC5D,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,sBAAsB,GAAG,MAAM,IAAI;IAsBjE,OAAO,CAAC,aAAa,CAwBnB;IAEO,aAAa,IAAI,IAAI;IAIrB,gBAAgB,IAAI,IAAI;CAIlC"}

package/dist/controllers/message-bus.controller.js

@@ -0,0 +1,45 @@
+import { BaseController as r } from "./base.controller.js";
+class l extends r {
+  /**
+   * @param host - The reactive controller host
+   * @param targetOrigin - The origin to accept messages from and send messages to.
+   *   SECURITY NOTE: Using '*' accepts messages from any origin which can be dangerous.
+   *   Always specify an explicit origin in production environments.
+   */
+  constructor(e, s = "*") {
+    super(e), this.handlers = /* @__PURE__ */ new Map(), this.wildcardHandlers = /* @__PURE__ */ new Set(), this.handleMessage = (t) => {
+      if (!(this.targetOrigin !== "*" && t.origin !== this.targetOrigin) && t.data && typeof t.data == "object" && typeof t.data.type == "string") {
+        const { type: n, payload: a } = t.data;
+        this.handlers.get(n)?.forEach((i) => {
+          i(a);
+        }), this.wildcardHandlers.forEach((i) => {
+          i(n, a);
+        });
+      }
+    }, this.targetOrigin = s, s === "*" && typeof window < "u" && window.location.protocol !== "file:" && console.warn(
+      '[MessageBusController] Using targetOrigin="*" accepts messages from any origin. For security, specify an explicit origin in production.'
+    );
+  }
+  send(e, s, t = window) {
+    t.postMessage({ type: e, payload: s }, this.targetOrigin);
+  }
+  sendToFrame(e, s, t) {
+    e.contentWindow?.postMessage({ type: s, payload: t }, this.targetOrigin);
+  }
+  onMessage(e, s) {
+    return e === "*" ? (this.wildcardHandlers.add(s), () => {
+      this.wildcardHandlers.delete(s);
+    }) : (this.handlers.has(e) || this.handlers.set(e, /* @__PURE__ */ new Set()), this.handlers.get(e)?.add(s), () => {
+      this.handlers.get(e)?.delete(s);
+    });
+  }
+  hostConnected() {
+    window.addEventListener("message", this.handleMessage);
+  }
+  hostDisconnected() {
+    window.removeEventListener("message", this.handleMessage), this.handlers.clear();
+  }
+}
+export {
+  l as MessageBusController
+};

package/dist/controllers/storage.controller.d.ts

@@ -0,0 +1,40 @@
+import { ReactiveControllerHost } from 'lit';
+import { BaseController } from './base.controller.js';
+/**
+ * Controller for syncing component state with localStorage/sessionStorage.
+ * Automatically updates when storage changes in other tabs.
+ *
+ * @example
+ * ```ts
+ * class MyBanner extends LitElement {
+ *   private dismissed = new StorageController<boolean>(this, 'banner-dismissed');
+ *
+ *   handleDismiss() {
+ *     this.dismissed.set(true);
+ *   }
+ *
+ *   render() {
+ *     if (this.dismissed.value) return null;
+ *     return html`
+ *       <div class="banner">
+ *         <button @click=${this.handleDismiss}>Dismiss</button>
+ *       </div>
+ *     `;
+ *   }
+ * }
+ * ```
+ */
+export declare class StorageController<T = unknown> extends BaseController {
+    private key;
+    private storage;
+    private _value;
+    constructor(host: ReactiveControllerHost, key: string, storage?: Storage);
+    get value(): T | null;
+    set(value: T): void;
+    remove(): void;
+    private load;
+    private handleStorageChange;
+    hostConnected(): void;
+    hostDisconnected(): void;
+}
+//# sourceMappingURL=storage.controller.d.ts.map

package/dist/controllers/storage.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"storage.controller.d.ts","sourceRoot":"","sources":["../../src/controllers/storage.controller.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAEtD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBAAa,iBAAiB,CAAC,CAAC,GAAG,OAAO,CAAE,SAAQ,cAAc;IAChE,OAAO,CAAC,GAAG,CAAS;IACpB,OAAO,CAAC,OAAO,CAAU;IACzB,OAAO,CAAC,MAAM,CAAkB;gBAG9B,IAAI,EAAE,sBAAsB,EAC5B,GAAG,EAAE,MAAM,EACX,OAAO,GAAE,OAAsB;IAQjC,IAAI,KAAK,IAAI,CAAC,GAAG,IAAI,CAEpB;IAED,GAAG,CAAC,KAAK,EAAE,CAAC,GAAG,IAAI;IAWnB,MAAM,IAAI,IAAI;IAMd,OAAO,CAAC,IAAI;IAWZ,OAAO,CAAC,mBAAmB,CAKzB;IAEO,aAAa,IAAI,IAAI;IAIrB,gBAAgB,IAAI,IAAI;CAGlC"}

package/dist/controllers/storage.controller.js

@@ -0,0 +1,40 @@
+import { BaseController as a } from "./base.controller.js";
+class i extends a {
+  constructor(t, s, o = localStorage) {
+    super(t), this._value = null, this.handleStorageChange = (e) => {
+      e.key === this.key && e.storageArea === this.storage && (this.load(), this.host.requestUpdate());
+    }, this.key = s, this.storage = o, this.load();
+  }
+  get value() {
+    return this._value;
+  }
+  set(t) {
+    this._value = t;
+    try {
+      this.storage.setItem(this.key, JSON.stringify(t));
+    } catch {
+      console.warn(`Failed to save to storage: ${this.key}`);
+    }
+    this.host.requestUpdate();
+  }
+  remove() {
+    this._value = null, this.storage.removeItem(this.key), this.host.requestUpdate();
+  }
+  load() {
+    try {
+      const t = this.storage.getItem(this.key);
+      t !== null && (this._value = JSON.parse(t));
+    } catch {
+      this._value = null;
+    }
+  }
+  hostConnected() {
+    window.addEventListener("storage", this.handleStorageChange);
+  }
+  hostDisconnected() {
+    window.removeEventListener("storage", this.handleStorageChange);
+  }
+}
+export {
+  i as StorageController
+};

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export * from './controllers/index.js';
+export * from './primitives/index.js';
+export * from './screens/index.js';
+export * from './types.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAGA,cAAc,wBAAwB,CAAC;AAEvC,cAAc,uBAAuB,CAAC;AAEtC,cAAc,oBAAoB,CAAC;AACnC,cAAc,YAAY,CAAC"}

package/dist/index.js

@@ -0,0 +1,64 @@
+import { AnimationController as e } from "./controllers/animation.controller.js";
+import { BaseController as p } from "./controllers/base.controller.js";
+import { HistoryController as c } from "./controllers/history.controller.js";
+import { LoadingController as f } from "./controllers/loading.controller.js";
+import { MatchMediaController as T } from "./controllers/match-media.controller.js";
+import { MessageBusController as a } from "./controllers/message-bus.controller.js";
+import { StorageController as C } from "./controllers/storage.controller.js";
+import { TcBox as u } from "./primitives/tc-box.js";
+import { TcButton as d } from "./primitives/tc-button.js";
+import { TcCallout as I } from "./primitives/tc-callout.js";
+import { TcCard as h } from "./primitives/tc-card.js";
+import { TcChip as y } from "./primitives/tc-chip.js";
+import { TcContainer as E } from "./primitives/tc-container.js";
+import { TcDivider as L } from "./primitives/tc-divider.js";
+import { TcErrorMessage as v } from "./primitives/tc-error-message.js";
+import { TcFormHeader as F } from "./primitives/tc-form-header.js";
+import { TcIcon as P } from "./primitives/tc-icon.js";
+import { TcInput as j } from "./primitives/tc-input.js";
+import { TcInputWithChip as q } from "./primitives/tc-input-with-chip.js";
+import { TcItem as z } from "./primitives/tc-item.js";
+import { TcItemButton as J } from "./primitives/tc-item-button.js";
+import { TcOtpInput as N } from "./primitives/tc-otp-input.js";
+import { TcPageDecoration as R } from "./primitives/tc-page-decoration.js";
+import { TcSection as V } from "./primitives/tc-section.js";
+import { TcSpinner as Y } from "./primitives/tc-spinner.js";
+import { TcSymbol as _ } from "./primitives/tc-symbol.js";
+import { TcText as oo } from "./primitives/tc-text.js";
+import { TcToast as eo } from "./primitives/tc-toast.js";
+import { TcErrorScreen as po } from "./screens/tc-error-screen.js";
+import { TcLoadingScreen as co } from "./screens/tc-loading-screen.js";
+import { TcSuccessScreen as fo } from "./screens/tc-success-screen.js";
+export {
+  e as AnimationController,
+  p as BaseController,
+  c as HistoryController,
+  f as LoadingController,
+  T as MatchMediaController,
+  a as MessageBusController,
+  C as StorageController,
+  u as TcBox,
+  d as TcButton,
+  I as TcCallout,
+  h as TcCard,
+  y as TcChip,
+  E as TcContainer,
+  L as TcDivider,
+  v as TcErrorMessage,
+  po as TcErrorScreen,
+  F as TcFormHeader,
+  P as TcIcon,
+  j as TcInput,
+  q as TcInputWithChip,
+  z as TcItem,
+  J as TcItemButton,
+  co as TcLoadingScreen,
+  N as TcOtpInput,
+  R as TcPageDecoration,
+  V as TcSection,
+  Y as TcSpinner,
+  fo as TcSuccessScreen,
+  _ as TcSymbol,
+  oo as TcText,
+  eo as TcToast
+};

package/dist/primitives/index.d.ts

@@ -0,0 +1,22 @@
+export { TcBox } from './tc-box.js';
+export { TcButton } from './tc-button.js';
+export { TcCallout } from './tc-callout.js';
+export { TcCard } from './tc-card.js';
+export { TcChip } from './tc-chip.js';
+export { TcContainer } from './tc-container.js';
+export { TcDivider } from './tc-divider.js';
+export { TcErrorMessage } from './tc-error-message.js';
+export { TcFormHeader } from './tc-form-header.js';
+export { type IconName, TcIcon } from './tc-icon.js';
+export { TcInput } from './tc-input.js';
+export { TcInputWithChip } from './tc-input-with-chip.js';
+export { TcItem } from './tc-item.js';
+export { TcItemButton } from './tc-item-button.js';
+export { TcOtpInput } from './tc-otp-input.js';
+export { TcPageDecoration } from './tc-page-decoration.js';
+export { TcSection } from './tc-section.js';
+export { TcSpinner } from './tc-spinner.js';
+export { TcSymbol } from './tc-symbol.js';
+export { TcText } from './tc-text.js';
+export { TcToast } from './tc-toast.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/primitives/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/primitives/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC"}