@voiceflow/style 1.2.4 → 1.3.0

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.3.0](https://github.com/voiceflow/design/compare/@voiceflow/style@1.2.5...@voiceflow/style@1.3.0) (2023-07-07)
+
+### Features
+
+* improve menu component (DX-000) ([#110](https://github.com/voiceflow/design/issues/110)) ([fc772b5](https://github.com/voiceflow/design/commit/fc772b53d9b1c6184cff239354b7e085117c065b))
+
+## [1.2.5](https://github.com/voiceflow/design/compare/@voiceflow/style@1.2.4...@voiceflow/style@1.2.5) (2023-07-05)
+
+### Bug Fixes
+
+* types ([a5e92b0](https://github.com/voiceflow/design/commit/a5e92b0b370331e69d18ebd495e181283b411b3e))
+
 ## [1.2.4](https://github.com/voiceflow/design/compare/@voiceflow/style@1.2.3...@voiceflow/style@1.2.4) (2023-06-12)
 
 **Note:** Version bump only for package @voiceflow/style

package/build/cjs/__fixtures__/Button/Button.styled.d.ts

@@ -1,2 +1,3 @@
-export declare const Base: import("../../main").StyledComponent<import("../../main").StyledComponentProps<"button", null, null, {}>>;
+/// <reference types="react" />
+export declare const Base: import("../../main").StyledComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">>;
 //# sourceMappingURL=Button.styled.d.ts.map

package/build/cjs/__fixtures__/Button/Button.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/Button/Button.styled.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,mGAAwB,CAAC"}
+{"version":3,"file":"Button.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/Button/Button.styled.ts"],"names":[],"mappings":";AAIA,eAAO,MAAM,IAAI,8JAAwB,CAAC"}

package/build/cjs/__fixtures__/RecipeButton/RecipeButton.component.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
-import type { RecipeVariants } from '../../main';
+import type { VariantProps } from '../../main';
 import type { ButtonProps } from '../Button';
 import type { complex } from './RecipeButton.css';
-export type RecipeButtonProps = ButtonProps & RecipeVariants<typeof complex>;
+export interface RecipeButtonProps extends ButtonProps, VariantProps<typeof complex> {
+}
 export declare const RecipeButton: React.FC<RecipeButtonProps>;
 //# sourceMappingURL=RecipeButton.component.d.ts.map

package/build/cjs/__fixtures__/RecipeButton/RecipeButton.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RecipeButton.component.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/RecipeButton.component.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAE7C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAGlD,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC;AAE7E,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAIpD,CAAC"}
+{"version":3,"file":"RecipeButton.component.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/RecipeButton.component.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAE3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAGlD,MAAM,WAAW,iBAAkB,SAAQ,WAAW,EAAE,YAAY,CAAC,OAAO,OAAO,CAAC;CAAG;AAEvF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAIpD,CAAC"}

package/build/cjs/__fixtures__/RecipeButton/index.d.ts

@@ -1,9 +1,6 @@
 /// <reference types="react" />
 import * as css from './RecipeButton.css';
-export declare const RecipeButton: import("react").FC<import("..").ButtonProps & {
-    color?: "ok" | "warn" | undefined;
-    fontSize?: "sm" | "md" | "lg" | undefined;
-}> & {
+export declare const RecipeButton: import("react").FC<import("./RecipeButton.component").RecipeButtonProps> & {
     css: typeof css;
 };
 //# sourceMappingURL=index.d.ts.map

package/build/cjs/__fixtures__/RecipeButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/index.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,GAAG,MAAM,oBAAoB,CAAC;AAE1C,eAAO,MAAM,YAAY;;;;;CAAgD,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/index.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,GAAG,MAAM,oBAAoB,CAAC;AAE1C,eAAO,MAAM,YAAY;;CAAgD,CAAC"}

package/build/cjs/__fixtures__/ReuseStyled/ReuseStyled.styled.d.ts

@@ -1,2 +1,3 @@
-export declare const Base: import("../../main").StyledComponent<import("../../main").StyledComponentProps<"button", null, null, {}>>;
+/// <reference types="react" />
+export declare const Base: import("../../main").StyledComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">>;
 //# sourceMappingURL=ReuseStyled.styled.d.ts.map

package/build/cjs/__fixtures__/ReuseStyled/ReuseStyled.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReuseStyled.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ReuseStyled/ReuseStyled.styled.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,mGAAyC,CAAC"}
+{"version":3,"file":"ReuseStyled.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ReuseStyled/ReuseStyled.styled.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,IAAI,8JAAyC,CAAC"}

package/build/cjs/__fixtures__/ThemedButton/ThemedButton.styled.d.ts

@@ -1,2 +1,3 @@
-export declare const Base: import("../../main").StyledComponent<import("../../main").StyledComponentProps<"button", null, null, {}>>;
+/// <reference types="react" />
+export declare const Base: import("../../main").StyledComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">>;
 //# sourceMappingURL=ThemedButton.styled.d.ts.map

package/build/cjs/__fixtures__/ThemedButton/ThemedButton.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemedButton.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ThemedButton/ThemedButton.styled.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,mGAAuC,CAAC"}
+{"version":3,"file":"ThemedButton.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ThemedButton/ThemedButton.styled.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,IAAI,8JAAuC,CAAC"}

package/build/cjs/styled/types.d.ts

@@ -27,7 +27,7 @@ export type DynamicVariablesProps<Variables> = Variables extends Record<string,
         [K in keyof Variables]: string;
     }>;
 } : {};
-export type StyledComponentProps<Tag extends keyof JSX.IntrinsicElements, Theme, Variables, Extras extends object = {}> = React.ComponentProps<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
+export type StyledComponentProps<Tag extends keyof JSX.IntrinsicElements, Theme, Variables, Extras extends object = {}> = React.ComponentPropsWithoutRef<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
 export interface StyledComponent<Props = {}> extends React.FunctionComponent<Props> {
     (props: Props, context?: any): React.ReactElement<any, any> | null;
     [STYLED_CLASS]: string | null;

package/build/cjs/styled/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/styled/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/styled/types.ts"],"names":[],"mappings":"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"}

package/build/cjs/types.d.ts

@@ -2,5 +2,5 @@ import type { ComplexStyleRule } from '@vanilla-extract/css';
 import type { RecipeVariants, RuntimeFn } from '@vanilla-extract/recipes';
 import type { Simplify } from 'type-fest';
 export type VariantStyleRules = Record<string, Record<string, ComplexStyleRule | string>>;
-export type VariantProps<RecipeFn extends RuntimeFn<VariantStyleRules>> = Simplify<RecipeVariants<RecipeFn>>;
+export type VariantProps<RecipeFn extends RuntimeFn<VariantStyleRules>> = Exclude<Simplify<RecipeVariants<RecipeFn>>, undefined | null>;
 //# sourceMappingURL=types.d.ts.map

package/build/cjs/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE1C,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAAC,CAAC,CAAC;AAE1F,MAAM,MAAM,YAAY,CAAC,QAAQ,SAAS,SAAS,CAAC,iBAAiB,CAAC,IAAI,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE1C,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAAC,CAAC,CAAC;AAE1F,MAAM,MAAM,YAAY,CAAC,QAAQ,SAAS,SAAS,CAAC,iBAAiB,CAAC,IAAI,OAAO,CAC/E,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,EAClC,SAAS,GAAG,IAAI,CACjB,CAAC"}

package/build/esm/__fixtures__/Button/Button.styled.d.ts

@@ -1,2 +1,3 @@
-export declare const Base: import("../../main.js").StyledComponent<import("../../main.js").StyledComponentProps<"button", null, null, {}>>;
+/// <reference types="react" />
+export declare const Base: import("../../main.js").StyledComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">>;
 //# sourceMappingURL=Button.styled.d.ts.map

package/build/esm/__fixtures__/Button/Button.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/Button/Button.styled.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,IAAI,mGAAwB,CAAC"}
+{"version":3,"file":"Button.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/Button/Button.styled.ts"],"names":[],"mappings":";AAIA,eAAO,MAAM,IAAI,8JAAwB,CAAC"}

package/build/esm/__fixtures__/RecipeButton/RecipeButton.component.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
-import type { RecipeVariants } from '../../main.js';
+import type { VariantProps } from '../../main.js';
 import type { ButtonProps } from '../Button/index.js';
 import type { complex } from './RecipeButton.css.js';
-export type RecipeButtonProps = ButtonProps & RecipeVariants<typeof complex>;
+export interface RecipeButtonProps extends ButtonProps, VariantProps<typeof complex> {
+}
 export declare const RecipeButton: React.FC<RecipeButtonProps>;
 //# sourceMappingURL=RecipeButton.component.d.ts.map

package/build/esm/__fixtures__/RecipeButton/RecipeButton.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RecipeButton.component.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/RecipeButton.component.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAE7C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAGlD,MAAM,MAAM,iBAAiB,GAAG,WAAW,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAC;AAE7E,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAIpD,CAAC"}
+{"version":3,"file":"RecipeButton.component.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/RecipeButton.component.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAE3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAGlD,MAAM,WAAW,iBAAkB,SAAQ,WAAW,EAAE,YAAY,CAAC,OAAO,OAAO,CAAC;CAAG;AAEvF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAIpD,CAAC"}

package/build/esm/__fixtures__/RecipeButton/index.d.ts

@@ -1,9 +1,6 @@
 /// <reference types="react" />
 import * as css from './RecipeButton.css.js';
-export declare const RecipeButton: import("react").FC<import("../index.js").ButtonProps & {
-    color?: "ok" | "warn" | undefined;
-    fontSize?: "sm" | "md" | "lg" | undefined;
-}> & {
+export declare const RecipeButton: import("react").FC<import("./RecipeButton.component.js").RecipeButtonProps> & {
     css: typeof css;
 };
 //# sourceMappingURL=index.d.ts.map

package/build/esm/__fixtures__/RecipeButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/index.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,GAAG,MAAM,oBAAoB,CAAC;AAE1C,eAAO,MAAM,YAAY;;;;;CAAgD,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/RecipeButton/index.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,GAAG,MAAM,oBAAoB,CAAC;AAE1C,eAAO,MAAM,YAAY;;CAAgD,CAAC"}

package/build/esm/__fixtures__/ReuseStyled/ReuseStyled.styled.d.ts

@@ -1,2 +1,3 @@
-export declare const Base: import("../../main.js").StyledComponent<import("../../main.js").StyledComponentProps<"button", null, null, {}>>;
+/// <reference types="react" />
+export declare const Base: import("../../main.js").StyledComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">>;
 //# sourceMappingURL=ReuseStyled.styled.d.ts.map

package/build/esm/__fixtures__/ReuseStyled/ReuseStyled.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReuseStyled.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ReuseStyled/ReuseStyled.styled.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,mGAAyC,CAAC"}
+{"version":3,"file":"ReuseStyled.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ReuseStyled/ReuseStyled.styled.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,IAAI,8JAAyC,CAAC"}

package/build/esm/__fixtures__/ThemedButton/ThemedButton.styled.d.ts

@@ -1,2 +1,3 @@
-export declare const Base: import("../../main.js").StyledComponent<import("../../main.js").StyledComponentProps<"button", null, null, {}>>;
+/// <reference types="react" />
+export declare const Base: import("../../main.js").StyledComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">>;
 //# sourceMappingURL=ThemedButton.styled.d.ts.map

package/build/esm/__fixtures__/ThemedButton/ThemedButton.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemedButton.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ThemedButton/ThemedButton.styled.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,IAAI,mGAAuC,CAAC"}
+{"version":3,"file":"ThemedButton.styled.d.ts","sourceRoot":"","sources":["../../../../src/__fixtures__/ThemedButton/ThemedButton.styled.ts"],"names":[],"mappings":";AAKA,eAAO,MAAM,IAAI,8JAAuC,CAAC"}

package/build/esm/styled/types.d.ts

@@ -27,7 +27,7 @@ export type DynamicVariablesProps<Variables> = Variables extends Record<string,
         [K in keyof Variables]: string;
     }>;
 } : {};
-export type StyledComponentProps<Tag extends keyof JSX.IntrinsicElements, Theme, Variables, Extras extends object = {}> = React.ComponentProps<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
+export type StyledComponentProps<Tag extends keyof JSX.IntrinsicElements, Theme, Variables, Extras extends object = {}> = React.ComponentPropsWithoutRef<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
 export interface StyledComponent<Props = {}> extends React.FunctionComponent<Props> {
     (props: Props, context?: any): React.ReactElement<any, any> | null;
     [STYLED_CLASS]: string | null;

package/build/esm/styled/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/styled/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/styled/types.ts"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC;AAEnE,MAAM,WAAW,cAAc,CAC7B,KAAK,SAAS,aAAa,GAAG,IAAI,GAAG,aAAa,EAClD,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;IAExE;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,MAAM,MAAM,iBAAiB,CAAC,KAAK,IAAI,KAAK,SAAS,aAAa,GAC9D;IACE;;OAEG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CACvD,GACD,EAAE,CAAC;AAEP,MAAM,MAAM,qBAAqB,CAAC,SAAS,IAAI,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GACnF;IACE;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;SAAG,CAAC,IAAI,MAAM,SAAS,GAAG,MAAM;KAAE,CAAC,CAAC;CACpD,GACD,EAAE,CAAC;AAEP,MAAM,MAAM,oBAAoB,CAC9B,GAAG,SAAS,MAAM,GAAG,CAAC,iBAAiB,EACvC,KAAK,EACL,SAAS,EACT,MAAM,SAAS,MAAM,GAAG,EAAE,IACxB,KAAK,CAAC,wBAAwB,CAAC,GAAG,CAAC,GAAG,iBAAiB,CAAC,KAAK,CAAC,GAAG,qBAAqB,CAAC,SAAS,CAAC,GAAG,MAAM,CAAC;AAE/G,MAAM,WAAW,eAAe,CAAC,KAAK,GAAG,EAAE,CAAE,SAAQ,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC;IACjF,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,EAAE,GAAG,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC;IACnE,CAAC,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B;AAED,MAAM,MAAM,WAAW,GAAG,eAAe,GAAG,MAAM,CAAC;AAEnD,MAAM,WAAW,aAAa,CAAC,GAAG,SAAS,MAAM,GAAG,CAAC,iBAAiB;IACpE,CACE,MAAM,SAAS,SAAS,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,EAC7C,KAAK,SAAS,aAAa,GAAG,IAAI,GAAG,IAAI,EACzC,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,GAAG,IAAI,EAEtD,MAAM,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,WAAW,EAAE,EACvB,OAAO,CAAC,EAAE,cAAc,CAAC,KAAK,EAAE,SAAS,CAAC,GACzC,eAAe,CAAC,oBAAoB,CAAC,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE;QAAE,QAAQ,EAAE,cAAc,CAAC,MAAM,CAAC,CAAA;KAAE,CAAC,CAAC,CAAC;IAEtG,CACE,OAAO,SAAS,MAAM,EACtB,KAAK,SAAS,aAAa,GAAG,IAAI,GAAG,IAAI,EACzC,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,GAAG,IAAI,EAEtD,QAAQ,EAAE,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,EACjC,OAAO,CAAC,EAAE,WAAW,EAAE,EACvB,OAAO,CAAC,EAAE,cAAc,CAAC,KAAK,EAAE,SAAS,CAAC,GACzC,eAAe,CAAC,oBAAoB,CAAC,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE;QAAE,OAAO,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC,CAAC;IAEtF,CAAC,KAAK,SAAS,aAAa,GAAG,IAAI,GAAG,IAAI,EAAE,SAAS,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,GAAG,IAAI,EAChG,OAAO,EAAE,WAAW,EAAE,EACtB,OAAO,CAAC,EAAE,cAAc,CAAC,KAAK,EAAE,SAAS,CAAC,GACzC,eAAe,CAAC,oBAAoB,CAAC,GAAG,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC;CACjE;AAED,MAAM,MAAM,mBAAmB,CAAC,QAAQ,SAAS,EAAE,GAAG,GAAG,IACrD,SAAS,CAAC,QAAQ,CAAC,GACnB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GACtB,WAAW,EAAE,CAAC;AAElB,MAAM,MAAM,oBAAoB,GAAG,WAAW,EAAE,GAAG,cAAc,CAAC"}

package/build/esm/types.d.ts

@@ -2,5 +2,5 @@ import type { ComplexStyleRule } from '@vanilla-extract/css';
 import type { RecipeVariants, RuntimeFn } from '@vanilla-extract/recipes';
 import type { Simplify } from 'type-fest';
 export type VariantStyleRules = Record<string, Record<string, ComplexStyleRule | string>>;
-export type VariantProps<RecipeFn extends RuntimeFn<VariantStyleRules>> = Simplify<RecipeVariants<RecipeFn>>;
+export type VariantProps<RecipeFn extends RuntimeFn<VariantStyleRules>> = Exclude<Simplify<RecipeVariants<RecipeFn>>, undefined | null>;
 //# sourceMappingURL=types.d.ts.map

package/build/esm/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE1C,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAAC,CAAC,CAAC;AAE1F,MAAM,MAAM,YAAY,CAAC,QAAQ,SAAS,SAAS,CAAC,iBAAiB,CAAC,IAAI,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAC1E,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAE1C,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,GAAG,MAAM,CAAC,CAAC,CAAC;AAE1F,MAAM,MAAM,YAAY,CAAC,QAAQ,SAAS,SAAS,CAAC,iBAAiB,CAAC,IAAI,OAAO,CAC/E,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,EAClC,SAAS,GAAG,IAAI,CACjB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@voiceflow/style",
-  "version": "1.2.4",
+  "version": "1.3.0",
   "exports": {
     ".": {
       "types": "./build/cjs/main.d.ts",
@@ -54,5 +54,5 @@
   "peerDependencies": {
     "react": "^18"
   },
-  "gitHead": "0b4d858853f8c3b267a0eb6b4008312b0e3a1f1e"
+  "gitHead": "fd809d5e3fffd3ee84b26fc8462d22d549ebd6f5"
 }

package/src/__fixtures__/RecipeButton/RecipeButton.component.tsx

@@ -1,10 +1,10 @@
-import type { RecipeVariants } from '@/main';
+import type { VariantProps } from '@/main';
 
 import type { ButtonProps } from '../Button';
 import type { complex } from './RecipeButton.css';
 import * as S from './RecipeButton.styled';
 
-export type RecipeButtonProps = ButtonProps & RecipeVariants<typeof complex>;
+export interface RecipeButtonProps extends ButtonProps, VariantProps<typeof complex> {}
 
 export const RecipeButton: React.FC<RecipeButtonProps> = ({ color, fontSize, onClick, children }) => (
   <S.Base variants={{ color, fontSize }} onClick={onClick}>

package/src/styled/factory.tsx

@@ -28,7 +28,7 @@ export const styled = new Proxy<{
         const inlineStyle = useInlineStyle(props, dynamicOptions);
 
         return createElement(tag, {
-          ...(props as React.ComponentProps<Tag>),
+          ...(props as React.ComponentPropsWithoutRef<Tag>),
           className: clsx(themeClass, staticClass, dynamicClass, props.className),
           style: { ...inlineStyle, ...props.style },
         });

package/src/styled/types.ts

@@ -43,7 +43,7 @@ export type StyledComponentProps<
   Theme,
   Variables,
   Extras extends object = {}
-> = React.ComponentProps<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
+> = React.ComponentPropsWithoutRef<Tag> & DynamicThemeProps<Theme> & DynamicVariablesProps<Variables> & Extras;
 
 export interface StyledComponent<Props = {}> extends React.FunctionComponent<Props> {
   (props: Props, context?: any): React.ReactElement<any, any> | null;

package/src/types.ts

@@ -4,4 +4,7 @@ import type { Simplify } from 'type-fest';
 
 export type VariantStyleRules = Record<string, Record<string, ComplexStyleRule | string>>;
 
-export type VariantProps<RecipeFn extends RuntimeFn<VariantStyleRules>> = Simplify<RecipeVariants<RecipeFn>>;
+export type VariantProps<RecipeFn extends RuntimeFn<VariantStyleRules>> = Exclude<
+  Simplify<RecipeVariants<RecipeFn>>,
+  undefined | null
+>;