@exxatdesignux/ui 0.2.16 → 0.2.17

package/template/stores/app-store.ts

@@ -11,12 +11,37 @@
 import { create } from "zustand"
 import { persist } from "zustand/middleware"
 
-export type Product = "exxat-one" | "exxat-prism"
+export type Product = "exxat-one" | "exxat-prism" | "exxat-assessment" | "exxat-custom"
+
+export interface CustomProductBrand {
+  suffix: string
+  brandColor: string
+}
+
+export const DEFAULT_CUSTOM_PRODUCT_BRAND: CustomProductBrand = {
+  suffix: "Assessment",
+  brandColor: "oklch(0.7 0.0913 159.88)",
+}
 
 interface AppState {
   /** Currently active product — drives theme class and sidebar logo */
   product: Product
   setProduct: (product: Product) => void
+  customProductBrand: CustomProductBrand | null
+  setCustomProductBrand: (brand: CustomProductBrand | null) => void
+  /**
+   * Per-product brand color overrides — drives the mark gradient + wordmark
+   * suffix tint when the user picks a custom color for a built-in product
+   * (Exxat One / Prism / Assessment) or the custom slot. Settings →
+   * Appearance → Product uses these so the color picker actually re-colours
+   * the rendered logo (mark + suffix), instead of just the unused `brandColor`
+   * on the underlying `ProductBrandConfig`.
+   */
+  productBrandColors: Partial<Record<Product, string>>
+  setProductBrandColor: (product: Product, color: string | null) => void
+  hiddenProductIds: Product[]
+  hideProduct: (product: Product) => void
+  showProduct: (product: Product) => void
 }
 
 export const useAppStore = create<AppState>()(
@@ -24,6 +49,26 @@ export const useAppStore = create<AppState>()(
     (set) => ({
       product: "exxat-one",
       setProduct: (product) => set({ product }),
+      customProductBrand: DEFAULT_CUSTOM_PRODUCT_BRAND,
+      setCustomProductBrand: (customProductBrand) => set({ customProductBrand }),
+      productBrandColors: {},
+      setProductBrandColor: (product, color) =>
+        set(state => {
+          const next = { ...state.productBrandColors }
+          if (color && color.trim()) {
+            next[product] = color.trim()
+          } else {
+            delete next[product]
+          }
+          return { productBrandColors: next }
+        }),
+      hiddenProductIds: [],
+      hideProduct: (product) => set(state => ({
+        hiddenProductIds: Array.from(new Set([...state.hiddenProductIds, product])),
+      })),
+      showProduct: (product) => set(state => ({
+        hiddenProductIds: state.hiddenProductIds.filter(id => id !== product),
+      })),
     }),
     {
       name: "exxat-app",