@quinnjr/ngx-tailwindcss 1.0.1 → 1.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quinnjr/ngx-tailwindcss",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "A highly customizable Angular component library for Tailwind CSS 4+. Build beautiful, accessible UI components with full theming support, intelligent class merging, and zero bundled CSS. Features 30+ components including buttons, cards, modals, forms, tables, and more.",
   "license": "MIT",
   "exports": {
@@ -84,15 +84,16 @@
     "stepper"
   ],
   "peerDependencies": {
-    "@angular/common": "^19.0.0 || ^20.0.0 || ^21.0.0",
-    "@angular/core": "^19.0.0 || ^20.0.0 || ^21.0.0",
-    "@angular/cdk": "^19.0.0 || ^20.0.0 || ^21.0.0",
-    "@angular/forms": "^19.0.0 || ^20.0.0 || ^21.0.0",
-    "@angular/animations": "^19.0.0 || ^20.0.0 || ^21.0.0",
+    "@angular/common": "^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
+    "@angular/core": "^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
+    "@angular/cdk": "^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
+    "@angular/forms": "^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
+    "@angular/animations": "^19.0.0 || ^20.0.0 || ^21.0.0 || ^22.0.0",
     "@tauri-apps/api": "^2.0.0",
     "@tauri-apps/plugin-dialog": "^2.0.0",
     "@tauri-apps/plugin-notification": "^2.0.0",
     "@tauri-apps/plugin-process": "^2.0.0",
+    "@tauri-apps/plugin-store": "^2.0.0",
     "@tauri-apps/plugin-updater": "^2.0.0",
     "electron": "^28.0.0 || ^29.0.0 || ^30.0.0 || ^31.0.0 || ^32.0.0 || ^33.0.0 || ^34.0.0 || ^35.0.0 || ^36.0.0 || ^37.0.0 || ^38.0.0 || ^39.0.0"
   },
@@ -109,6 +110,9 @@
     "@tauri-apps/plugin-process": {
       "optional": true
     },
+    "@tauri-apps/plugin-store": {
+      "optional": true
+    },
     "@tauri-apps/plugin-updater": {
       "optional": true
     },

package/src/lib/styles/theme.css

@@ -1,15 +1,29 @@
 /**
  * ngx-tailwindcss Theme System
  *
- * This file provides CSS custom properties (variables) for theming the component library.
- * The library uses Tailwind CSS classes by default, but you can override colors using
- * these CSS variables.
+ * This file provides CSS custom properties (variables) for theming.
+ * The shipped components style themselves with plain Tailwind CSS utility
+ * classes and do NOT read these variables directly. The variables exist for
+ * two distinct purposes:
+ *
+ * 1. Semantic tokens (--tw-color-*): consumed by the OPTIONAL theme-aware
+ *    path — the THEME_CSS_CLASSES constants (e.g.
+ *    'bg-[var(--tw-color-primary)]') and the TwThemeService runtime theming
+ *    API. If you opt into that path, overriding these variables re-colors
+ *    everything that uses it.
+ *
+ * 2. Per-component tokens (--tw-button-*, --tw-card-*, --tw-switch-*, ...):
+ *    provided as a stable naming convention for YOUR OWN CSS when you
+ *    restyle the components (e.g. via classOverride, ::part-like wrapper
+ *    selectors, or global stylesheets). The shipped components do not read
+ *    them; they are hooks for consumer stylesheets and default to the
+ *    semantic tokens above so they follow your theme automatically.
  *
  * USAGE:
  * ======
  * 1. Import this file in your application's global styles:
  *
- *    @import '@pegasus-heavy/ngx-tailwindcss/styles/theme.css';
+ *    @import '@quinnjr/ngx-tailwindcss/styles/theme.css';
  *
  * 2. Override any variables in your own CSS to customize colors:
  *
@@ -33,12 +47,14 @@
  *
  * Or use the provided service:
  *
- *    import { TwThemeService } from '@pegasus-heavy/ngx-tailwindcss';
+ *    import { TwThemeService } from '@quinnjr/ngx-tailwindcss';
  *    themeService.setColorMode('dark');
  *
  * CUSTOMIZATION LEVELS:
  * =====================
- * 1. CSS Variables (this file) - Override semantic colors
+ * 1. CSS Variables (this file) - Override semantic colors for the optional
+ *    THEME_CSS_CLASSES / TwThemeService path, or use the per-component
+ *    tokens in your own stylesheets
  * 2. Tailwind Config - Extend/override Tailwind's color palette
  * 3. Component Props - Use classOverride/classReplace on individual components
  * 4. TwThemeService - Programmatically set theme at runtime
@@ -115,6 +131,7 @@
      ===================================================== */
 
   --tw-color-text: #0f172a;
+  --tw-color-text-primary: #0f172a;
   --tw-color-text-secondary: #475569;
   --tw-color-text-muted: #94a3b8;
   --tw-color-text-disabled: #cbd5e1;
@@ -321,6 +338,7 @@
 
   /* Text colors */
   --tw-color-text: #f8fafc;
+  --tw-color-text-primary: #f8fafc;
   --tw-color-text-secondary: #94a3b8;
   --tw-color-text-muted: #64748b;
   --tw-color-text-disabled: #475569;