@pyck/styled-system 0.0.17 → 0.1.0

package/dist/patterns/divider.d.ts

@@ -6,7 +6,7 @@ import type { DistributiveOmit } from '../types/system-types';
 import type { Tokens } from '../tokens/index';
 
 export interface DividerProperties {
-   orientation?: "horizontal" | "vertical"
+   orientation?: ConditionalValue<"horizontal" | "vertical">
 	thickness?: ConditionalValue<Tokens["sizes"] | Properties["borderWidth"]>
 	color?: ConditionalValue<Tokens["colors"] | Properties["borderColor"]>
 }

package/dist/patterns/float.d.ts

@@ -9,7 +9,7 @@ export interface FloatProperties {
    offsetX?: ConditionalValue<Tokens["spacing"] | Properties["left"]>
 	offsetY?: ConditionalValue<Tokens["spacing"] | Properties["top"]>
 	offset?: ConditionalValue<Tokens["spacing"] | Properties["top"]>
-	placement?: "bottom-end" | "bottom-start" | "top-end" | "top-start" | "bottom-center" | "top-center" | "middle-center" | "middle-end" | "middle-start"
+	placement?: ConditionalValue<"bottom-end" | "bottom-start" | "top-end" | "top-start" | "bottom-center" | "top-center" | "middle-center" | "middle-end" | "middle-start">
 }
 
 interface FloatStyles extends FloatProperties, DistributiveOmit<SystemStyleObject, keyof FloatProperties > {}

package/dist/recipes/data-list.d.ts

@@ -10,7 +10,7 @@ type DataListVariantMap = {
   [key in keyof DataListVariant]: Array<DataListVariant[key]>
 }
 
-type DataListSlot = "root" | "label" | "list" | "item" | "term" | "value"
+type DataListSlot = "root" | "label" | "list" | "item" | "term" | "value" | "empty"
 
 export type DataListVariantProps = {
   [key in keyof DataListVariant]?: ConditionalValue<DataListVariant[key]> | undefined

package/dist/recipes/data-list.mjs

@@ -28,6 +28,10 @@ const dataListSlotNames = [
   [
     "value",
     "data-list__value"
+  ],
+  [
+    "empty",
+    "data-list__empty"
   ]
 ]
 const dataListSlotFns = /* @__PURE__ */ dataListSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, dataListDefaultVariants, getSlotCompoundVariant(dataListCompoundVariants, slotName))])

package/dist/recipes/file-upload.d.ts

@@ -0,0 +1,31 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface FileUploadVariant {
+  
+}
+
+type FileUploadVariantMap = {
+  [key in keyof FileUploadVariant]: Array<FileUploadVariant[key]>
+}
+
+type FileUploadSlot = "root" | "dropzone" | "item" | "itemDeleteTrigger" | "itemGroup" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "label" | "trigger" | "clearTrigger"
+
+export type FileUploadVariantProps = {
+  [key in keyof FileUploadVariant]?: ConditionalValue<FileUploadVariant[key]> | undefined
+}
+
+export interface FileUploadRecipe {
+  __slot: FileUploadSlot
+  __type: FileUploadVariantProps
+  (props?: FileUploadVariantProps): Pretty<Record<FileUploadSlot, string>>
+  raw: (props?: FileUploadVariantProps) => FileUploadVariantProps
+  variantMap: FileUploadVariantMap
+  variantKeys: Array<keyof FileUploadVariant>
+  splitVariantProps<Props extends FileUploadVariantProps>(props: Props): [FileUploadVariantProps, Pretty<DistributiveOmit<Props, keyof FileUploadVariantProps>>]
+  getVariantProps: (props?: FileUploadVariantProps) => FileUploadVariantProps
+}
+
+
+export declare const fileUpload: FileUploadRecipe

package/dist/recipes/file-upload.mjs

@@ -0,0 +1,77 @@
+import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mjs';
+import { createRecipe } from './create-recipe.mjs';
+
+const fileUploadDefaultVariants = {}
+const fileUploadCompoundVariants = []
+
+const fileUploadSlotNames = [
+  [
+    "root",
+    "fileUpload__root"
+  ],
+  [
+    "dropzone",
+    "fileUpload__dropzone"
+  ],
+  [
+    "item",
+    "fileUpload__item"
+  ],
+  [
+    "itemDeleteTrigger",
+    "fileUpload__itemDeleteTrigger"
+  ],
+  [
+    "itemGroup",
+    "fileUpload__itemGroup"
+  ],
+  [
+    "itemName",
+    "fileUpload__itemName"
+  ],
+  [
+    "itemPreview",
+    "fileUpload__itemPreview"
+  ],
+  [
+    "itemPreviewImage",
+    "fileUpload__itemPreviewImage"
+  ],
+  [
+    "itemSizeText",
+    "fileUpload__itemSizeText"
+  ],
+  [
+    "label",
+    "fileUpload__label"
+  ],
+  [
+    "trigger",
+    "fileUpload__trigger"
+  ],
+  [
+    "clearTrigger",
+    "fileUpload__clearTrigger"
+  ]
+]
+const fileUploadSlotFns = /* @__PURE__ */ fileUploadSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, fileUploadDefaultVariants, getSlotCompoundVariant(fileUploadCompoundVariants, slotName))])
+
+const fileUploadFn = memo((props = {}) => {
+  return Object.fromEntries(fileUploadSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]))
+})
+
+const fileUploadVariantKeys = []
+const getVariantProps = (variants) => ({ ...fileUploadDefaultVariants, ...compact(variants) })
+
+export const fileUpload = /* @__PURE__ */ Object.assign(fileUploadFn, {
+  __recipe__: false,
+  __name__: 'fileUpload',
+  raw: (props) => props,
+  classNameMap: {},
+  variantKeys: fileUploadVariantKeys,
+  variantMap: {},
+  splitVariantProps(props) {
+    return splitProps(props, fileUploadVariantKeys)
+  },
+  getVariantProps
+})

