Merge pull request #104 from mj-studio-library/develop

Release
mym0404 · Jun 14, 2024 · c215bdf · c215bdf
2 parents fe7492a + fd2e57d
commit c215bdf
Showing 1 changed file with 17 additions and 4 deletions.
diff --git a/packages/core/src/util/createSxComponent.tsx b/packages/core/src/util/createSxComponent.tsx
@@ -2,12 +2,16 @@ import type { ComponentType } from 'react';
 import React, { forwardRef } from 'react';
 
 import type { SxProps, TextSxProps } from '../@types/SxProps';
+import type { UseSxOptions } from '../hook/useSx';
 import { useSx } from '../hook/useSx';
 
-export function createSxComponent<Props extends object, Ref>(Base: ComponentType<Props>) {
+export function createSxComponent<Props extends object, Ref>(
+  Base: ComponentType<Props>,
+  { defaultProps, sxOptions }: { defaultProps?: Props & SxProps; sxOptions?: UseSxOptions } = {},
+) {
   return () => {
     const Transformed = forwardRef<Ref, Props & SxProps>(function (props, ref) {
-      const { filteredProps, getStyle } = useSx(props);
+      const { filteredProps, getStyle } = useSx({ ...defaultProps, ...props }, sxOptions);
 
       return <Base {...(filteredProps as any)} style={getStyle()} ref={ref as any} />;
     });
@@ -18,10 +22,19 @@ export function createSxComponent<Props extends object, Ref>(Base: ComponentType
   };
 }
 
-export function createSxTextComponent<Props extends object, Ref>(Base: ComponentType<Props>) {
+export function createSxTextComponent<Props extends object, Ref>(
+  Base: ComponentType<Props>,
+  {
+    defaultProps,
+    sxOptions,
+  }: { defaultProps?: Props & TextSxProps; sxOptions?: UseSxOptions } = {},
+) {
   return () => {
     const Transformed = forwardRef<Ref, Props & TextSxProps>(function (props, ref) {
-      const { filteredProps, getStyle } = useSx(props, { styleType: 'TextStyle' });
+      const { filteredProps, getStyle } = useSx(
+        { ...defaultProps, ...props },
+        { styleType: 'TextStyle', ...sxOptions },
+      );
 
       return <Base {...(filteredProps as any)} style={getStyle()} ref={ref as any} />;
     });