@pandacss/node 0.0.0-dev-20221124070053 → 0.0.0-dev-20221124074636

package/dist/index.js

@@ -380,6 +380,7 @@ function generatePreactJsxFactory(ctx) {
 // src/generators/jsx/preact-pattern.ts
 var import_shared3 = require("@pandacss/shared");
 var import_outdent7 = require("outdent");
+var import_ts_pattern = require("ts-pattern");
 function generate(name, pattern, jsxFactory) {
   const upperName = (0, import_shared3.capitalize)(name);
   const jsxName = pattern.jsx ?? upperName;
@@ -392,9 +393,18 @@ function generate(name, pattern, jsxFactory) {
     import { config } from '../patterns/${(0, import_shared3.dashCase)(name)}'
 
     export const ${jsxName} = forwardRef(function ${jsxName}(props, ref) {
-      const { ${keys.join(", ")}, ...restProps } = props
-      const styleProps = config.transform({${keys.join(", ")}})
-      return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+      ${(0, import_ts_pattern.match)(keys.length).with(
+      0,
+      () => `
+          return <${jsxFactory}.div ref={ref} {...props} />
+        `
+    ).otherwise(
+      () => `
+        const { ${keys.join(", ")}, ...restProps } = props
+        const styleProps = config.transform({${keys.join(", ")}})
+        return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+        `
+    )}
     })    
     `,
     dts: import_outdent7.outdent`
@@ -410,7 +420,7 @@ function generate(name, pattern, jsxFactory) {
     type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
       Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
 
-    type ${jsxName}Props<C extends ElementType> = Polymorphic<C, ${upperName}Options>
+    type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
     
     export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
     `
@@ -507,6 +517,7 @@ function generateReactJsxFactory(ctx) {
 // src/generators/jsx/react-pattern.ts
 var import_shared5 = require("@pandacss/shared");
 var import_outdent9 = require("outdent");
+var import_ts_pattern2 = require("ts-pattern");
 function generate2(name, pattern, jsxFactory) {
   const upperName = (0, import_shared5.capitalize)(name);
   const jsxName = pattern.jsx ?? upperName;
@@ -519,9 +530,19 @@ function generate2(name, pattern, jsxFactory) {
     import { config } from '../patterns/${(0, import_shared5.dashCase)(name)}'
 
     export const ${jsxName} = forwardRef(function ${jsxName}(props, ref) {
-      const { ${keys.join(", ")}, ...restProps } = props
-      const styleProps = config.transform({${keys.join(", ")}})
-      return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+      ${(0, import_ts_pattern2.match)(keys.length).with(
+      0,
+      () => `
+          return <${jsxFactory}.div ref={ref} {...props} />
+        `
+    ).otherwise(
+      () => `
+        const { ${keys.join(", ")}, ...restProps } = props
+        const styleProps = config.transform({${keys.join(", ")}})
+        return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+        `
+    )}
+        
     })    
     `,
     dts: import_outdent9.outdent`
@@ -534,7 +555,7 @@ function generate2(name, pattern, jsxFactory) {
     type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
       Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
     
     export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
     `
@@ -618,6 +639,7 @@ function generateSolidJsxFactory(ctx) {
 // src/generators/jsx/solid-pattern.ts
 var import_shared7 = require("@pandacss/shared");
 var import_outdent11 = require("outdent");
+var import_ts_pattern3 = require("ts-pattern");
 function generate3(name, pattern, jsxFactory) {
   const upperName = (0, import_shared7.capitalize)(name);
   const jsxName = pattern.jsx ?? upperName;
@@ -630,9 +652,18 @@ function generate3(name, pattern, jsxFactory) {
     import { config } from '../patterns/${(0, import_shared7.dashCase)(name)}'
 
     export function ${jsxName}(props) {
-      const [patternProps, restProps] = splitProps(props, [${keys.map((v) => JSON.stringify(v)).join(", ")}]);
-      const styleProps = config.transform(patternProps)
-      return <${jsxFactory}.div {...styleProps} {...restProps} />
+      ${(0, import_ts_pattern3.match)(keys.length).with(
+      0,
+      () => `
+          return <${jsxFactory}.div {...props} />
+        `
+    ).otherwise(
+      () => `
+          const [patternProps, restProps] = splitProps(props, [${keys.map((v) => JSON.stringify(v)).join(", ")}]);
+          const styleProps = config.transform(patternProps)
+          return <${jsxFactory}.div {...styleProps} {...restProps} />
+        `
+    )}
     }
     `,
     dts: import_outdent11.outdent`
@@ -646,7 +677,7 @@ function generate3(name, pattern, jsxFactory) {
     type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
       Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
     
     export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
     `
@@ -680,7 +711,7 @@ function generateJsxPatterns(ctx) {
 var import_shared8 = require("@pandacss/shared");
 var import_outdent12 = require("outdent");
 var import_telejson = require("telejson");
-var import_ts_pattern = require("ts-pattern");
+var import_ts_pattern4 = require("ts-pattern");
 function generate4(name, pattern) {
   const { properties, transform, strict } = pattern;
   return {
@@ -693,7 +724,7 @@ function generate4(name, pattern) {
     export type ${(0, import_shared8.capitalize)(name)}Options = {
        ${Object.keys(properties ?? {}).map((key) => {
       const value = properties[key];
-      return (0, import_ts_pattern.match)(value).with({ type: "property" }, (value2) => {
+      return (0, import_ts_pattern4.match)(value).with({ type: "property" }, (value2) => {
         return `${key}?: SystemStyleObject["${value2.value}"]`;
       }).with({ type: "token" }, (value2) => {
         if (value2.property) {
@@ -920,7 +951,7 @@ function generateReset() {
 // src/generators/token-css.ts
 var import_core2 = require("@pandacss/core");
 var import_outdent15 = require("outdent");
-var import_ts_pattern2 = require("ts-pattern");
+var import_ts_pattern5 = require("ts-pattern");
 function generateKeyframes(keyframes) {
   if (keyframes) {
     return (0, import_core2.toKeyframeCss)(keyframes);
@@ -947,7 +978,7 @@ function generateTokenCss(ctx, varRoot) {
       results.push(css3);
     } else {
       const cond = conditions.normalize(key);
-      const css3 = (0, import_ts_pattern2.match)(cond).with({ type: "parent-nesting" }, (cond2) => {
+      const css3 = (0, import_ts_pattern5.match)(cond).with({ type: "parent-nesting" }, (cond2) => {
         const selector = cond2.value.replace(/\s&/g, "");
         const { css: css4 } = (0, import_core2.toCss)(varsObj);
         return `${selector} {
@@ -961,7 +992,7 @@ function generateTokenCss(ctx, varRoot) {
  ${css4}; 
  } 
  }`;
-      }).with(import_ts_pattern2.P.nullish, () => {
+      }).with(import_ts_pattern5.P.nullish, () => {
       }).otherwise((cond2) => {
         if (cond2) {
           throw new Error(getConditionMessage(cond2.raw));

package/dist/index.mjs

@@ -335,6 +335,7 @@ function generatePreactJsxFactory(ctx) {
 // src/generators/jsx/preact-pattern.ts
 import { capitalize as capitalize2, dashCase } from "@pandacss/shared";
 import { outdent as outdent7 } from "outdent";
+import { match } from "ts-pattern";
 function generate(name, pattern, jsxFactory) {
   const upperName = capitalize2(name);
   const jsxName = pattern.jsx ?? upperName;
@@ -347,9 +348,18 @@ function generate(name, pattern, jsxFactory) {
     import { config } from '../patterns/${dashCase(name)}'
 
     export const ${jsxName} = forwardRef(function ${jsxName}(props, ref) {
-      const { ${keys.join(", ")}, ...restProps } = props
-      const styleProps = config.transform({${keys.join(", ")}})
-      return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+      ${match(keys.length).with(
+      0,
+      () => `
+          return <${jsxFactory}.div ref={ref} {...props} />
+        `
+    ).otherwise(
+      () => `
+        const { ${keys.join(", ")}, ...restProps } = props
+        const styleProps = config.transform({${keys.join(", ")}})
+        return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+        `
+    )}
     })    
     `,
     dts: outdent7`
@@ -365,7 +375,7 @@ function generate(name, pattern, jsxFactory) {
     type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
       Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
 
-    type ${jsxName}Props<C extends ElementType> = Polymorphic<C, ${upperName}Options>
+    type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
     
     export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
     `
@@ -462,6 +472,7 @@ function generateReactJsxFactory(ctx) {
 // src/generators/jsx/react-pattern.ts
 import { capitalize as capitalize4, dashCase as dashCase2 } from "@pandacss/shared";
 import { outdent as outdent9 } from "outdent";
+import { match as match2 } from "ts-pattern";
 function generate2(name, pattern, jsxFactory) {
   const upperName = capitalize4(name);
   const jsxName = pattern.jsx ?? upperName;
@@ -474,9 +485,19 @@ function generate2(name, pattern, jsxFactory) {
     import { config } from '../patterns/${dashCase2(name)}'
 
     export const ${jsxName} = forwardRef(function ${jsxName}(props, ref) {
-      const { ${keys.join(", ")}, ...restProps } = props
-      const styleProps = config.transform({${keys.join(", ")}})
-      return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+      ${match2(keys.length).with(
+      0,
+      () => `
+          return <${jsxFactory}.div ref={ref} {...props} />
+        `
+    ).otherwise(
+      () => `
+        const { ${keys.join(", ")}, ...restProps } = props
+        const styleProps = config.transform({${keys.join(", ")}})
+        return <${jsxFactory}.div ref={ref} {...styleProps} {...restProps} />
+        `
+    )}
+        
     })    
     `,
     dts: outdent9`
@@ -489,7 +510,7 @@ function generate2(name, pattern, jsxFactory) {
     type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
       Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
     
     export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
     `
@@ -573,6 +594,7 @@ function generateSolidJsxFactory(ctx) {
 // src/generators/jsx/solid-pattern.ts
 import { capitalize as capitalize6, dashCase as dashCase3 } from "@pandacss/shared";
 import { outdent as outdent11 } from "outdent";
+import { match as match3 } from "ts-pattern";
 function generate3(name, pattern, jsxFactory) {
   const upperName = capitalize6(name);
   const jsxName = pattern.jsx ?? upperName;
@@ -585,9 +607,18 @@ function generate3(name, pattern, jsxFactory) {
     import { config } from '../patterns/${dashCase3(name)}'
 
     export function ${jsxName}(props) {
-      const [patternProps, restProps] = splitProps(props, [${keys.map((v) => JSON.stringify(v)).join(", ")}]);
-      const styleProps = config.transform(patternProps)
-      return <${jsxFactory}.div {...styleProps} {...restProps} />
+      ${match3(keys.length).with(
+      0,
+      () => `
+          return <${jsxFactory}.div {...props} />
+        `
+    ).otherwise(
+      () => `
+          const [patternProps, restProps] = splitProps(props, [${keys.map((v) => JSON.stringify(v)).join(", ")}]);
+          const styleProps = config.transform(patternProps)
+          return <${jsxFactory}.div {...styleProps} {...restProps} />
+        `
+    )}
     }
     `,
     dts: outdent11`
@@ -601,7 +632,7 @@ function generate3(name, pattern, jsxFactory) {
     type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
       Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
     
     export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
     `
@@ -635,7 +666,7 @@ function generateJsxPatterns(ctx) {
 import { capitalize as capitalize7, dashCase as dashCase4, unionType as unionType2 } from "@pandacss/shared";
 import { outdent as outdent12 } from "outdent";
 import { stringify as stringify2 } from "telejson";
-import { match } from "ts-pattern";
+import { match as match4 } from "ts-pattern";
 function generate4(name, pattern) {
   const { properties, transform, strict } = pattern;
   return {
@@ -648,7 +679,7 @@ function generate4(name, pattern) {
     export type ${capitalize7(name)}Options = {
        ${Object.keys(properties ?? {}).map((key) => {
       const value = properties[key];
-      return match(value).with({ type: "property" }, (value2) => {
+      return match4(value).with({ type: "property" }, (value2) => {
         return `${key}?: SystemStyleObject["${value2.value}"]`;
       }).with({ type: "token" }, (value2) => {
         if (value2.property) {
@@ -875,7 +906,7 @@ function generateReset() {
 // src/generators/token-css.ts
 import { toCss, toKeyframeCss } from "@pandacss/core";
 import { outdent as outdent15 } from "outdent";
-import { match as match2, P } from "ts-pattern";
+import { match as match5, P } from "ts-pattern";
 function generateKeyframes(keyframes) {
   if (keyframes) {
     return toKeyframeCss(keyframes);
@@ -902,7 +933,7 @@ function generateTokenCss(ctx, varRoot) {
       results.push(css3);
     } else {
       const cond = conditions.normalize(key);
-      const css3 = match2(cond).with({ type: "parent-nesting" }, (cond2) => {
+      const css3 = match5(cond).with({ type: "parent-nesting" }, (cond2) => {
         const selector = cond2.value.replace(/\s&/g, "");
         const { css: css4 } = toCss(varsObj);
         return `${selector} {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/node",
-  "version": "0.0.0-dev-20221124070053",
+  "version": "0.0.0-dev-20221124074636",
   "description": "The core css panda library",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -30,15 +30,15 @@
     "telejson": "6.0.8",
     "ts-pattern": "4.0.6",
     "ts-morph": "17.0.1",
-    "@pandacss/types": "0.0.0-dev-20221124070053",
-    "@pandacss/is-valid-prop": "0.0.0-dev-20221124070053",
-    "@pandacss/error": "0.0.0-dev-20221124070053",
-    "@pandacss/parser": "0.0.0-dev-20221124070053",
-    "@pandacss/shared": "0.0.0-dev-20221124070053",
-    "@pandacss/token-dictionary": "0.0.0-dev-20221124070053",
-    "@pandacss/logger": "0.0.0-dev-20221124070053",
-    "@pandacss/core": "0.0.0-dev-20221124070053",
-    "@pandacss/config": "0.0.0-dev-20221124070053"
+    "@pandacss/types": "0.0.0-dev-20221124074636",
+    "@pandacss/is-valid-prop": "0.0.0-dev-20221124074636",
+    "@pandacss/error": "0.0.0-dev-20221124074636",
+    "@pandacss/parser": "0.0.0-dev-20221124074636",
+    "@pandacss/shared": "0.0.0-dev-20221124074636",
+    "@pandacss/token-dictionary": "0.0.0-dev-20221124074636",
+    "@pandacss/logger": "0.0.0-dev-20221124074636",
+    "@pandacss/core": "0.0.0-dev-20221124074636",
+    "@pandacss/config": "0.0.0-dev-20221124074636"
   },
   "devDependencies": {
     "@types/fs-extra": "9.0.13",
@@ -46,7 +46,7 @@
     "@types/glob-parent": "^5.1.1",
     "@types/pluralize": "0.0.29",
     "@types/lodash.merge": "4.6.7",
-    "@pandacss/fixture": "0.0.0-dev-20221124070053"
+    "@pandacss/fixture": "0.0.0-dev-20221124074636"
   },
   "scripts": {
     "build": "tsup src/index.ts --format=cjs,esm --shims --dts",