@plumile/ui 0.1.144 → 0.1.145

package/lib/esm/theme/sprinkles.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"sprinkles.css.js","names":[],"sources":["../../../src/theme/sprinkles.css.ts"],"sourcesContent":["import { defineProperties, createSprinkles } from '@vanilla-extract/sprinkles';\nimport { vars } from './themeContract.css.js';\nimport { screens, spacing } from './common.js';\n\nconst NONE = 'none' as const;\nconst FLEX_START = 'flex-start' as const;\nconst FLEX_END = 'flex-end' as const;\nconst CENTER = 'center' as const;\nconst STRETCH = 'stretch' as const;\nconst BASELINE = 'baseline' as const;\n\nconst otherProperties = defineProperties({\n  properties: {\n    all: ['inherit', 'initial', 'revert', 'revert-layer', 'unset'],\n    appearance: ['auto', 'none'],\n    cursor: [\n      'alias',\n      'all-scroll',\n      'auto',\n      'cell',\n      'col-resize',\n      'context-menu',\n      'copy',\n      'crosshair',\n      'default',\n      'e-resize',\n      'ew-resize',\n      'grab',\n      'grabbing',\n      'help',\n      'move',\n      'n-resize',\n      'ne-resize',\n      'nesw-resize',\n      'no-drop',\n      'none',\n      'not-allowed',\n      'ns-resize',\n      'nw-resize',\n      'nwse-resize',\n      'pointer',\n      'progress',\n      'row-resize',\n      's-resize',\n      'se-resize',\n      'sw-resize',\n      'text',\n      'vertical-text',\n      'w-resize',\n      'wait',\n      'zoom-in',\n      'zoom-out',\n    ],\n    animation: vars.animation,\n    arrows: {\n      hidden: {\n        WebkitAppearance: 'none',\n        MozAppearance: 'textfield',\n        '&::-webkit-inner-spin-button, &::-webkit-outer-spin-button': {\n          WebkitAppearance: 'none',\n          margin: 0,\n        },\n      },\n    },\n    backgroundSize: {\n      auto: 'auto',\n      contain: 'contain',\n      cover: 'cover',\n      skeleton: '300% 100%',\n    },\n    border: {\n      none: 'none',\n      spinner: `${vars.borderWidth[2]} solid ${vars.colors.borderSubtle}`,\n    },\n    clip: {\n      hidden: 'rect(0 0 0 0)',\n    },\n    containerType: ['inline-size', 'normal', 'size'],\n    fontStyle: ['normal', 'italic'],\n    font: ['inherit'],\n    filter: {\n      none: 'none',\n      brightness90: 'brightness(0.9)',\n      brightness97: 'brightness(0.97)',\n      brightness98: 'brightness(0.98)',\n    },\n    objectPosition: vars.objectPosition,\n    objectFit: ['contain', 'cover', 'fill', 'none', 'scale-down'],\n    order: vars.order,\n    placeHolder: {\n      italic: {\n        '::placeholder': {\n          fontStyle: 'italic',\n          // color: vars.colors['slate-400'],\n          fontWeight: vars.fontWeight.light,\n        },\n      },\n    },\n\n    pointerEvents: ['none', 'auto'],\n    msOverflowStyle: ['auto', 'none'],\n    rotate: vars.rotate,\n    scrollBar: {\n      light: {\n        '&::-webkit-scrollbar': {\n          background: 'transparent',\n          width: spacing[1.5],\n        },\n        '&::-webkit-scrollbar-thumb': {\n          background: 'white',\n          borderRadius: spacing[1.5],\n        },\n      },\n      hidden: {\n        '&::-webkit-scrollbar': {\n          WebkitAppearance: 'none',\n          display: 'none',\n        },\n        MsOverflowStyle: 'none',\n        scrollbarWidth: 'none',\n      },\n    },\n    scrollbarColor: {\n      auto: 'auto',\n      border: `${vars.colors.border} transparent`,\n      borderLight: `${vars.colors.borderLight} transparent`,\n    },\n    scrollbarWidth: ['auto', 'none', 'thin'],\n    skew: vars.skew,\n    textDecoration: ['none', 'line-through', 'underline'],\n    textDecorationThickness: vars.textDecorationThickness,\n    textIndent: vars.spacing,\n    textTransform: ['uppercase', 'lowercase', 'capitalize'],\n    textUnderlineOffset: vars.textUnderlineOffset,\n    transform: vars.transform,\n    transformOrigin: {\n      topLeft: 'top left',\n    },\n    transitionDelay: vars.transitionDelay,\n    transitionDuration: vars.transitionDuration,\n    transitionProperty: vars.transitionProperty,\n    transitionTimingFunction: vars.transitionTimingFunction,\n    verticalAlign: ['baseline', 'middle', 'sub', 'super', 'top'],\n    willChange: ['background-position', 'transform'],\n    zIndex: vars.zIndex,\n  },\n});\n\nconst responsiveProperties = defineProperties({\n  conditions: {\n    base: {},\n    sm: { '@media': screens.sm },\n    md: { '@media': screens.md },\n    lg: { '@media': screens.lg },\n    xl: { '@media': screens.xl },\n    xxl: { '@media': screens.xxl },\n    max767: { '@media': 'screen and (max-width: 767px)' },\n    min768: { '@media': 'screen and (min-width: 768px)' },\n    tabletOnly: {\n      '@media': 'screen and (min-width: 768px) and (max-width: 1023px)',\n    },\n    max900: { '@media': 'screen and (max-width: 900px)' },\n    max1023: { '@media': 'screen and (max-width: 1023px)' },\n    max1199: { '@media': 'screen and (max-width: 1199px)' },\n    min1200: { '@media': 'screen and (min-width: 1200px)' },\n  },\n  defaultCondition: 'base',\n  properties: {\n    /**\n     * The order of fontSize in this file has an impact on CSS rule priority\n     */\n    fontSize: {\n      '3xs': {\n        fontSize: vars.fontSize['3xs'],\n        lineHeight: vars.lineHeight['3xs'],\n      },\n      '2xs': {\n        fontSize: vars.fontSize['2xs'],\n        lineHeight: vars.lineHeight['2xs'],\n      },\n      xs: {\n        fontSize: vars.fontSize.xs,\n        lineHeight: vars.lineHeight.xs,\n      },\n      sm: {\n        fontSize: vars.fontSize.sm,\n        lineHeight: vars.lineHeight.sm,\n      },\n      base: {\n        fontSize: vars.fontSize.base,\n        lineHeight: vars.lineHeight.base,\n      },\n      lg: {\n        fontSize: vars.fontSize.lg,\n        lineHeight: vars.lineHeight.lg,\n      },\n      xl: {\n        fontSize: vars.fontSize.xl,\n        lineHeight: vars.lineHeight.xl,\n      },\n      '2xl': {\n        fontSize: vars.fontSize['2xl'],\n        lineHeight: vars.lineHeight['2xl'],\n      },\n      '3xl': {\n        fontSize: vars.fontSize['3xl'],\n        lineHeight: vars.lineHeight['3xl'],\n      },\n      '4xl': {\n        fontSize: vars.fontSize['4xl'],\n      },\n      '5xl': {\n        fontSize: vars.fontSize['5xl'],\n        lineHeight: vars.lineHeight['5xl'],\n      },\n      '6xl': {\n        fontSize: vars.fontSize['6xl'],\n        lineHeight: vars.lineHeight['6xl'],\n      },\n      '7xl': {\n        fontSize: vars.fontSize['7xl'],\n        lineHeight: vars.lineHeight['7xl'],\n      },\n      '8xl': {\n        fontSize: vars.fontSize['8xl'],\n        lineHeight: vars.lineHeight['8xl'],\n      },\n      '9xl': {\n        fontSize: vars.fontSize['9xl'],\n        lineHeight: vars.lineHeight['9xl'],\n      },\n      responsive: {\n        fontSize: vars.fontSize.responsive,\n        lineHeight: vars.lineHeight.responsive,\n      },\n    },\n    alignItems: [STRETCH, FLEX_START, CENTER, FLEX_END, BASELINE],\n    alignSelf: ['auto', FLEX_START, CENTER, FLEX_END, STRETCH],\n    borderColor: vars.colors,\n    borderWidth: vars.borderWidth,\n    borderStyle: [NONE, 'dashed', 'solid'],\n    borderRadius: vars.borderRadius,\n    borderTop: [NONE],\n    borderRight: [NONE],\n    borderBottom: [NONE],\n    borderLeft: [NONE],\n    borderTopColor: vars.colors,\n    borderRightColor: vars.colors,\n    borderBottomColor: vars.colors,\n    borderLeftColor: vars.colors,\n    borderTopWidth: vars.borderWidth,\n    borderRightWidth: vars.borderWidth,\n    borderBottomWidth: vars.borderWidth,\n    borderLeftWidth: vars.borderWidth,\n    borderTopRightRadius: vars.borderRadius,\n    aspectRatio: {\n      auto: 'auto',\n      square: '1 / 1',\n      video: '16 / 9',\n      golden: '1.618 / 1',\n      card: '4 / 3',\n    },\n    borderTopLeftRadius: vars.borderRadius,\n    borderBottomRightRadius: vars.borderRadius,\n    borderBottomLeftRadius: vars.borderRadius,\n    borderSpacing: vars.borderSpacing,\n    borderCollapse: ['collapse', 'separate'],\n    bottom: vars.spacing,\n    boxShadow: vars.boxShadow,\n    columnGap: vars.spacing,\n    display: [\n      'none',\n      'block',\n      'contents',\n      'flex',\n      'grid',\n      'inline',\n      'inline-flex',\n      'inline-block',\n      'table',\n      'table-cell',\n      'table-header-group',\n      'table-row',\n      'table-row-group',\n    ],\n    dropShadow: vars.dropShadow,\n    flex: vars.flex,\n    flexBasis: vars.flexBasis,\n    flexDirection: ['row', 'column', 'row-reverse'],\n    flexGrow: vars.flexGrow,\n    flexShrink: vars.flexShrink,\n    flexWrap: ['nowrap', 'wrap', 'wrap-reverse'],\n    fontVariantNumeric: {\n      'tabular-nums': 'tabular-nums',\n    },\n    fontFamily: vars.fontFamily,\n    fontWeight: vars.fontWeight,\n    gap: vars.spacing,\n    gridAutoColumns: vars.gridAutoColumns,\n    gridAutoRows: vars.gridAutoRows,\n    gridColumn: vars.gridColumn,\n    gridColumnEnd: vars.gridColumnEnd,\n    gridColumnStart: vars.gridColumnStart,\n    gridRow: vars.gridRow,\n    gridRowEnd: vars.gridRowEnd,\n    gridRowStart: vars.gridRowStart,\n    gridTemplateColumns: vars.gridTemplateColumns,\n    gridTemplateRows: vars.gridTemplateRows,\n    height: vars.height,\n    hueRotate: vars.hueRotate,\n    inset: vars.inset,\n    invert: vars.invert,\n    justifyContent: [\n      'center',\n      'flex-end',\n      'flex-start',\n      'space-between',\n      'stretch',\n      'space-around',\n    ],\n    justifyItems: [STRETCH, FLEX_START, CENTER, FLEX_END],\n    left: vars.left,\n    letterSpacing: vars.letterSpacing,\n    wordSpacing: vars.wordSpacing,\n    lineHeight: vars.lineHeight,\n    listStyleType: vars.listStyleType,\n    margin: vars.margin,\n    marginBottom: vars.spacing,\n    marginLeft: vars.spacing,\n    marginRight: vars.spacing,\n    marginTop: vars.spacing,\n    maxHeight: vars.maxHeight,\n    maxWidth: vars.maxWidth,\n    minHeight: vars.minHeight,\n    minWidth: { ...vars.minWidth, ...vars.width },\n    outline: ['none'],\n    outlineStyle: [NONE, 'solid', 'dashed'],\n    outlineOffset: vars.outlineOffset,\n    outlineWidth: vars.outlineWidth,\n    overflow: ['auto', 'hidden', 'scroll', 'visible'],\n    overflowWrap: ['anywhere', 'break-word'],\n    overflowY: ['auto', 'hidden', 'scroll'],\n    overflowX: ['auto', 'hidden', 'scroll', 'visible'],\n    padding: vars.spacing,\n    paddingBottom: vars.spacing,\n    paddingBlock: vars.spacing,\n    paddingInline: vars.spacing,\n    paddingLeft: vars.spacing,\n    paddingRight: vars.spacing,\n    paddingTop: vars.spacing,\n    placeContent: [\n      CENTER,\n      STRETCH,\n      'space-between',\n      'space-around',\n      'space-evenly',\n    ],\n    placeItems: [STRETCH, FLEX_START, CENTER, FLEX_END],\n    position: ['absolute', 'relative', 'fixed', 'sticky', 'static'],\n    right: vars.spacing,\n    rowGap: vars.spacing,\n    scale: vars.scale,\n    scrollbarGutter: ['auto', 'stable', 'stable both-edges'],\n    scrollMargin: vars.spacing,\n    scrollMarginTop: vars.spacing,\n    scrollPadding: vars.spacing,\n    strokeWidth: vars.strokeWidth,\n    textAlign: ['left', 'center', 'end'],\n    textOverflow: ['ellipsis', 'clip'],\n    top: vars.top,\n    userSelect: {\n      none: {\n        userSelect: 'none',\n        '-webkit-user-select': 'none',\n      },\n    },\n    visibility: ['hidden', 'visible'],\n    width: vars.width,\n    wordBreak: ['break-word', 'break-all'],\n    zIndex: vars.zIndex,\n    whiteSpace: ['nowrap', 'normal', 'pre', 'pre-wrap'],\n    resize: ['none', 'both', 'horizontal', 'vertical'],\n    backgroundImage: vars.backgroundImage,\n  },\n  shorthands: {\n    marginX: ['marginLeft', 'marginRight'],\n    marginY: ['marginTop', 'marginBottom'],\n    padding: ['paddingTop', 'paddingBottom', 'paddingLeft', 'paddingRight'],\n    paddingX: ['paddingLeft', 'paddingRight'],\n    paddingY: ['paddingTop', 'paddingBottom'],\n  },\n});\n\nconst colorModeProperties = defineProperties({\n  conditions: {\n    lightMode: {},\n    darkMode: { '@media': '(prefers-color-scheme: dark)' },\n  },\n  defaultCondition: 'lightMode',\n  properties: {\n    backgroundColor: vars.colors,\n    background: {\n      gradient: vars.backgroundImage.brandDiagonal,\n      ellipseGradient: vars.backgroundImage.floatingChatSurface,\n      linearGradient: vars.backgroundImage.brandDiagonal125,\n      verticalLinearGradient: vars.backgroundImage.surfaceChrome,\n    },\n    color: vars.colors,\n    grayscale: vars.grayscale,\n    opacity: vars.opacity,\n    outlineColor: vars.colors,\n    sepia: vars.sepia,\n    stroke: vars.stroke,\n    textColor: vars.colors,\n    textTransform: ['uppercase', 'lowercase', 'capitalize', 'none'],\n    textDecorationColor: vars.colors,\n    textOpacity: vars.opacity,\n  },\n});\n\nexport const sprinkles = createSprinkles(\n  colorModeProperties,\n  otherProperties,\n  responsiveProperties,\n);\n\nconst stateProperties = defineProperties({\n  conditions: {\n    hover: {\n      selector: '&:hover',\n    },\n    hoverNotDisabled: {\n      selector: '&:hover:not(:disabled)',\n    },\n    active: {\n      selector: '&:active',\n    },\n    focusVisible: {\n      selector: '&:focus-visible',\n    },\n    focus: {\n      selector: '&:focus',\n    },\n    focusWithin: {\n      selector: '&:focus-within',\n    },\n    hasFocusVisible: {\n      selector: '&:has(:focus-visible)',\n    },\n    disabled: {\n      selector: '&:disabled',\n    },\n  },\n  defaultCondition: false,\n  properties: {\n    backgroundColor: vars.colors,\n    borderColor: vars.colors,\n    boxShadow: vars.boxShadow,\n    color: vars.colors,\n    cursor: [\n      'alias',\n      'all-scroll',\n      'auto',\n      'cell',\n      'col-resize',\n      'context-menu',\n      'copy',\n      'crosshair',\n      'default',\n      'e-resize',\n      'ew-resize',\n      'grab',\n      'grabbing',\n      'help',\n      'move',\n      'n-resize',\n      'ne-resize',\n      'nesw-resize',\n      'no-drop',\n      'none',\n      'not-allowed',\n      'ns-resize',\n      'nw-resize',\n      'nwse-resize',\n      'pointer',\n      'progress',\n      'row-resize',\n      's-resize',\n      'se-resize',\n      'sw-resize',\n      'text',\n      'vertical-text',\n      'w-resize',\n      'wait',\n      'zoom-in',\n      'zoom-out',\n    ],\n    filter: {\n      none: 'none',\n      brightness90: 'brightness(0.9)',\n      brightness97: 'brightness(0.97)',\n      brightness98: 'brightness(0.98)',\n    },\n    opacity: vars.opacity,\n    outline: {\n      none: 'none',\n      focus: `2px solid ${vars.colors.primary}`,\n    },\n    outlineColor: vars.colors,\n    outlineOffset: vars.outlineOffset,\n    outlineStyle: [NONE, 'solid', 'dashed'],\n    outlineWidth: vars.outlineWidth,\n    textDecoration: ['none', 'line-through', 'underline'],\n    textUnderlineOffset: vars.textUnderlineOffset,\n    transform: vars.transform,\n  },\n});\n\nconst hoverProperties = defineProperties({\n  conditions: {\n    default: {},\n    hover: {\n      selector: '&:hover',\n    },\n  },\n  defaultCondition: 'default',\n  properties: {\n    backgroundColor: vars.colors,\n    color: vars.colors,\n    transform: vars.transform,\n    textDecoration: ['underline'],\n  },\n});\n\nconst firstChildProperties = defineProperties({\n  conditions: {\n    default: {},\n    firstChild: {\n      selector: '&:first-child',\n    },\n  },\n  defaultCondition: 'default',\n  properties: {\n    borderTopLeftRadius: vars.borderRadius,\n    borderTopRightRadius: vars.borderRadius,\n  },\n});\n\nexport const hoverSprinkles = createSprinkles(hoverProperties);\nexport const firstChildSprinkles = createSprinkles(firstChildProperties);\nexport const stateSprinkles = createSprinkles(stateProperties);\n"],"mappings":""}
+{"version":3,"file":"sprinkles.css.js","names":[],"sources":["../../../src/theme/sprinkles.css.ts"],"sourcesContent":["import { defineProperties, createSprinkles } from '@vanilla-extract/sprinkles';\nimport { vars } from './themeContract.css.js';\nimport { screens, spacing } from './common.js';\n\nconst NONE = 'none' as const;\nconst FLEX_START = 'flex-start' as const;\nconst FLEX_END = 'flex-end' as const;\nconst CENTER = 'center' as const;\nconst STRETCH = 'stretch' as const;\nconst BASELINE = 'baseline' as const;\n\nconst otherProperties = defineProperties({\n  properties: {\n    all: ['inherit', 'initial', 'revert', 'revert-layer', 'unset'],\n    appearance: ['auto', 'none'],\n    cursor: [\n      'alias',\n      'all-scroll',\n      'auto',\n      'cell',\n      'col-resize',\n      'context-menu',\n      'copy',\n      'crosshair',\n      'default',\n      'e-resize',\n      'ew-resize',\n      'grab',\n      'grabbing',\n      'help',\n      'move',\n      'n-resize',\n      'ne-resize',\n      'nesw-resize',\n      'no-drop',\n      'none',\n      'not-allowed',\n      'ns-resize',\n      'nw-resize',\n      'nwse-resize',\n      'pointer',\n      'progress',\n      'row-resize',\n      's-resize',\n      'se-resize',\n      'sw-resize',\n      'text',\n      'vertical-text',\n      'w-resize',\n      'wait',\n      'zoom-in',\n      'zoom-out',\n    ],\n    animation: vars.animation,\n    arrows: {\n      hidden: {\n        WebkitAppearance: 'none',\n        MozAppearance: 'textfield',\n        '&::-webkit-inner-spin-button, &::-webkit-outer-spin-button': {\n          WebkitAppearance: 'none',\n          margin: 0,\n        },\n      },\n    },\n    backgroundSize: {\n      auto: 'auto',\n      contain: 'contain',\n      cover: 'cover',\n      skeleton: '300% 100%',\n    },\n    border: {\n      none: 'none',\n      spinner: `${vars.borderWidth[2]} solid ${vars.colors.borderSubtle}`,\n    },\n    clip: {\n      hidden: 'rect(0 0 0 0)',\n    },\n    containerType: ['inline-size', 'normal', 'size'],\n    fontStyle: ['normal', 'italic'],\n    font: ['inherit'],\n    filter: {\n      none: 'none',\n      brightness90: 'brightness(0.9)',\n      brightness97: 'brightness(0.97)',\n      brightness98: 'brightness(0.98)',\n    },\n    objectPosition: vars.objectPosition,\n    objectFit: ['contain', 'cover', 'fill', 'none', 'scale-down'],\n    order: vars.order,\n    placeHolder: {\n      italic: {\n        '::placeholder': {\n          fontStyle: 'italic',\n          // color: vars.colors['slate-400'],\n          fontWeight: vars.fontWeight.light,\n        },\n      },\n    },\n\n    pointerEvents: ['none', 'auto'],\n    msOverflowStyle: ['auto', 'none'],\n    rotate: vars.rotate,\n    scrollBar: {\n      light: {\n        '&::-webkit-scrollbar': {\n          background: 'transparent',\n          width: spacing[1.5],\n        },\n        '&::-webkit-scrollbar-thumb': {\n          background: vars.colors.borderLight,\n          borderRadius: spacing[1.5],\n        },\n      },\n      hidden: {\n        '&::-webkit-scrollbar': {\n          WebkitAppearance: 'none',\n          display: 'none',\n        },\n        MsOverflowStyle: 'none',\n        scrollbarWidth: 'none',\n      },\n    },\n    scrollbarColor: {\n      auto: 'auto',\n      border: `${vars.colors.border} transparent`,\n      borderLight: `${vars.colors.borderLight} transparent`,\n    },\n    scrollbarWidth: ['auto', 'none', 'thin'],\n    skew: vars.skew,\n    textDecoration: ['none', 'line-through', 'underline'],\n    textDecorationThickness: vars.textDecorationThickness,\n    textIndent: vars.spacing,\n    textTransform: ['uppercase', 'lowercase', 'capitalize'],\n    textUnderlineOffset: vars.textUnderlineOffset,\n    transform: vars.transform,\n    transformOrigin: {\n      topLeft: 'top left',\n    },\n    transitionDelay: vars.transitionDelay,\n    transitionDuration: vars.transitionDuration,\n    transitionProperty: vars.transitionProperty,\n    transitionTimingFunction: vars.transitionTimingFunction,\n    verticalAlign: ['baseline', 'middle', 'sub', 'super', 'top'],\n    willChange: ['background-position', 'transform'],\n    zIndex: vars.zIndex,\n  },\n});\n\nconst responsiveProperties = defineProperties({\n  conditions: {\n    base: {},\n    sm: { '@media': screens.sm },\n    md: { '@media': screens.md },\n    lg: { '@media': screens.lg },\n    xl: { '@media': screens.xl },\n    xxl: { '@media': screens.xxl },\n    max767: { '@media': 'screen and (max-width: 767px)' },\n    min768: { '@media': 'screen and (min-width: 768px)' },\n    tabletOnly: {\n      '@media': 'screen and (min-width: 768px) and (max-width: 1023px)',\n    },\n    max900: { '@media': 'screen and (max-width: 900px)' },\n    max1023: { '@media': 'screen and (max-width: 1023px)' },\n    max1199: { '@media': 'screen and (max-width: 1199px)' },\n    min1200: { '@media': 'screen and (min-width: 1200px)' },\n  },\n  defaultCondition: 'base',\n  properties: {\n    /**\n     * The order of fontSize in this file has an impact on CSS rule priority\n     */\n    fontSize: {\n      '3xs': {\n        fontSize: vars.fontSize['3xs'],\n        lineHeight: vars.lineHeight['3xs'],\n      },\n      '2xs': {\n        fontSize: vars.fontSize['2xs'],\n        lineHeight: vars.lineHeight['2xs'],\n      },\n      xs: {\n        fontSize: vars.fontSize.xs,\n        lineHeight: vars.lineHeight.xs,\n      },\n      sm: {\n        fontSize: vars.fontSize.sm,\n        lineHeight: vars.lineHeight.sm,\n      },\n      base: {\n        fontSize: vars.fontSize.base,\n        lineHeight: vars.lineHeight.base,\n      },\n      lg: {\n        fontSize: vars.fontSize.lg,\n        lineHeight: vars.lineHeight.lg,\n      },\n      xl: {\n        fontSize: vars.fontSize.xl,\n        lineHeight: vars.lineHeight.xl,\n      },\n      '2xl': {\n        fontSize: vars.fontSize['2xl'],\n        lineHeight: vars.lineHeight['2xl'],\n      },\n      '3xl': {\n        fontSize: vars.fontSize['3xl'],\n        lineHeight: vars.lineHeight['3xl'],\n      },\n      '4xl': {\n        fontSize: vars.fontSize['4xl'],\n      },\n      '5xl': {\n        fontSize: vars.fontSize['5xl'],\n        lineHeight: vars.lineHeight['5xl'],\n      },\n      '6xl': {\n        fontSize: vars.fontSize['6xl'],\n        lineHeight: vars.lineHeight['6xl'],\n      },\n      '7xl': {\n        fontSize: vars.fontSize['7xl'],\n        lineHeight: vars.lineHeight['7xl'],\n      },\n      '8xl': {\n        fontSize: vars.fontSize['8xl'],\n        lineHeight: vars.lineHeight['8xl'],\n      },\n      '9xl': {\n        fontSize: vars.fontSize['9xl'],\n        lineHeight: vars.lineHeight['9xl'],\n      },\n      responsive: {\n        fontSize: vars.fontSize.responsive,\n        lineHeight: vars.lineHeight.responsive,\n      },\n    },\n    alignItems: [STRETCH, FLEX_START, CENTER, FLEX_END, BASELINE],\n    alignSelf: ['auto', FLEX_START, CENTER, FLEX_END, STRETCH],\n    borderColor: vars.colors,\n    borderWidth: vars.borderWidth,\n    borderStyle: [NONE, 'dashed', 'solid'],\n    borderRadius: vars.borderRadius,\n    borderTop: [NONE],\n    borderRight: [NONE],\n    borderBottom: [NONE],\n    borderLeft: [NONE],\n    borderTopColor: vars.colors,\n    borderRightColor: vars.colors,\n    borderBottomColor: vars.colors,\n    borderLeftColor: vars.colors,\n    borderTopWidth: vars.borderWidth,\n    borderRightWidth: vars.borderWidth,\n    borderBottomWidth: vars.borderWidth,\n    borderLeftWidth: vars.borderWidth,\n    borderTopRightRadius: vars.borderRadius,\n    aspectRatio: {\n      auto: 'auto',\n      square: '1 / 1',\n      video: '16 / 9',\n      golden: '1.618 / 1',\n      card: '4 / 3',\n    },\n    borderTopLeftRadius: vars.borderRadius,\n    borderBottomRightRadius: vars.borderRadius,\n    borderBottomLeftRadius: vars.borderRadius,\n    borderSpacing: vars.borderSpacing,\n    borderCollapse: ['collapse', 'separate'],\n    bottom: vars.spacing,\n    boxShadow: vars.boxShadow,\n    columnGap: vars.spacing,\n    display: [\n      'none',\n      'block',\n      'contents',\n      'flex',\n      'grid',\n      'inline',\n      'inline-flex',\n      'inline-block',\n      'table',\n      'table-cell',\n      'table-header-group',\n      'table-row',\n      'table-row-group',\n    ],\n    dropShadow: vars.dropShadow,\n    flex: vars.flex,\n    flexBasis: vars.flexBasis,\n    flexDirection: ['row', 'column', 'row-reverse'],\n    flexGrow: vars.flexGrow,\n    flexShrink: vars.flexShrink,\n    flexWrap: ['nowrap', 'wrap', 'wrap-reverse'],\n    fontVariantNumeric: {\n      'tabular-nums': 'tabular-nums',\n    },\n    fontFamily: vars.fontFamily,\n    fontWeight: vars.fontWeight,\n    gap: vars.spacing,\n    gridAutoColumns: vars.gridAutoColumns,\n    gridAutoRows: vars.gridAutoRows,\n    gridColumn: vars.gridColumn,\n    gridColumnEnd: vars.gridColumnEnd,\n    gridColumnStart: vars.gridColumnStart,\n    gridRow: vars.gridRow,\n    gridRowEnd: vars.gridRowEnd,\n    gridRowStart: vars.gridRowStart,\n    gridTemplateColumns: vars.gridTemplateColumns,\n    gridTemplateRows: vars.gridTemplateRows,\n    height: vars.height,\n    hueRotate: vars.hueRotate,\n    inset: vars.inset,\n    invert: vars.invert,\n    justifyContent: [\n      'center',\n      'flex-end',\n      'flex-start',\n      'space-between',\n      'stretch',\n      'space-around',\n    ],\n    justifyItems: [STRETCH, FLEX_START, CENTER, FLEX_END],\n    left: vars.left,\n    letterSpacing: vars.letterSpacing,\n    wordSpacing: vars.wordSpacing,\n    lineHeight: vars.lineHeight,\n    listStyleType: vars.listStyleType,\n    margin: vars.margin,\n    marginBottom: vars.spacing,\n    marginLeft: vars.spacing,\n    marginRight: vars.spacing,\n    marginTop: vars.spacing,\n    maxHeight: vars.maxHeight,\n    maxWidth: vars.maxWidth,\n    minHeight: vars.minHeight,\n    minWidth: { ...vars.minWidth, ...vars.width },\n    outline: ['none'],\n    outlineStyle: [NONE, 'solid', 'dashed'],\n    outlineOffset: vars.outlineOffset,\n    outlineWidth: vars.outlineWidth,\n    overflow: ['auto', 'hidden', 'scroll', 'visible'],\n    overflowWrap: ['anywhere', 'break-word'],\n    overflowY: ['auto', 'hidden', 'scroll'],\n    overflowX: ['auto', 'hidden', 'scroll', 'visible'],\n    padding: vars.spacing,\n    paddingBottom: vars.spacing,\n    paddingBlock: vars.spacing,\n    paddingInline: vars.spacing,\n    paddingLeft: vars.spacing,\n    paddingRight: vars.spacing,\n    paddingTop: vars.spacing,\n    placeContent: [\n      CENTER,\n      STRETCH,\n      'space-between',\n      'space-around',\n      'space-evenly',\n    ],\n    placeItems: [STRETCH, FLEX_START, CENTER, FLEX_END],\n    position: ['absolute', 'relative', 'fixed', 'sticky', 'static'],\n    right: vars.spacing,\n    rowGap: vars.spacing,\n    scale: vars.scale,\n    scrollbarGutter: ['auto', 'stable', 'stable both-edges'],\n    scrollMargin: vars.spacing,\n    scrollMarginTop: vars.spacing,\n    scrollPadding: vars.spacing,\n    strokeWidth: vars.strokeWidth,\n    textAlign: ['left', 'center', 'end'],\n    textOverflow: ['ellipsis', 'clip'],\n    top: vars.top,\n    userSelect: {\n      none: {\n        userSelect: 'none',\n        '-webkit-user-select': 'none',\n      },\n    },\n    visibility: ['hidden', 'visible'],\n    width: vars.width,\n    wordBreak: ['break-word', 'break-all'],\n    zIndex: vars.zIndex,\n    whiteSpace: ['nowrap', 'normal', 'pre', 'pre-wrap'],\n    resize: ['none', 'both', 'horizontal', 'vertical'],\n    backgroundImage: vars.backgroundImage,\n  },\n  shorthands: {\n    marginX: ['marginLeft', 'marginRight'],\n    marginY: ['marginTop', 'marginBottom'],\n    padding: ['paddingTop', 'paddingBottom', 'paddingLeft', 'paddingRight'],\n    paddingX: ['paddingLeft', 'paddingRight'],\n    paddingY: ['paddingTop', 'paddingBottom'],\n  },\n});\n\nconst colorModeProperties = defineProperties({\n  conditions: {\n    lightMode: {},\n    darkMode: { '@media': '(prefers-color-scheme: dark)' },\n  },\n  defaultCondition: 'lightMode',\n  properties: {\n    backgroundColor: vars.colors,\n    background: {\n      gradient: vars.backgroundImage.brandDiagonal,\n      ellipseGradient: vars.backgroundImage.floatingChatSurface,\n      linearGradient: vars.backgroundImage.brandDiagonal125,\n      verticalLinearGradient: vars.backgroundImage.surfaceChrome,\n    },\n    color: vars.colors,\n    grayscale: vars.grayscale,\n    opacity: vars.opacity,\n    outlineColor: vars.colors,\n    sepia: vars.sepia,\n    stroke: vars.stroke,\n    textColor: vars.colors,\n    textTransform: ['uppercase', 'lowercase', 'capitalize', 'none'],\n    textDecorationColor: vars.colors,\n    textOpacity: vars.opacity,\n  },\n});\n\nexport const sprinkles = createSprinkles(\n  colorModeProperties,\n  otherProperties,\n  responsiveProperties,\n);\n\nconst stateProperties = defineProperties({\n  conditions: {\n    hover: {\n      selector: '&:hover',\n    },\n    hoverNotDisabled: {\n      selector: '&:hover:not(:disabled)',\n    },\n    active: {\n      selector: '&:active',\n    },\n    focusVisible: {\n      selector: '&:focus-visible',\n    },\n    focus: {\n      selector: '&:focus',\n    },\n    focusWithin: {\n      selector: '&:focus-within',\n    },\n    hasFocusVisible: {\n      selector: '&:has(:focus-visible)',\n    },\n    disabled: {\n      selector: '&:disabled',\n    },\n  },\n  defaultCondition: false,\n  properties: {\n    backgroundColor: vars.colors,\n    borderColor: vars.colors,\n    boxShadow: vars.boxShadow,\n    color: vars.colors,\n    cursor: [\n      'alias',\n      'all-scroll',\n      'auto',\n      'cell',\n      'col-resize',\n      'context-menu',\n      'copy',\n      'crosshair',\n      'default',\n      'e-resize',\n      'ew-resize',\n      'grab',\n      'grabbing',\n      'help',\n      'move',\n      'n-resize',\n      'ne-resize',\n      'nesw-resize',\n      'no-drop',\n      'none',\n      'not-allowed',\n      'ns-resize',\n      'nw-resize',\n      'nwse-resize',\n      'pointer',\n      'progress',\n      'row-resize',\n      's-resize',\n      'se-resize',\n      'sw-resize',\n      'text',\n      'vertical-text',\n      'w-resize',\n      'wait',\n      'zoom-in',\n      'zoom-out',\n    ],\n    filter: {\n      none: 'none',\n      brightness90: 'brightness(0.9)',\n      brightness97: 'brightness(0.97)',\n      brightness98: 'brightness(0.98)',\n    },\n    opacity: vars.opacity,\n    outline: {\n      none: 'none',\n      focus: `2px solid ${vars.colors.primary}`,\n    },\n    outlineColor: vars.colors,\n    outlineOffset: vars.outlineOffset,\n    outlineStyle: [NONE, 'solid', 'dashed'],\n    outlineWidth: vars.outlineWidth,\n    textDecoration: ['none', 'line-through', 'underline'],\n    textUnderlineOffset: vars.textUnderlineOffset,\n    transform: vars.transform,\n  },\n});\n\nconst hoverProperties = defineProperties({\n  conditions: {\n    default: {},\n    hover: {\n      selector: '&:hover',\n    },\n  },\n  defaultCondition: 'default',\n  properties: {\n    backgroundColor: vars.colors,\n    color: vars.colors,\n    transform: vars.transform,\n    textDecoration: ['underline'],\n  },\n});\n\nconst firstChildProperties = defineProperties({\n  conditions: {\n    default: {},\n    firstChild: {\n      selector: '&:first-child',\n    },\n  },\n  defaultCondition: 'default',\n  properties: {\n    borderTopLeftRadius: vars.borderRadius,\n    borderTopRightRadius: vars.borderRadius,\n  },\n});\n\nexport const hoverSprinkles = createSprinkles(hoverProperties);\nexport const firstChildSprinkles = createSprinkles(firstChildProperties);\nexport const stateSprinkles = createSprinkles(stateProperties);\n"],"mappings":""}

