@motor-hero/ui-kit 0.19.0 → 0.20.1

package/src/hooks/use-company-subdomain.ts

@@ -0,0 +1,51 @@
+import { useState } from "react"
+
+export type UseCompanySubdomainOptions = {
+  enableOverride?: boolean
+  overrideStorageKey?: string
+}
+
+export type UseCompanySubdomainResult = {
+  subdomain: string | undefined
+}
+
+export function getSubdomain(hostname: string): string | undefined {
+  const labels = hostname.split(".")
+  if (labels.length < 2) return undefined
+  const first = labels[0]
+  if (!first || first === "www" || first === "localhost") return undefined
+  return first
+}
+
+function resolveOverride(storageKey: string): string | undefined {
+  if (typeof window === "undefined") return undefined
+  const params = new URLSearchParams(window.location.search)
+  if (params.has("company")) {
+    const value = params.get("company")
+    if (value) {
+      window.localStorage.setItem(storageKey, value)
+      return value
+    }
+    window.localStorage.removeItem(storageKey)
+    return undefined
+  }
+  return window.localStorage.getItem(storageKey) ?? undefined
+}
+
+export function useCompanySubdomain(
+  opts: UseCompanySubdomainOptions = {},
+): UseCompanySubdomainResult {
+  const { enableOverride = false, overrideStorageKey = "company-subdomain" } =
+    opts
+
+  const [subdomain] = useState<string | undefined>(() => {
+    if (enableOverride) {
+      const override = resolveOverride(overrideStorageKey)
+      if (override) return override
+    }
+    if (typeof window === "undefined") return undefined
+    return getSubdomain(window.location.hostname)
+  })
+
+  return { subdomain }
+}

package/src/index.ts

@@ -1,8 +1,13 @@
 // Theme
 export { ThemeProvider, useTheme } from "./components/theme-provider"
 export type { Theme, ThemeProviderProps, ThemeProviderState } from "./components/theme-provider"
-export { applyTenantTheme } from "./lib/tenant-theme"
-export type { TenantTheme, TenantTokenSet } from "./lib/tenant-theme"
+export { applyCompanyTheme } from "./lib/company-theme"
+export type { CompanyTheme, CompanyThemeTokens } from "./lib/company-theme"
+export { useCompanySubdomain, getSubdomain } from "./hooks/use-company-subdomain"
+export type {
+  UseCompanySubdomainOptions,
+  UseCompanySubdomainResult,
+} from "./hooks/use-company-subdomain"
 
 // Components
 export { ModeToggle } from "./components/mode-toggle"

package/src/lib/company-theme.ts

@@ -0,0 +1,54 @@
+export type CompanyThemeTokens = {
+  primary?: string | null
+  primaryForeground?: string | null
+  secondary?: string | null
+  secondaryForeground?: string | null
+  accent?: string | null
+  accentForeground?: string | null
+  ring?: string | null
+}
+
+export type CompanyTheme = {
+  light: CompanyThemeTokens
+  dark?: Partial<CompanyThemeTokens>
+}
+
+const VAR_MAP: Record<keyof CompanyThemeTokens, string> = {
+  primary: "--color-primary",
+  primaryForeground: "--color-primary-foreground",
+  secondary: "--color-secondary",
+  secondaryForeground: "--color-secondary-foreground",
+  accent: "--color-accent",
+  accentForeground: "--color-accent-foreground",
+  ring: "--color-ring",
+}
+
+// A dark token that is null/undefined means "no override" — inherit the light
+// value. The API serializes unset *_dark columns as explicit null, so spreading
+// the raw dark object would clobber the inherited light values; strip them first.
+function definedTokens(
+  tokens: Partial<CompanyThemeTokens> | undefined
+): Partial<CompanyThemeTokens> {
+  if (!tokens) return {}
+  return Object.fromEntries(
+    Object.entries(tokens).filter(([, value]) => value != null)
+  )
+}
+
+export function applyCompanyTheme(
+  root: HTMLElement,
+  companyTheme: CompanyTheme | undefined,
+  mode: "light" | "dark"
+) {
+  const tokens: CompanyThemeTokens = companyTheme
+    ? mode === "dark"
+      ? { ...companyTheme.light, ...definedTokens(companyTheme.dark) }
+      : companyTheme.light
+    : {}
+
+  for (const key of Object.keys(VAR_MAP) as (keyof CompanyThemeTokens)[]) {
+    const value = tokens[key]
+    if (value) root.style.setProperty(VAR_MAP[key], value)
+    else root.style.removeProperty(VAR_MAP[key])
+  }
+}

package/dist/lib/tenant-theme.d.ts

@@ -1,15 +0,0 @@
-export type TenantTokenSet = {
-    primary?: string;
-    primaryForeground?: string;
-    secondary?: string;
-    secondaryForeground?: string;
-    accent?: string;
-    accentForeground?: string;
-    ring?: string;
-};
-export type TenantTheme = {
-    light: TenantTokenSet;
-    dark?: Partial<TenantTokenSet>;
-};
-export declare function applyTenantTheme(root: HTMLElement, tenantTheme: TenantTheme | undefined, mode: "light" | "dark"): void;
-//# sourceMappingURL=tenant-theme.d.ts.map

package/dist/lib/tenant-theme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"tenant-theme.d.ts","sourceRoot":"","sources":["../../src/lib/tenant-theme.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,cAAc,GAAG;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,cAAc,CAAA;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAA;CAC/B,CAAA;AAYD,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,WAAW,EACjB,WAAW,EAAE,WAAW,GAAG,SAAS,EACpC,IAAI,EAAE,OAAO,GAAG,MAAM,QAavB"}

package/src/lib/tenant-theme.ts

@@ -1,42 +0,0 @@
-export type TenantTokenSet = {
-  primary?: string
-  primaryForeground?: string
-  secondary?: string
-  secondaryForeground?: string
-  accent?: string
-  accentForeground?: string
-  ring?: string
-}
-
-export type TenantTheme = {
-  light: TenantTokenSet
-  dark?: Partial<TenantTokenSet>
-}
-
-const VAR_MAP: Record<keyof TenantTokenSet, string> = {
-  primary: "--color-primary",
-  primaryForeground: "--color-primary-foreground",
-  secondary: "--color-secondary",
-  secondaryForeground: "--color-secondary-foreground",
-  accent: "--color-accent",
-  accentForeground: "--color-accent-foreground",
-  ring: "--color-ring",
-}
-
-export function applyTenantTheme(
-  root: HTMLElement,
-  tenantTheme: TenantTheme | undefined,
-  mode: "light" | "dark"
-) {
-  const tokens: TenantTokenSet = tenantTheme
-    ? mode === "dark"
-      ? { ...tenantTheme.light, ...tenantTheme.dark }
-      : tenantTheme.light
-    : {}
-
-  for (const key of Object.keys(VAR_MAP) as (keyof TenantTokenSet)[]) {
-    const value = tokens[key]
-    if (value) root.style.setProperty(VAR_MAP[key], value)
-    else root.style.removeProperty(VAR_MAP[key])
-  }
-}