diff --git a/.changeset/calm-impalas-itch.md b/.changeset/calm-impalas-itch.md new file mode 100644 index 000000000..f60b47507 --- /dev/null +++ b/.changeset/calm-impalas-itch.md @@ -0,0 +1,5 @@ +--- +'@vanilla-extract/recipes': patch +--- + +Applying recipes now ignores unknown options instead of throwing a runtime TypeError. diff --git a/packages/recipes/src/createRuntimeFn.ts b/packages/recipes/src/createRuntimeFn.ts index f064aeda1..4ed8b8c18 100644 --- a/packages/recipes/src/createRuntimeFn.ts +++ b/packages/recipes/src/createRuntimeFn.ts @@ -45,7 +45,7 @@ export const createRuntimeFn = ( const selectionClassName = // @ts-expect-error - config.variantClassNames[variantName][selection]; + config.variantClassNames[variantName]?.[selection]; if (selectionClassName) { className += ' ' + selectionClassName; diff --git a/tests/recipes/recipes.test.ts b/tests/recipes/recipes.test.ts index 6794b957c..d00e9a420 100644 --- a/tests/recipes/recipes.test.ts +++ b/tests/recipes/recipes.test.ts @@ -24,6 +24,13 @@ describe('recipes', () => { ); }); + it('should ignore unknown variants', () => { + const props = { other: 'unknown-option' } as Parameters[0]; + expect(basic(props)).toMatchInlineSnapshot( + `"recipes_basic__niwegb0 recipes_basic_spaceWithDefault_small__niwegb1"`, + ); + }); + it('should return requested variants', () => { expect( basic({