tailwind-styled-v4 5.1.24 → 5.1.26

package/dist/index.d.mts

@@ -19,7 +19,6 @@ interface AnimateOptions {
     name?: string;
 }
 
-type TokenMap = Record<string, string>;
 type HtmlTagName = keyof HTMLElementTagNameMap;
 
 /**
@@ -33,7 +32,7 @@ type VariantLiterals = string | number | boolean;
 /** Sizes sugar syntax — shorthand untuk variants.size */
 type SizesConfig = Record<string, string>;
 type InferVariantProps<T extends ComponentConfig> = {
-    [K in keyof T["variants"]]?: keyof T["variants"][K];
+    [K in keyof T["variants"]]?: T["variants"][K] extends Record<infer Key, any> ? Key extends "true" | "false" ? boolean : Key : never;
 };
 type InferSizeProps<T extends ComponentConfig> = T["sizes"] extends Record<string, string> ? {
     size?: keyof T["sizes"];
@@ -67,7 +66,7 @@ type InferStatesProps<T extends ComponentConfig> = {
 interface SubComponentConfig {
     base?: string;
     variants?: Record<string, Record<string, string>>;
-    defaultVariants?: Record<string, string>;
+    defaultVariants?: Record<string, string | number | boolean>;
     compoundVariants?: Array<{
         class: string;
         [key: string]: string;
@@ -91,8 +90,10 @@ type SubValue = string | Record<string, string | SubComponentConfig>;
 type StatesConfig = Record<string, string>;
 interface ComponentConfig {
     base?: string;
-    /** Variants — nested: { intent: { primary: "..." }, size: { sm: "..." } } */
-    variants?: Record<string, Record<string, string>>;
+    /** Variants — nested: { intent: { primary: "..." }, size: { sm: "..." } }
+     * Supports string and boolean keys: { disabled: { true: "...", false: "..." } }
+     */
+    variants?: Record<string, Record<string | "true" | "false", string>>;
     defaultVariants?: Record<string, string>;
     compoundVariants?: Array<{
         class: string;
@@ -813,27 +814,4 @@ interface ThemeConfig {
     raw: Record<string, string>;
 }
 
-type TokenSubscriber = (tokens: TokenMap) => void;
-interface LiveTokenSet {
-    vars: Record<string, string>;
-    get(name: string): string | undefined;
-    set(name: string, value: string): void;
-    setAll(tokens: TokenMap): void;
-    snapshot(): TokenMap;
-}
-interface LiveTokenEngineBridge {
-    getToken(name: string): string | undefined;
-    getTokens(): TokenMap;
-    setToken(name: string, value: string): void;
-    setTokens(tokens: TokenMap): void;
-    applyTokenSet(tokens: TokenMap): void;
-    subscribeTokens(fn: TokenSubscriber): () => void;
-    subscribe?(fn: TokenSubscriber): () => void;
-}
-declare global {
-    interface Window {
-        __TW_TOKEN_ENGINE__?: LiveTokenEngineBridge;
-    }
-}
-
-export { type ComponentConfig, type ContainerConfig, type ContainerEntry, type CvFn, type HtmlTagName, type InferVariantProps, type LiveTokenSet, type MergeOptions, type ParsedClass, type ParsedClassModifier, type ResolvedThemeTokens, type StateComponentEntry, type StateConfig, type StyledComponentProps, type StyledOptions, type StyledProps, type StyledSystemConfig, type StyledSystemInstance, type SubComponentEntry, type SubComponentMap, type SubComponentProps, type SystemComponentConfig, type SystemComponentFactory, type SystemTokenMap, type ThemeConfig, type ThemeTokenMap, type TokenMap, type TokenSubscriber, type TwComponentFactory, type TwObject, type TwStyledComponent, type TwSubComponent, type TwTagFactory, type TwTagFactoryAny, type VariantLiterals, cn, createComponent, createStyledSystem, createTheme, createTwMerge, cssVar, cv, cx, cxm, generateContainerCss, generateStateCss, getAllSubComponents, getContainerRegistry, getStateRegistry, getSubComponent, mergeWithRules, processContainer, processState, registerSubComponent, registerVariantTable, resolveStyledClassName, server, styled, t, tw, twMerge, twVar, v4Tokens, withSubComponents };
+export { type ComponentConfig, type ContainerConfig, type ContainerEntry, type CvFn, type HtmlTagName, type InferVariantProps, type MergeOptions, type ParsedClass, type ParsedClassModifier, type ResolvedThemeTokens, type StateComponentEntry, type StateConfig, type StyledComponentProps, type StyledOptions, type StyledProps, type StyledSystemConfig, type StyledSystemInstance, type SubComponentEntry, type SubComponentMap, type SubComponentProps, type SystemComponentConfig, type SystemComponentFactory, type SystemTokenMap, type ThemeConfig, type ThemeTokenMap, type TwComponentFactory, type TwObject, type TwStyledComponent, type TwSubComponent, type TwTagFactory, type TwTagFactoryAny, type VariantLiterals, cn, createComponent, createStyledSystem, createTheme, createTwMerge, cssVar, cv, cx, cxm, generateContainerCss, generateStateCss, getAllSubComponents, getContainerRegistry, getStateRegistry, getSubComponent, mergeWithRules, processContainer, processState, registerSubComponent, registerVariantTable, resolveStyledClassName, server, styled, t, tw, twMerge, twVar, v4Tokens, withSubComponents };

package/dist/index.d.ts

@@ -19,7 +19,6 @@ interface AnimateOptions {
     name?: string;
 }
 
-type TokenMap = Record<string, string>;
 type HtmlTagName = keyof HTMLElementTagNameMap;
 
 /**
@@ -33,7 +32,7 @@ type VariantLiterals = string | number | boolean;
 /** Sizes sugar syntax — shorthand untuk variants.size */
 type SizesConfig = Record<string, string>;
 type InferVariantProps<T extends ComponentConfig> = {
-    [K in keyof T["variants"]]?: keyof T["variants"][K];
+    [K in keyof T["variants"]]?: T["variants"][K] extends Record<infer Key, any> ? Key extends "true" | "false" ? boolean : Key : never;
 };
 type InferSizeProps<T extends ComponentConfig> = T["sizes"] extends Record<string, string> ? {
     size?: keyof T["sizes"];
@@ -67,7 +66,7 @@ type InferStatesProps<T extends ComponentConfig> = {
 interface SubComponentConfig {
     base?: string;
     variants?: Record<string, Record<string, string>>;
-    defaultVariants?: Record<string, string>;
+    defaultVariants?: Record<string, string | number | boolean>;
     compoundVariants?: Array<{
         class: string;
         [key: string]: string;
@@ -91,8 +90,10 @@ type SubValue = string | Record<string, string | SubComponentConfig>;
 type StatesConfig = Record<string, string>;
 interface ComponentConfig {
     base?: string;
-    /** Variants — nested: { intent: { primary: "..." }, size: { sm: "..." } } */
-    variants?: Record<string, Record<string, string>>;
+    /** Variants — nested: { intent: { primary: "..." }, size: { sm: "..." } }
+     * Supports string and boolean keys: { disabled: { true: "...", false: "..." } }
+     */
+    variants?: Record<string, Record<string | "true" | "false", string>>;
     defaultVariants?: Record<string, string>;
     compoundVariants?: Array<{
         class: string;
@@ -813,27 +814,4 @@ interface ThemeConfig {
     raw: Record<string, string>;
 }
 
-type TokenSubscriber = (tokens: TokenMap) => void;
-interface LiveTokenSet {
-    vars: Record<string, string>;
-    get(name: string): string | undefined;
-    set(name: string, value: string): void;
-    setAll(tokens: TokenMap): void;
-    snapshot(): TokenMap;
-}
-interface LiveTokenEngineBridge {
-    getToken(name: string): string | undefined;
-    getTokens(): TokenMap;
-    setToken(name: string, value: string): void;
-    setTokens(tokens: TokenMap): void;
-    applyTokenSet(tokens: TokenMap): void;
-    subscribeTokens(fn: TokenSubscriber): () => void;
-    subscribe?(fn: TokenSubscriber): () => void;
-}
-declare global {
-    interface Window {
-        __TW_TOKEN_ENGINE__?: LiveTokenEngineBridge;
-    }
-}
-
-export { type ComponentConfig, type ContainerConfig, type ContainerEntry, type CvFn, type HtmlTagName, type InferVariantProps, type LiveTokenSet, type MergeOptions, type ParsedClass, type ParsedClassModifier, type ResolvedThemeTokens, type StateComponentEntry, type StateConfig, type StyledComponentProps, type StyledOptions, type StyledProps, type StyledSystemConfig, type StyledSystemInstance, type SubComponentEntry, type SubComponentMap, type SubComponentProps, type SystemComponentConfig, type SystemComponentFactory, type SystemTokenMap, type ThemeConfig, type ThemeTokenMap, type TokenMap, type TokenSubscriber, type TwComponentFactory, type TwObject, type TwStyledComponent, type TwSubComponent, type TwTagFactory, type TwTagFactoryAny, type VariantLiterals, cn, createComponent, createStyledSystem, createTheme, createTwMerge, cssVar, cv, cx, cxm, generateContainerCss, generateStateCss, getAllSubComponents, getContainerRegistry, getStateRegistry, getSubComponent, mergeWithRules, processContainer, processState, registerSubComponent, registerVariantTable, resolveStyledClassName, server, styled, t, tw, twMerge, twVar, v4Tokens, withSubComponents };
+export { type ComponentConfig, type ContainerConfig, type ContainerEntry, type CvFn, type HtmlTagName, type InferVariantProps, type MergeOptions, type ParsedClass, type ParsedClassModifier, type ResolvedThemeTokens, type StateComponentEntry, type StateConfig, type StyledComponentProps, type StyledOptions, type StyledProps, type StyledSystemConfig, type StyledSystemInstance, type SubComponentEntry, type SubComponentMap, type SubComponentProps, type SystemComponentConfig, type SystemComponentFactory, type SystemTokenMap, type ThemeConfig, type ThemeTokenMap, type TwComponentFactory, type TwObject, type TwStyledComponent, type TwSubComponent, type TwTagFactory, type TwTagFactoryAny, type VariantLiterals, cn, createComponent, createStyledSystem, createTheme, createTwMerge, cssVar, cv, cx, cxm, generateContainerCss, generateStateCss, getAllSubComponents, getContainerRegistry, getStateRegistry, getSubComponent, mergeWithRules, processContainer, processState, registerSubComponent, registerVariantTable, resolveStyledClassName, server, styled, t, tw, twMerge, twVar, v4Tokens, withSubComponents };

package/dist/index.js

@@ -965,7 +965,7 @@ function resolveVariants(variants, props, defaults) {
   if (!binding?.resolveSimpleVariants) {
     const classes = [];
     for (const key of Object.keys(variants)) {
-      const propValue = cleanProps[key] ?? defaults[key];
+      const propValue = cleanProps[key] ?? String(defaults[key]);
       if (propValue !== void 0 && variants[key]?.[propValue]) {
         classes.push(variants[key][propValue]);
       }
@@ -1236,6 +1236,9 @@ function makeTag(tag) {
   });
 }
 var HTML_TAGS = [
+  "html",
+  "head",
+  "body",
   "div",
   "section",
   "article",
@@ -1488,14 +1491,20 @@ function cv(config, componentId) {
       }
     }
   }
-  return (props = {}) => {
+  const stringifiedDefaults = {};
+  if (config.defaultVariants) {
+    for (const [k, v] of Object.entries(config.defaultVariants)) {
+      stringifiedDefaults[k] = String(v);
+    }
+  }
+  return ((props = {}) => {
     let result;
     const variantKeys = Object.keys(config.variants ?? {});
     if (componentId) {
       const generated = lookupGenerated(
         componentId,
         props,
-        config.defaultVariants,
+        stringifiedDefaults,
         variantKeys
       );
       result = generated ?? resolveVariantsNative(config, props);
@@ -1503,7 +1512,7 @@ function cv(config, componentId) {
       result = resolveVariantsNative(config, props);
     }
     return props.className ? twMerge(result, props.className) : result;
-  };
+  });
 }
 
 // packages/domain/core/src/cx.ts