@seed-design/react 2.0.3 → 2.0.4

package/lib/utils/createRecipeContext.cjs

@@ -1,5 +1,6 @@
 "use client";
 const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
+const require_restoreDefaultProps = require("./restoreDefaultProps.cjs");
 let clsx = require("clsx");
 clsx = require_runtime.__toESM(clsx);
 let react = require("react");
@@ -24,6 +25,7 @@ function createRecipeContext(recipe) {
 				...useProps(),
 				...innerProps
 			};
+			require_restoreDefaultProps.restoreDefaultProps(props, defaultProps);
 			const [variantProps, otherProps] = recipe.splitVariantProps(props);
 			const className = recipe(variantProps);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, {

package/lib/utils/createRecipeContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createRecipeContext.d.ts","sourceRoot":"","sources":["../../src/utils/createRecipeContext.tsx"],"names":[],"mappings":"AAGA,KAAK,MAAM,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,CACzE,KAAK,CAAC,EAAE,KAAK,KACV,MAAM,CAAC,GAAG;IACb,iBAAiB,EAAE,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC;CACjF,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC5F,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC;yCAIuB;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE;;kBAQlE,CAAC,EAAE,CAAC,aACZ,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,YACvB;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;wBAgB1D,CAAC,OAAK,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;EAU5D"}
+{"version":3,"file":"createRecipeContext.d.ts","sourceRoot":"","sources":["../../src/utils/createRecipeContext.tsx"],"names":[],"mappings":"AAIA,KAAK,MAAM,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,IAAI,CAAC,CACzE,KAAK,CAAC,EAAE,KAAK,KACV,MAAM,CAAC,GAAG;IACb,iBAAiB,EAAE,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC;CACjF,CAAC;AAEF,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC5F,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC;yCAIuB;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE;;kBAQlE,CAAC,EAAE,CAAC,aACZ,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,YACvB;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;wBAmB1D,CAAC,OAAK,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;EAU5D"}

package/lib/utils/createRecipeContext.js

@@ -1,4 +1,5 @@
 "use client";
+import { restoreDefaultProps } from "./restoreDefaultProps.js";
 import clsx$1 from "clsx";
 import { createContext, forwardRef, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -22,6 +23,7 @@ function createRecipeContext(recipe) {
 				...useProps(),
 				...innerProps
 			};
+			restoreDefaultProps(props, defaultProps);
 			const [variantProps, otherProps] = recipe.splitVariantProps(props);
 			const className = recipe(variantProps);
 			return /* @__PURE__ */ jsx(Component, {

package/lib/utils/createRecipeContext.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=createRecipeContext.test.d.ts.map

package/lib/utils/createRecipeContext.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createRecipeContext.test.d.ts","sourceRoot":"","sources":["../../src/utils/createRecipeContext.test.tsx"],"names":[],"mappings":""}

package/lib/utils/createSlotRecipeContext.cjs

@@ -1,5 +1,6 @@
 "use client";
 const require_runtime = require("../_virtual/_rolldown/runtime.cjs");
+const require_restoreDefaultProps = require("./restoreDefaultProps.cjs");
 let clsx = require("clsx");
 clsx = require_runtime.__toESM(clsx);
 let react = require("react");
@@ -36,6 +37,7 @@ function createSlotRecipeContext(recipe) {
 				...useProps(),
 				...innerProps
 			};
+			require_restoreDefaultProps.restoreDefaultProps(props, defaultProps);
 			const [variantProps, otherProps] = recipe.splitVariantProps(props);
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ClassNamesProvider, {
 				value: recipe(variantProps),
@@ -53,6 +55,7 @@ function createSlotRecipeContext(recipe) {
 				...useProps(),
 				...innerProps
 			};
+			require_restoreDefaultProps.restoreDefaultProps(props, defaultProps);
 			const [variantProps, otherProps] = recipe.splitVariantProps(props);
 			const classNames = recipe(variantProps);
 			const className = classNames[slot];

package/lib/utils/createSlotRecipeContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createSlotRecipeContext.d.ts","sourceRoot":"","sources":["../../src/utils/createSlotRecipeContext.tsx"],"names":[],"mappings":"AAGA,KAAK,UAAU,CACb,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,IACvC,CAAC,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,UAAU,CAAC,GAAG;IACpC,iBAAiB,EAAE,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC;CACjF,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACzC,MAAM,EAAE,UAAU,CAAC,KAAK,EAAE,UAAU,CAAC;+CAOlC;QACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,KAAK,EAAE,UAAU,CAAC;KACnB;yCAI2C;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE;;;uBAmB7D,CAAC,aACd,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,YACvB;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;mBAsBtC,CAAC,EAAE,CAAC,aACb,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,QAC3B,MAAM,UAAU,YACZ;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;kBAuBhE,CAAC,EAAE,CAAC,aACZ,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,SAC1B,MAAM,UAAU,KACtB,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;EAsBtF"}
+{"version":3,"file":"createSlotRecipeContext.d.ts","sourceRoot":"","sources":["../../src/utils/createSlotRecipeContext.tsx"],"names":[],"mappings":"AAIA,KAAK,UAAU,CACb,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,IACvC,CAAC,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,UAAU,CAAC,GAAG;IACpC,iBAAiB,EAAE,CAAC,CAAC,SAAS,KAAK,EAAE,KAAK,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,EAAE,MAAM,KAAK,CAAC,CAAC,CAAC;CACjF,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC,EAC1D,UAAU,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACzC,MAAM,EAAE,UAAU,CAAC,KAAK,EAAE,UAAU,CAAC;+CAOlC;QACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,KAAK,EAAE,UAAU,CAAC;KACnB;yCAI2C;QAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE;;;uBAmB7D,CAAC,aACd,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,YACvB;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;mBAyBtC,CAAC,EAAE,CAAC,aACb,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,QAC3B,MAAM,UAAU,YACZ;QACR,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;KAC3B,KACA,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;kBA0BhE,CAAC,EAAE,CAAC,aACZ,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,SAC1B,MAAM,UAAU,KACtB,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;EAsBtF"}

package/lib/utils/createSlotRecipeContext.js

@@ -1,4 +1,5 @@
 "use client";
+import { restoreDefaultProps } from "./restoreDefaultProps.js";
 import clsx$1 from "clsx";
 import { createContext, forwardRef, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -34,6 +35,7 @@ function createSlotRecipeContext(recipe) {
 				...useProps(),
 				...innerProps
 			};
+			restoreDefaultProps(props, defaultProps);
 			const [variantProps, otherProps] = recipe.splitVariantProps(props);
 			return /* @__PURE__ */ jsx(ClassNamesProvider, {
 				value: recipe(variantProps),
@@ -51,6 +53,7 @@ function createSlotRecipeContext(recipe) {
 				...useProps(),
 				...innerProps
 			};
+			restoreDefaultProps(props, defaultProps);
 			const [variantProps, otherProps] = recipe.splitVariantProps(props);
 			const classNames = recipe(variantProps);
 			const className = classNames[slot];

package/lib/utils/createSlotRecipeContext.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=createSlotRecipeContext.test.d.ts.map

package/lib/utils/createSlotRecipeContext.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createSlotRecipeContext.test.d.ts","sourceRoot":"","sources":["../../src/utils/createSlotRecipeContext.test.tsx"],"names":[],"mappings":""}

package/lib/utils/restoreDefaultProps.cjs

@@ -0,0 +1,9 @@
+"use client";
+//#region src/utils/restoreDefaultProps.ts
+/** Restores defaults overwritten by explicitly passed undefined values. */
+function restoreDefaultProps(props, defaultProps) {
+	if (!defaultProps) return;
+	for (const key of Object.keys(defaultProps)) if (props[key] === void 0) props[key] = defaultProps[key];
+}
+//#endregion
+exports.restoreDefaultProps = restoreDefaultProps;

package/lib/utils/restoreDefaultProps.d.ts

@@ -0,0 +1,3 @@
+/** Restores defaults overwritten by explicitly passed undefined values. */
+export declare function restoreDefaultProps<P>(props: Record<string, unknown>, defaultProps: Partial<P> | undefined): void;
+//# sourceMappingURL=restoreDefaultProps.d.ts.map

package/lib/utils/restoreDefaultProps.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"restoreDefaultProps.d.ts","sourceRoot":"","sources":["../../src/utils/restoreDefaultProps.ts"],"names":[],"mappings":"AAAA,2EAA2E;AAC3E,wBAAgB,mBAAmB,CAAC,CAAC,EACnC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC9B,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,SAAS,QASrC"}

package/lib/utils/restoreDefaultProps.js

@@ -0,0 +1,9 @@
+"use client";
+//#region src/utils/restoreDefaultProps.ts
+/** Restores defaults overwritten by explicitly passed undefined values. */
+function restoreDefaultProps(props, defaultProps) {
+	if (!defaultProps) return;
+	for (const key of Object.keys(defaultProps)) if (props[key] === void 0) props[key] = defaultProps[key];
+}
+//#endregion
+export { restoreDefaultProps };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seed-design/react",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/daangn/seed-design.git",

package/src/utils/createRecipeContext.test.tsx

@@ -0,0 +1,52 @@
+import { render } from "@testing-library/react";
+import { describe, expect, it } from "bun:test";
+import { createRecipeContext } from "./createRecipeContext";
+
+type TestRecipeProps = {
+  active?: boolean;
+};
+
+let receivedProps: TestRecipeProps | undefined;
+
+const testRecipe = Object.assign(
+  (props?: TestRecipeProps) => {
+    receivedProps = props;
+    return "root";
+  },
+  {
+    splitVariantProps: <T extends TestRecipeProps>(props: T) =>
+      [props, {} as Omit<T, keyof TestRecipeProps>] as [
+        TestRecipeProps,
+        Omit<T, keyof TestRecipeProps>,
+      ],
+  },
+);
+
+const { PropsProvider, withContext } = createRecipeContext(testRecipe);
+const Root = withContext<unknown, TestRecipeProps>(() => null, {
+  defaultProps: { active: true },
+});
+
+describe("createRecipeContext", () => {
+  it("restores default props overwritten with undefined", () => {
+    render(<Root active={undefined} />);
+
+    expect(receivedProps).toMatchObject({ active: true });
+  });
+
+  it("restores default props overwritten with undefined context props", () => {
+    render(
+      <PropsProvider value={{ active: undefined }}>
+        <Root />
+      </PropsProvider>,
+    );
+
+    expect(receivedProps).toMatchObject({ active: true });
+  });
+
+  it("preserves explicitly provided false values", () => {
+    render(<Root active={false} />);
+
+    expect(receivedProps).toMatchObject({ active: false });
+  });
+});

package/src/utils/createRecipeContext.tsx

@@ -1,5 +1,6 @@
 import clsx from "clsx";
 import { createContext, forwardRef, useContext } from "react";
+import { restoreDefaultProps } from "./restoreDefaultProps";
 
 type Recipe<Props extends Record<string, string | boolean | undefined>> = ((
   props?: Props,
@@ -31,6 +32,9 @@ export function createRecipeContext<Props extends Record<string, string | boolea
     const StyledComponent = forwardRef<any, any>((innerProps, ref) => {
       const props = { ...(defaultProps ?? {}), ...useProps(), ...innerProps } as Props &
         React.HTMLAttributes<HTMLElement>;
+
+      restoreDefaultProps(props as Record<string, unknown>, defaultProps);
+
       const [variantProps, otherProps] = recipe.splitVariantProps(props);
       const className = recipe(variantProps); // TODO: should we memoize this?
 

package/src/utils/createSlotRecipeContext.test.tsx

@@ -0,0 +1,92 @@
+import { render } from "@testing-library/react";
+import { describe, expect, it } from "bun:test";
+import { createSlotRecipeContext } from "./createSlotRecipeContext";
+
+type TestRecipeProps = {
+  lazyMount?: boolean;
+  unmountOnExit?: boolean;
+};
+
+type TestClassNames = {
+  root: string;
+};
+
+let receivedProps: TestRecipeProps | undefined;
+
+const testRecipe = Object.assign(
+  (props?: TestRecipeProps): TestClassNames => {
+    receivedProps = props;
+    return { root: "root" };
+  },
+  {
+    splitVariantProps: <T extends TestRecipeProps>(props: T) =>
+      [props, {} as Omit<T, keyof TestRecipeProps>] as [
+        TestRecipeProps,
+        Omit<T, keyof TestRecipeProps>,
+      ],
+  },
+);
+
+const { PropsProvider, withProvider, withRootProvider } = createSlotRecipeContext(testRecipe);
+const Root = withRootProvider<TestRecipeProps>(() => null, {
+  defaultProps: {
+    lazyMount: true,
+    unmountOnExit: true,
+  },
+});
+const Slot = withProvider<unknown, TestRecipeProps>(() => null, "root", {
+  defaultProps: {
+    lazyMount: true,
+    unmountOnExit: true,
+  },
+});
+
+describe("createSlotRecipeContext", () => {
+  describe("withRootProvider", () => {
+    it("restores default props overwritten with undefined", () => {
+      render(<Root lazyMount={undefined} unmountOnExit={undefined} />);
+
+      expect(receivedProps).toMatchObject({
+        lazyMount: true,
+        unmountOnExit: true,
+      });
+    });
+
+    it("restores default props overwritten with undefined context props", () => {
+      render(
+        <PropsProvider value={{ lazyMount: undefined, unmountOnExit: undefined }}>
+          <Root />
+        </PropsProvider>,
+      );
+
+      expect(receivedProps).toMatchObject({
+        lazyMount: true,
+        unmountOnExit: true,
+      });
+    });
+
+    it("preserves explicitly provided false values", () => {
+      render(<Root lazyMount={false} unmountOnExit={false} />);
+
+      expect(receivedProps).toMatchObject({
+        lazyMount: false,
+        unmountOnExit: false,
+      });
+    });
+  });
+
+  describe("withProvider", () => {
+    it("restores default props overwritten with undefined context props", () => {
+      render(
+        <PropsProvider value={{ lazyMount: undefined, unmountOnExit: undefined }}>
+          <Slot />
+        </PropsProvider>,
+      );
+
+      expect(receivedProps).toMatchObject({
+        lazyMount: true,
+        unmountOnExit: true,
+      });
+    });
+  });
+});

package/src/utils/createSlotRecipeContext.tsx

@@ -1,5 +1,6 @@
 import clsx from "clsx";
 import { createContext, forwardRef, useContext } from "react";
+import { restoreDefaultProps } from "./restoreDefaultProps";
 
 type SlotRecipe<
   Props extends Record<string, string | boolean | undefined>,
@@ -55,6 +56,9 @@ export function createSlotRecipeContext<
     const StyledComponent = (innerProps: any) => {
       const props = { ...(defaultProps ?? {}), ...useProps(), ...innerProps } as Props &
         React.HTMLAttributes<HTMLElement>;
+
+      restoreDefaultProps(props as Record<string, unknown>, defaultProps);
+
       const [variantProps, otherProps] = recipe.splitVariantProps(props);
       const classNames = recipe(variantProps); // TODO: should we memoize this?
 
@@ -83,6 +87,9 @@ export function createSlotRecipeContext<
     const StyledComponent = forwardRef<any, any>((innerProps, ref) => {
       const props = { ...(defaultProps ?? {}), ...useProps(), ...innerProps } as Props &
         React.HTMLAttributes<HTMLElement>;
+
+      restoreDefaultProps(props as Record<string, unknown>, defaultProps);
+
       const [variantProps, otherProps] = recipe.splitVariantProps(props);
       const classNames = recipe(variantProps); // TODO: should we memoize this?
       const className = classNames[slot as keyof typeof classNames];

package/src/utils/restoreDefaultProps.ts

@@ -0,0 +1,13 @@
+/** Restores defaults overwritten by explicitly passed undefined values. */
+export function restoreDefaultProps<P>(
+  props: Record<string, unknown>,
+  defaultProps: Partial<P> | undefined,
+) {
+  if (!defaultProps) return;
+
+  for (const key of Object.keys(defaultProps)) {
+    if (props[key] === undefined) {
+      props[key] = defaultProps[key as keyof P];
+    }
+  }
+}