package/dist/recipes/index.d.ts

@@ -1,4 +1,5 @@
 /* eslint-disable */
+export * from './prose';
 export * from './absolute-center';
 export * from './badge';
 export * from './button';
@@ -34,6 +35,7 @@ export * from './drawer';
 export * from './drilldown-menu';
 export * from './field';
 export * from './fieldset';
+export * from './file-upload';
 export * from './floating-panel';
 export * from './input-group';
 export * from './menu';

package/dist/recipes/index.mjs

@@ -1,3 +1,4 @@
+export * from './prose.mjs';
 export * from './absolute-center.mjs';
 export * from './badge.mjs';
 export * from './button.mjs';
@@ -33,6 +34,7 @@ export * from './drawer.mjs';
 export * from './drilldown-menu.mjs';
 export * from './field.mjs';
 export * from './fieldset.mjs';
+export * from './file-upload.mjs';
 export * from './floating-panel.mjs';
 export * from './input-group.mjs';
 export * from './menu.mjs';

package/dist/recipes/prose.d.ts

@@ -0,0 +1,36 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface ProseVariant {
+  /**
+ * @default "base"
+ */
+size: "sm" | "base" | "lg" | "xl" | "2xl"
+}
+
+type ProseVariantMap = {
+  [key in keyof ProseVariant]: Array<ProseVariant[key]>
+}
+
+
+
+export type ProseVariantProps = {
+  [key in keyof ProseVariant]?: ConditionalValue<ProseVariant[key]> | undefined
+}
+
+export interface ProseRecipe {
+  
+  __type: ProseVariantProps
+  (props?: ProseVariantProps): string
+  raw: (props?: ProseVariantProps) => ProseVariantProps
+  variantMap: ProseVariantMap
+  variantKeys: Array<keyof ProseVariant>
+  splitVariantProps<Props extends ProseVariantProps>(props: Props): [ProseVariantProps, Pretty<DistributiveOmit<Props, keyof ProseVariantProps>>]
+  getVariantProps: (props?: ProseVariantProps) => ProseVariantProps
+}
+
+/**
+ * Generated using 🐼 pandacss-preset-typography
+ */
+export declare const prose: ProseRecipe

package/dist/recipes/prose.mjs

@@ -0,0 +1,34 @@
+import { memo, splitProps } from '../helpers.mjs';
+import { createRecipe, mergeRecipes } from './create-recipe.mjs';
+
+const proseFn = /* @__PURE__ */ createRecipe('prose', {
+  "size": "base"
+}, [])
+
+const proseVariantMap = {
+  "size": [
+    "sm",
+    "base",
+    "lg",
+    "xl",
+    "2xl"
+  ]
+}
+
+const proseVariantKeys = Object.keys(proseVariantMap)
+
+export const prose = /* @__PURE__ */ Object.assign(memo(proseFn.recipeFn), {
+  __recipe__: true,
+  __name__: 'prose',
+  __getCompoundVariantCss__: proseFn.__getCompoundVariantCss__,
+  raw: (props) => props,
+  variantKeys: proseVariantKeys,
+  variantMap: proseVariantMap,
+  merge(recipe) {
+    return mergeRecipes(this, recipe)
+  },
+  splitVariantProps(props) {
+    return splitProps(props, proseVariantKeys)
+  },
+  getVariantProps: proseFn.getVariantProps,
+})

package/dist/recipes/tabs.d.ts

@@ -18,7 +18,7 @@ type TabsVariantMap = {
   [key in keyof TabsVariant]: Array<TabsVariant[key]>
 }
 
-type TabsSlot = "root" | "list" | "trigger" | "content" | "indicator"
+type TabsSlot = "root" | "list" | "trigger" | "content" | "indicator" | "label"
 
 export type TabsVariantProps = {
   [key in keyof TabsVariant]?: ConditionalValue<TabsVariant[key]> | undefined

package/dist/recipes/tabs.mjs

@@ -27,6 +27,10 @@ const tabsSlotNames = [
   [
     "indicator",
     "tabs__indicator"
+  ],
+  [
+    "label",
+    "tabs__label"
   ]
 ]
 const tabsSlotFns = /* @__PURE__ */ tabsSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, tabsDefaultVariants, getSlotCompoundVariant(tabsCompoundVariants, slotName))])

package/dist/tokens/index.mjs

@@ -1895,6 +1895,30 @@ const tokens = {
     "value": "1536px",
     "variable": "var(--breakpoints-2xl)"
   },
