@pandacss/node 0.0.0-dev-20221128063601 → 0.0.0-dev-20221128100346

package/dist/index.js

@@ -323,10 +323,9 @@ function generatePreactJsxFactory(ctx) {
     import type { JSXStyleProperties } from '../types'
     
     type Element = keyof JSX.IntrinsicElements
-
-    type Merge<P, T> = Omit<P, 'color'> & T;
     
-    export type HTML${upperName}Props<T extends Element> = Merge<ComponentProps<T>, JSXStyleProperties>
+    export type HTML${upperName}Props<T extends Element> = Omit<ComponentProps<T>, 'color'> | JSXStyleProperties
+    
 
     type JSXFactory = {
       [K in Element]: (props: HTML${upperName}Props<K>) => JSX.Element
@@ -335,8 +334,8 @@ function generatePreactJsxFactory(ctx) {
     export declare const ${name}: JSXFactory
     `,
     js: import_outdent6.outdent`
-    import { h } from 'preact';
-    import { forwardRef } from 'preact/compat';
+    import { h } from 'preact'
+    import { forwardRef } from 'preact/compat'
     import { isCssProperty } from './is-valid-prop'
     import { css } from '../css'
     
@@ -371,7 +370,7 @@ function generatePreactJsxFactory(ctx) {
           return cx(atomicClass, elementProps.className)
         }
     
-        return h(Element, { ...elementProps, ref, className: classes() });
+        return h(Element, { ...elementProps, ref, className: classes() })
       })
       
       ${upperName}Component.displayName = \`${name}.\${Dynamic}\`
@@ -391,7 +390,7 @@ function generatePreactJsxFactory(ctx) {
       })
     }
 
-    export const ${name} = createFactory();
+    export const ${name} = createFactory()
     `
   };
 }
@@ -481,20 +480,18 @@ function generate(name, pattern, jsxFactory) {
     `,
     dts: import_outdent8.outdent`
     import { ComponentProps, JSX, ComponentChildren } from 'preact';
-    import { ${upperName}Options } from '../patterns/${(0, import_shared3.dashCase)(name)}'
+    import { ${upperName}Properties } from '../patterns/${(0, import_shared3.dashCase)(name)}'
     import { JSXStyleProperties, Assign } from '../types'
     
     type ElementType = keyof JSX.IntrinsicElements
-    
-    type PropsWithChildren<T> = T & { children?: ComponentChildren }
-    type PropsOf<C extends ElementType> = ComponentProps<C>
-    
-    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
-      Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
+        
+    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties |
+      Assign<Omit<ComponentProps<C>, 'color'>, P & { as?: C }>
 
-    type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
+    type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Properties>
     
-    export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
+    ${pattern.description ? `/** ${pattern.description} */` : ""}
+    export declare function ${jsxName}<V extends ElementType = 'div'>(props: ${jsxName}Props<V>): JSX.Element    
     `
   };
 }
@@ -517,7 +514,7 @@ function generateReactJsxFactory(ctx) {
     
     type Element = keyof JSX.IntrinsicElements
 
-    export type HTML${upperName}Props<T extends Element> = Omit<ComponentProps<T>, "color"> & JSXStyleProperties
+    export type HTML${upperName}Props<T extends Element> = Omit<ComponentProps<T>, 'color'> | JSXStyleProperties;
 
     type JSXFactory = {
       [K in Element]: (props: HTML${upperName}Props<K>) => JSX.Element
@@ -672,17 +669,17 @@ function generate2(name, pattern, jsxFactory) {
     `,
     dts: import_outdent11.outdent`
     import { ComponentProps, ElementType, PropsWithChildren } from 'react'
-    import { ${upperName}Options } from '../patterns/${(0, import_shared5.dashCase)(name)}'
+    import { ${upperName}Properties } from '../patterns/${(0, import_shared5.dashCase)(name)}'
     import { JSXStyleProperties, Assign } from '../types'
     
-    type PropsOf<C extends ElementType> = ComponentProps<C>
-    
-    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
-      Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
+    type Polymorphic<C extends ElementType = "div", P = {}> =
+      | JSXStyleProperties
+      | Assign<Omit<ComponentProps<C>, "color">, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Properties>
     
-    export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
+    ${pattern.description ? `/** ${pattern.description} */` : ""}
+    export declare function ${jsxName}<V extends ElementType = 'div'>(props: ${jsxName}Props<V>): JSX.Element    
     `
   };
 }
