tailwind-styled-v4 5.1.14 → 5.1.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/umbrella/runtime.ts","../packages/domain/runtime/src/index.ts","../packages/domain/theme/src/liveTokenEngine.ts","../packages/domain/runtime/src/schemas.ts"],"sourcesContent":["export * from \"@tailwind-styled/runtime\"\n","/**\n * @tailwind-styled/runtime v5\n *\n * Lightweight runtime helpers for compiled tailwind-styled-v5 components.\n * Live token engine has been moved to @tailwind-styled/theme package.\n */\n\nimport React from \"react\"\n\n// Re-export live token engine from @tailwind-styled/theme\nexport type {\n LiveTokenEngineBridge,\n LiveTokenSet,\n TokenMap,\n TokenSubscriber,\n} from \"@tailwind-styled/theme\"\nexport {\n applyTokenSet,\n createUseTokens,\n generateTokenCssString,\n getToken,\n getTokens,\n liveToken,\n liveTokenEngine,\n setToken,\n setTokens,\n subscribeTokens,\n tokenRef,\n tokenVar,\n} from \"@tailwind-styled/theme/live-tokens\"\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────────────────────\n\nexport interface SubComponentDef {\n /** HTML tag to render (default: \"span\") */\n tag?: string\n /** Scoped CSS class generated by Rust, e.g. \"Button_icon_abc123\" */\n class: string\n}\n\nexport type SubComponentMap = Record<string, SubComponentDef>\n\n/**\n * Map of prop name → CSS class appended when the prop is truthy.\n * e.g. { fullWidth: \"w-full\", large: \"text-lg px-6 py-3\" }\n */\nexport type ConditionalProps = Record<string, string>\n\n/**\n * A compound styled component: base ForwardRef + attached .SubName properties.\n * The generic params are intentionally loose so callers don't need to repeat them.\n */\nexport type StyledComponent<S extends SubComponentMap = SubComponentMap> =\n React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n > & {\n [K in keyof S]: React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n >\n }\n\n/** Metadata for one compound component produced by Rust. */\nexport interface ComponentMetadata {\n component: string\n tag: string\n baseClass: string\n subComponents: SubComponentMap\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// cx — tiny className utility (no external dependency)\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype ClassInput = string | number | false | null | undefined | ClassInput[]\n\nexport function cx(...inputs: ClassInput[]): string {\n const out: string[] = []\n for (const input of inputs) {\n if (!input) continue // filters 0, false, null, undefined, \"\"\n if (typeof input === \"string\") {\n out.push(input)\n } else if (typeof input === \"number\") {\n out.push(String(input))\n } else if (Array.isArray(input)) {\n const nested = cx(...input)\n if (nested) out.push(nested)\n }\n }\n return out.join(\" \")\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// createComponent\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Build a compound styled React component from Rust-generated metadata.\n *\n * @param tag HTML element tag, e.g. \"button\" | \"div\"\n * @param baseClass Scoped base class from Rust, e.g. \"Button_abc123\"\n * @param subComponents Map of subcomponent definitions (optional)\n * @param conditionals Map of prop name → CSS class (optional)\n *\n * @example\n * // Injected automatically by the compiler — do not call manually\n * const Button = createComponent(\"button\", \"Button_abc123\", {\n * icon: { tag: \"span\", class: \"Button_icon_abc123\" },\n * text: { tag: \"span\", class: \"Button_text_abc123\" },\n * }, { fullWidth: \"w-full\" })\n *\n * // Usage in JSX:\n * <Button fullWidth>\n * <Button.icon>🔍</Button.icon>\n * <Button.text>Search</Button.text>\n * </Button>\n */\nexport function createComponent<S extends SubComponentMap = SubComponentMap>(\n tag: string,\n baseClass: string,\n subComponents?: S,\n conditionals?: ConditionalProps\n): StyledComponent<S> {\n type Props = React.HTMLAttributes<HTMLElement> &\n React.RefAttributes<HTMLElement> &\n Record<string, unknown>\n\n // ── Base component ─────────────────────────────────────────────────────────\n const Base = React.forwardRef<HTMLElement, Props>(function TwBase(props, ref) {\n const extra: string[] = []\n\n // Collect conditional classes\n if (conditionals) {\n for (const [prop, cls] of Object.entries(conditionals)) {\n if (props[prop]) extra.push(cls)\n }\n }\n\n // Build clean props — strip conditional + subcomponent boolean props\n const clean: Record<string, unknown> = {}\n const stripKeys = new Set([\n \"className\",\n ...(conditionals ? Object.keys(conditionals) : []),\n ...(subComponents ? Object.keys(subComponents) : []),\n ])\n for (const [k, v] of Object.entries(props)) {\n if (!stripKeys.has(k)) clean[k] = v\n }\n\n const className = cx(baseClass, ...extra, (props.className as string) ?? \"\")\n\n return React.createElement(tag, { ...clean, ref, className: className || undefined })\n })\n\n ;(Base as { displayName?: string }).displayName = `tw.${String(tag)}`\n\n // ── Attach subcomponent properties ────────────────────────────────────────\n if (subComponents) {\n for (const [subName, def] of Object.entries(subComponents)) {\n const subTag = def.tag ?? \"span\"\n const subClass = def.class\n\n const SubComp = React.forwardRef<HTMLElement, Props>(function TwSub(props, ref) {\n const className = cx(subClass, (props.className as string) ?? \"\")\n const clean: Record<string, unknown> = { ...props }\n delete clean.className\n return React.createElement(subTag, { ...clean, ref, className: className || undefined })\n })\n\n ;(SubComp as { displayName?: string }).displayName = `tw.${String(tag)}.${String(subName)}`\n\n ;(Base as unknown as Record<string, unknown>)[subName] = SubComp\n }\n }\n\n return Base as StyledComponent<S>\n}\n\n// Re-export schemas\nexport {\n type ComponentMetadataInput,\n ComponentMetadataSchema,\n type ConditionalPropsInput,\n ConditionalPropsSchema,\n parseComponentMetadata,\n parseSubComponentDef,\n type SubComponentDefInput,\n SubComponentDefSchema,\n} from \"./schemas\"\n","\"use client\"\n\nimport React from \"react\"\n\nimport type { TokenMap } from '@tailwind-styled/shared'\nexport type { TokenMap }\n\nexport type TokenSubscriber = (tokens: TokenMap) => void\n\nexport interface LiveTokenSet {\n vars: Record<string, string>\n get(name: string): string | undefined\n set(name: string, value: string): void\n setAll(tokens: TokenMap): void\n snapshot(): TokenMap\n}\n\nexport interface LiveTokenEngineBridge {\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n subscribeTokens(fn: TokenSubscriber): () => void\n subscribe?(fn: TokenSubscriber): () => void\n}\n\ninterface LiveTokenEngineRuntime {\n liveToken(tokens: TokenMap): LiveTokenSet\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n generateTokenCssString(): string\n subscribe(fn: TokenSubscriber): () => void\n}\n\nconst TOKEN_ENGINE_KEY = \"__TW_TOKEN_ENGINE__\"\n\nexport function tokenVar(name: string): string {\n const normalized = name.replace(/[^a-zA-Z0-9-]/g, \"-\").toLowerCase()\n return `--tw-token-${normalized}`\n}\n\nexport function tokenRef(name: string): string {\n return `var(${tokenVar(name)})`\n}\n\nconst buildRootCss = (tokens: TokenMap): string => {\n const vars = Object.entries(tokens)\n .map(([name, value]) => ` ${tokenVar(name)}: ${value};`)\n .join(\"\\n\")\n return `:root {\\n${vars}\\n}`\n}\n\nconst createLiveTokenEngine = (): LiveTokenEngineRuntime => {\n const state = {\n currentTokens: {} as TokenMap,\n styleEl: null as HTMLStyleElement | null,\n }\n const subscribers = new Set<TokenSubscriber>()\n\n const syncStyleEl = (): void => {\n if (typeof document === \"undefined\") return\n\n if (!state.styleEl) {\n const styleEl = document.createElement(\"style\")\n styleEl.id = \"tw-live-tokens\"\n styleEl.setAttribute(\"data-tw-tokens\", \"true\")\n document.head.appendChild(styleEl)\n state.styleEl = styleEl\n }\n\n state.styleEl.textContent = buildRootCss(state.currentTokens)\n }\n\n const notifySubscribers = (): void => {\n const snapshot = { ...state.currentTokens }\n for (const subscriber of subscribers) {\n try {\n subscriber(snapshot)\n } catch {\n // Intentionally ignore subscriber errors.\n }\n }\n }\n\n const setToken = (name: string, value: string): void => {\n state.currentTokens = { ...state.currentTokens, [name]: value }\n if (typeof document !== \"undefined\") {\n document.documentElement.style.setProperty(tokenVar(name), value)\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const setTokens = (tokens: TokenMap): void => {\n state.currentTokens = { ...state.currentTokens, ...tokens }\n if (typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const applyTokenSet = (tokens: TokenMap): void => {\n if (typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const name of Object.keys(state.currentTokens)) {\n if (!(name in tokens)) {\n root.style.removeProperty(tokenVar(name))\n }\n }\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n\n state.currentTokens = { ...tokens }\n syncStyleEl()\n notifySubscribers()\n }\n\n return {\n liveToken(tokens: TokenMap): LiveTokenSet {\n setTokens(tokens)\n\n const vars: Record<string, string> = {}\n for (const name of Object.keys(tokens)) {\n vars[name] = tokenRef(name)\n }\n\n return {\n vars,\n get(name: string) {\n return state.currentTokens[name]\n },\n set(name: string, value: string) {\n setToken(name, value)\n },\n setAll(nextTokens: TokenMap) {\n setTokens(nextTokens)\n },\n snapshot() {\n return { ...state.currentTokens }\n },\n }\n },\n getToken(name: string): string | undefined {\n return state.currentTokens[name]\n },\n getTokens(): TokenMap {\n return { ...state.currentTokens }\n },\n setToken,\n setTokens,\n applyTokenSet,\n generateTokenCssString(): string {\n return buildRootCss(state.currentTokens)\n },\n subscribe(fn: TokenSubscriber): () => void {\n subscribers.add(fn)\n return () => {\n subscribers.delete(fn)\n }\n },\n }\n}\n\nconst engine = createLiveTokenEngine()\n\nexport function liveToken(tokens: TokenMap): LiveTokenSet {\n return engine.liveToken(tokens)\n}\n\nexport function setToken(name: string, value: string): void {\n engine.setToken(name, value)\n}\n\nexport function setTokens(tokens: TokenMap): void {\n engine.setTokens(tokens)\n}\n\nexport function applyTokenSet(tokens: TokenMap): void {\n engine.applyTokenSet(tokens)\n}\n\nexport function getToken(name: string): string | undefined {\n return engine.getToken(name)\n}\n\nexport function getTokens(): TokenMap {\n return engine.getTokens()\n}\n\nexport function subscribeTokens(fn: TokenSubscriber): () => void {\n return engine.subscribe(fn)\n}\n\nexport function generateTokenCssString(): string {\n return engine.generateTokenCssString()\n}\n\nexport function createUseTokens() {\n return function useTokens(): TokenMap {\n const [tokens, setTokensState] = React.useState<TokenMap>(engine.getTokens())\n\n React.useEffect(() => {\n setTokensState(engine.getTokens())\n return engine.subscribe((nextTokens) => setTokensState(nextTokens))\n }, [])\n\n return tokens\n }\n}\n\nexport const liveTokenEngine: LiveTokenEngineBridge = {\n getToken: engine.getToken,\n getTokens: engine.getTokens,\n setToken: engine.setToken,\n setTokens: engine.setTokens,\n applyTokenSet: engine.applyTokenSet,\n subscribeTokens: engine.subscribe,\n subscribe: engine.subscribe,\n}\n\ndeclare global {\n interface Window {\n __TW_TOKEN_ENGINE__?: LiveTokenEngineBridge\n }\n}\n\nconst globalTokenEngine = globalThis as typeof globalThis & {\n [TOKEN_ENGINE_KEY]?: LiveTokenEngineBridge\n}\n\nglobalTokenEngine[TOKEN_ENGINE_KEY] = liveTokenEngine\nif (typeof window !== \"undefined\") {\n window.__TW_TOKEN_ENGINE__ = liveTokenEngine\n}\n","import { z } from \"zod\"\n\nconst formatIssues = (error: z.ZodError): string =>\n error.issues\n .map((issue) => {\n const p = issue.path.length > 0 ? issue.path.join(\".\") : \"<root>\"\n return `${p}: ${issue.message}`\n })\n .join(\"; \")\n\nconst parseWithSchema = <T>(schema: z.ZodType<T>, data: unknown, label: string): T => {\n const parsed = schema.safeParse(data)\n if (parsed.success) return parsed.data\n throw new TypeError(`${label}: ${formatIssues(parsed.error)}`)\n}\n\nexport const SubComponentDefSchema = z.object({\n tag: z.string().optional(),\n class: z.string(),\n})\n\nexport type SubComponentDefInput = z.infer<typeof SubComponentDefSchema>\n\nexport const ComponentMetadataSchema = z.object({\n component: z.string(),\n tag: z.string(),\n baseClass: z.string(),\n subComponents: z.record(z.string(), SubComponentDefSchema),\n})\n\nexport type ComponentMetadataInput = z.infer<typeof ComponentMetadataSchema>\n\nexport const ConditionalPropsSchema = z.record(z.string(), z.string())\n\nexport type ConditionalPropsInput = z.infer<typeof ConditionalPropsSchema>\n\nexport const parseSubComponentDef = (data: unknown) =>\n parseWithSchema(SubComponentDefSchema, data, \"sub-component definition is invalid\")\n\nexport const parseComponentMetadata = (data: unknown) =>\n parseWithSchema(ComponentMetadataSchema, data, \"component metadata is invalid\")\n"],"mappings":"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","names":["import_react","setToken","setTokens","applyTokenSet","React","React"]}
1
+ {"version":3,"sources":["../src/umbrella/runtime.ts","../packages/domain/runtime/src/index.ts","../packages/domain/theme/src/liveTokenEngine.ts","../packages/domain/runtime/src/schemas.ts"],"sourcesContent":["export * from \"@tailwind-styled/runtime\"\n","/**\n * @tailwind-styled/runtime v5\n *\n * Lightweight runtime helpers for compiled tailwind-styled-v5 components.\n * Live token engine has been moved to @tailwind-styled/theme package.\n */\n\nimport React from \"react\"\n\n// Re-export live token engine from @tailwind-styled/theme\nexport type {\n LiveTokenEngineBridge,\n LiveTokenSet,\n TokenMap,\n TokenSubscriber,\n} from \"@tailwind-styled/theme\"\nexport {\n applyTokenSet,\n createUseTokens,\n generateTokenCssString,\n getToken,\n getTokens,\n liveToken,\n liveTokenEngine,\n setToken,\n setTokens,\n subscribeTokens,\n tokenRef,\n tokenVar,\n} from \"@tailwind-styled/theme/live-tokens\"\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────────────────────\n\nexport interface SubComponentDef {\n /** HTML tag to render (default: \"span\") */\n tag?: string\n /** Scoped CSS class generated by Rust, e.g. \"Button_icon_abc123\" */\n class: string\n}\n\nexport type SubComponentMap = Record<string, SubComponentDef>\n\n/**\n * Map of prop name → CSS class appended when the prop is truthy.\n * e.g. { fullWidth: \"w-full\", large: \"text-lg px-6 py-3\" }\n */\nexport type ConditionalProps = Record<string, string>\n\n/**\n * A compound styled component: base ForwardRef + attached .SubName properties.\n * The generic params are intentionally loose so callers don't need to repeat them.\n */\nexport type StyledComponent<S extends SubComponentMap = SubComponentMap> =\n React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n > & {\n [K in keyof S]: React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n >\n }\n\n/** Metadata for one compound component produced by Rust. */\nexport interface ComponentMetadata {\n component: string\n tag: string\n baseClass: string\n subComponents: SubComponentMap\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// cx — tiny className utility (no external dependency)\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype ClassInput = string | number | false | null | undefined | ClassInput[]\n\nexport function cx(...inputs: ClassInput[]): string {\n const out: string[] = []\n for (const input of inputs) {\n if (!input) continue // filters 0, false, null, undefined, \"\"\n if (typeof input === \"string\") {\n out.push(input)\n } else if (typeof input === \"number\") {\n out.push(String(input))\n } else if (Array.isArray(input)) {\n const nested = cx(...input)\n if (nested) out.push(nested)\n }\n }\n return out.join(\" \")\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// createComponent\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Build a compound styled React component from Rust-generated metadata.\n *\n * @param tag HTML element tag, e.g. \"button\" | \"div\"\n * @param baseClass Scoped base class from Rust, e.g. \"Button_abc123\"\n * @param subComponents Map of subcomponent definitions (optional)\n * @param conditionals Map of prop name → CSS class (optional)\n *\n * @example\n * // Injected automatically by the compiler — do not call manually\n * const Button = createComponent(\"button\", \"Button_abc123\", {\n * icon: { tag: \"span\", class: \"Button_icon_abc123\" },\n * text: { tag: \"span\", class: \"Button_text_abc123\" },\n * }, { fullWidth: \"w-full\" })\n *\n * // Usage in JSX:\n * <Button fullWidth>\n * <Button.icon>🔍</Button.icon>\n * <Button.text>Search</Button.text>\n * </Button>\n */\nexport function createComponent<S extends SubComponentMap = SubComponentMap>(\n tag: string,\n baseClass: string,\n subComponents?: S,\n conditionals?: ConditionalProps\n): StyledComponent<S> {\n type Props = React.HTMLAttributes<HTMLElement> &\n React.RefAttributes<HTMLElement> &\n Record<string, unknown>\n\n // ── Base component ─────────────────────────────────────────────────────────\n const Base = React.forwardRef<HTMLElement, Props>(function TwBase(props, ref) {\n const extra: string[] = []\n\n // Collect conditional classes\n if (conditionals) {\n for (const [prop, cls] of Object.entries(conditionals)) {\n if (props[prop]) extra.push(cls)\n }\n }\n\n // Build clean props — strip conditional + subcomponent boolean props\n const clean: Record<string, unknown> = {}\n const stripKeys = new Set([\n \"className\",\n ...(conditionals ? Object.keys(conditionals) : []),\n ...(subComponents ? Object.keys(subComponents) : []),\n ])\n for (const [k, v] of Object.entries(props)) {\n if (!stripKeys.has(k)) clean[k] = v\n }\n\n const className = cx(baseClass, ...extra, (props.className as string) ?? \"\")\n\n return React.createElement(tag, { ...clean, ref, className: className || undefined })\n })\n\n ;(Base as { displayName?: string }).displayName = `tw.${String(tag)}`\n\n // ── Attach subcomponent properties ────────────────────────────────────────\n if (subComponents) {\n for (const [subName, def] of Object.entries(subComponents)) {\n const subTag = def.tag ?? \"span\"\n const subClass = def.class\n\n const SubComp = React.forwardRef<HTMLElement, Props>(function TwSub(props, ref) {\n const className = cx(subClass, (props.className as string) ?? \"\")\n const clean: Record<string, unknown> = { ...props }\n delete clean.className\n return React.createElement(subTag, { ...clean, ref, className: className || undefined })\n })\n\n ;(SubComp as { displayName?: string }).displayName = `tw.${String(tag)}.${String(subName)}`\n\n ;(Base as unknown as Record<string, unknown>)[subName] = SubComp\n }\n }\n\n return Base as StyledComponent<S>\n}\n\n// Re-export schemas\nexport {\n type ComponentMetadataInput,\n ComponentMetadataSchema,\n type ConditionalPropsInput,\n ConditionalPropsSchema,\n parseComponentMetadata,\n parseSubComponentDef,\n type SubComponentDefInput,\n SubComponentDefSchema,\n} from \"./schemas\"\n","\"use client\"\n\nimport React from \"react\"\n\nimport type { TokenMap } from '@tailwind-styled/shared'\nexport type { TokenMap }\n\nexport type TokenSubscriber = (tokens: TokenMap) => void\n\nexport interface LiveTokenSet {\n vars: Record<string, string>\n get(name: string): string | undefined\n set(name: string, value: string): void\n setAll(tokens: TokenMap): void\n snapshot(): TokenMap\n}\n\nexport interface LiveTokenEngineBridge {\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n subscribeTokens(fn: TokenSubscriber): () => void\n subscribe?(fn: TokenSubscriber): () => void\n}\n\ninterface LiveTokenEngineRuntime {\n liveToken(tokens: TokenMap): LiveTokenSet\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n generateTokenCssString(): string\n subscribe(fn: TokenSubscriber): () => void\n markHydrated(): void\n}\n\nconst TOKEN_ENGINE_KEY = \"__TW_TOKEN_ENGINE__\"\n\nexport function tokenVar(name: string): string {\n const normalized = name.replace(/[^a-zA-Z0-9-]/g, \"-\").toLowerCase()\n return `--tw-token-${normalized}`\n}\n\nexport function tokenRef(name: string): string {\n return `var(${tokenVar(name)})`\n}\n\nconst buildRootCss = (tokens: TokenMap): string => {\n const vars = Object.entries(tokens)\n .map(([name, value]) => ` ${tokenVar(name)}: ${value};`)\n .join(\"\\n\")\n return `:root {\\n${vars}\\n}`\n}\n\nconst createLiveTokenEngine = (): LiveTokenEngineRuntime => {\n const state = {\n currentTokens: {} as TokenMap,\n styleEl: null as HTMLStyleElement | null,\n // Belum boleh nyentuh live DOM sampai komponen pertama selesai mount.\n // Ini yang nyegah hydration mismatch: tanpa flag ini, liveToken() yang\n // dipanggil di module top-level akan langsung document.documentElement\n // .style.setProperty(...) saat bundle client di-evaluasi — JAUH sebelum\n // React selesai hydrate — sehingga <html> versi live DOM beda dengan\n // <html> yang di-render server (yang gak pernah nyentuh `document`).\n hydrated: false,\n }\n const subscribers = new Set<TokenSubscriber>()\n\n const syncStyleEl = (): void => {\n if (!state.hydrated || typeof document === \"undefined\") return\n\n if (!state.styleEl) {\n const styleEl = document.createElement(\"style\")\n styleEl.id = \"tw-live-tokens\"\n styleEl.setAttribute(\"data-tw-tokens\", \"true\")\n document.head.appendChild(styleEl)\n state.styleEl = styleEl\n }\n\n state.styleEl.textContent = buildRootCss(state.currentTokens)\n }\n\n const notifySubscribers = (): void => {\n const snapshot = { ...state.currentTokens }\n for (const subscriber of subscribers) {\n try {\n subscriber(snapshot)\n } catch {\n // Intentionally ignore subscriber errors.\n }\n }\n }\n\n const setToken = (name: string, value: string): void => {\n state.currentTokens = { ...state.currentTokens, [name]: value }\n if (state.hydrated && typeof document !== \"undefined\") {\n document.documentElement.style.setProperty(tokenVar(name), value)\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const setTokens = (tokens: TokenMap): void => {\n state.currentTokens = { ...state.currentTokens, ...tokens }\n if (state.hydrated && typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const applyTokenSet = (tokens: TokenMap): void => {\n if (state.hydrated && typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const name of Object.keys(state.currentTokens)) {\n if (!(name in tokens)) {\n root.style.removeProperty(tokenVar(name))\n }\n }\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n\n state.currentTokens = { ...tokens }\n syncStyleEl()\n notifySubscribers()\n }\n\n // Dipanggil sekali setelah mount pertama (lewat useTokens()'s useEffect, atau\n // fallback rAF di bawah buat consumer yang pakai API imperative tanpa hook).\n // Setelah ini true, semua write di atas balik sinkron langsung seperti semula.\n const markHydrated = (): void => {\n if (state.hydrated || typeof document === \"undefined\") return\n state.hydrated = true\n const root = document.documentElement\n for (const [name, value] of Object.entries(state.currentTokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n syncStyleEl()\n }\n\n if (typeof window !== \"undefined\") {\n // Fallback buat consumer yang gak pakai useTokens() hook (cuma pakai\n // liveToken().set() imperatif): tetap flush setelah paint pertama,\n // jauh lebih aman daripada langsung saat module di-evaluasi.\n requestAnimationFrame(markHydrated)\n }\n\n return {\n markHydrated,\n liveToken(tokens: TokenMap): LiveTokenSet {\n setTokens(tokens)\n\n const vars: Record<string, string> = {}\n for (const name of Object.keys(tokens)) {\n vars[name] = tokenRef(name)\n }\n\n return {\n vars,\n get(name: string) {\n return state.currentTokens[name]\n },\n set(name: string, value: string) {\n setToken(name, value)\n },\n setAll(nextTokens: TokenMap) {\n setTokens(nextTokens)\n },\n snapshot() {\n return { ...state.currentTokens }\n },\n }\n },\n getToken(name: string): string | undefined {\n return state.currentTokens[name]\n },\n getTokens(): TokenMap {\n return { ...state.currentTokens }\n },\n setToken,\n setTokens,\n applyTokenSet,\n generateTokenCssString(): string {\n return buildRootCss(state.currentTokens)\n },\n subscribe(fn: TokenSubscriber): () => void {\n subscribers.add(fn)\n return () => {\n subscribers.delete(fn)\n }\n },\n }\n}\n\nconst engine = createLiveTokenEngine()\n\nexport function liveToken(tokens: TokenMap): LiveTokenSet {\n return engine.liveToken(tokens)\n}\n\nexport function setToken(name: string, value: string): void {\n engine.setToken(name, value)\n}\n\nexport function setTokens(tokens: TokenMap): void {\n engine.setTokens(tokens)\n}\n\nexport function applyTokenSet(tokens: TokenMap): void {\n engine.applyTokenSet(tokens)\n}\n\nexport function getToken(name: string): string | undefined {\n return engine.getToken(name)\n}\n\nexport function getTokens(): TokenMap {\n return engine.getTokens()\n}\n\nexport function subscribeTokens(fn: TokenSubscriber): () => void {\n return engine.subscribe(fn)\n}\n\nexport function generateTokenCssString(): string {\n return engine.generateTokenCssString()\n}\n\nexport function createUseTokens() {\n return function useTokens(): TokenMap {\n // useSyncExternalStore untuk konsistensi SSR/client:\n // - getServerSnapshot() return empty object → SSR render tanpa tokens\n // - getSnapshot() return live tokens di client setelah hydration\n // Ini menghilangkan hydration mismatch karena server dan client\n // initial render keduanya return {} (empty), lalu useEffect update\n // ke nilai aktual via subscriber.\n const [tokens, setTokensState] = React.useState<TokenMap>({})\n\n React.useEffect(() => {\n // Baru sekarang aman nyentuh document.documentElement — hydration\n // udah pasti selesai di titik ini. markHydrated() flush token yang\n // sempat ditunda dari liveToken() init call (lihat createLiveTokenEngine).\n engine.markHydrated()\n // Set ke nilai aktual setelah mount (client-only)\n setTokensState(engine.getTokens())\n return engine.subscribe((nextTokens) => setTokensState(nextTokens))\n }, [])\n\n return tokens\n }\n}\n\nexport const liveTokenEngine: LiveTokenEngineBridge = {\n getToken: engine.getToken,\n getTokens: engine.getTokens,\n setToken: engine.setToken,\n setTokens: engine.setTokens,\n applyTokenSet: engine.applyTokenSet,\n subscribeTokens: engine.subscribe,\n subscribe: engine.subscribe,\n}\n\ndeclare global {\n interface Window {\n __TW_TOKEN_ENGINE__?: LiveTokenEngineBridge\n }\n}\n\nconst globalTokenEngine = globalThis as typeof globalThis & {\n [TOKEN_ENGINE_KEY]?: LiveTokenEngineBridge\n}\n\nglobalTokenEngine[TOKEN_ENGINE_KEY] = liveTokenEngine\nif (typeof window !== \"undefined\") {\n window.__TW_TOKEN_ENGINE__ = liveTokenEngine\n}\n","import { z } from \"zod\"\n\nconst formatIssues = (error: z.ZodError): string =>\n error.issues\n .map((issue) => {\n const p = issue.path.length > 0 ? issue.path.join(\".\") : \"<root>\"\n return `${p}: ${issue.message}`\n })\n .join(\"; \")\n\nconst parseWithSchema = <T>(schema: z.ZodType<T>, data: unknown, label: string): T => {\n const parsed = schema.safeParse(data)\n if (parsed.success) return parsed.data\n throw new TypeError(`${label}: ${formatIssues(parsed.error)}`)\n}\n\nexport const SubComponentDefSchema = z.object({\n tag: z.string().optional(),\n class: z.string(),\n})\n\nexport type SubComponentDefInput = z.infer<typeof SubComponentDefSchema>\n\nexport const ComponentMetadataSchema = z.object({\n component: z.string(),\n tag: z.string(),\n baseClass: z.string(),\n subComponents: z.record(z.string(), SubComponentDefSchema),\n})\n\nexport type ComponentMetadataInput = z.infer<typeof ComponentMetadataSchema>\n\nexport const ConditionalPropsSchema = z.record(z.string(), z.string())\n\nexport type ConditionalPropsInput = z.infer<typeof ConditionalPropsSchema>\n\nexport const parseSubComponentDef = (data: unknown) =>\n parseWithSchema(SubComponentDefSchema, data, \"sub-component definition is invalid\")\n\nexport const parseComponentMetadata = (data: unknown) =>\n parseWithSchema(ComponentMetadataSchema, data, \"component metadata is invalid\")\n"],"mappings":"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","names":["import_react","setToken","setTokens","applyTokenSet","React","React"]}
package/dist/runtime.mjs CHANGED
@@ -21,11 +21,18 @@ ${vars}
21
21
  var createLiveTokenEngine = () => {
22
22
  const state = {
23
23
  currentTokens: {},
24
- styleEl: null
24
+ styleEl: null,
25
+ // Belum boleh nyentuh live DOM sampai komponen pertama selesai mount.
26
+ // Ini yang nyegah hydration mismatch: tanpa flag ini, liveToken() yang
27
+ // dipanggil di module top-level akan langsung document.documentElement
28
+ // .style.setProperty(...) saat bundle client di-evaluasi — JAUH sebelum
29
+ // React selesai hydrate — sehingga <html> versi live DOM beda dengan
30
+ // <html> yang di-render server (yang gak pernah nyentuh `document`).
31
+ hydrated: false
25
32
  };
26
33
  const subscribers = /* @__PURE__ */ new Set();
27
34
  const syncStyleEl = () => {
28
- if (typeof document === "undefined") return;
35
+ if (!state.hydrated || typeof document === "undefined") return;
29
36
  if (!state.styleEl) {
30
37
  const styleEl = document.createElement("style");
31
38
  styleEl.id = "tw-live-tokens";
@@ -46,7 +53,7 @@ var createLiveTokenEngine = () => {
46
53
  };
47
54
  const setToken2 = (name, value) => {
48
55
  state.currentTokens = { ...state.currentTokens, [name]: value };
49
- if (typeof document !== "undefined") {
56
+ if (state.hydrated && typeof document !== "undefined") {
50
57
  document.documentElement.style.setProperty(tokenVar(name), value);
51
58
  }
52
59
  syncStyleEl();
@@ -54,7 +61,7 @@ var createLiveTokenEngine = () => {
54
61
  };
55
62
  const setTokens2 = (tokens) => {
56
63
  state.currentTokens = { ...state.currentTokens, ...tokens };
57
- if (typeof document !== "undefined") {
64
+ if (state.hydrated && typeof document !== "undefined") {
58
65
  const root = document.documentElement;
59
66
  for (const [name, value] of Object.entries(tokens)) {
60
67
  root.style.setProperty(tokenVar(name), value);
@@ -64,7 +71,7 @@ var createLiveTokenEngine = () => {
64
71
  notifySubscribers();
65
72
  };
66
73
  const applyTokenSet2 = (tokens) => {
67
- if (typeof document !== "undefined") {
74
+ if (state.hydrated && typeof document !== "undefined") {
68
75
  const root = document.documentElement;
69
76
  for (const name of Object.keys(state.currentTokens)) {
70
77
  if (!(name in tokens)) {
@@ -79,7 +86,20 @@ var createLiveTokenEngine = () => {
79
86
  syncStyleEl();
80
87
  notifySubscribers();
81
88
  };
89
+ const markHydrated = () => {
90
+ if (state.hydrated || typeof document === "undefined") return;
91
+ state.hydrated = true;
92
+ const root = document.documentElement;
93
+ for (const [name, value] of Object.entries(state.currentTokens)) {
94
+ root.style.setProperty(tokenVar(name), value);
95
+ }
96
+ syncStyleEl();
97
+ };
98
+ if (typeof window !== "undefined") {
99
+ requestAnimationFrame(markHydrated);
100
+ }
82
101
  return {
102
+ markHydrated,
83
103
  liveToken(tokens) {
84
104
  setTokens2(tokens);
85
105
  const vars = {};
@@ -149,8 +169,9 @@ function generateTokenCssString() {
149
169
  }
150
170
  function createUseTokens() {
151
171
  return function useTokens() {
152
- const [tokens, setTokensState] = React.useState(engine.getTokens());
172
+ const [tokens, setTokensState] = React.useState({});
153
173
  React.useEffect(() => {
174
+ engine.markHydrated();
154
175
  setTokensState(engine.getTokens());
155
176
  return engine.subscribe((nextTokens) => setTokensState(nextTokens));
156
177
  }, []);
@@ -1 +1 @@
1
- {"version":3,"sources":["../packages/domain/runtime/src/index.ts","../packages/domain/theme/src/liveTokenEngine.ts","../packages/domain/runtime/src/schemas.ts"],"sourcesContent":["/**\n * @tailwind-styled/runtime v5\n *\n * Lightweight runtime helpers for compiled tailwind-styled-v5 components.\n * Live token engine has been moved to @tailwind-styled/theme package.\n */\n\nimport React from \"react\"\n\n// Re-export live token engine from @tailwind-styled/theme\nexport type {\n LiveTokenEngineBridge,\n LiveTokenSet,\n TokenMap,\n TokenSubscriber,\n} from \"@tailwind-styled/theme\"\nexport {\n applyTokenSet,\n createUseTokens,\n generateTokenCssString,\n getToken,\n getTokens,\n liveToken,\n liveTokenEngine,\n setToken,\n setTokens,\n subscribeTokens,\n tokenRef,\n tokenVar,\n} from \"@tailwind-styled/theme/live-tokens\"\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────────────────────\n\nexport interface SubComponentDef {\n /** HTML tag to render (default: \"span\") */\n tag?: string\n /** Scoped CSS class generated by Rust, e.g. \"Button_icon_abc123\" */\n class: string\n}\n\nexport type SubComponentMap = Record<string, SubComponentDef>\n\n/**\n * Map of prop name → CSS class appended when the prop is truthy.\n * e.g. { fullWidth: \"w-full\", large: \"text-lg px-6 py-3\" }\n */\nexport type ConditionalProps = Record<string, string>\n\n/**\n * A compound styled component: base ForwardRef + attached .SubName properties.\n * The generic params are intentionally loose so callers don't need to repeat them.\n */\nexport type StyledComponent<S extends SubComponentMap = SubComponentMap> =\n React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n > & {\n [K in keyof S]: React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n >\n }\n\n/** Metadata for one compound component produced by Rust. */\nexport interface ComponentMetadata {\n component: string\n tag: string\n baseClass: string\n subComponents: SubComponentMap\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// cx — tiny className utility (no external dependency)\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype ClassInput = string | number | false | null | undefined | ClassInput[]\n\nexport function cx(...inputs: ClassInput[]): string {\n const out: string[] = []\n for (const input of inputs) {\n if (!input) continue // filters 0, false, null, undefined, \"\"\n if (typeof input === \"string\") {\n out.push(input)\n } else if (typeof input === \"number\") {\n out.push(String(input))\n } else if (Array.isArray(input)) {\n const nested = cx(...input)\n if (nested) out.push(nested)\n }\n }\n return out.join(\" \")\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// createComponent\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Build a compound styled React component from Rust-generated metadata.\n *\n * @param tag HTML element tag, e.g. \"button\" | \"div\"\n * @param baseClass Scoped base class from Rust, e.g. \"Button_abc123\"\n * @param subComponents Map of subcomponent definitions (optional)\n * @param conditionals Map of prop name → CSS class (optional)\n *\n * @example\n * // Injected automatically by the compiler — do not call manually\n * const Button = createComponent(\"button\", \"Button_abc123\", {\n * icon: { tag: \"span\", class: \"Button_icon_abc123\" },\n * text: { tag: \"span\", class: \"Button_text_abc123\" },\n * }, { fullWidth: \"w-full\" })\n *\n * // Usage in JSX:\n * <Button fullWidth>\n * <Button.icon>🔍</Button.icon>\n * <Button.text>Search</Button.text>\n * </Button>\n */\nexport function createComponent<S extends SubComponentMap = SubComponentMap>(\n tag: string,\n baseClass: string,\n subComponents?: S,\n conditionals?: ConditionalProps\n): StyledComponent<S> {\n type Props = React.HTMLAttributes<HTMLElement> &\n React.RefAttributes<HTMLElement> &\n Record<string, unknown>\n\n // ── Base component ─────────────────────────────────────────────────────────\n const Base = React.forwardRef<HTMLElement, Props>(function TwBase(props, ref) {\n const extra: string[] = []\n\n // Collect conditional classes\n if (conditionals) {\n for (const [prop, cls] of Object.entries(conditionals)) {\n if (props[prop]) extra.push(cls)\n }\n }\n\n // Build clean props — strip conditional + subcomponent boolean props\n const clean: Record<string, unknown> = {}\n const stripKeys = new Set([\n \"className\",\n ...(conditionals ? Object.keys(conditionals) : []),\n ...(subComponents ? Object.keys(subComponents) : []),\n ])\n for (const [k, v] of Object.entries(props)) {\n if (!stripKeys.has(k)) clean[k] = v\n }\n\n const className = cx(baseClass, ...extra, (props.className as string) ?? \"\")\n\n return React.createElement(tag, { ...clean, ref, className: className || undefined })\n })\n\n ;(Base as { displayName?: string }).displayName = `tw.${String(tag)}`\n\n // ── Attach subcomponent properties ────────────────────────────────────────\n if (subComponents) {\n for (const [subName, def] of Object.entries(subComponents)) {\n const subTag = def.tag ?? \"span\"\n const subClass = def.class\n\n const SubComp = React.forwardRef<HTMLElement, Props>(function TwSub(props, ref) {\n const className = cx(subClass, (props.className as string) ?? \"\")\n const clean: Record<string, unknown> = { ...props }\n delete clean.className\n return React.createElement(subTag, { ...clean, ref, className: className || undefined })\n })\n\n ;(SubComp as { displayName?: string }).displayName = `tw.${String(tag)}.${String(subName)}`\n\n ;(Base as unknown as Record<string, unknown>)[subName] = SubComp\n }\n }\n\n return Base as StyledComponent<S>\n}\n\n// Re-export schemas\nexport {\n type ComponentMetadataInput,\n ComponentMetadataSchema,\n type ConditionalPropsInput,\n ConditionalPropsSchema,\n parseComponentMetadata,\n parseSubComponentDef,\n type SubComponentDefInput,\n SubComponentDefSchema,\n} from \"./schemas\"\n","\"use client\"\n\nimport React from \"react\"\n\nimport type { TokenMap } from '@tailwind-styled/shared'\nexport type { TokenMap }\n\nexport type TokenSubscriber = (tokens: TokenMap) => void\n\nexport interface LiveTokenSet {\n vars: Record<string, string>\n get(name: string): string | undefined\n set(name: string, value: string): void\n setAll(tokens: TokenMap): void\n snapshot(): TokenMap\n}\n\nexport interface LiveTokenEngineBridge {\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n subscribeTokens(fn: TokenSubscriber): () => void\n subscribe?(fn: TokenSubscriber): () => void\n}\n\ninterface LiveTokenEngineRuntime {\n liveToken(tokens: TokenMap): LiveTokenSet\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n generateTokenCssString(): string\n subscribe(fn: TokenSubscriber): () => void\n}\n\nconst TOKEN_ENGINE_KEY = \"__TW_TOKEN_ENGINE__\"\n\nexport function tokenVar(name: string): string {\n const normalized = name.replace(/[^a-zA-Z0-9-]/g, \"-\").toLowerCase()\n return `--tw-token-${normalized}`\n}\n\nexport function tokenRef(name: string): string {\n return `var(${tokenVar(name)})`\n}\n\nconst buildRootCss = (tokens: TokenMap): string => {\n const vars = Object.entries(tokens)\n .map(([name, value]) => ` ${tokenVar(name)}: ${value};`)\n .join(\"\\n\")\n return `:root {\\n${vars}\\n}`\n}\n\nconst createLiveTokenEngine = (): LiveTokenEngineRuntime => {\n const state = {\n currentTokens: {} as TokenMap,\n styleEl: null as HTMLStyleElement | null,\n }\n const subscribers = new Set<TokenSubscriber>()\n\n const syncStyleEl = (): void => {\n if (typeof document === \"undefined\") return\n\n if (!state.styleEl) {\n const styleEl = document.createElement(\"style\")\n styleEl.id = \"tw-live-tokens\"\n styleEl.setAttribute(\"data-tw-tokens\", \"true\")\n document.head.appendChild(styleEl)\n state.styleEl = styleEl\n }\n\n state.styleEl.textContent = buildRootCss(state.currentTokens)\n }\n\n const notifySubscribers = (): void => {\n const snapshot = { ...state.currentTokens }\n for (const subscriber of subscribers) {\n try {\n subscriber(snapshot)\n } catch {\n // Intentionally ignore subscriber errors.\n }\n }\n }\n\n const setToken = (name: string, value: string): void => {\n state.currentTokens = { ...state.currentTokens, [name]: value }\n if (typeof document !== \"undefined\") {\n document.documentElement.style.setProperty(tokenVar(name), value)\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const setTokens = (tokens: TokenMap): void => {\n state.currentTokens = { ...state.currentTokens, ...tokens }\n if (typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const applyTokenSet = (tokens: TokenMap): void => {\n if (typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const name of Object.keys(state.currentTokens)) {\n if (!(name in tokens)) {\n root.style.removeProperty(tokenVar(name))\n }\n }\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n\n state.currentTokens = { ...tokens }\n syncStyleEl()\n notifySubscribers()\n }\n\n return {\n liveToken(tokens: TokenMap): LiveTokenSet {\n setTokens(tokens)\n\n const vars: Record<string, string> = {}\n for (const name of Object.keys(tokens)) {\n vars[name] = tokenRef(name)\n }\n\n return {\n vars,\n get(name: string) {\n return state.currentTokens[name]\n },\n set(name: string, value: string) {\n setToken(name, value)\n },\n setAll(nextTokens: TokenMap) {\n setTokens(nextTokens)\n },\n snapshot() {\n return { ...state.currentTokens }\n },\n }\n },\n getToken(name: string): string | undefined {\n return state.currentTokens[name]\n },\n getTokens(): TokenMap {\n return { ...state.currentTokens }\n },\n setToken,\n setTokens,\n applyTokenSet,\n generateTokenCssString(): string {\n return buildRootCss(state.currentTokens)\n },\n subscribe(fn: TokenSubscriber): () => void {\n subscribers.add(fn)\n return () => {\n subscribers.delete(fn)\n }\n },\n }\n}\n\nconst engine = createLiveTokenEngine()\n\nexport function liveToken(tokens: TokenMap): LiveTokenSet {\n return engine.liveToken(tokens)\n}\n\nexport function setToken(name: string, value: string): void {\n engine.setToken(name, value)\n}\n\nexport function setTokens(tokens: TokenMap): void {\n engine.setTokens(tokens)\n}\n\nexport function applyTokenSet(tokens: TokenMap): void {\n engine.applyTokenSet(tokens)\n}\n\nexport function getToken(name: string): string | undefined {\n return engine.getToken(name)\n}\n\nexport function getTokens(): TokenMap {\n return engine.getTokens()\n}\n\nexport function subscribeTokens(fn: TokenSubscriber): () => void {\n return engine.subscribe(fn)\n}\n\nexport function generateTokenCssString(): string {\n return engine.generateTokenCssString()\n}\n\nexport function createUseTokens() {\n return function useTokens(): TokenMap {\n const [tokens, setTokensState] = React.useState<TokenMap>(engine.getTokens())\n\n React.useEffect(() => {\n setTokensState(engine.getTokens())\n return engine.subscribe((nextTokens) => setTokensState(nextTokens))\n }, [])\n\n return tokens\n }\n}\n\nexport const liveTokenEngine: LiveTokenEngineBridge = {\n getToken: engine.getToken,\n getTokens: engine.getTokens,\n setToken: engine.setToken,\n setTokens: engine.setTokens,\n applyTokenSet: engine.applyTokenSet,\n subscribeTokens: engine.subscribe,\n subscribe: engine.subscribe,\n}\n\ndeclare global {\n interface Window {\n __TW_TOKEN_ENGINE__?: LiveTokenEngineBridge\n }\n}\n\nconst globalTokenEngine = globalThis as typeof globalThis & {\n [TOKEN_ENGINE_KEY]?: LiveTokenEngineBridge\n}\n\nglobalTokenEngine[TOKEN_ENGINE_KEY] = liveTokenEngine\nif (typeof window !== \"undefined\") {\n window.__TW_TOKEN_ENGINE__ = liveTokenEngine\n}\n","import { z } from \"zod\"\n\nconst formatIssues = (error: z.ZodError): string =>\n error.issues\n .map((issue) => {\n const p = issue.path.length > 0 ? issue.path.join(\".\") : \"<root>\"\n return `${p}: ${issue.message}`\n })\n .join(\"; \")\n\nconst parseWithSchema = <T>(schema: z.ZodType<T>, data: unknown, label: string): T => {\n const parsed = schema.safeParse(data)\n if (parsed.success) return parsed.data\n throw new TypeError(`${label}: ${formatIssues(parsed.error)}`)\n}\n\nexport const SubComponentDefSchema = z.object({\n tag: z.string().optional(),\n class: z.string(),\n})\n\nexport type SubComponentDefInput = z.infer<typeof SubComponentDefSchema>\n\nexport const ComponentMetadataSchema = z.object({\n component: z.string(),\n tag: z.string(),\n baseClass: z.string(),\n subComponents: z.record(z.string(), SubComponentDefSchema),\n})\n\nexport type ComponentMetadataInput = z.infer<typeof ComponentMetadataSchema>\n\nexport const ConditionalPropsSchema = z.record(z.string(), z.string())\n\nexport type ConditionalPropsInput = z.infer<typeof ConditionalPropsSchema>\n\nexport const parseSubComponentDef = (data: unknown) =>\n parseWithSchema(SubComponentDefSchema, data, \"sub-component definition is invalid\")\n\nexport const parseComponentMetadata = (data: unknown) =>\n parseWithSchema(ComponentMetadataSchema, data, \"component metadata is invalid\")\n"],"mappings":"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","names":["React","setToken","setTokens","applyTokenSet","React"]}
1
+ {"version":3,"sources":["../packages/domain/runtime/src/index.ts","../packages/domain/theme/src/liveTokenEngine.ts","../packages/domain/runtime/src/schemas.ts"],"sourcesContent":["/**\n * @tailwind-styled/runtime v5\n *\n * Lightweight runtime helpers for compiled tailwind-styled-v5 components.\n * Live token engine has been moved to @tailwind-styled/theme package.\n */\n\nimport React from \"react\"\n\n// Re-export live token engine from @tailwind-styled/theme\nexport type {\n LiveTokenEngineBridge,\n LiveTokenSet,\n TokenMap,\n TokenSubscriber,\n} from \"@tailwind-styled/theme\"\nexport {\n applyTokenSet,\n createUseTokens,\n generateTokenCssString,\n getToken,\n getTokens,\n liveToken,\n liveTokenEngine,\n setToken,\n setTokens,\n subscribeTokens,\n tokenRef,\n tokenVar,\n} from \"@tailwind-styled/theme/live-tokens\"\n\n// ─────────────────────────────────────────────────────────────────────────────\n// Types\n// ─────────────────────────────────────────────────────────────────────────────\n\nexport interface SubComponentDef {\n /** HTML tag to render (default: \"span\") */\n tag?: string\n /** Scoped CSS class generated by Rust, e.g. \"Button_icon_abc123\" */\n class: string\n}\n\nexport type SubComponentMap = Record<string, SubComponentDef>\n\n/**\n * Map of prop name → CSS class appended when the prop is truthy.\n * e.g. { fullWidth: \"w-full\", large: \"text-lg px-6 py-3\" }\n */\nexport type ConditionalProps = Record<string, string>\n\n/**\n * A compound styled component: base ForwardRef + attached .SubName properties.\n * The generic params are intentionally loose so callers don't need to repeat them.\n */\nexport type StyledComponent<S extends SubComponentMap = SubComponentMap> =\n React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n > & {\n [K in keyof S]: React.ForwardRefExoticComponent<\n React.HTMLAttributes<HTMLElement> & React.RefAttributes<HTMLElement>\n >\n }\n\n/** Metadata for one compound component produced by Rust. */\nexport interface ComponentMetadata {\n component: string\n tag: string\n baseClass: string\n subComponents: SubComponentMap\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// cx — tiny className utility (no external dependency)\n// ─────────────────────────────────────────────────────────────────────────────\n\ntype ClassInput = string | number | false | null | undefined | ClassInput[]\n\nexport function cx(...inputs: ClassInput[]): string {\n const out: string[] = []\n for (const input of inputs) {\n if (!input) continue // filters 0, false, null, undefined, \"\"\n if (typeof input === \"string\") {\n out.push(input)\n } else if (typeof input === \"number\") {\n out.push(String(input))\n } else if (Array.isArray(input)) {\n const nested = cx(...input)\n if (nested) out.push(nested)\n }\n }\n return out.join(\" \")\n}\n\n// ─────────────────────────────────────────────────────────────────────────────\n// createComponent\n// ─────────────────────────────────────────────────────────────────────────────\n\n/**\n * Build a compound styled React component from Rust-generated metadata.\n *\n * @param tag HTML element tag, e.g. \"button\" | \"div\"\n * @param baseClass Scoped base class from Rust, e.g. \"Button_abc123\"\n * @param subComponents Map of subcomponent definitions (optional)\n * @param conditionals Map of prop name → CSS class (optional)\n *\n * @example\n * // Injected automatically by the compiler — do not call manually\n * const Button = createComponent(\"button\", \"Button_abc123\", {\n * icon: { tag: \"span\", class: \"Button_icon_abc123\" },\n * text: { tag: \"span\", class: \"Button_text_abc123\" },\n * }, { fullWidth: \"w-full\" })\n *\n * // Usage in JSX:\n * <Button fullWidth>\n * <Button.icon>🔍</Button.icon>\n * <Button.text>Search</Button.text>\n * </Button>\n */\nexport function createComponent<S extends SubComponentMap = SubComponentMap>(\n tag: string,\n baseClass: string,\n subComponents?: S,\n conditionals?: ConditionalProps\n): StyledComponent<S> {\n type Props = React.HTMLAttributes<HTMLElement> &\n React.RefAttributes<HTMLElement> &\n Record<string, unknown>\n\n // ── Base component ─────────────────────────────────────────────────────────\n const Base = React.forwardRef<HTMLElement, Props>(function TwBase(props, ref) {\n const extra: string[] = []\n\n // Collect conditional classes\n if (conditionals) {\n for (const [prop, cls] of Object.entries(conditionals)) {\n if (props[prop]) extra.push(cls)\n }\n }\n\n // Build clean props — strip conditional + subcomponent boolean props\n const clean: Record<string, unknown> = {}\n const stripKeys = new Set([\n \"className\",\n ...(conditionals ? Object.keys(conditionals) : []),\n ...(subComponents ? Object.keys(subComponents) : []),\n ])\n for (const [k, v] of Object.entries(props)) {\n if (!stripKeys.has(k)) clean[k] = v\n }\n\n const className = cx(baseClass, ...extra, (props.className as string) ?? \"\")\n\n return React.createElement(tag, { ...clean, ref, className: className || undefined })\n })\n\n ;(Base as { displayName?: string }).displayName = `tw.${String(tag)}`\n\n // ── Attach subcomponent properties ────────────────────────────────────────\n if (subComponents) {\n for (const [subName, def] of Object.entries(subComponents)) {\n const subTag = def.tag ?? \"span\"\n const subClass = def.class\n\n const SubComp = React.forwardRef<HTMLElement, Props>(function TwSub(props, ref) {\n const className = cx(subClass, (props.className as string) ?? \"\")\n const clean: Record<string, unknown> = { ...props }\n delete clean.className\n return React.createElement(subTag, { ...clean, ref, className: className || undefined })\n })\n\n ;(SubComp as { displayName?: string }).displayName = `tw.${String(tag)}.${String(subName)}`\n\n ;(Base as unknown as Record<string, unknown>)[subName] = SubComp\n }\n }\n\n return Base as StyledComponent<S>\n}\n\n// Re-export schemas\nexport {\n type ComponentMetadataInput,\n ComponentMetadataSchema,\n type ConditionalPropsInput,\n ConditionalPropsSchema,\n parseComponentMetadata,\n parseSubComponentDef,\n type SubComponentDefInput,\n SubComponentDefSchema,\n} from \"./schemas\"\n","\"use client\"\n\nimport React from \"react\"\n\nimport type { TokenMap } from '@tailwind-styled/shared'\nexport type { TokenMap }\n\nexport type TokenSubscriber = (tokens: TokenMap) => void\n\nexport interface LiveTokenSet {\n vars: Record<string, string>\n get(name: string): string | undefined\n set(name: string, value: string): void\n setAll(tokens: TokenMap): void\n snapshot(): TokenMap\n}\n\nexport interface LiveTokenEngineBridge {\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n subscribeTokens(fn: TokenSubscriber): () => void\n subscribe?(fn: TokenSubscriber): () => void\n}\n\ninterface LiveTokenEngineRuntime {\n liveToken(tokens: TokenMap): LiveTokenSet\n getToken(name: string): string | undefined\n getTokens(): TokenMap\n setToken(name: string, value: string): void\n setTokens(tokens: TokenMap): void\n applyTokenSet(tokens: TokenMap): void\n generateTokenCssString(): string\n subscribe(fn: TokenSubscriber): () => void\n markHydrated(): void\n}\n\nconst TOKEN_ENGINE_KEY = \"__TW_TOKEN_ENGINE__\"\n\nexport function tokenVar(name: string): string {\n const normalized = name.replace(/[^a-zA-Z0-9-]/g, \"-\").toLowerCase()\n return `--tw-token-${normalized}`\n}\n\nexport function tokenRef(name: string): string {\n return `var(${tokenVar(name)})`\n}\n\nconst buildRootCss = (tokens: TokenMap): string => {\n const vars = Object.entries(tokens)\n .map(([name, value]) => ` ${tokenVar(name)}: ${value};`)\n .join(\"\\n\")\n return `:root {\\n${vars}\\n}`\n}\n\nconst createLiveTokenEngine = (): LiveTokenEngineRuntime => {\n const state = {\n currentTokens: {} as TokenMap,\n styleEl: null as HTMLStyleElement | null,\n // Belum boleh nyentuh live DOM sampai komponen pertama selesai mount.\n // Ini yang nyegah hydration mismatch: tanpa flag ini, liveToken() yang\n // dipanggil di module top-level akan langsung document.documentElement\n // .style.setProperty(...) saat bundle client di-evaluasi — JAUH sebelum\n // React selesai hydrate — sehingga <html> versi live DOM beda dengan\n // <html> yang di-render server (yang gak pernah nyentuh `document`).\n hydrated: false,\n }\n const subscribers = new Set<TokenSubscriber>()\n\n const syncStyleEl = (): void => {\n if (!state.hydrated || typeof document === \"undefined\") return\n\n if (!state.styleEl) {\n const styleEl = document.createElement(\"style\")\n styleEl.id = \"tw-live-tokens\"\n styleEl.setAttribute(\"data-tw-tokens\", \"true\")\n document.head.appendChild(styleEl)\n state.styleEl = styleEl\n }\n\n state.styleEl.textContent = buildRootCss(state.currentTokens)\n }\n\n const notifySubscribers = (): void => {\n const snapshot = { ...state.currentTokens }\n for (const subscriber of subscribers) {\n try {\n subscriber(snapshot)\n } catch {\n // Intentionally ignore subscriber errors.\n }\n }\n }\n\n const setToken = (name: string, value: string): void => {\n state.currentTokens = { ...state.currentTokens, [name]: value }\n if (state.hydrated && typeof document !== \"undefined\") {\n document.documentElement.style.setProperty(tokenVar(name), value)\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const setTokens = (tokens: TokenMap): void => {\n state.currentTokens = { ...state.currentTokens, ...tokens }\n if (state.hydrated && typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n syncStyleEl()\n notifySubscribers()\n }\n\n const applyTokenSet = (tokens: TokenMap): void => {\n if (state.hydrated && typeof document !== \"undefined\") {\n const root = document.documentElement\n for (const name of Object.keys(state.currentTokens)) {\n if (!(name in tokens)) {\n root.style.removeProperty(tokenVar(name))\n }\n }\n for (const [name, value] of Object.entries(tokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n }\n\n state.currentTokens = { ...tokens }\n syncStyleEl()\n notifySubscribers()\n }\n\n // Dipanggil sekali setelah mount pertama (lewat useTokens()'s useEffect, atau\n // fallback rAF di bawah buat consumer yang pakai API imperative tanpa hook).\n // Setelah ini true, semua write di atas balik sinkron langsung seperti semula.\n const markHydrated = (): void => {\n if (state.hydrated || typeof document === \"undefined\") return\n state.hydrated = true\n const root = document.documentElement\n for (const [name, value] of Object.entries(state.currentTokens)) {\n root.style.setProperty(tokenVar(name), value)\n }\n syncStyleEl()\n }\n\n if (typeof window !== \"undefined\") {\n // Fallback buat consumer yang gak pakai useTokens() hook (cuma pakai\n // liveToken().set() imperatif): tetap flush setelah paint pertama,\n // jauh lebih aman daripada langsung saat module di-evaluasi.\n requestAnimationFrame(markHydrated)\n }\n\n return {\n markHydrated,\n liveToken(tokens: TokenMap): LiveTokenSet {\n setTokens(tokens)\n\n const vars: Record<string, string> = {}\n for (const name of Object.keys(tokens)) {\n vars[name] = tokenRef(name)\n }\n\n return {\n vars,\n get(name: string) {\n return state.currentTokens[name]\n },\n set(name: string, value: string) {\n setToken(name, value)\n },\n setAll(nextTokens: TokenMap) {\n setTokens(nextTokens)\n },\n snapshot() {\n return { ...state.currentTokens }\n },\n }\n },\n getToken(name: string): string | undefined {\n return state.currentTokens[name]\n },\n getTokens(): TokenMap {\n return { ...state.currentTokens }\n },\n setToken,\n setTokens,\n applyTokenSet,\n generateTokenCssString(): string {\n return buildRootCss(state.currentTokens)\n },\n subscribe(fn: TokenSubscriber): () => void {\n subscribers.add(fn)\n return () => {\n subscribers.delete(fn)\n }\n },\n }\n}\n\nconst engine = createLiveTokenEngine()\n\nexport function liveToken(tokens: TokenMap): LiveTokenSet {\n return engine.liveToken(tokens)\n}\n\nexport function setToken(name: string, value: string): void {\n engine.setToken(name, value)\n}\n\nexport function setTokens(tokens: TokenMap): void {\n engine.setTokens(tokens)\n}\n\nexport function applyTokenSet(tokens: TokenMap): void {\n engine.applyTokenSet(tokens)\n}\n\nexport function getToken(name: string): string | undefined {\n return engine.getToken(name)\n}\n\nexport function getTokens(): TokenMap {\n return engine.getTokens()\n}\n\nexport function subscribeTokens(fn: TokenSubscriber): () => void {\n return engine.subscribe(fn)\n}\n\nexport function generateTokenCssString(): string {\n return engine.generateTokenCssString()\n}\n\nexport function createUseTokens() {\n return function useTokens(): TokenMap {\n // useSyncExternalStore untuk konsistensi SSR/client:\n // - getServerSnapshot() return empty object → SSR render tanpa tokens\n // - getSnapshot() return live tokens di client setelah hydration\n // Ini menghilangkan hydration mismatch karena server dan client\n // initial render keduanya return {} (empty), lalu useEffect update\n // ke nilai aktual via subscriber.\n const [tokens, setTokensState] = React.useState<TokenMap>({})\n\n React.useEffect(() => {\n // Baru sekarang aman nyentuh document.documentElement — hydration\n // udah pasti selesai di titik ini. markHydrated() flush token yang\n // sempat ditunda dari liveToken() init call (lihat createLiveTokenEngine).\n engine.markHydrated()\n // Set ke nilai aktual setelah mount (client-only)\n setTokensState(engine.getTokens())\n return engine.subscribe((nextTokens) => setTokensState(nextTokens))\n }, [])\n\n return tokens\n }\n}\n\nexport const liveTokenEngine: LiveTokenEngineBridge = {\n getToken: engine.getToken,\n getTokens: engine.getTokens,\n setToken: engine.setToken,\n setTokens: engine.setTokens,\n applyTokenSet: engine.applyTokenSet,\n subscribeTokens: engine.subscribe,\n subscribe: engine.subscribe,\n}\n\ndeclare global {\n interface Window {\n __TW_TOKEN_ENGINE__?: LiveTokenEngineBridge\n }\n}\n\nconst globalTokenEngine = globalThis as typeof globalThis & {\n [TOKEN_ENGINE_KEY]?: LiveTokenEngineBridge\n}\n\nglobalTokenEngine[TOKEN_ENGINE_KEY] = liveTokenEngine\nif (typeof window !== \"undefined\") {\n window.__TW_TOKEN_ENGINE__ = liveTokenEngine\n}\n","import { z } from \"zod\"\n\nconst formatIssues = (error: z.ZodError): string =>\n error.issues\n .map((issue) => {\n const p = issue.path.length > 0 ? issue.path.join(\".\") : \"<root>\"\n return `${p}: ${issue.message}`\n })\n .join(\"; \")\n\nconst parseWithSchema = <T>(schema: z.ZodType<T>, data: unknown, label: string): T => {\n const parsed = schema.safeParse(data)\n if (parsed.success) return parsed.data\n throw new TypeError(`${label}: ${formatIssues(parsed.error)}`)\n}\n\nexport const SubComponentDefSchema = z.object({\n tag: z.string().optional(),\n class: z.string(),\n})\n\nexport type SubComponentDefInput = z.infer<typeof SubComponentDefSchema>\n\nexport const ComponentMetadataSchema = z.object({\n component: z.string(),\n tag: z.string(),\n baseClass: z.string(),\n subComponents: z.record(z.string(), SubComponentDefSchema),\n})\n\nexport type ComponentMetadataInput = z.infer<typeof ComponentMetadataSchema>\n\nexport const ConditionalPropsSchema = z.record(z.string(), z.string())\n\nexport type ConditionalPropsInput = z.infer<typeof ConditionalPropsSchema>\n\nexport const parseSubComponentDef = (data: unknown) =>\n parseWithSchema(SubComponentDefSchema, data, \"sub-component definition is invalid\")\n\nexport const parseComponentMetadata = (data: unknown) =>\n parseWithSchema(ComponentMetadataSchema, data, \"component metadata is invalid\")\n"],"mappings":"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","names":["React","setToken","setTokens","applyTokenSet","React"]}
package/dist/theme.js CHANGED
@@ -179,11 +179,18 @@ ${vars}
179
179
  var createLiveTokenEngine = () => {
180
180
  const state = {
181
181
  currentTokens: {},
182
- styleEl: null
182
+ styleEl: null,
183
+ // Belum boleh nyentuh live DOM sampai komponen pertama selesai mount.
184
+ // Ini yang nyegah hydration mismatch: tanpa flag ini, liveToken() yang
185
+ // dipanggil di module top-level akan langsung document.documentElement
186
+ // .style.setProperty(...) saat bundle client di-evaluasi — JAUH sebelum
187
+ // React selesai hydrate — sehingga <html> versi live DOM beda dengan
188
+ // <html> yang di-render server (yang gak pernah nyentuh `document`).
189
+ hydrated: false
183
190
  };
184
191
  const subscribers = /* @__PURE__ */ new Set();
185
192
  const syncStyleEl = () => {
186
- if (typeof document === "undefined") return;
193
+ if (!state.hydrated || typeof document === "undefined") return;
187
194
  if (!state.styleEl) {
188
195
  const styleEl = document.createElement("style");
189
196
  styleEl.id = "tw-live-tokens";
@@ -204,7 +211,7 @@ var createLiveTokenEngine = () => {
204
211
  };
205
212
  const setToken2 = (name, value) => {
206
213
  state.currentTokens = { ...state.currentTokens, [name]: value };
207
- if (typeof document !== "undefined") {
214
+ if (state.hydrated && typeof document !== "undefined") {
208
215
  document.documentElement.style.setProperty(tokenVar(name), value);
209
216
  }
210
217
  syncStyleEl();
@@ -212,7 +219,7 @@ var createLiveTokenEngine = () => {
212
219
  };
213
220
  const setTokens2 = (tokens) => {
214
221
  state.currentTokens = { ...state.currentTokens, ...tokens };
215
- if (typeof document !== "undefined") {
222
+ if (state.hydrated && typeof document !== "undefined") {
216
223
  const root = document.documentElement;
217
224
  for (const [name, value] of Object.entries(tokens)) {
218
225
  root.style.setProperty(tokenVar(name), value);
@@ -222,7 +229,7 @@ var createLiveTokenEngine = () => {
222
229
  notifySubscribers();
223
230
  };
224
231
  const applyTokenSet2 = (tokens) => {
225
- if (typeof document !== "undefined") {
232
+ if (state.hydrated && typeof document !== "undefined") {
226
233
  const root = document.documentElement;
227
234
  for (const name of Object.keys(state.currentTokens)) {
228
235
  if (!(name in tokens)) {
@@ -237,7 +244,20 @@ var createLiveTokenEngine = () => {
237
244
  syncStyleEl();
238
245
  notifySubscribers();
239
246
  };
247
+ const markHydrated = () => {
248
+ if (state.hydrated || typeof document === "undefined") return;
249
+ state.hydrated = true;
250
+ const root = document.documentElement;
251
+ for (const [name, value] of Object.entries(state.currentTokens)) {
252
+ root.style.setProperty(tokenVar(name), value);
253
+ }
254
+ syncStyleEl();
255
+ };
256
+ if (typeof window !== "undefined") {
257
+ requestAnimationFrame(markHydrated);
258
+ }
240
259
  return {
260
+ markHydrated,
241
261
  liveToken(tokens) {
242
262
  setTokens2(tokens);
243
263
  const vars = {};
@@ -307,8 +327,9 @@ function generateTokenCssString() {
307
327
  }
308
328
  function createUseTokens() {
309
329
  return function useTokens() {
310
- const [tokens, setTokensState] = import_react.default.useState(engine.getTokens());
330
+ const [tokens, setTokensState] = import_react.default.useState({});
311
331
  import_react.default.useEffect(() => {
332
+ engine.markHydrated();
312
333
  setTokensState(engine.getTokens());
313
334
  return engine.subscribe((nextTokens) => setTokensState(nextTokens));
314
335
  }, []);