tailwind-styled-v4 5.1.20 → 5.1.21

package/dist/index.d.mts

@@ -182,7 +182,6 @@ interface StyledComponentProps {
     className?: string;
     as?: HtmlTagName;
     children?: React.ReactNode;
-    [key: string]: unknown;
 }
 type SubComponentMap = Record<string, unknown>;
 type TwSubComponentAccessor<Tag extends HtmlTagName = "span"> = React.FC<Omit<React.ComponentPropsWithoutRef<Tag>, "ref"> & {
@@ -200,19 +199,19 @@ type ExtractSubNames<T extends string> = T extends `${string}[${infer Name}]${st
 type SubComponentKeys<S extends string, TagMap extends Record<string, string> = Record<string, never>> = {
     [K in S]: TwSubComponentAccessor<K extends keyof TagMap ? (TagMap[K] extends HtmlTagName ? TagMap[K] : "span") : "span">;
 };
-type TwStyledComponent<Config extends ComponentConfig = ComponentConfig, S extends string = string, TagMap extends Record<string, string> = Record<string, never>> = {
-    (props: StyledComponentProps & InferVariantProps<Config> & InferSizeProps<Config> & InferStatesProps<Config>): React.ReactElement | null;
+type TwStyledComponent<Config extends ComponentConfig = ComponentConfig, S extends string = string, TagMap extends Record<string, string> = Record<string, never>, Tag extends HtmlTagName = HtmlTagName> = {
+    (props: React.ComponentPropsWithoutRef<Tag> & StyledComponentProps & InferVariantProps<Config> & InferSizeProps<Config> & InferStatesProps<Config>): React.ReactElement | null;
     displayName?: string;
     extend: {
-        (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, S, TagMap>;
+        (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, S, TagMap, Tag>;
         (config: {
             classes?: string;
             variants?: ComponentConfig["variants"];
             defaultVariants?: ComponentConfig["defaultVariants"];
             compoundVariants?: ComponentConfig["compoundVariants"];
-        }): TwStyledComponent<Config, S, TagMap>;
+        }): TwStyledComponent<Config, S, TagMap, Tag>;
     };
-    withVariants: (config: Partial<Config>) => TwStyledComponent<Config, S, TagMap>;
+    withVariants: (config: Partial<Config>) => TwStyledComponent<Config, S, TagMap, Tag>;
     /**
      * Declare sub-component names secara eksplisit untuk autocomplete + type safety.
      *
@@ -226,27 +225,27 @@ type TwStyledComponent<Config extends ComponentConfig = ComponentConfig, S exten
      * Button.footer // ✅ autocomplete
      * Button.xyz    // ❌ TypeScript error
      */
-    withSub<NewS extends string>(): TwStyledComponent<Config, NewS, TagMap>;
-    animate: (opts: AnimateOptions) => Promise<TwStyledComponent<Config, S, TagMap>>;
+    withSub<NewS extends string>(): TwStyledComponent<Config, NewS, TagMap, Tag>;
+    animate: (opts: AnimateOptions) => Promise<TwStyledComponent<Config, S, TagMap, Tag>>;
 } & SubComponentKeys<S, TagMap>;
 interface TwSubComponent<P = unknown> {
     (props: P): React.ReactElement | null;
     displayName?: string;
 }
-interface TwTemplateFactory<Config extends ComponentConfig = ComponentConfig> {
-    <const T extends string>(strings: readonly [T], ...exprs: []): TwStyledComponent<Config, ExtractSubNames<T>>;
-    (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, string>;
-    <C extends ComponentConfig>(config: C): TwStyledComponent<C, InferSubFromConfig<C>, InferSubTagsFromConfig<C> extends Record<string, string> ? InferSubTagsFromConfig<C> : Record<string, never>>;
+interface TwTemplateFactory<Config extends ComponentConfig = ComponentConfig, Tag extends HtmlTagName = HtmlTagName> {
+    <const T extends string>(strings: readonly [T], ...exprs: []): TwStyledComponent<Config, ExtractSubNames<T>, Record<string, never>, Tag>;
+    (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, string, Record<string, never>, Tag>;
+    <C extends ComponentConfig>(config: C): TwStyledComponent<C, InferSubFromConfig<C>, InferSubTagsFromConfig<C> extends Record<string, string> ? InferSubTagsFromConfig<C> : Record<string, never>, Tag>;
 }
 type TwTagFactory = {
-    [K in HtmlTagName]: TwTemplateFactory;
+    [K in HtmlTagName]: TwTemplateFactory<ComponentConfig, K>;
 };
 type TwTagFactoryAny = {
     [key: string]: TwTemplateFactory;
 };
 type TwComponentFactory<T extends React.ElementType = React.ElementType> = (tag: T) => TwTemplateFactory;
 type TwServerObject = TwTagFactory & {
-    [K in HtmlTagName as `${K}`]: TwTemplateFactory;
+    [K in HtmlTagName as `${K}`]: TwTemplateFactory<ComponentConfig, K>;
 };
 type TwObject = TwComponentFactory & TwTagFactory & {
     server: TwServerObject;

package/dist/index.d.ts

@@ -182,7 +182,6 @@ interface StyledComponentProps {
     className?: string;
     as?: HtmlTagName;
     children?: React.ReactNode;
-    [key: string]: unknown;
 }
 type SubComponentMap = Record<string, unknown>;
 type TwSubComponentAccessor<Tag extends HtmlTagName = "span"> = React.FC<Omit<React.ComponentPropsWithoutRef<Tag>, "ref"> & {
@@ -200,19 +199,19 @@ type ExtractSubNames<T extends string> = T extends `${string}[${infer Name}]${st
 type SubComponentKeys<S extends string, TagMap extends Record<string, string> = Record<string, never>> = {
     [K in S]: TwSubComponentAccessor<K extends keyof TagMap ? (TagMap[K] extends HtmlTagName ? TagMap[K] : "span") : "span">;
 };
-type TwStyledComponent<Config extends ComponentConfig = ComponentConfig, S extends string = string, TagMap extends Record<string, string> = Record<string, never>> = {
-    (props: StyledComponentProps & InferVariantProps<Config> & InferSizeProps<Config> & InferStatesProps<Config>): React.ReactElement | null;
+type TwStyledComponent<Config extends ComponentConfig = ComponentConfig, S extends string = string, TagMap extends Record<string, string> = Record<string, never>, Tag extends HtmlTagName = HtmlTagName> = {
+    (props: React.ComponentPropsWithoutRef<Tag> & StyledComponentProps & InferVariantProps<Config> & InferSizeProps<Config> & InferStatesProps<Config>): React.ReactElement | null;
     displayName?: string;
     extend: {
-        (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, S, TagMap>;
+        (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, S, TagMap, Tag>;
         (config: {
             classes?: string;
             variants?: ComponentConfig["variants"];
             defaultVariants?: ComponentConfig["defaultVariants"];
             compoundVariants?: ComponentConfig["compoundVariants"];
-        }): TwStyledComponent<Config, S, TagMap>;
+        }): TwStyledComponent<Config, S, TagMap, Tag>;
     };
-    withVariants: (config: Partial<Config>) => TwStyledComponent<Config, S, TagMap>;
+    withVariants: (config: Partial<Config>) => TwStyledComponent<Config, S, TagMap, Tag>;
     /**
      * Declare sub-component names secara eksplisit untuk autocomplete + type safety.
      *
@@ -226,27 +225,27 @@ type TwStyledComponent<Config extends ComponentConfig = ComponentConfig, S exten
      * Button.footer // ✅ autocomplete
      * Button.xyz    // ❌ TypeScript error
      */
-    withSub<NewS extends string>(): TwStyledComponent<Config, NewS, TagMap>;
-    animate: (opts: AnimateOptions) => Promise<TwStyledComponent<Config, S, TagMap>>;
+    withSub<NewS extends string>(): TwStyledComponent<Config, NewS, TagMap, Tag>;
+    animate: (opts: AnimateOptions) => Promise<TwStyledComponent<Config, S, TagMap, Tag>>;
 } & SubComponentKeys<S, TagMap>;
 interface TwSubComponent<P = unknown> {
     (props: P): React.ReactElement | null;
     displayName?: string;
 }
-interface TwTemplateFactory<Config extends ComponentConfig = ComponentConfig> {
-    <const T extends string>(strings: readonly [T], ...exprs: []): TwStyledComponent<Config, ExtractSubNames<T>>;
-    (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, string>;
-    <C extends ComponentConfig>(config: C): TwStyledComponent<C, InferSubFromConfig<C>, InferSubTagsFromConfig<C> extends Record<string, string> ? InferSubTagsFromConfig<C> : Record<string, never>>;
+interface TwTemplateFactory<Config extends ComponentConfig = ComponentConfig, Tag extends HtmlTagName = HtmlTagName> {
+    <const T extends string>(strings: readonly [T], ...exprs: []): TwStyledComponent<Config, ExtractSubNames<T>, Record<string, never>, Tag>;
+    (strings: TemplateStringsArray, ...exprs: unknown[]): TwStyledComponent<Config, string, Record<string, never>, Tag>;
+    <C extends ComponentConfig>(config: C): TwStyledComponent<C, InferSubFromConfig<C>, InferSubTagsFromConfig<C> extends Record<string, string> ? InferSubTagsFromConfig<C> : Record<string, never>, Tag>;
 }
 type TwTagFactory = {
-    [K in HtmlTagName]: TwTemplateFactory;
+    [K in HtmlTagName]: TwTemplateFactory<ComponentConfig, K>;
 };
 type TwTagFactoryAny = {
     [key: string]: TwTemplateFactory;
 };
 type TwComponentFactory<T extends React.ElementType = React.ElementType> = (tag: T) => TwTemplateFactory;
 type TwServerObject = TwTagFactory & {
-    [K in HtmlTagName as `${K}`]: TwTemplateFactory;
+    [K in HtmlTagName as `${K}`]: TwTemplateFactory<ComponentConfig, K>;
 };
 type TwObject = TwComponentFactory & TwTagFactory & {
     server: TwServerObject;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwind-styled-v4",
-  "version": "5.1.20",
+  "version": "5.1.21",
   "packageManager": "npm@11.11.1",
   "engines": {
     "node": ">=20"