@@ -705,7 +702,7 @@ function generateSolidJsxFactory(ctx) {
     
     type Element = keyof JSX.IntrinsicElements
     
-    export type HTML${upperName}Props<T extends Element> = Assign<JSX.IntrinsicElements[T], JSXStyleProperties>
+    export type HTML${upperName}Props<T extends Element> = Omit<JSX.IntrinsicElements[T], 'color'> | JSXStyleProperties
 
     type JSXFactory = {
       [K in Element]: (props: HTML${upperName}Props<K>) => JSX.Element
@@ -714,8 +711,8 @@ function generateSolidJsxFactory(ctx) {
     export declare const ${name}: JSXFactory
     `,
     js: import_outdent12.outdent`
-    import { Dynamic } from 'solid-js/web';
-    import { mergeProps, splitProps } from 'solid-js';
+    import { Dynamic } from 'solid-js/web'
+    import { mergeProps, splitProps } from 'solid-js'
     import { allCssProperties } from './is-valid-prop'
     import { css } from '../css'
 
@@ -744,19 +741,19 @@ function generateSolidJsxFactory(ctx) {
     }
     
     function createFactory() {
-      const cache = new Map();
+      const cache = new Map()
     
       return new Proxy(Object.create(null), {
         get(_, el) {
           if (!cache.has(el)) {
-            cache.set(el, styled(el));
+            cache.set(el, styled(el))
           }
-          return cache.get(el);
+          return cache.get(el)
         },
       })
     }
       
-    export const ${name} = createFactory();
+    export const ${name} = createFactory()
     `
   };
 }
@@ -844,18 +841,18 @@ function generate3(name, pattern, jsxFactory) {
     `,
     dts: import_outdent14.outdent`
     import { ComponentProps, JSX } from 'solid-js'
-    import { ${upperName}Options } from '../patterns/${(0, import_shared7.dashCase)(name)}'
+    import { ${upperName}Properties } from '../patterns/${(0, import_shared7.dashCase)(name)}'
     import { Assign, JSXStyleProperties } from '../types'
     
     type ElementType = keyof JSX.IntrinsicElements
-    type PropsOf<C extends ElementType> = ComponentProps<C>
     
-    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
-      Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
+    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties |
+      Assign<Omit<ComponentProps<C>, 'color'>, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Properties>
     
-    export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
+    ${pattern.description ? `/** ${pattern.description} */` : ""}
+    export declare function ${jsxName}<V extends ElementType = 'div'>(props: ${jsxName}Props<V>): JSX.Element    
     `
   };
 }
@@ -905,7 +902,7 @@ function generate4(name, pattern) {
     import { Properties } from "../types/csstype"
     import { Tokens } from "../types/token"
 
-    export type ${(0, import_shared8.capitalize)(name)}Options = {
+    export type ${(0, import_shared8.capitalize)(name)}Properties = {
        ${Object.keys(properties ?? {}).map((key) => {
       const value = properties[key];
       return (0, import_ts_pattern4.match)(value).with({ type: "property" }, (value2) => {
@@ -923,10 +920,11 @@ function generate4(name, pattern) {
     }).join("\n	")}
     }
 
-    ${strict ? import_outdent15.outdent`export declare function ${name}(options: ${(0, import_shared8.capitalize)(name)}Options): string` : import_outdent15.outdent`
+    ${strict ? import_outdent15.outdent`export declare function ${name}(options: ${(0, import_shared8.capitalize)(name)}Properties): string` : import_outdent15.outdent`
         type Merge<T> = Omit<SystemStyleObject, keyof T> & T
+
         ${description ? `/** ${description} */` : ""}
-        export declare function ${name}(options: Merge<${(0, import_shared8.capitalize)(name)}Options>): string
+        export declare function ${name}(options: Merge<${(0, import_shared8.capitalize)(name)}Properties>): string
         `}
 
    `,

package/dist/index.mjs

@@ -278,10 +278,9 @@ function generatePreactJsxFactory(ctx) {
     import type { JSXStyleProperties } from '../types'
     
     type Element = keyof JSX.IntrinsicElements
-
-    type Merge<P, T> = Omit<P, 'color'> & T;
     
-    export type HTML${upperName}Props<T extends Element> = Merge<ComponentProps<T>, JSXStyleProperties>
+    export type HTML${upperName}Props<T extends Element> = Omit<ComponentProps<T>, 'color'> | JSXStyleProperties
+    
 
     type JSXFactory = {
       [K in Element]: (props: HTML${upperName}Props<K>) => JSX.Element
@@ -290,8 +289,8 @@ function generatePreactJsxFactory(ctx) {
     export declare const ${name}: JSXFactory
     `,
     js: outdent6`
-    import { h } from 'preact';
-    import { forwardRef } from 'preact/compat';
+    import { h } from 'preact'
+    import { forwardRef } from 'preact/compat'
     import { isCssProperty } from './is-valid-prop'
     import { css } from '../css'
     
@@ -326,7 +325,7 @@ function generatePreactJsxFactory(ctx) {
           return cx(atomicClass, elementProps.className)
         }
     
-        return h(Element, { ...elementProps, ref, className: classes() });
+        return h(Element, { ...elementProps, ref, className: classes() })
       })
       
       ${upperName}Component.displayName = \`${name}.\${Dynamic}\`
@@ -346,7 +345,7 @@ function generatePreactJsxFactory(ctx) {
       })
     }
 
-    export const ${name} = createFactory();
+    export const ${name} = createFactory()
     `
   };
 }
@@ -436,20 +435,18 @@ function generate(name, pattern, jsxFactory) {
     `,
     dts: outdent8`
     import { ComponentProps, JSX, ComponentChildren } from 'preact';
-    import { ${upperName}Options } from '../patterns/${dashCase(name)}'
+    import { ${upperName}Properties } from '../patterns/${dashCase(name)}'
     import { JSXStyleProperties, Assign } from '../types'
     
     type ElementType = keyof JSX.IntrinsicElements
-    
-    type PropsWithChildren<T> = T & { children?: ComponentChildren }
-    type PropsOf<C extends ElementType> = ComponentProps<C>
-    
-    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
-      Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
+        
+    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties |
+      Assign<Omit<ComponentProps<C>, 'color'>, P & { as?: C }>
 
-    type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
+    type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Properties>
     
-    export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
+    ${pattern.description ? `/** ${pattern.description} */` : ""}
+    export declare function ${jsxName}<V extends ElementType = 'div'>(props: ${jsxName}Props<V>): JSX.Element    
     `
   };
 }
@@ -472,7 +469,7 @@ function generateReactJsxFactory(ctx) {
     
     type Element = keyof JSX.IntrinsicElements
 
-    export type HTML${upperName}Props<T extends Element> = Omit<ComponentProps<T>, "color"> & JSXStyleProperties
+    export type HTML${upperName}Props<T extends Element> = Omit<ComponentProps<T>, 'color'> | JSXStyleProperties;
 
     type JSXFactory = {
       [K in Element]: (props: HTML${upperName}Props<K>) => JSX.Element
@@ -627,17 +624,17 @@ function generate2(name, pattern, jsxFactory) {
     `,
     dts: outdent11`
     import { ComponentProps, ElementType, PropsWithChildren } from 'react'
-    import { ${upperName}Options } from '../patterns/${dashCase2(name)}'
+    import { ${upperName}Properties } from '../patterns/${dashCase2(name)}'
     import { JSXStyleProperties, Assign } from '../types'
     
-    type PropsOf<C extends ElementType> = ComponentProps<C>
-    
-    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
-      Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
+    type Polymorphic<C extends ElementType = "div", P = {}> =
+      | JSXStyleProperties
+      | Assign<Omit<ComponentProps<C>, "color">, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Properties>
     
-    export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
+    ${pattern.description ? `/** ${pattern.description} */` : ""}
+    export declare function ${jsxName}<V extends ElementType = 'div'>(props: ${jsxName}Props<V>): JSX.Element    
     `
   };
 }
@@ -660,7 +657,7 @@ function generateSolidJsxFactory(ctx) {
     
     type Element = keyof JSX.IntrinsicElements
     
-    export type HTML${upperName}Props<T extends Element> = Assign<JSX.IntrinsicElements[T], JSXStyleProperties>
+    export type HTML${upperName}Props<T extends Element> = Omit<JSX.IntrinsicElements[T], 'color'> | JSXStyleProperties
 
     type JSXFactory = {
       [K in Element]: (props: HTML${upperName}Props<K>) => JSX.Element
@@ -669,8 +666,8 @@ function generateSolidJsxFactory(ctx) {
     export declare const ${name}: JSXFactory
     `,
     js: outdent12`
-    import { Dynamic } from 'solid-js/web';
-    import { mergeProps, splitProps } from 'solid-js';
+    import { Dynamic } from 'solid-js/web'
+    import { mergeProps, splitProps } from 'solid-js'
     import { allCssProperties } from './is-valid-prop'
     import { css } from '../css'
 
@@ -699,19 +696,19 @@ function generateSolidJsxFactory(ctx) {
     }
     
     function createFactory() {
-      const cache = new Map();
+      const cache = new Map()
     
       return new Proxy(Object.create(null), {
         get(_, el) {
           if (!cache.has(el)) {
-            cache.set(el, styled(el));
+            cache.set(el, styled(el))
           }
-          return cache.get(el);
+          return cache.get(el)
         },
       })
     }
       
-    export const ${name} = createFactory();
+    export const ${name} = createFactory()
     `
   };
 }
@@ -799,18 +796,18 @@ function generate3(name, pattern, jsxFactory) {
     `,
     dts: outdent14`
     import { ComponentProps, JSX } from 'solid-js'
-    import { ${upperName}Options } from '../patterns/${dashCase3(name)}'
+    import { ${upperName}Properties } from '../patterns/${dashCase3(name)}'
     import { Assign, JSXStyleProperties } from '../types'
     
     type ElementType = keyof JSX.IntrinsicElements
-    type PropsOf<C extends ElementType> = ComponentProps<C>
     
-    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties &
-      Assign<Omit<PropsOf<C>, 'color'>, P & { as?: C }>
+    type Polymorphic<C extends ElementType = 'div', P = {}> = JSXStyleProperties |
+      Assign<Omit<ComponentProps<C>, 'color'>, P & { as?: C }>
 
-    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Options>
+    export type ${jsxName}Props<C extends ElementType = 'div'> = Polymorphic<C, ${upperName}Properties>
     
-    export declare function ${jsxName}<V extends ElementType>(props: ${jsxName}Props<V>): JSX.Element    
+    ${pattern.description ? `/** ${pattern.description} */` : ""}
+    export declare function ${jsxName}<V extends ElementType = 'div'>(props: ${jsxName}Props<V>): JSX.Element    
     `
   };
 }
@@ -860,7 +857,7 @@ function generate4(name, pattern) {
     import { Properties } from "../types/csstype"
     import { Tokens } from "../types/token"
 
-    export type ${capitalize7(name)}Options = {
+    export type ${capitalize7(name)}Properties = {
        ${Object.keys(properties ?? {}).map((key) => {
       const value = properties[key];
       return match4(value).with({ type: "property" }, (value2) => {
@@ -878,10 +875,11 @@ function generate4(name, pattern) {
     }).join("\n	")}
     }
 
-    ${strict ? outdent15`export declare function ${name}(options: ${capitalize7(name)}Options): string` : outdent15`
+    ${strict ? outdent15`export declare function ${name}(options: ${capitalize7(name)}Properties): string` : outdent15`
         type Merge<T> = Omit<SystemStyleObject, keyof T> & T
+
         ${description ? `/** ${description} */` : ""}
-        export declare function ${name}(options: Merge<${capitalize7(name)}Options>): string
+        export declare function ${name}(options: Merge<${capitalize7(name)}Properties>): string
         `}
 
    `,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/node",
-  "version": "0.0.0-dev-20221128063601",
+  "version": "0.0.0-dev-20221128100346",
   "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-20221128063601",
-    "@pandacss/is-valid-prop": "0.0.0-dev-20221128063601",
-    "@pandacss/error": "0.0.0-dev-20221128063601",
-    "@pandacss/parser": "0.0.0-dev-20221128063601",
-    "@pandacss/shared": "0.0.0-dev-20221128063601",
-    "@pandacss/token-dictionary": "0.0.0-dev-20221128063601",
-    "@pandacss/logger": "0.0.0-dev-20221128063601",
-    "@pandacss/core": "0.0.0-dev-20221128063601",
-    "@pandacss/config": "0.0.0-dev-20221128063601"
+    "@pandacss/types": "0.0.0-dev-20221128100346",
+    "@pandacss/is-valid-prop": "0.0.0-dev-20221128100346",
+    "@pandacss/error": "0.0.0-dev-20221128100346",
+    "@pandacss/parser": "0.0.0-dev-20221128100346",
+    "@pandacss/shared": "0.0.0-dev-20221128100346",
+    "@pandacss/token-dictionary": "0.0.0-dev-20221128100346",
+    "@pandacss/logger": "0.0.0-dev-20221128100346",
+    "@pandacss/core": "0.0.0-dev-20221128100346",
+    "@pandacss/config": "0.0.0-dev-20221128100346"
   },
   "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-20221128063601"
+    "@pandacss/fixture": "0.0.0-dev-20221128100346"
   },
   "scripts": {
     "build": "tsup src/index.ts --format=cjs,esm --shims --dts",