@pyck/styled-system 0.6.1 → 0.7.0

package/dist/recipes/avatar.d.ts

@@ -6,7 +6,7 @@ interface AvatarVariant {
   /**
  * @default "md"
  */
-size: "full" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl"
+size: "full" | "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl"
 /**
  * @default "subtle"
  */

package/dist/recipes/avatar.mjs

@@ -45,6 +45,7 @@ export const avatar = /* @__PURE__ */ Object.assign(avatarFn, {
   variantMap: {
   "size": [
     "full",
+    "3xs",
     "2xs",
     "xs",
     "sm",

package/dist/recipes/button.d.ts

@@ -6,7 +6,7 @@ interface ButtonVariant {
   /**
  * @default "solid"
  */
-variant: "solid" | "surface" | "subtle" | "outline" | "plain"
+variant: "solid" | "surface" | "subtle" | "outline" | "plain" | "link"
 /**
  * @default "md"
  */

package/dist/recipes/button.mjs

@@ -12,7 +12,8 @@ const buttonVariantMap = {
     "surface",
     "subtle",
     "outline",
-    "plain"
+    "plain",
+    "link"
   ],
   "size": [
     "2xs",

package/dist/recipes/checkmark.d.ts

@@ -8,9 +8,9 @@ interface CheckmarkVariant {
  */
 size: "xs" | "sm" | "md" | "lg"
 /**
- * @default "surface"
+ * @default "outline"
  */
-variant: "solid" | "surface" | "subtle"
+variant: "solid" | "surface" | "outline" | "subtle"
 }
 
 type CheckmarkVariantMap = {

package/dist/recipes/checkmark.mjs

@@ -2,7 +2,7 @@ import { memo, splitProps } from '../helpers.mjs';
 import { createRecipe, mergeRecipes } from './create-recipe.mjs';
 
 const checkmarkFn = /* @__PURE__ */ createRecipe('checkmark', {
-  "variant": "surface",
+  "variant": "outline",
   "size": "md"
 }, [])
 
@@ -16,6 +16,7 @@ const checkmarkVariantMap = {
   "variant": [
     "solid",
     "surface",
+    "outline",
     "subtle"
   ]
 }

package/dist/recipes/combobox.d.ts

@@ -4,20 +4,16 @@ import type { DistributiveOmit, Pretty } from '../types/system-types';
 
 interface ComboboxVariant {
   /**
- * @default "surface"
- */
-variant: "outline" | "surface" | "plain"
-/**
  * @default "md"
  */
-size: "xs" | "sm" | "md" | "lg" | "xl"
+size: "sm" | "md"
 }
 
 type ComboboxVariantMap = {
   [key in keyof ComboboxVariant]: Array<ComboboxVariant[key]>
 }
 
-type ComboboxSlot = "root" | "clearTrigger" | "content" | "control" | "input" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "label" | "list" | "positioner" | "trigger" | "empty" | "indicatorGroup"
+type ComboboxSlot = "root" | "clearTrigger" | "content" | "control" | "input" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "label" | "list" | "positioner" | "trigger" | "empty"
 
 export type ComboboxVariantProps = {
   [key in keyof ComboboxVariant]?: ConditionalValue<ComboboxVariant[key]> | undefined

package/dist/recipes/combobox.mjs

@@ -2,8 +2,7 @@ import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.mj
 import { createRecipe } from './create-recipe.mjs';
 
 const comboboxDefaultVariants = {
-  "size": "md",
-  "variant": "surface"
+  "size": "md"
 }
 const comboboxCompoundVariants = []
 
@@ -67,10 +66,6 @@ const comboboxSlotNames = [
   [
     "empty",
     "combobox__empty"
-  ],
-  [
-    "indicatorGroup",
-    "combobox__indicatorGroup"
   ]
 ]
 const comboboxSlotFns = /* @__PURE__ */ comboboxSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, comboboxDefaultVariants, getSlotCompoundVariant(comboboxCompoundVariants, slotName))])
@@ -80,7 +75,6 @@ const comboboxFn = memo((props = {}) => {
 })
 
 const comboboxVariantKeys = [
-  "variant",
   "size"
 ]
 const getVariantProps = (variants) => ({ ...comboboxDefaultVariants, ...compact(variants) })
@@ -92,17 +86,9 @@ export const combobox = /* @__PURE__ */ Object.assign(comboboxFn, {
   classNameMap: {},
   variantKeys: comboboxVariantKeys,
   variantMap: {
-  "variant": [
-    "outline",
-    "surface",
-    "plain"
-  ],
   "size": [
-    "xs",
     "sm",
-    "md",
-    "lg",
-    "xl"
+    "md"
   ]
 },
   splitVariantProps(props) {

package/dist/recipes/index.d.ts

@@ -4,11 +4,11 @@ export * from './absolute-center';
 export * from './badge';
 export * from './button';
 export * from './checkmark';
+export * from './radiomark';
 export * from './dot-separator';
 export * from './form';
 export * from './group';
 export * from './heading';
-export * from './hint-text';
 export * from './icon';
 export * from './input';
 export * from './input-addon';

package/dist/recipes/index.mjs

@@ -3,11 +3,11 @@ export * from './absolute-center.mjs';
 export * from './badge.mjs';
 export * from './button.mjs';
 export * from './checkmark.mjs';
+export * from './radiomark.mjs';
 export * from './dot-separator.mjs';
 export * from './form.mjs';
 export * from './group.mjs';
 export * from './heading.mjs';
-export * from './hint-text.mjs';
 export * from './icon.mjs';
 export * from './input.mjs';
 export * from './input-addon.mjs';

package/dist/recipes/menu.d.ts

@@ -6,14 +6,14 @@ interface MenuVariant {
   /**
  * @default "md"
  */
-size: "xs" | "sm" | "md" | "lg" | "xl"
+size: "md"
 }
 
 type MenuVariantMap = {
   [key in keyof MenuVariant]: Array<MenuVariant[key]>
 }
 
-type MenuSlot = "arrow" | "arrowTip" | "content" | "contextTrigger" | "indicator" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "positioner" | "separator" | "trigger" | "triggerItem"
+type MenuSlot = "arrow" | "arrowTip" | "content" | "contextTrigger" | "indicator" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "positioner" | "separator" | "trigger" | "triggerItem" | "itemCommand"
 
 export type MenuVariantProps = {
   [key in keyof MenuVariant]?: ConditionalValue<MenuVariant[key]> | undefined

package/dist/recipes/menu.mjs

@@ -62,6 +62,10 @@ const menuSlotNames = [
   [
     "triggerItem",
     "menu__triggerItem"
+  ],
+  [
+    "itemCommand",
+    "menu__itemCommand"
   ]
 ]
 const menuSlotFns = /* @__PURE__ */ menuSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, menuDefaultVariants, getSlotCompoundVariant(menuCompoundVariants, slotName))])
@@ -83,11 +87,7 @@ export const menu = /* @__PURE__ */ Object.assign(menuFn, {
   variantKeys: menuVariantKeys,
   variantMap: {
   "size": [
-    "xs",
-    "sm",
-    "md",
-    "lg",
-    "xl"
+    "md"
   ]
 },
   splitVariantProps(props) {

package/dist/recipes/radiomark.d.ts

@@ -0,0 +1,38 @@
+/* eslint-disable */
+import type { ConditionalValue } from '../types/index';
+import type { DistributiveOmit, Pretty } from '../types/system-types';
+
+interface RadiomarkVariant {
+  /**
+ * @default "md"
+ */
+size: "xs" | "sm" | "md" | "lg"
+/**
+ * @default "solid"
+ */
+variant: "solid"
+}
+
+type RadiomarkVariantMap = {
+  [key in keyof RadiomarkVariant]: Array<RadiomarkVariant[key]>
+}
+
+
+
+export type RadiomarkVariantProps = {
+  [key in keyof RadiomarkVariant]?: ConditionalValue<RadiomarkVariant[key]> | undefined
+}
+
+export interface RadiomarkRecipe {
+  
+  __type: RadiomarkVariantProps
+  (props?: RadiomarkVariantProps): string
+  raw: (props?: RadiomarkVariantProps) => RadiomarkVariantProps
+  variantMap: RadiomarkVariantMap
+  variantKeys: Array<keyof RadiomarkVariant>
+  splitVariantProps<Props extends RadiomarkVariantProps>(props: Props): [RadiomarkVariantProps, Pretty<DistributiveOmit<Props, keyof RadiomarkVariantProps>>]
+  getVariantProps: (props?: RadiomarkVariantProps) => RadiomarkVariantProps
+}
+
+
+export declare const radiomark: RadiomarkRecipe

package/dist/recipes/radiomark.mjs

@@ -0,0 +1,37 @@
+import { memo, splitProps } from '../helpers.mjs';
+import { createRecipe, mergeRecipes } from './create-recipe.mjs';
+
+const radiomarkFn = /* @__PURE__ */ createRecipe('radiomark', {
+  "variant": "solid",
+  "size": "md"
+}, [])
+
+const radiomarkVariantMap = {
+  "size": [
+    "xs",
+    "sm",
+    "md",
+    "lg"
+  ],
+  "variant": [
+    "solid"
+  ]
+}
+
+const radiomarkVariantKeys = Object.keys(radiomarkVariantMap)
+
+export const radiomark = /* @__PURE__ */ Object.assign(memo(radiomarkFn.recipeFn), {
+  __recipe__: true,
+  __name__: 'radiomark',
+  __getCompoundVariantCss__: radiomarkFn.__getCompoundVariantCss__,
+  raw: (props) => props,
+  variantKeys: radiomarkVariantKeys,
+  variantMap: radiomarkVariantMap,
+  merge(recipe) {
+    return mergeRecipes(this, recipe)
+  },
+  splitVariantProps(props) {
+    return splitProps(props, radiomarkVariantKeys)
+  },
+  getVariantProps: radiomarkFn.getVariantProps,
+})

package/dist/tokens/index.mjs

@@ -2175,6 +2175,10 @@ const tokens = {
     "value": "var(--colors-teal-solid-bg-hover)",
     "variable": "var(--colors-teal-solid-bg-hover)"
   },
+  "colors.teal.solid.bg.active": {
+    "value": "var(--colors-teal-solid-bg-active)",
+    "variable": "var(--colors-teal-solid-bg-active)"
+  },
   "colors.teal.solid.fg": {
     "value": "var(--colors-teal-solid-fg)",
     "variable": "var(--colors-teal-solid-fg)"
@@ -2351,6 +2355,10 @@ const tokens = {
     "value": "var(--colors-gray-solid-bg-hover)",
     "variable": "var(--colors-gray-solid-bg-hover)"
   },
+  "colors.gray.solid.bg.active": {
+    "value": "var(--colors-gray-solid-bg-active)",
+    "variable": "var(--colors-gray-solid-bg-active)"
+  },
   "colors.gray.solid.fg": {
     "value": "var(--colors-gray-solid-fg)",
     "variable": "var(--colors-gray-solid-fg)"
@@ -2527,6 +2535,10 @@ const tokens = {
     "value": "var(--colors-orange-solid-bg-hover)",
     "variable": "var(--colors-orange-solid-bg-hover)"
   },
+  "colors.orange.solid.bg.active": {
+    "value": "var(--colors-orange-solid-bg-active)",
+    "variable": "var(--colors-orange-solid-bg-active)"
+  },
   "colors.orange.solid.fg": {
     "value": "var(--colors-orange-solid-fg)",
     "variable": "var(--colors-orange-solid-fg)"
@@ -2699,6 +2711,10 @@ const tokens = {
     "value": "var(--colors-red-solid-bg-hover)",
     "variable": "var(--colors-red-solid-bg-hover)"
   },
+  "colors.red.solid.bg.active": {
+    "value": "var(--colors-red-solid-bg-active)",
+    "variable": "var(--colors-red-solid-bg-active)"
+  },
   "colors.red.solid.fg": {
     "value": "var(--colors-red-solid-fg)",
     "variable": "var(--colors-red-solid-fg)"
@@ -2871,6 +2887,10 @@ const tokens = {
     "value": "var(--colors-blue-solid-bg-hover)",
     "variable": "var(--colors-blue-solid-bg-hover)"
   },
+  "colors.blue.solid.bg.active": {
+    "value": "var(--colors-blue-solid-bg-active)",
+    "variable": "var(--colors-blue-solid-bg-active)"
+  },
   "colors.blue.solid.fg": {
     "value": "var(--colors-blue-solid-fg)",
     "variable": "var(--colors-blue-solid-fg)"
@@ -3047,6 +3067,10 @@ const tokens = {
     "value": "var(--colors-purple-solid-bg-hover)",
     "variable": "var(--colors-purple-solid-bg-hover)"
   },
+  "colors.purple.solid.bg.active": {
+    "value": "var(--colors-purple-solid-bg-active)",
+    "variable": "var(--colors-purple-solid-bg-active)"
+  },
   "colors.purple.solid.fg": {
     "value": "var(--colors-purple-solid-fg)",
     "variable": "var(--colors-purple-solid-fg)"
@@ -3311,6 +3335,18 @@ const tokens = {
     "value": "var(--colors-color-palette-hover)",
     "variable": "var(--colors-color-palette-hover)"
   },
+  "colors.colorPalette.solid.bg.active": {
+    "value": "var(--colors-color-palette-solid-bg-active)",
+    "variable": "var(--colors-color-palette-solid-bg-active)"
+  },
+  "colors.colorPalette.bg.active": {
+    "value": "var(--colors-color-palette-bg-active)",
+    "variable": "var(--colors-color-palette-bg-active)"
+  },
+  "colors.colorPalette.active": {
+    "value": "var(--colors-color-palette-active)",
+    "variable": "var(--colors-color-palette-active)"
+  },
   "colors.colorPalette.solid.fg": {
     "value": "var(--colors-color-palette-solid-fg)",
     "variable": "var(--colors-color-palette-solid-fg)"
@@ -3331,14 +3367,6 @@ const tokens = {
     "value": "var(--colors-color-palette-subtle-bg-active)",
     "variable": "var(--colors-color-palette-subtle-bg-active)"
   },
-  "colors.colorPalette.bg.active": {
-    "value": "var(--colors-color-palette-bg-active)",
-    "variable": "var(--colors-color-palette-bg-active)"
-  },
-  "colors.colorPalette.active": {
-    "value": "var(--colors-color-palette-active)",
-    "variable": "var(--colors-color-palette-active)"
-  },
   "colors.colorPalette.subtle.fg": {
     "value": "var(--colors-color-palette-subtle-fg)",
     "variable": "var(--colors-color-palette-subtle-fg)"

package/dist/tokens/tokens.d.ts

@@ -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" | "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" | "blue.1" | "blue.2" | "blue.3" | "blue.4" | "blue.5" | "blue.6" | "blue.7" | "blue.8" | "blue.9" | "blue.10" | "blue.11" | "blue.12" | "blue.a1" | "blue.a2" | "blue.a3" | "blue.a4" | "blue.a5" | "blue.a6" | "blue.a7" | "blue.a8" | "blue.a9" | "blue.a10" | "blue.a11" | "blue.a12" | "blue.solid.bg" | "blue.solid.bg.hover" | "blue.solid.fg" | "blue.subtle.bg" | "blue.subtle.bg.hover" | "blue.subtle.bg.active" | "blue.subtle.fg" | "blue.surface.bg" | "blue.surface.bg.active" | "blue.surface.border" | "blue.surface.border.hover" | "blue.surface.fg" | "blue.outline.bg.hover" | "blue.outline.bg.active" | "blue.outline.border" | "blue.outline.fg" | "blue.plain.bg.hover" | "blue.plain.bg.active" | "blue.plain.fg" | "blue.plain.fg.hover" | "purple.1" | "purple.2" | "purple.3" | "purple.4" | "purple.5" | "purple.6" | "purple.7" | "purple.8" | "purple.9" | "purple.10" | "purple.11" | "purple.12" | "purple.a1" | "purple.a2" | "purple.a3" | "purple.a4" | "purple.a5" | "purple.a6" | "purple.a7" | "purple.a8" | "purple.a9" | "purple.a10" | "purple.a11" | "purple.a12" | "purple.solid.bg" | "purple.solid.bg.hover" | "purple.solid.fg" | "purple.subtle.bg" | "purple.subtle.bg.hover" | "purple.subtle.bg.active" | "purple.subtle.fg" | "purple.surface.bg" | "purple.surface.bg.active" | "purple.surface.border" | "purple.surface.border.hover" | "purple.surface.fg" | "purple.outline.bg.hover" | "purple.outline.bg.active" | "purple.outline.border" | "purple.outline.fg" | "purple.plain.bg.hover" | "purple.plain.bg.active" | "purple.plain.fg" | "purple.plain.fg.hover" | "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 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.bg.active" | "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.bg.active" | "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.bg.active" | "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.bg.active" | "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" | "blue.1" | "blue.2" | "blue.3" | "blue.4" | "blue.5" | "blue.6" | "blue.7" | "blue.8" | "blue.9" | "blue.10" | "blue.11" | "blue.12" | "blue.a1" | "blue.a2" | "blue.a3" | "blue.a4" | "blue.a5" | "blue.a6" | "blue.a7" | "blue.a8" | "blue.a9" | "blue.a10" | "blue.a11" | "blue.a12" | "blue.solid.bg" | "blue.solid.bg.hover" | "blue.solid.bg.active" | "blue.solid.fg" | "blue.subtle.bg" | "blue.subtle.bg.hover" | "blue.subtle.bg.active" | "blue.subtle.fg" | "blue.surface.bg" | "blue.surface.bg.active" | "blue.surface.border" | "blue.surface.border.hover" | "blue.surface.fg" | "blue.outline.bg.hover" | "blue.outline.bg.active" | "blue.outline.border" | "blue.outline.fg" | "blue.plain.bg.hover" | "blue.plain.bg.active" | "blue.plain.fg" | "blue.plain.fg.hover" | "purple.1" | "purple.2" | "purple.3" | "purple.4" | "purple.5" | "purple.6" | "purple.7" | "purple.8" | "purple.9" | "purple.10" | "purple.11" | "purple.12" | "purple.a1" | "purple.a2" | "purple.a3" | "purple.a4" | "purple.a5" | "purple.a6" | "purple.a7" | "purple.a8" | "purple.a9" | "purple.a10" | "purple.a11" | "purple.a12" | "purple.solid.bg" | "purple.solid.bg.hover" | "purple.solid.bg.active" | "purple.solid.fg" | "purple.subtle.bg" | "purple.subtle.bg.hover" | "purple.subtle.bg.active" | "purple.subtle.fg" | "purple.surface.bg" | "purple.surface.bg.active" | "purple.surface.border" | "purple.surface.border.hover" | "purple.surface.fg" | "purple.outline.bg.hover" | "purple.outline.bg.active" | "purple.outline.border" | "purple.outline.fg" | "purple.plain.bg.hover" | "purple.plain.bg.active" | "purple.plain.fg" | "purple.plain.fg.hover" | "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.bg.active" | "colorPalette.bg.active" | "colorPalette.active" | "colorPalette.solid.fg" | "colorPalette.fg" | "colorPalette.subtle.bg" | "colorPalette.subtle.bg.hover" | "colorPalette.subtle.bg.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/conditions.d.ts

@@ -10,7 +10,7 @@ export interface Conditions {
 	"_focusWithin": string
 	/** `&:is(:focus-visible, [data-focus-visible])` */
 	"_focusVisible": string
-	/** `&:is(:disabled, [disabled], [data-disabled], [aria-disabled=true])` */
+	/** `&:is(:disabled, [data-disabled], [aria-disabled=true]):not([data-loading])` */
 	"_disabled": string
 	/** `&:not(:disabled):active` */
 	"_active": string

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

@@ -206,7 +206,7 @@ export interface UtilityValues {
 	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" | "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" | "blue.solid.bg" | "blue.solid" | "blue.solid.fg" | "blue.subtle.bg" | "blue.subtle" | "blue.subtle.fg" | "blue.surface.bg" | "blue.surface" | "blue.surface.border" | "blue.surface.fg" | "blue.outline" | "blue.outline.bg" | "blue.outline.border" | "blue.outline.fg" | "blue.plain" | "blue.plain.bg" | "blue.plain.fg" | "purple.solid.bg" | "purple.solid" | "purple.solid.fg" | "purple.subtle.bg" | "purple.subtle" | "purple.subtle.fg" | "purple.surface.bg" | "purple.surface" | "purple.surface.border" | "purple.surface.fg" | "purple.outline" | "purple.outline.bg" | "purple.outline.border" | "purple.outline.fg" | "purple.plain" | "purple.plain.bg" | "purple.plain.fg" | "fg" | "canvas" | "border" | "error";
-	textStyle: "8xl" | "9xl" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "label" | "header";
+	textStyle: "8xl" | "9xl" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "label" | "description";
 	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.6.1",
+  "version": "0.7.0",
   "license": "MIT",
   "homepage": "https://pyck.ai",
   "repository": {

package/dist/recipes/hint-text.d.ts

@@ -1,31 +0,0 @@
-/* eslint-disable */
-import type { ConditionalValue } from '../types/index';
-import type { DistributiveOmit, Pretty } from '../types/system-types';
-
-interface HintTextVariant {
-  
-}
-
-type HintTextVariantMap = {
-  [key in keyof HintTextVariant]: Array<HintTextVariant[key]>
-}
-
-
-
-export type HintTextVariantProps = {
-  [key in keyof HintTextVariant]?: ConditionalValue<HintTextVariant[key]> | undefined
-}
-
-export interface HintTextRecipe {
-  
-  __type: HintTextVariantProps
-  (props?: HintTextVariantProps): string
-  raw: (props?: HintTextVariantProps) => HintTextVariantProps
-  variantMap: HintTextVariantMap
-  variantKeys: Array<keyof HintTextVariant>
-  splitVariantProps<Props extends HintTextVariantProps>(props: Props): [HintTextVariantProps, Pretty<DistributiveOmit<Props, keyof HintTextVariantProps>>]
-  getVariantProps: (props?: HintTextVariantProps) => HintTextVariantProps
-}
-
-
-export declare const hintText: HintTextRecipe

package/dist/recipes/hint-text.mjs

@@ -1,24 +0,0 @@
-import { memo, splitProps } from '../helpers.mjs';
-import { createRecipe, mergeRecipes } from './create-recipe.mjs';
-
-const hintTextFn = /* @__PURE__ */ createRecipe('hint-text', {}, [])
-
-const hintTextVariantMap = {}
-
-const hintTextVariantKeys = Object.keys(hintTextVariantMap)
-
-export const hintText = /* @__PURE__ */ Object.assign(memo(hintTextFn.recipeFn), {
-  __recipe__: true,
-  __name__: 'hintText',
-  __getCompoundVariantCss__: hintTextFn.__getCompoundVariantCss__,
-  raw: (props) => props,
-  variantKeys: hintTextVariantKeys,
-  variantMap: hintTextVariantMap,
-  merge(recipe) {
-    return mergeRecipes(this, recipe)
-  },
-  splitVariantProps(props) {
-    return splitProps(props, hintTextVariantKeys)
-  },
-  getVariantProps: hintTextFn.getVariantProps,
-})