package/lib/esm/theme/styleRecipes.css.js

@@ -1,18 +1,18 @@
 /* empty css                         */
 import { createRuntimeFn as e } from "@vanilla-extract/recipes/createRuntimeFn";
 //#region src/theme/styleRecipes.css.ts
-var t = "qbwcue0 txvbqb1etc txvbqb1fls", n = "qbwcue1 txvbqb1d2h txvbqb1dlt", r = "qbwcue2 txvbqb1dm1", i = "qbwcue3 txvbqb1et4 txvbqb1dm8", a = "qbwcue4 txvbqb1el8 txvbqb1ero", o = "qbwcue5 txvbqb1frr", s = "qbwcue6 txvbqb1fry txvbqb1fs7", c = "qbwcue9 qbwcue7 txvbqb7g txvbqb76 txvbqb7r qbwcue8 txvbqb1dme txvbqb1dmn qbwcue0 txvbqb1etc txvbqb1fls", l = "qbwcuea txvbqb1dlk txvbqb1et4", u = "qbwcued qbwcueb txvbqb25s txvbqb2pn txvbqb1d9 txvbqb2r3 txvbqb1atj txvbqb1b15 txvbqbv txvbqb7g txvbqb76 txvbqb7t qbwcuec txvbqb1cc6 txvbqb1d2e txvbqb1e3y txvbqb1dhy qbwcue4 txvbqb1el8 txvbqb1ero qbwcue0 txvbqb1etc txvbqb1fls", d = "qbwcueg qbwcuee txvbqb2r3 txvbqb1b15 txvbqb3f txvbqb7g txvbqb76 txvbqb7t qbwcuef txvbqb1cbx txvbqb1d9h qbwcue0 txvbqb1etc txvbqb1fls", f = "qbwcuej qbwcueh txvbqbfca txvbqbey txvbqbldo txvbqb1qz txvbqb2ox txvbqb2r3 txvbqb1aqb txvbqb1b17 txvbqbv txvbqbwh2 txvbqb7h txvbqb76 txvbqb7t qbwcuei txvbqb1cc6 txvbqb1e3y qbwcue4 txvbqb1el8 txvbqb1ero qbwcue0 txvbqb1etc txvbqb1fls", p = "qbwcuem qbwcuek txvbqb1084 txvbqb115p txvbqb122x txvbqbxf0 txvbqbfca txvbqbey txvbqbldo txvbqbgys txvbqbuwq txvbqb1b15 txvbqb1atl txvbqb1d9 txvbqb2pn txvbqb26v txvbqb2tm txvbqbgwz txvbqbnq6 txvbqb3f txvbqb7g txvbqb75 txvbqb7t qbwcuel txvbqb1e91 txvbqb1cbp txvbqb1dal txvbqb1dhx qbwcue0 txvbqb1etc txvbqb1fls", m = "qbwcuep qbwcuen txvbqbfca txvbqbey txvbqbgys txvbqb1b15 txvbqb3f txvbqb7h txvbqb75 txvbqb7t qbwcueo txvbqb1fol qbwcue0 txvbqb1etc txvbqb1fls", h = "qbwcueq txvbqbuth txvbqbwcq txvbqb17zz txvbqb1ahj", g = e({
-	defaultClassName: "qbwcuex qbwcuer txvbqbfca txvbqbey txvbqbldo txvbqbgrx txvbqbnq6",
+var t = "qbwcue0 txvbqb1ffs txvbqb1ga0", n = "qbwcue1 txvbqb1dld txvbqb1e6h", r = "qbwcue2 txvbqb1e6p", i = "qbwcue3 txvbqb1ffk txvbqb1e6w", a = "qbwcue4 txvbqb1f7o txvbqb1fe4", o = "qbwcue5 txvbqb1gfz", s = "qbwcue6 txvbqb1gg6 txvbqb1ggf", c = "qbwcue9 qbwcue7 txvbqb7g txvbqb76 txvbqb7r qbwcue8 txvbqb1e72 txvbqb1e7b qbwcue0 txvbqb1ffs txvbqb1ga0", l = "qbwcuea txvbqb1e68 txvbqb1ffk", u = "qbwcued qbwcueb txvbqb28o txvbqb2sj txvbqb1d9 txvbqb2tz txvbqb1b7z txvbqb1bg1 txvbqbv txvbqb7g txvbqb76 txvbqb7t qbwcuec txvbqb1cta txvbqb1dla txvbqb1eom txvbqb1e2m qbwcue4 txvbqb1f7o txvbqb1fe4 qbwcue0 txvbqb1ffs txvbqb1ga0", d = "qbwcueg qbwcuee txvbqb2tz txvbqb1bg1 txvbqb3f txvbqb7g txvbqb76 txvbqb7t qbwcuef txvbqb1ct1 txvbqb1dsd qbwcue0 txvbqb1ffs txvbqb1ga0", f = "qbwcuej qbwcueh txvbqbfqq txvbqbey txvbqbls4 txvbqb1tv txvbqb2rt txvbqb2tz txvbqb1b4r txvbqb1bg3 txvbqbv txvbqbwvi txvbqb7h txvbqb76 txvbqb7t qbwcuei txvbqb1cta txvbqb1eom qbwcue4 txvbqb1f7o txvbqb1fe4 qbwcue0 txvbqb1ffs txvbqb1ga0", p = "qbwcuem qbwcuek txvbqb10mk txvbqb11k5 txvbqb12hd txvbqbxtg txvbqbfqq txvbqbey txvbqbls4 txvbqbhd8 txvbqbvb6 txvbqb1bg1 txvbqb1b81 txvbqb1d9 txvbqb2sj txvbqb29r txvbqb2wi txvbqbhbf txvbqbo4m txvbqb3f txvbqb7g txvbqb75 txvbqb7t qbwcuel txvbqb1etp txvbqb1cst txvbqb1dth txvbqb1e2l qbwcue0 txvbqb1ffs txvbqb1ga0", m = "qbwcuep qbwcuen txvbqbfqq txvbqbey txvbqbhd8 txvbqb1bg1 txvbqb3f txvbqb7h txvbqb75 txvbqb7t qbwcueo txvbqb1gct qbwcue0 txvbqb1ffs txvbqb1ga0", h = "qbwcueq txvbqbv7x txvbqbwr6 txvbqb18ef txvbqb1avz", g = e({
+	defaultClassName: "qbwcuex qbwcuer txvbqbfqq txvbqbey txvbqbls4 txvbqbh6d txvbqbo4m",
 	variantClassNames: { size: {
-		xs: "qbwcuey qbwcues txvbqb1916 txvbqbj6l txvbqbuux txvbqbtv6",
-		sm: "qbwcuez qbwcuet txvbqb191j txvbqbj6y txvbqbuva txvbqbtvj",
-		md: "qbwcue10 qbwcueu txvbqb191w txvbqbj7b txvbqbuvn txvbqbtvw",
-		lg: "qbwcue11 qbwcuev txvbqb192m txvbqbj81 txvbqbuwd txvbqbtwm",
-		xl: "qbwcue12 qbwcuew txvbqb193c txvbqbj8r txvbqbux3 txvbqbtxc"
+		xs: "qbwcuey qbwcues txvbqb19fm txvbqbjl1 txvbqbv9d txvbqbu9m",
+		sm: "qbwcuez qbwcuet txvbqb19fz txvbqbjle txvbqbv9q txvbqbu9z",
+		md: "qbwcue10 qbwcueu txvbqb19gc txvbqbjlr txvbqbva3 txvbqbuac",
+		lg: "qbwcue11 qbwcuev txvbqb19h2 txvbqbjmh txvbqbvat txvbqbub2",
+		xl: "qbwcue12 qbwcuew txvbqb19hs txvbqbjn7 txvbqbvbj txvbqbubs"
 	} },
 	defaultVariants: { size: "md" },
 	compoundVariants: []
-}), _ = "qbwcuex qbwcuer txvbqbfca txvbqbey txvbqbldo txvbqbgrx txvbqbnq6 qbwcue11 qbwcuev txvbqb192m txvbqbj81 txvbqbuwd txvbqbtwm", v = "qbwcue13 txvbqb1am8 txvbqb1g txvbqb1a";
+}), _ = "qbwcuex qbwcuer txvbqbfqq txvbqbey txvbqbls4 txvbqbh6d txvbqbo4m qbwcue11 qbwcuev txvbqb19h2 txvbqbjmh txvbqbvat txvbqbub2", v = "qbwcue13 txvbqb1b0o txvbqb1g txvbqb1a";
 //#endregion
 export { i as brandFocusRing, n as controlFocusRing, a as disabledControl, m as entityReferenceLink, r as errorControlFocusRing, t as focusRing, f as ghostIconButton, g as iconBox, _ as iconBoxCompact, l as insetFocusRing, u as interactiveControlSurface, d as interactiveLinkSurface, s as liftOnHover, v as loadingShimmer, p as pillLink, o as pressInteraction, c as surfaceInteractive, h as truncate };