@pandacss/studio 0.0.0-dev-20230614113002 → 0.0.0-dev-20230614152938

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pandacss/studio",
-  "version": "0.0.0-dev-20230614113002",
+  "version": "0.0.0-dev-20230614152938",
   "description": "The automated token documentation for Panda CSS",
   "main": "dist/studio.js",
   "module": "dist/studio.mjs",
@@ -32,19 +32,19 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "vite": "4.3.9",
-    "@pandacss/types": "0.0.0-dev-20230614113002",
-    "@pandacss/config": "0.0.0-dev-20230614113002",
-    "@pandacss/shared": "0.0.0-dev-20230614113002",
-    "@pandacss/token-dictionary": "0.0.0-dev-20230614113002",
-    "@pandacss/logger": "0.0.0-dev-20230614113002",
-    "@pandacss/node": "0.0.0-dev-20230614113002"
+    "@pandacss/types": "0.0.0-dev-20230614152938",
+    "@pandacss/config": "0.0.0-dev-20230614152938",
+    "@pandacss/shared": "0.0.0-dev-20230614152938",
+    "@pandacss/token-dictionary": "0.0.0-dev-20230614152938",
+    "@pandacss/logger": "0.0.0-dev-20230614152938",
+    "@pandacss/node": "0.0.0-dev-20230614152938"
   },
   "devDependencies": {
     "@types/react": "18.2.12",
     "@types/react-dom": "18.2.5",
     "@vitejs/plugin-react": "4.0.0",
     "execa": "7.1.1",
-    "@pandacss/dev": "0.0.0-dev-20230614113002"
+    "@pandacss/dev": "0.0.0-dev-20230614152938"
   },
   "scripts": {
     "codegen": "panda",

package/styled-system/css/css.mjs

@@ -158,8 +158,10 @@ const classNameMap = {
   border: 'border',
   borderColor: 'border',
   borderInline: 'border-x',
+  borderInlineWidth: 'border-x',
   borderInlineColor: 'border-x',
   borderBlock: 'border-y',
+  borderBlockWidth: 'border-y',
   borderBlockColor: 'border-y',
   borderLeft: 'border-l',
   borderLeftColor: 'border-l',
@@ -341,8 +343,15 @@ const shorthands = {
   roundedEndEnd: 'borderEndEndRadius',
   roundedEnd: 'borderEndRadius',
   borderX: 'borderInline',
+  borderXWidth: 'borderInlineWidth',
   borderXColor: 'borderInlineColor',
+  borderY: 'borderBlock',
+  borderYWidth: 'borderBlockWidth',
   borderYColor: 'borderBlockColor',
+  borderStart: 'borderInlineStart',
+  borderStartColor: 'borderInlineStartColor',
+  borderEnd: 'borderInlineEnd',
+  borderEndColor: 'borderInlineEndColor',
   shadow: 'boxShadow',
   shadowColor: 'boxShadowColor',
   x: 'translateX',

package/styled-system/jsx/index.d.ts

@@ -8,7 +8,8 @@ export * from './spacer'
 export * from './square'
 export * from './circle'
 export * from './center'
-export * from './absolute-center'
+export * from './link-box'
+export * from './link-overlay'
 export * from './aspect-ratio'
 export * from './grid'
 export * from './grid-item'

package/styled-system/jsx/index.mjs

@@ -8,7 +8,8 @@ export * from './spacer.mjs'
 export * from './square.mjs'
 export * from './circle.mjs'
 export * from './center.mjs'
-export * from './absolute-center.mjs'
+export * from './link-box.mjs'
+export * from './link-overlay.mjs'
 export * from './aspect-ratio.mjs'
 export * from './grid.mjs'
 export * from './grid-item.mjs'

package/styled-system/jsx/is-valid-prop.mjs

@@ -72,8 +72,15 @@ var userGenerated = [
   'roundedEndEnd',
   'roundedEnd',
   'borderX',
+  'borderXWidth',
   'borderXColor',
+  'borderY',
+  'borderYWidth',
   'borderYColor',
+  'borderStart',
+  'borderStartColor',
+  'borderEnd',
+  'borderEndColor',
   'shadow',
   'shadowColor',
   'x',
@@ -234,8 +241,10 @@ var userGenerated = [
   'border',
   'borderColor',
   'borderInline',
+  'borderInlineWidth',
   'borderInlineColor',
   'borderBlock',
+  'borderBlockWidth',
   'borderBlockColor',
   'borderLeft',
   'borderLeftColor',

package/styled-system/jsx/link-box.d.ts

@@ -0,0 +1,8 @@
+import type { FunctionComponent } from 'react'
+import type { LinkBoxProperties } from '../patterns/link-box'
+import type { HTMLPandaProps } from '../types/jsx'
+
+export type LinkBoxProps = LinkBoxProperties & Omit<HTMLPandaProps<'div'>, keyof LinkBoxProperties >
+
+
+export declare const LinkBox: FunctionComponent<LinkBoxProps>

package/styled-system/jsx/link-box.mjs

@@ -0,0 +1,8 @@
+import { createElement, forwardRef } from 'react'
+import { panda } from './factory.mjs'
+import { getLinkBoxStyle } from '../patterns/link-box.mjs'
+
+export const LinkBox = forwardRef(function LinkBox(props, ref) {
+  const styleProps = getLinkBoxStyle()
+  return createElement(panda.div, { ref, ...styleProps, ...props })
+})

package/styled-system/jsx/link-overlay.d.ts

@@ -0,0 +1,8 @@
+import type { FunctionComponent } from 'react'
+import type { LinkOverlayProperties } from '../patterns/link-overlay'
+import type { HTMLPandaProps } from '../types/jsx'
+
+export type LinkOverlayProps = LinkOverlayProperties & Omit<HTMLPandaProps<'a'>, keyof LinkOverlayProperties >
+
+
+export declare const LinkOverlay: FunctionComponent<LinkOverlayProps>

package/styled-system/jsx/link-overlay.mjs

@@ -0,0 +1,8 @@
+import { createElement, forwardRef } from 'react'
+import { panda } from './factory.mjs'
+import { getLinkOverlayStyle } from '../patterns/link-overlay.mjs'
+
+export const LinkOverlay = forwardRef(function LinkOverlay(props, ref) {
+  const styleProps = getLinkOverlayStyle()
+  return createElement(panda.a, { ref, ...styleProps, ...props })
+})

package/styled-system/patterns/index.d.ts

@@ -7,7 +7,8 @@ export * from './spacer'
 export * from './square'
 export * from './circle'
 export * from './center'
-export * from './absolute-center'
+export * from './link-box'
+export * from './link-overlay'
 export * from './aspect-ratio'
 export * from './grid'
 export * from './grid-item'

package/styled-system/patterns/index.mjs

@@ -7,7 +7,8 @@ export * from './spacer.mjs'
 export * from './square.mjs'
 export * from './circle.mjs'
 export * from './center.mjs'
-export * from './absolute-center.mjs'
+export * from './link-box.mjs'
+export * from './link-overlay.mjs'
 export * from './aspect-ratio.mjs'
 export * from './grid.mjs'
 export * from './grid-item.mjs'

package/styled-system/patterns/link-box.d.ts

@@ -0,0 +1,14 @@
+import type { SystemStyleObject, ConditionalValue } from '../types'
+import type { PropertyValue } from '../types/prop-type'
+import type { Properties } from '../types/csstype'
+import type { Tokens } from '../tokens'
+
+export type LinkBoxProperties = {
+   
+}
+
+
+type LinkBoxOptions = LinkBoxProperties & Omit<SystemStyleObject, keyof LinkBoxProperties >
+
+
+export declare function linkBox(options?: LinkBoxOptions): string

package/styled-system/patterns/link-box.mjs

@@ -0,0 +1,19 @@
+import { mapObject } from '../helpers.mjs'
+import { css } from '../css/index.mjs'
+
+const linkBoxConfig = {
+  transform(props) {
+    return {
+      position: 'relative',
+      '& :where(a, abbr)': {
+        position: 'relative',
+        zIndex: '1',
+      },
+      ...props,
+    }
+  },
+}
+
+export const getLinkBoxStyle = (styles = {}) => linkBoxConfig.transform(styles, { map: mapObject })
+
+export const linkBox = (styles) => css(getLinkBoxStyle(styles))

package/styled-system/patterns/link-overlay.d.ts

@@ -0,0 +1,14 @@
+import type { SystemStyleObject, ConditionalValue } from '../types'
+import type { PropertyValue } from '../types/prop-type'
+import type { Properties } from '../types/csstype'
+import type { Tokens } from '../tokens'
+
+export type LinkOverlayProperties = {
+   
+}
+
+
+type LinkOverlayOptions = LinkOverlayProperties & Omit<SystemStyleObject, keyof LinkOverlayProperties >
+
+
+export declare function linkOverlay(options?: LinkOverlayOptions): string

package/styled-system/patterns/link-overlay.mjs

@@ -0,0 +1,24 @@
+import { mapObject } from '../helpers.mjs'
+import { css } from '../css/index.mjs'
+
+const linkOverlayConfig = {
+  transform(props) {
+    return {
+      position: 'static',
+      _before: {
+        content: '""',
+        display: 'block',
+        position: 'absolute',
+        cursor: 'inherit',
+        inset: '0',
+        zIndex: '0',
+        ...props['_before'],
+      },
+      ...props,
+    }
+  },
+}
+
+export const getLinkOverlayStyle = (styles = {}) => linkOverlayConfig.transform(styles, { map: mapObject })
+
+export const linkOverlay = (styles) => css(getLinkOverlayStyle(styles))

package/styled-system/types/prop-type.d.ts

@@ -115,12 +115,15 @@ type PropertyValueTypes  = {
 	border: Tokens["borders"];
 	borderColor: Tokens["colors"];
 	borderInline: Tokens["borders"];
+	borderInlineWidth: Tokens["borderWidths"];
 	borderInlineColor: Tokens["colors"];
 	borderBlock: Tokens["borders"];
+	borderBlockWidth: Tokens["borderWidths"];
 	borderBlockColor: Tokens["colors"];
 	borderLeft: Tokens["borders"];
 	borderLeftColor: Tokens["colors"];
 	borderInlineStart: Tokens["borders"];
+	borderInlineStartColor: Tokens["colors"];
 	borderRight: Tokens["borders"];
 	borderRightColor: Tokens["colors"];
 	borderInlineEnd: Tokens["borders"];
@@ -275,8 +278,15 @@ type PropertyValueTypes  = {
 	roundedEndEnd: Shorthand<"borderEndEndRadius">;
 	roundedEnd: Shorthand<"borderEndRadius">;
 	borderX: Shorthand<"borderInline">;
+	borderXWidth: Shorthand<"borderInlineWidth">;
 	borderXColor: Shorthand<"borderInlineColor">;
+	borderY: Shorthand<"borderBlock">;
+	borderYWidth: Shorthand<"borderBlockWidth">;
 	borderYColor: Shorthand<"borderBlockColor">;
+	borderStart: Shorthand<"borderInlineStart">;
+	borderStartColor: Shorthand<"borderInlineStartColor">;
+	borderEnd: Shorthand<"borderInlineEnd">;
+	borderEndColor: Shorthand<"borderInlineEndColor">;
 	shadow: Shorthand<"boxShadow">;
 	shadowColor: Shorthand<"boxShadowColor">;
 	x: Shorthand<"translateX">;

package/styled-system/types/recipe.d.ts

@@ -6,7 +6,7 @@ type StringToBoolean<T> = T extends 'true' | 'false' ? boolean : T
 
 export type RecipeVariantRecord = Record<any, Record<any, SystemStyleObject>>
 
-export type RecipeSelection<T extends RecipeVariantRecord> = any extends T
+export type RecipeSelection<T extends RecipeVariantRecord> = keyof any extends keyof T
   ? {}
   : {
       [K in keyof T]?: StringToBoolean<keyof T[K]>

package/styled-system/types/style-props.d.ts

@@ -606,8 +606,15 @@ export type SystemProperties = {
 	roundedEndEnd?: PropertyValue<'roundedEndEnd'>
 	roundedEnd?: PropertyValue<'roundedEnd'>
 	borderX?: PropertyValue<'borderX'>
+	borderXWidth?: PropertyValue<'borderXWidth'>
 	borderXColor?: PropertyValue<'borderXColor'>
+	borderY?: PropertyValue<'borderY'>
+	borderYWidth?: PropertyValue<'borderYWidth'>
 	borderYColor?: PropertyValue<'borderYColor'>
+	borderStart?: PropertyValue<'borderStart'>
+	borderStartColor?: PropertyValue<'borderStartColor'>
+	borderEnd?: PropertyValue<'borderEnd'>
+	borderEndColor?: PropertyValue<'borderEndColor'>
 	shadow?: PropertyValue<'shadow'>
 	shadowColor?: PropertyValue<'shadowColor'>
 	x?: PropertyValue<'x'>