+  "colors.prose.heading": {
+    "value": "var(--colors-fg-default)",
+    "variable": "var(--colors-prose-heading)"
+  },
+  "colors.prose.body": {
+    "value": "var(--colors-fg-muted)",
+    "variable": "var(--colors-prose-body)"
+  },
+  "colors.prose.link": {
+    "value": "var(--colors-fg-default)",
+    "variable": "var(--colors-prose-link)"
+  },
+  "colors.prose.bold": {
+    "value": "var(--colors-fg-default)",
+    "variable": "var(--colors-prose-bold)"
+  },
+  "colors.prose.td-border": {
+    "value": "var(--colors-border)",
+    "variable": "var(--colors-prose-td-border)"
+  },
+  "colors.prose.th-border": {
+    "value": "var(--colors-border)",
+    "variable": "var(--colors-prose-th-border)"
+  },
   "radii.l1": {
     "value": "var(--radii-sm)",
     "variable": "var(--radii-l1)"
@@ -3046,6 +3070,30 @@ const tokens = {
   "colors.colorPalette.subtle": {
     "value": "var(--colors-color-palette-subtle)",
     "variable": "var(--colors-color-palette-subtle)"
+  },
+  "colors.colorPalette.heading": {
+    "value": "var(--colors-color-palette-heading)",
+    "variable": "var(--colors-color-palette-heading)"
+  },
+  "colors.colorPalette.body": {
+    "value": "var(--colors-color-palette-body)",
+    "variable": "var(--colors-color-palette-body)"
+  },
+  "colors.colorPalette.link": {
+    "value": "var(--colors-color-palette-link)",
+    "variable": "var(--colors-color-palette-link)"
+  },
+  "colors.colorPalette.bold": {
+    "value": "var(--colors-color-palette-bold)",
+    "variable": "var(--colors-color-palette-bold)"
+  },
+  "colors.colorPalette.td-border": {
+    "value": "var(--colors-color-palette-td-border)",
+    "variable": "var(--colors-color-palette-td-border)"
+  },
+  "colors.colorPalette.th-border": {
+    "value": "var(--colors-color-palette-th-border)",
+    "variable": "var(--colors-color-palette-th-border)"
   }
 }
 

package/dist/tokens/tokens.d.ts

@@ -1,7 +1,7 @@
 /* eslint-disable */
 export type Token = `aspectRatios.${AspectRatioToken}` | `borders.${BorderToken}` | `radii.${RadiusToken}` | `fontWeights.${FontWeightToken}` | `lineHeights.${LineHeightToken}` | `letterSpacings.${LetterSpacingToken}` | `fontSizes.${FontSizeToken}` | `shadows.${ShadowToken}` | `blurs.${BlurToken}` | `spacing.${SpacingToken}` | `animations.${AnimationToken}` | `colors.${ColorToken}` | `durations.${DurationToken}` | `easings.${EasingToken}` | `zIndex.${ZIndexToken}` | `sizes.${SizeToken}` | `fonts.${FontToken}` | `breakpoints.${BreakpointToken}`
 
-export type ColorPalette = "current" | "transparent" | "rose" | "pink" | "fuchsia" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "emerald" | "green" | "lime" | "yellow" | "amber" | "orange" | "red" | "neutral" | "stone" | "zinc" | "gray" | "slate" | "black" | "white" | "teal.solid.bg" | "teal.solid" | "teal.solid.fg" | "teal.subtle.bg" | "teal.subtle" | "teal.subtle.fg" | "teal.surface.bg" | "teal.surface" | "teal.surface.border" | "teal.surface.fg" | "teal.outline" | "teal.outline.bg" | "teal.outline.border" | "teal.outline.fg" | "teal.plain" | "teal.plain.bg" | "teal.plain.fg" | "gray.solid.bg" | "gray.solid" | "gray.solid.fg" | "gray.subtle.bg" | "gray.subtle" | "gray.subtle.fg" | "gray.surface.bg" | "gray.surface" | "gray.surface.border" | "gray.surface.fg" | "gray.outline" | "gray.outline.bg" | "gray.outline.border" | "gray.outline.fg" | "gray.plain" | "gray.plain.bg" | "gray.plain.fg" | "orange.solid.bg" | "orange.solid" | "orange.solid.fg" | "orange.subtle.bg" | "orange.subtle" | "orange.subtle.fg" | "orange.surface.bg" | "orange.surface" | "orange.surface.border" | "orange.surface.fg" | "orange.outline" | "orange.outline.bg" | "orange.outline.border" | "orange.outline.fg" | "orange.plain" | "orange.plain.bg" | "orange.plain.fg" | "red.solid.bg" | "red.solid" | "red.solid.fg" | "red.subtle.bg" | "red.subtle" | "red.subtle.fg" | "red.surface.bg" | "red.surface" | "red.surface.border" | "red.surface.fg" | "red.outline" | "red.outline.bg" | "red.outline.border" | "red.outline.fg" | "red.plain" | "red.plain.bg" | "red.plain.fg" | "fg" | "canvas" | "border" | "error"
+export type ColorPalette = "current" | "transparent" | "rose" | "pink" | "fuchsia" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "emerald" | "green" | "lime" | "yellow" | "amber" | "orange" | "red" | "neutral" | "stone" | "zinc" | "gray" | "slate" | "black" | "white" | "prose" | "teal.solid.bg" | "teal.solid" | "teal.solid.fg" | "teal.subtle.bg" | "teal.subtle" | "teal.subtle.fg" | "teal.surface.bg" | "teal.surface" | "teal.surface.border" | "teal.surface.fg" | "teal.outline" | "teal.outline.bg" | "teal.outline.border" | "teal.outline.fg" | "teal.plain" | "teal.plain.bg" | "teal.plain.fg" | "gray.solid.bg" | "gray.solid" | "gray.solid.fg" | "gray.subtle.bg" | "gray.subtle" | "gray.subtle.fg" | "gray.surface.bg" | "gray.surface" | "gray.surface.border" | "gray.surface.fg" | "gray.outline" | "gray.outline.bg" | "gray.outline.border" | "gray.outline.fg" | "gray.plain" | "gray.plain.bg" | "gray.plain.fg" | "orange.solid.bg" | "orange.solid" | "orange.solid.fg" | "orange.subtle.bg" | "orange.subtle" | "orange.subtle.fg" | "orange.surface.bg" | "orange.surface" | "orange.surface.border" | "orange.surface.fg" | "orange.outline" | "orange.outline.bg" | "orange.outline.border" | "orange.outline.fg" | "orange.plain" | "orange.plain.bg" | "orange.plain.fg" | "red.solid.bg" | "red.solid" | "red.solid.fg" | "red.subtle.bg" | "red.subtle" | "red.subtle.fg" | "red.surface.bg" | "red.surface" | "red.surface.border" | "red.surface.fg" | "red.outline" | "red.outline.bg" | "red.outline.border" | "red.outline.fg" | "red.plain" | "red.plain.bg" | "red.plain.fg" | "fg" | "canvas" | "border" | "error"
 
 export type AspectRatioToken = "square" | "landscape" | "portrait" | "wide" | "ultrawide" | "golden"
 
@@ -25,7 +25,7 @@ export type SpacingToken = "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" |
 
 export type AnimationToken = "spin" | "ping" | "pulse" | "bounce"
 
-export type ColorToken = "current" | "transparent" | "rose.50" | "rose.100" | "rose.200" | "rose.300" | "rose.400" | "rose.500" | "rose.600" | "rose.700" | "rose.800" | "rose.900" | "rose.950" | "pink.50" | "pink.100" | "pink.200" | "pink.300" | "pink.400" | "pink.500" | "pink.600" | "pink.700" | "pink.800" | "pink.900" | "pink.950" | "fuchsia.50" | "fuchsia.100" | "fuchsia.200" | "fuchsia.300" | "fuchsia.400" | "fuchsia.500" | "fuchsia.600" | "fuchsia.700" | "fuchsia.800" | "fuchsia.900" | "fuchsia.950" | "purple.50" | "purple.100" | "purple.200" | "purple.300" | "purple.400" | "purple.500" | "purple.600" | "purple.700" | "purple.800" | "purple.900" | "purple.950" | "violet.50" | "violet.100" | "violet.200" | "violet.300" | "violet.400" | "violet.500" | "violet.600" | "violet.700" | "violet.800" | "violet.900" | "violet.950" | "indigo.50" | "indigo.100" | "indigo.200" | "indigo.300" | "indigo.400" | "indigo.500" | "indigo.600" | "indigo.700" | "indigo.800" | "indigo.900" | "indigo.950" | "blue.50" | "blue.100" | "blue.200" | "blue.300" | "blue.400" | "blue.500" | "blue.600" | "blue.700" | "blue.800" | "blue.900" | "blue.950" | "sky.50" | "sky.100" | "sky.200" | "sky.300" | "sky.400" | "sky.500" | "sky.600" | "sky.700" | "sky.800" | "sky.900" | "sky.950" | "cyan.50" | "cyan.100" | "cyan.200" | "cyan.300" | "cyan.400" | "cyan.500" | "cyan.600" | "cyan.700" | "cyan.800" | "cyan.900" | "cyan.950" | "teal.50" | "teal.100" | "teal.200" | "teal.300" | "teal.400" | "teal.500" | "teal.600" | "teal.700" | "teal.800" | "teal.900" | "teal.950" | "emerald.50" | "emerald.100" | "emerald.200" | "emerald.300" | "emerald.400" | "emerald.500" | "emerald.600" | "emerald.700" | "emerald.800" | "emerald.900" | "emerald.950" | "green.50" | "green.100" | "green.200" | "green.300" | "green.400" | "green.500" | "green.600" | "green.700" | "green.800" | "green.900" | "green.950" | "lime.50" | "lime.100" | "lime.200" | "lime.300" | "lime.400" | "lime.500" | "lime.600" | "lime.700" | "lime.800" | "lime.900" | "lime.950" | "yellow.50" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.500" | "yellow.600" | "yellow.700" | "yellow.800" | "yellow.900" | "yellow.950" | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | "amber.950" | "orange.50" | "orange.100" | "orange.200" | "orange.300" | "orange.400" | "orange.500" | "orange.600" | "orange.700" | "orange.800" | "orange.900" | "orange.950" | "red.50" | "red.100" | "red.200" | "red.300" | "red.400" | "red.500" | "red.600" | "red.700" | "red.800" | "red.900" | "red.950" | "neutral.50" | "neutral.100" | "neutral.200" | "neutral.300" | "neutral.400" | "neutral.500" | "neutral.600" | "neutral.700" | "neutral.800" | "neutral.900" | "neutral.950" | "stone.50" | "stone.100" | "stone.200" | "stone.300" | "stone.400" | "stone.500" | "stone.600" | "stone.700" | "stone.800" | "stone.900" | "stone.950" | "zinc.50" | "zinc.100" | "zinc.200" | "zinc.300" | "zinc.400" | "zinc.500" | "zinc.600" | "zinc.700" | "zinc.800" | "zinc.900" | "zinc.950" | "gray.50" | "gray.100" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "gray.800" | "gray.900" | "gray.950" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.400" | "slate.500" | "slate.600" | "slate.700" | "slate.800" | "slate.900" | "slate.950" | "black" | "black.a1" | "black.a2" | "black.a3" | "black.a4" | "black.a5" | "black.a6" | "black.a7" | "black.a8" | "black.a9" | "black.a10" | "black.a11" | "black.a12" | "white" | "white.a1" | "white.a2" | "white.a3" | "white.a4" | "white.a5" | "white.a6" | "white.a7" | "white.a8" | "white.a9" | "white.a10" | "white.a11" | "white.a12" | "teal.1" | "teal.2" | "teal.3" | "teal.4" | "teal.5" | "teal.6" | "teal.7" | "teal.8" | "teal.9" | "teal.10" | "teal.11" | "teal.12" | "teal.a1" | "teal.a2" | "teal.a3" | "teal.a4" | "teal.a5" | "teal.a6" | "teal.a7" | "teal.a8" | "teal.a9" | "teal.a10" | "teal.a11" | "teal.a12" | "teal.solid.bg" | "teal.solid.bg.hover" | "teal.solid.fg" | "teal.subtle.bg" | "teal.subtle.bg.hover" | "teal.subtle.bg.active" | "teal.subtle.fg" | "teal.surface.bg" | "teal.surface.bg.active" | "teal.surface.border" | "teal.surface.border.hover" | "teal.surface.fg" | "teal.outline.bg.hover" | "teal.outline.bg.active" | "teal.outline.border" | "teal.outline.fg" | "teal.plain.bg.hover" | "teal.plain.bg.active" | "teal.plain.fg" | "teal.plain.fg.hover" | "gray.1" | "gray.2" | "gray.3" | "gray.4" | "gray.5" | "gray.6" | "gray.7" | "gray.8" | "gray.9" | "gray.10" | "gray.11" | "gray.12" | "gray.a1" | "gray.a2" | "gray.a3" | "gray.a4" | "gray.a5" | "gray.a6" | "gray.a7" | "gray.a8" | "gray.a9" | "gray.a10" | "gray.a11" | "gray.a12" | "gray.solid.bg" | "gray.solid.bg.hover" | "gray.solid.fg" | "gray.subtle.bg" | "gray.subtle.bg.hover" | "gray.subtle.bg.active" | "gray.subtle.fg" | "gray.surface.bg" | "gray.surface.bg.hover" | "gray.surface.bg.active" | "gray.surface.border" | "gray.surface.border.hover" | "gray.surface.fg" | "gray.outline.bg.hover" | "gray.outline.bg.active" | "gray.outline.border" | "gray.outline.fg" | "gray.plain.bg.hover" | "gray.plain.bg.active" | "gray.plain.fg" | "orange.1" | "orange.2" | "orange.3" | "orange.4" | "orange.5" | "orange.6" | "orange.7" | "orange.8" | "orange.9" | "orange.10" | "orange.11" | "orange.12" | "orange.a1" | "orange.a2" | "orange.a3" | "orange.a4" | "orange.a5" | "orange.a6" | "orange.a7" | "orange.a8" | "orange.a9" | "orange.a10" | "orange.a11" | "orange.a12" | "orange.solid.bg" | "orange.solid.bg.hover" | "orange.solid.fg" | "orange.subtle.bg" | "orange.subtle.bg.hover" | "orange.subtle.bg.active" | "orange.subtle.fg" | "orange.surface.bg" | "orange.surface.bg.active" | "orange.surface.border" | "orange.surface.border.hover" | "orange.surface.fg" | "orange.outline.bg.hover" | "orange.outline.bg.active" | "orange.outline.border" | "orange.outline.fg" | "orange.plain.bg.hover" | "orange.plain.bg.active" | "orange.plain.fg" | "red.1" | "red.2" | "red.3" | "red.4" | "red.5" | "red.6" | "red.7" | "red.8" | "red.9" | "red.10" | "red.11" | "red.12" | "red.a1" | "red.a2" | "red.a3" | "red.a4" | "red.a5" | "red.a6" | "red.a7" | "red.a8" | "red.a9" | "red.a10" | "red.a11" | "red.a12" | "red.solid.bg" | "red.solid.bg.hover" | "red.solid.fg" | "red.subtle.bg" | "red.subtle.bg.hover" | "red.subtle.bg.active" | "red.subtle.fg" | "red.surface.bg" | "red.surface.bg.active" | "red.surface.border" | "red.surface.border.hover" | "red.surface.fg" | "red.outline.bg.hover" | "red.outline.bg.active" | "red.outline.border" | "red.outline.fg" | "red.plain.bg.hover" | "red.plain.bg.active" | "red.plain.fg" | "fg.default" | "fg.muted" | "fg.subtle" | "canvas" | "border" | "error" | "colorPalette" | "colorPalette.50" | "colorPalette.100" | "colorPalette.200" | "colorPalette.300" | "colorPalette.400" | "colorPalette.500" | "colorPalette.600" | "colorPalette.700" | "colorPalette.800" | "colorPalette.900" | "colorPalette.950" | "colorPalette.a1" | "colorPalette.a2" | "colorPalette.a3" | "colorPalette.a4" | "colorPalette.a5" | "colorPalette.a6" | "colorPalette.a7" | "colorPalette.a8" | "colorPalette.a9" | "colorPalette.a10" | "colorPalette.a11" | "colorPalette.a12" | "colorPalette.1" | "colorPalette.2" | "colorPalette.3" | "colorPalette.4" | "colorPalette.5" | "colorPalette.6" | "colorPalette.7" | "colorPalette.8" | "colorPalette.9" | "colorPalette.10" | "colorPalette.11" | "colorPalette.12" | "colorPalette.solid.bg" | "colorPalette.bg" | "colorPalette.solid.bg.hover" | "colorPalette.bg.hover" | "colorPalette.hover" | "colorPalette.solid.fg" | "colorPalette.fg" | "colorPalette.subtle.bg" | "colorPalette.subtle.bg.hover" | "colorPalette.subtle.bg.active" | "colorPalette.bg.active" | "colorPalette.active" | "colorPalette.subtle.fg" | "colorPalette.surface.bg" | "colorPalette.surface.bg.active" | "colorPalette.surface.border" | "colorPalette.border" | "colorPalette.surface.border.hover" | "colorPalette.border.hover" | "colorPalette.surface.fg" | "colorPalette.outline.bg.hover" | "colorPalette.outline.bg.active" | "colorPalette.outline.border" | "colorPalette.outline.fg" | "colorPalette.plain.bg.hover" | "colorPalette.plain.bg.active" | "colorPalette.plain.fg" | "colorPalette.plain.fg.hover" | "colorPalette.fg.hover" | "colorPalette.surface.bg.hover" | "colorPalette.default" | "colorPalette.muted" | "colorPalette.subtle"
+export type ColorToken = "current" | "transparent" | "rose.50" | "rose.100" | "rose.200" | "rose.300" | "rose.400" | "rose.500" | "rose.600" | "rose.700" | "rose.800" | "rose.900" | "rose.950" | "pink.50" | "pink.100" | "pink.200" | "pink.300" | "pink.400" | "pink.500" | "pink.600" | "pink.700" | "pink.800" | "pink.900" | "pink.950" | "fuchsia.50" | "fuchsia.100" | "fuchsia.200" | "fuchsia.300" | "fuchsia.400" | "fuchsia.500" | "fuchsia.600" | "fuchsia.700" | "fuchsia.800" | "fuchsia.900" | "fuchsia.950" | "purple.50" | "purple.100" | "purple.200" | "purple.300" | "purple.400" | "purple.500" | "purple.600" | "purple.700" | "purple.800" | "purple.900" | "purple.950" | "violet.50" | "violet.100" | "violet.200" | "violet.300" | "violet.400" | "violet.500" | "violet.600" | "violet.700" | "violet.800" | "violet.900" | "violet.950" | "indigo.50" | "indigo.100" | "indigo.200" | "indigo.300" | "indigo.400" | "indigo.500" | "indigo.600" | "indigo.700" | "indigo.800" | "indigo.900" | "indigo.950" | "blue.50" | "blue.100" | "blue.200" | "blue.300" | "blue.400" | "blue.500" | "blue.600" | "blue.700" | "blue.800" | "blue.900" | "blue.950" | "sky.50" | "sky.100" | "sky.200" | "sky.300" | "sky.400" | "sky.500" | "sky.600" | "sky.700" | "sky.800" | "sky.900" | "sky.950" | "cyan.50" | "cyan.100" | "cyan.200" | "cyan.300" | "cyan.400" | "cyan.500" | "cyan.600" | "cyan.700" | "cyan.800" | "cyan.900" | "cyan.950" | "teal.50" | "teal.100" | "teal.200" | "teal.300" | "teal.400" | "teal.500" | "teal.600" | "teal.700" | "teal.800" | "teal.900" | "teal.950" | "emerald.50" | "emerald.100" | "emerald.200" | "emerald.300" | "emerald.400" | "emerald.500" | "emerald.600" | "emerald.700" | "emerald.800" | "emerald.900" | "emerald.950" | "green.50" | "green.100" | "green.200" | "green.300" | "green.400" | "green.500" | "green.600" | "green.700" | "green.800" | "green.900" | "green.950" | "lime.50" | "lime.100" | "lime.200" | "lime.300" | "lime.400" | "lime.500" | "lime.600" | "lime.700" | "lime.800" | "lime.900" | "lime.950" | "yellow.50" | "yellow.100" | "yellow.200" | "yellow.300" | "yellow.400" | "yellow.500" | "yellow.600" | "yellow.700" | "yellow.800" | "yellow.900" | "yellow.950" | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | "amber.950" | "orange.50" | "orange.100" | "orange.200" | "orange.300" | "orange.400" | "orange.500" | "orange.600" | "orange.700" | "orange.800" | "orange.900" | "orange.950" | "red.50" | "red.100" | "red.200" | "red.300" | "red.400" | "red.500" | "red.600" | "red.700" | "red.800" | "red.900" | "red.950" | "neutral.50" | "neutral.100" | "neutral.200" | "neutral.300" | "neutral.400" | "neutral.500" | "neutral.600" | "neutral.700" | "neutral.800" | "neutral.900" | "neutral.950" | "stone.50" | "stone.100" | "stone.200" | "stone.300" | "stone.400" | "stone.500" | "stone.600" | "stone.700" | "stone.800" | "stone.900" | "stone.950" | "zinc.50" | "zinc.100" | "zinc.200" | "zinc.300" | "zinc.400" | "zinc.500" | "zinc.600" | "zinc.700" | "zinc.800" | "zinc.900" | "zinc.950" | "gray.50" | "gray.100" | "gray.200" | "gray.300" | "gray.400" | "gray.500" | "gray.600" | "gray.700" | "gray.800" | "gray.900" | "gray.950" | "slate.50" | "slate.100" | "slate.200" | "slate.300" | "slate.400" | "slate.500" | "slate.600" | "slate.700" | "slate.800" | "slate.900" | "slate.950" | "black" | "black.a1" | "black.a2" | "black.a3" | "black.a4" | "black.a5" | "black.a6" | "black.a7" | "black.a8" | "black.a9" | "black.a10" | "black.a11" | "black.a12" | "white" | "white.a1" | "white.a2" | "white.a3" | "white.a4" | "white.a5" | "white.a6" | "white.a7" | "white.a8" | "white.a9" | "white.a10" | "white.a11" | "white.a12" | "prose.heading" | "prose.body" | "prose.link" | "prose.bold" | "prose.td-border" | "prose.th-border" | "teal.1" | "teal.2" | "teal.3" | "teal.4" | "teal.5" | "teal.6" | "teal.7" | "teal.8" | "teal.9" | "teal.10" | "teal.11" | "teal.12" | "teal.a1" | "teal.a2" | "teal.a3" | "teal.a4" | "teal.a5" | "teal.a6" | "teal.a7" | "teal.a8" | "teal.a9" | "teal.a10" | "teal.a11" | "teal.a12" | "teal.solid.bg" | "teal.solid.bg.hover" | "teal.solid.fg" | "teal.subtle.bg" | "teal.subtle.bg.hover" | "teal.subtle.bg.active" | "teal.subtle.fg" | "teal.surface.bg" | "teal.surface.bg.active" | "teal.surface.border" | "teal.surface.border.hover" | "teal.surface.fg" | "teal.outline.bg.hover" | "teal.outline.bg.active" | "teal.outline.border" | "teal.outline.fg" | "teal.plain.bg.hover" | "teal.plain.bg.active" | "teal.plain.fg" | "teal.plain.fg.hover" | "gray.1" | "gray.2" | "gray.3" | "gray.4" | "gray.5" | "gray.6" | "gray.7" | "gray.8" | "gray.9" | "gray.10" | "gray.11" | "gray.12" | "gray.a1" | "gray.a2" | "gray.a3" | "gray.a4" | "gray.a5" | "gray.a6" | "gray.a7" | "gray.a8" | "gray.a9" | "gray.a10" | "gray.a11" | "gray.a12" | "gray.solid.bg" | "gray.solid.bg.hover" | "gray.solid.fg" | "gray.subtle.bg" | "gray.subtle.bg.hover" | "gray.subtle.bg.active" | "gray.subtle.fg" | "gray.surface.bg" | "gray.surface.bg.hover" | "gray.surface.bg.active" | "gray.surface.border" | "gray.surface.border.hover" | "gray.surface.fg" | "gray.outline.bg.hover" | "gray.outline.bg.active" | "gray.outline.border" | "gray.outline.fg" | "gray.plain.bg.hover" | "gray.plain.bg.active" | "gray.plain.fg" | "orange.1" | "orange.2" | "orange.3" | "orange.4" | "orange.5" | "orange.6" | "orange.7" | "orange.8" | "orange.9" | "orange.10" | "orange.11" | "orange.12" | "orange.a1" | "orange.a2" | "orange.a3" | "orange.a4" | "orange.a5" | "orange.a6" | "orange.a7" | "orange.a8" | "orange.a9" | "orange.a10" | "orange.a11" | "orange.a12" | "orange.solid.bg" | "orange.solid.bg.hover" | "orange.solid.fg" | "orange.subtle.bg" | "orange.subtle.bg.hover" | "orange.subtle.bg.active" | "orange.subtle.fg" | "orange.surface.bg" | "orange.surface.bg.active" | "orange.surface.border" | "orange.surface.border.hover" | "orange.surface.fg" | "orange.outline.bg.hover" | "orange.outline.bg.active" | "orange.outline.border" | "orange.outline.fg" | "orange.plain.bg.hover" | "orange.plain.bg.active" | "orange.plain.fg" | "red.1" | "red.2" | "red.3" | "red.4" | "red.5" | "red.6" | "red.7" | "red.8" | "red.9" | "red.10" | "red.11" | "red.12" | "red.a1" | "red.a2" | "red.a3" | "red.a4" | "red.a5" | "red.a6" | "red.a7" | "red.a8" | "red.a9" | "red.a10" | "red.a11" | "red.a12" | "red.solid.bg" | "red.solid.bg.hover" | "red.solid.fg" | "red.subtle.bg" | "red.subtle.bg.hover" | "red.subtle.bg.active" | "red.subtle.fg" | "red.surface.bg" | "red.surface.bg.active" | "red.surface.border" | "red.surface.border.hover" | "red.surface.fg" | "red.outline.bg.hover" | "red.outline.bg.active" | "red.outline.border" | "red.outline.fg" | "red.plain.bg.hover" | "red.plain.bg.active" | "red.plain.fg" | "fg.default" | "fg.muted" | "fg.subtle" | "canvas" | "border" | "error" | "colorPalette" | "colorPalette.50" | "colorPalette.100" | "colorPalette.200" | "colorPalette.300" | "colorPalette.400" | "colorPalette.500" | "colorPalette.600" | "colorPalette.700" | "colorPalette.800" | "colorPalette.900" | "colorPalette.950" | "colorPalette.a1" | "colorPalette.a2" | "colorPalette.a3" | "colorPalette.a4" | "colorPalette.a5" | "colorPalette.a6" | "colorPalette.a7" | "colorPalette.a8" | "colorPalette.a9" | "colorPalette.a10" | "colorPalette.a11" | "colorPalette.a12" | "colorPalette.1" | "colorPalette.2" | "colorPalette.3" | "colorPalette.4" | "colorPalette.5" | "colorPalette.6" | "colorPalette.7" | "colorPalette.8" | "colorPalette.9" | "colorPalette.10" | "colorPalette.11" | "colorPalette.12" | "colorPalette.solid.bg" | "colorPalette.bg" | "colorPalette.solid.bg.hover" | "colorPalette.bg.hover" | "colorPalette.hover" | "colorPalette.solid.fg" | "colorPalette.fg" | "colorPalette.subtle.bg" | "colorPalette.subtle.bg.hover" | "colorPalette.subtle.bg.active" | "colorPalette.bg.active" | "colorPalette.active" | "colorPalette.subtle.fg" | "colorPalette.surface.bg" | "colorPalette.surface.bg.active" | "colorPalette.surface.border" | "colorPalette.border" | "colorPalette.surface.border.hover" | "colorPalette.border.hover" | "colorPalette.surface.fg" | "colorPalette.outline.bg.hover" | "colorPalette.outline.bg.active" | "colorPalette.outline.border" | "colorPalette.outline.fg" | "colorPalette.plain.bg.hover" | "colorPalette.plain.bg.active" | "colorPalette.plain.fg" | "colorPalette.plain.fg.hover" | "colorPalette.fg.hover" | "colorPalette.surface.bg.hover" | "colorPalette.default" | "colorPalette.muted" | "colorPalette.subtle" | "colorPalette.heading" | "colorPalette.body" | "colorPalette.link" | "colorPalette.bold" | "colorPalette.td-border" | "colorPalette.th-border"
 
 export type DurationToken = "fastest" | "faster" | "fast" | "normal" | "slow" | "slower" | "slowest"
 

package/dist/types/prop-type.d.ts

@@ -205,7 +205,7 @@ export interface UtilityValues {
 	srOnly: boolean;
 	debug: boolean;
 	containerName: CssProperties["containerName"];
-	colorPalette: "current" | "transparent" | "rose" | "pink" | "fuchsia" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "emerald" | "green" | "lime" | "yellow" | "amber" | "orange" | "red" | "neutral" | "stone" | "zinc" | "gray" | "slate" | "black" | "white" | "teal.solid.bg" | "teal.solid" | "teal.solid.fg" | "teal.subtle.bg" | "teal.subtle" | "teal.subtle.fg" | "teal.surface.bg" | "teal.surface" | "teal.surface.border" | "teal.surface.fg" | "teal.outline" | "teal.outline.bg" | "teal.outline.border" | "teal.outline.fg" | "teal.plain" | "teal.plain.bg" | "teal.plain.fg" | "gray.solid.bg" | "gray.solid" | "gray.solid.fg" | "gray.subtle.bg" | "gray.subtle" | "gray.subtle.fg" | "gray.surface.bg" | "gray.surface" | "gray.surface.border" | "gray.surface.fg" | "gray.outline" | "gray.outline.bg" | "gray.outline.border" | "gray.outline.fg" | "gray.plain" | "gray.plain.bg" | "gray.plain.fg" | "orange.solid.bg" | "orange.solid" | "orange.solid.fg" | "orange.subtle.bg" | "orange.subtle" | "orange.subtle.fg" | "orange.surface.bg" | "orange.surface" | "orange.surface.border" | "orange.surface.fg" | "orange.outline" | "orange.outline.bg" | "orange.outline.border" | "orange.outline.fg" | "orange.plain" | "orange.plain.bg" | "orange.plain.fg" | "red.solid.bg" | "red.solid" | "red.solid.fg" | "red.subtle.bg" | "red.subtle" | "red.subtle.fg" | "red.surface.bg" | "red.surface" | "red.surface.border" | "red.surface.fg" | "red.outline" | "red.outline.bg" | "red.outline.border" | "red.outline.fg" | "red.plain" | "red.plain.bg" | "red.plain.fg" | "fg" | "canvas" | "border" | "error";
+	colorPalette: "current" | "transparent" | "rose" | "pink" | "fuchsia" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "emerald" | "green" | "lime" | "yellow" | "amber" | "orange" | "red" | "neutral" | "stone" | "zinc" | "gray" | "slate" | "black" | "white" | "prose" | "teal.solid.bg" | "teal.solid" | "teal.solid.fg" | "teal.subtle.bg" | "teal.subtle" | "teal.subtle.fg" | "teal.surface.bg" | "teal.surface" | "teal.surface.border" | "teal.surface.fg" | "teal.outline" | "teal.outline.bg" | "teal.outline.border" | "teal.outline.fg" | "teal.plain" | "teal.plain.bg" | "teal.plain.fg" | "gray.solid.bg" | "gray.solid" | "gray.solid.fg" | "gray.subtle.bg" | "gray.subtle" | "gray.subtle.fg" | "gray.surface.bg" | "gray.surface" | "gray.surface.border" | "gray.surface.fg" | "gray.outline" | "gray.outline.bg" | "gray.outline.border" | "gray.outline.fg" | "gray.plain" | "gray.plain.bg" | "gray.plain.fg" | "orange.solid.bg" | "orange.solid" | "orange.solid.fg" | "orange.subtle.bg" | "orange.subtle" | "orange.subtle.fg" | "orange.surface.bg" | "orange.surface" | "orange.surface.border" | "orange.surface.fg" | "orange.outline" | "orange.outline.bg" | "orange.outline.border" | "orange.outline.fg" | "orange.plain" | "orange.plain.bg" | "orange.plain.fg" | "red.solid.bg" | "red.solid" | "red.solid.fg" | "red.subtle.bg" | "red.subtle" | "red.subtle.fg" | "red.surface.bg" | "red.surface" | "red.surface.border" | "red.surface.fg" | "red.outline" | "red.outline.bg" | "red.outline.border" | "red.outline.fg" | "red.plain" | "red.plain.bg" | "red.plain.fg" | "fg" | "canvas" | "border" | "error";
 	textStyle: "8xl" | "9xl" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "label" | "header";
 	layerStyle: "disabled" | "card";
 	animationStyle: "slide-fade-in" | "slide-fade-out" | "scale-fade-in" | "scale-fade-out";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pyck/styled-system",
   "type": "module",
-  "version": "0.0.17",
+  "version": "0.1.0",
   "license": "MIT",
   "homepage": "https://pyck.ai",
   "repository": {
@@ -52,10 +52,10 @@
     }
   },
   "devDependencies": {
-    "@pyck/panda-preset": "0.0.17",
-    "@pandacss/dev": "1.8.2",
-    "@pandacss/preset-base": "1.8.2",
-    "@pandacss/preset-panda": "1.8.2",
+    "@pyck/panda-preset": "1.0.0",
+    "@pandacss/dev": "1.9.0",
+    "@pandacss/preset-base": "1.9.0",
+    "@pandacss/preset-panda": "1.9.0",
     "@types/react": "19.2.10",
     "react": "19.2.4",
     "react-dom": "19.2.4"
@@ -65,7 +65,7 @@
   },
   "peerDependencies": {
     "@pandacss/dev": ">=0.45.0",
-    "@pyck/panda-preset": ">=0.0.17",
+    "@pyck/panda-preset": ">=1.0.0",
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },