@awc-ui/theme 1.0.0-beta

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 AWC UI
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,49 @@
+# @awc-ui/theme
+
+Material Design 3 theme generation for [AWC UI](https://www.npmjs.com/package/@awc-ui/core): compute full MD3 color schemes from a seed color (via Google's [`@material/material-color-utilities`](https://www.npmjs.com/package/@material/material-color-utilities)), emit them as CSS custom properties, and apply them at runtime.
+
+## Install
+
+```bash
+npm install @awc-ui/theme
+```
+
+## Usage
+
+Generate and apply a theme in the browser:
+
+```ts
+import { computeTheme, applyThemeStylesheet } from '@awc-ui/theme';
+
+const theme = computeTheme({ primaryHex: '#6750A4' });
+applyThemeStylesheet(theme); // injects the --md-sys-* custom properties
+```
+
+Or generate static CSS at build time / server-side:
+
+```ts
+import { computeTheme, generateCss } from '@awc-ui/theme';
+
+const css = generateCss(computeTheme({ primaryHex: '#6750A4' }));
+// write `css` to a file and ship it instead of computing in the browser
+```
+
+### Off-main-thread
+
+Heavy palette computation can run in a Web Worker — the package ships a ready-made worker entry:
+
+```ts
+// Vite
+import ThemeWorker from '@awc-ui/theme/worker?worker';
+const worker = new ThemeWorker();
+```
+
+The worker bundle is self-contained (dependencies inlined), so it also works with a plain `new Worker(url, { type: 'module' })`.
+
+## Docs
+
+Theming guides and the interactive theme generator: **[awc-ui.dev](https://awc-ui.dev/theming/overview/)**.
+
+## License
+
+MIT

package/dist/apply-font.d.ts

@@ -0,0 +1,8 @@
+/** Set all 15 --md-sys-typescale-*-font-family tokens on an element. */
+export declare function applyFontFamily(element: HTMLElement, fontFamily: string): void;
+/**
+ * Inject or update a Google Fonts stylesheet for common font choices.
+ * Custom font family strings are applied via CSS vars only (no network fetch).
+ */
+export declare function loadGoogleFont(fontFamily: string): void;
+//# sourceMappingURL=apply-font.d.ts.map

package/dist/apply-font.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-font.d.ts","sourceRoot":"","sources":["../src/apply-font.ts"],"names":[],"mappings":"AAmBA,wEAAwE;AACxE,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,GAAG,IAAI,CAK9E;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,CAevD"}

package/dist/apply-theme.d.ts

@@ -0,0 +1,8 @@
+import { type RoleMap, type ThemeComputeResult } from './types';
+/** Apply generated MD3 color role tokens as inline CSS custom properties on an element. */
+export declare function applyThemeRoles(element: HTMLElement, roles: RoleMap): void;
+/** Remove inline MD3 color role overrides so stylesheet / data-theme tokens can apply. */
+export declare function clearThemeRoles(element: HTMLElement): void;
+/** Inject or update a stylesheet with light (:root) and dark ([data-theme="dark"]) role tokens. */
+export declare function applyThemeStylesheet(theme: ThemeComputeResult, styleId?: string): void;
+//# sourceMappingURL=apply-theme.d.ts.map

package/dist/apply-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-theme.d.ts","sourceRoot":"","sources":["../src/apply-theme.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAE3E,2FAA2F;AAC3F,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,GAAG,IAAI,CAI1E;AAED,0FAA0F;AAC1F,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,CAI1D;AAED,mGAAmG;AACnG,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,kBAAkB,EACzB,OAAO,SAAyB,GAC/B,IAAI,CAQN"}

package/dist/compute-theme.d.ts

@@ -0,0 +1,4 @@
+import { type ThemeComputeRequest, type ThemeComputeResult } from './types';
+/** Generate MD3 tonal palettes and role-mapped tokens for light and dark mode. */
+export declare function computeTheme(req: ThemeComputeRequest): ThemeComputeResult;
+//# sourceMappingURL=compute-theme.d.ts.map

package/dist/compute-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"compute-theme.d.ts","sourceRoot":"","sources":["../src/compute-theme.ts"],"names":[],"mappings":"AAQA,OAAO,EAKL,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACxB,MAAM,SAAS,CAAC;AAuBjB,kFAAkF;AAClF,wBAAgB,YAAY,CAAC,GAAG,EAAE,mBAAmB,GAAG,kBAAkB,CA8DzE"}

package/dist/generate-css.d.ts

@@ -0,0 +1,4 @@
+import type { ThemeComputeResult } from './types';
+/** Format a computed theme as a drop-in CSS file overriding @awc-ui/tokens defaults. */
+export declare function generateCss(result: ThemeComputeResult): string;
+//# sourceMappingURL=generate-css.d.ts.map

package/dist/generate-css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate-css.d.ts","sourceRoot":"","sources":["../src/generate-css.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,wFAAwF;AACxF,wBAAgB,WAAW,CAAC,MAAM,EAAE,kBAAkB,GAAG,MAAM,CA+B9D"}

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+export { computeTheme } from './compute-theme';
+export { applyThemeRoles, applyThemeStylesheet, clearThemeRoles } from './apply-theme';
+export { applyFontFamily, loadGoogleFont } from './apply-font';
+export { generateCss } from './generate-css';
+export { tokenName } from './token-name';
+export { ROLE_KEYS, DEFAULT_SEED_COLORS, DEFAULT_FONT_FAMILY, TYPESCALE_SLOTS, } from './types';
+export type { PaletteKey, RoleKey, RoleMap, ThemeComputeRequest, ThemeComputeResult, ThemeWorkerRequest, ThemeWorkerResponse, } from './types';
+//# 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":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EACL,SAAS,EACT,mBAAmB,EACnB,mBAAmB,EACnB,eAAe,GAChB,MAAM,SAAS,CAAC;AACjB,YAAY,EACV,UAAU,EACV,OAAO,EACP,OAAO,EACP,mBAAmB,EACnB,kBAAkB,EAClB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,SAAS,CAAC"}