@sanity/ui 3.0.0-static.29 → 3.0.0-static.30

package/src/css/primitives/_input/types.ts

@@ -1,7 +1,7 @@
 import type {FontTextSize, Space} from '@sanity/ui/theme'
 
-import type {RadiusStyleProps} from '../../props/radius'
-import type {WidthStyleProps} from '../../props/width'
+import type {RadiusStyleProps} from '../../props/radius/types'
+import type {WidthStyleProps} from '../../props/width/types'
 import type {ResponsiveProp} from '../../types'
 
 /** @public */

package/src/css/primitives/_selectable/selectable.ts

@@ -1,5 +1,5 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {radius} from '../../props/radius'
+import {radius} from '../../props/radius/radius'
 import {root, tones} from './_selectable.css'
 import type {SelectableStyleProps} from './types'
 

package/src/css/primitives/_selectable/types.ts

@@ -1,6 +1,6 @@
 import type {ThemeColorStateToneKey} from '@sanity/ui/theme'
 
-import type {RadiusStyleProps} from '../../props/radius'
+import type {RadiusStyleProps} from '../../props/radius/types'
 
 /** @internal */
 export interface SelectableStyleProps extends RadiusStyleProps {

package/src/css/primitives/avatar/avatar.ts

@@ -1,6 +1,6 @@
 import {_composeClassNames} from '../../_composeClassNames'
 import {_responsiveClassName} from '../../_responsiveClassName'
-import {flex} from '../../props/flex'
+import {flex} from '../../props/flex/flex'
 import {
   arrow,
   arrowSvg,

package/src/css/primitives/box/box.ts

@@ -1,39 +1,39 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {alignItems} from '../../props/alignItems'
-import {border} from '../../props/border'
-import {boxSizing} from '../../props/boxSizing'
-import {display} from '../../props/display'
-import {flex} from '../../props/flex'
-import {flexDirection} from '../../props/flexDirection'
-import {flexWrap} from '../../props/flexWrap'
-import {gap} from '../../props/gap'
-import {gridAutoColumns} from '../../props/gridAutoColumns'
-import {gridAutoFlow} from '../../props/gridAutoFlow'
-import {gridAutoRows} from '../../props/gridAutoRows'
-import {gridColumn} from '../../props/gridColumn'
-import {gridColumnEnd} from '../../props/gridColumnEnd'
-import {gridColumnStart} from '../../props/gridColumnStart'
-import {gridRow} from '../../props/gridRow'
-import {gridRowEnd} from '../../props/gridRowEnd'
-import {gridRowStart} from '../../props/gridRowStart'
-import {gridTemplateColumns} from '../../props/gridTemplateColumns'
-import {gridTemplateRows} from '../../props/gridTemplateRows'
-import {height} from '../../props/height'
-import {inset} from '../../props/inset'
-import {justifyContent} from '../../props/justifyContent'
-import {margin} from '../../props/margin'
-import {maxWidth} from '../../props/maxWidth'
-import {minHeight} from '../../props/minHeight'
-import {minWidth} from '../../props/minWidth'
-import {outline} from '../../props/outline'
-import {overflow} from '../../props/overflow'
-import {padding} from '../../props/padding'
-import {pointerEvents} from '../../props/pointerEvents'
-import {position} from '../../props/position'
-import {radius} from '../../props/radius'
-import {shadow} from '../../props/shadow'
-import {textAlign} from '../../props/textAlign'
-import {width} from '../../props/width'
+import {alignItems} from '../../props/alignItems/alignItems'
+import {border} from '../../props/border/border'
+import {boxSizing} from '../../props/boxSizing/boxSizing'
+import {display} from '../../props/display/display'
+import {flex} from '../../props/flex/flex'
+import {flexDirection} from '../../props/flexDirection/flexDirection'
+import {flexWrap} from '../../props/flexWrap/flexWrap'
+import {gap} from '../../props/gap/gap'
+import {gridAutoColumns} from '../../props/gridAutoColumns/gridAutoColumns'
+import {gridAutoFlow} from '../../props/gridAutoFlow/gridAutoFlow'
+import {gridAutoRows} from '../../props/gridAutoRows/gridAutoRows'
+import {gridColumn} from '../../props/gridColumn/gridColumn'
+import {gridColumnEnd} from '../../props/gridColumnEnd/gridColumnEnd'
+import {gridColumnStart} from '../../props/gridColumnStart/gridColumnStart'
+import {gridRow} from '../../props/gridRow/gridRow'
+import {gridRowEnd} from '../../props/gridRowEnd/gridRowEnd'
+import {gridRowStart} from '../../props/gridRowStart/gridRowStart'
+import {gridTemplateColumns} from '../../props/gridTemplateColumns/gridTemplateColumns'
+import {gridTemplateRows} from '../../props/gridTemplateRows/gridTemplateRows'
+import {height} from '../../props/height/height'
+import {inset} from '../../props/inset/inset'
+import {justifyContent} from '../../props/justifyContent/justifyContent'
+import {margin} from '../../props/margin/margin'
+import {maxWidth} from '../../props/maxWidth/maxWidth'
+import {minHeight} from '../../props/minHeight/minHeight'
+import {minWidth} from '../../props/minWidth/minWidth'
+import {outline} from '../../props/outline/outline'
+import {overflow} from '../../props/overflow/overflow'
+import {padding} from '../../props/padding/padding'
+import {pointerEvents} from '../../props/pointerEvents/pointerEvents'
+import {position} from '../../props/position/position'
+import {radius} from '../../props/radius/radius'
+import {shadow} from '../../props/shadow/shadow'
+import {textAlign} from '../../props/textAlign/textAlign'
+import {width} from '../../props/width/width'
 import {muted, root} from './box.css'
 import type {BoxStyleProps} from './types'
 

package/src/css/primitives/box/types.ts

@@ -1,37 +1,37 @@
-import type {AlignItemsStyleProps} from '../../props/alignItems'
-import type {BorderStyleProps} from '../../props/border'
-import type {BoxSizingStyleProps} from '../../props/boxSizing'
-import type {DisplayStyleProps} from '../../props/display'
-import type {FlexStyleProps} from '../../props/flex'
-import type {FlexDirectionStyleProps} from '../../props/flexDirection'
-import type {FlexWrapStyleProps} from '../../props/flexWrap'
-import type {GapStyleProps} from '../../props/gap'
-import type {GridAutoColumnsStyleProps} from '../../props/gridAutoColumns'
-import type {GridAutoFlowStyleProps} from '../../props/gridAutoFlow'
-import type {GridAutoRowsStyleProps} from '../../props/gridAutoRows'
-import type {GridColumnStyleProps} from '../../props/gridColumn'
-import type {GridColumnEndStyleProps} from '../../props/gridColumnEnd'
-import type {GridColumnStartStyleProps} from '../../props/gridColumnStart'
-import type {GridRowStyleProps} from '../../props/gridRow'
-import type {GridRowEndStyleProps} from '../../props/gridRowEnd'
-import type {GridRowStartStyleProps} from '../../props/gridRowStart'
-import type {GridTemplateColumnsStyleProps} from '../../props/gridTemplateColumns'
-import type {GridTemplateRowsStyleProps} from '../../props/gridTemplateRows'
-import type {HeightStyleProps} from '../../props/height'
-import type {InsetStyleProps} from '../../props/inset'
-import type {JustifyContentStyleProps} from '../../props/justifyContent'
-import type {MarginStyleProps} from '../../props/margin'
-import type {MaxWidthStyleProps} from '../../props/maxWidth'
-import type {MinHeightStyleProps} from '../../props/minHeight'
-import type {MinWidthStyleProps} from '../../props/minWidth'
-import type {OverflowStyleProps} from '../../props/overflow'
-import type {PaddingStyleProps} from '../../props/padding'
-import type {PointerEventsStyleProps} from '../../props/pointerEvents'
-import type {PositionStyleProps} from '../../props/position'
-import type {RadiusStyleProps} from '../../props/radius'
-import type {ShadowStyleProps} from '../../props/shadow'
-import type {TextAlignStyleProps} from '../../props/textAlign'
-import type {WidthStyleProps} from '../../props/width'
+import type {AlignItemsStyleProps} from '../../props/alignItems/types'
+import type {BorderStyleProps} from '../../props/border/types'
+import type {BoxSizingStyleProps} from '../../props/boxSizing/types'
+import type {DisplayStyleProps} from '../../props/display/types'
+import type {FlexStyleProps} from '../../props/flex/types'
+import type {FlexDirectionStyleProps} from '../../props/flexDirection/types'
+import type {FlexWrapStyleProps} from '../../props/flexWrap/types'
+import type {GapStyleProps} from '../../props/gap/types'
+import type {GridAutoColumnsStyleProps} from '../../props/gridAutoColumns/types'
+import type {GridAutoFlowStyleProps} from '../../props/gridAutoFlow/types'
+import type {GridAutoRowsStyleProps} from '../../props/gridAutoRows/types'
+import type {GridColumnStyleProps} from '../../props/gridColumn/types'
+import type {GridColumnEndStyleProps} from '../../props/gridColumnEnd/types'
+import type {GridColumnStartStyleProps} from '../../props/gridColumnStart/types'
+import type {GridRowStyleProps} from '../../props/gridRow/types'
+import type {GridRowEndStyleProps} from '../../props/gridRowEnd/types'
+import type {GridRowStartStyleProps} from '../../props/gridRowStart/types'
+import type {GridTemplateColumnsStyleProps} from '../../props/gridTemplateColumns/types'
+import type {GridTemplateRowsStyleProps} from '../../props/gridTemplateRows/types'
+import type {HeightStyleProps} from '../../props/height/types'
+import type {InsetStyleProps} from '../../props/inset/types'
+import type {JustifyContentStyleProps} from '../../props/justifyContent/types'
+import type {MarginStyleProps} from '../../props/margin/types'
+import type {MaxWidthStyleProps} from '../../props/maxWidth/types'
+import type {MinHeightStyleProps} from '../../props/minHeight/types'
+import type {MinWidthStyleProps} from '../../props/minWidth/types'
+import type {OverflowStyleProps} from '../../props/overflow/types'
+import type {PaddingStyleProps} from '../../props/padding/types'
+import type {PointerEventsStyleProps} from '../../props/pointerEvents/types'
+import type {PositionStyleProps} from '../../props/position/types'
+import type {RadiusStyleProps} from '../../props/radius/types'
+import type {ShadowStyleProps} from '../../props/shadow/types'
+import type {TextAlignStyleProps} from '../../props/textAlign/types'
+import type {WidthStyleProps} from '../../props/width/types'
 
 /** @public */
 export interface BoxStyleProps

package/src/css/primitives/button/button.css.ts

@@ -149,8 +149,8 @@ export const tones = {
 
             [`&.${modes.ghost}`]: {
               vars: {
-                [vars.color.bg]: tinted.bg[1],
-                [vars.color.border]: tinted.border[1],
+                [vars.color.bg]: `color-mix(in srgb, transparent, ${tinted.bg[1]} 50%)`,
+                [vars.color.border]: tinted.border[0],
                 [vars.color.fg]: tinted.fg[2],
                 [vars.color.code.bg]: tinted.bg[2],
                 [vars.color.code.fg]: tinted.fg[4],
@@ -163,8 +163,8 @@ export const tones = {
 
             [`&.${modes.ghost}:not([data-disabled]):hover`]: {
               vars: {
-                [vars.color.bg]: tinted.bg[2],
-                [vars.color.border]: tinted.border[2],
+                [vars.color.bg]: tinted.bg[1],
+                [vars.color.border]: tinted.border[1],
                 [vars.color.code.bg]: tinted.bg[3],
                 [vars.color.code.fg]: tinted.fg[3],
                 [vars.color.fg]: tinted.fg[1],
@@ -175,8 +175,8 @@ export const tones = {
 
             [`&.${modes.ghost}:not([data-disabled]):active`]: {
               vars: {
-                [vars.color.bg]: tinted.bg[3],
-                [vars.color.border]: tinted.border[3],
+                [vars.color.bg]: tinted.bg[2],
+                [vars.color.border]: tinted.border[2],
                 [vars.color.code.bg]: tinted.bg[4],
                 [vars.color.code.fg]: tinted.fg[3],
                 [vars.color.fg]: tinted.fg[1],
@@ -189,8 +189,8 @@ export const tones = {
 
             [`&.${modes.ghost}:not([data-disabled])[data-selected]`]: {
               vars: {
-                [vars.color.bg]: tinted.bg[3],
-                [vars.color.border]: tinted.border[3],
+                [vars.color.bg]: tinted.bg[2],
+                [vars.color.border]: tinted.border[2],
                 [vars.color.code.bg]: tinted.bg[4],
                 [vars.color.code.fg]: tinted.fg[3],
                 [vars.color.fg]: tinted.fg[1],

package/src/css/primitives/button/button.ts

@@ -1,8 +1,8 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {display} from '../../props/display'
-import {flex} from '../../props/flex'
-import {radius} from '../../props/radius'
-import {width} from '../../props/width'
+import {display} from '../../props/display/display'
+import {flex} from '../../props/flex/flex'
+import {radius} from '../../props/radius/radius'
+import {width} from '../../props/width/width'
 import {loadingBox, modes, root, tones} from './button.css'
 import type {ButtonStyleProps} from './types'
 

package/src/css/primitives/button/types.ts

@@ -1,8 +1,8 @@
 import type {ThemeColorButtonModeKey, ThemeColorStateToneKey} from '@sanity/ui/theme'
 
-import type {FlexStyleProps} from '../../props/flex'
-import type {RadiusStyleProps} from '../../props/radius'
-import type {WidthStyleProps} from '../../props/width'
+import type {FlexStyleProps} from '../../props/flex/types'
+import type {RadiusStyleProps} from '../../props/radius/types'
+import type {WidthStyleProps} from '../../props/width/types'
 
 /** @public */
 export interface ButtonStyleProps extends FlexStyleProps, RadiusStyleProps, WidthStyleProps {

package/src/css/primitives/card/__workshop__/color.tsx

@@ -10,15 +10,20 @@ import {
   type ThemeColorSchemeKey,
   type ThemeColorVariantKey,
 } from '@sanity/ui/theme'
+import {useSelect} from '@sanity/ui-workshop'
 import {useState} from 'react'
 
+import {WORKSHOP_CARD_TONE_OPTIONS} from '../../../../../workshop'
+
 interface ColorRecordNode extends Record<string, ColorNode> {}
 
 type ColorNode = string | ColorRecordNode
 
 export default function ColorStory() {
+  const tone = useSelect('Tone', WORKSHOP_CARD_TONE_OPTIONS, 'default')
+
   return (
-    <Box display="flex" flexDirection="column" gap={4} padding={4}>
+    <Card display="flex" flexDirection="column" gap={4} padding={4} tone={tone}>
       {Object.entries(vars.color).map(([key, value]) => {
         if (key === 'palette') {
           return null
@@ -38,7 +43,7 @@ export default function ColorStory() {
 
         return <ColorBox key={key} node={{key, value}} />
       })}
-    </Box>
+    </Card>
   )
 }
 
@@ -56,7 +61,7 @@ function ColorBox({node}: {node: {key: string; value: ColorNode}}) {
 
   return (
     <Box overflow="hidden" radius={3} shadow={1}>
-      <Card as="button" onClick={() => setOpen(!open)} padding={3}>
+      <Card as="button" onClick={() => setOpen(!open)} padding={3} tone="inherit">
         <Code size={1}>{`${key} +`}</Code>
       </Card>
 

package/src/css/primitives/code/code.ts

@@ -1,8 +1,8 @@
 import {_composeClassNames} from '../../_composeClassNames'
 import {_responsiveClassName} from '../../_responsiveClassName'
-import {display} from '../../props/display'
-import {flex} from '../../props/flex'
-import {font} from '../../props/font'
+import {display} from '../../props/display/display'
+import {flex} from '../../props/flex/flex'
+import {font} from '../../props/font/font'
 import {root, scale} from './code.css'
 import type {CodeStyleProps} from './types'
 

package/src/css/primitives/code/types.ts

@@ -1,5 +1,5 @@
-import type {FlexStyleProps} from '../../props/flex'
-import type {FontStyleProps} from '../../props/font'
+import type {FlexStyleProps} from '../../props/flex/types'
+import type {FontStyleProps} from '../../props/font/types'
 import type {ResponsiveProp} from '../../types'
 
 /** @public */

package/src/css/primitives/container/container.ts

@@ -1,7 +1,7 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {margin} from '../../props/margin'
-import {maxWidth} from '../../props/maxWidth'
-import {width} from '../../props/width'
+import {margin} from '../../props/margin/margin'
+import {maxWidth} from '../../props/maxWidth/maxWidth'
+import {width} from '../../props/width/width'
 import {root} from './container.css'
 import type {ContainerStyleProps} from './types'
 

package/src/css/primitives/heading/heading.ts

@@ -1,9 +1,9 @@
 import {_composeClassNames} from '../../_composeClassNames'
 import {_responsiveClassName} from '../../_responsiveClassName'
-import {display} from '../../props/display'
-import {flex} from '../../props/flex'
-import {font} from '../../props/font'
-import {textAlign} from '../../props/textAlign'
+import {display} from '../../props/display/display'
+import {flex} from '../../props/flex/flex'
+import {font} from '../../props/font/font'
+import {textAlign} from '../../props/textAlign/textAlign'
 import {muted, root, sizes} from './heading.css'
 import type {HeadingStyleProps} from './types'
 

package/src/css/primitives/heading/types.ts

@@ -1,6 +1,6 @@
-import type {FlexStyleProps} from '../../props/flex'
-import type {FontStyleProps} from '../../props/font'
-import type {TextAlignStyleProps} from '../../props/textAlign'
+import type {FlexStyleProps} from '../../props/flex/types'
+import type {FontStyleProps} from '../../props/font/types'
+import type {TextAlignStyleProps} from '../../props/textAlign/types'
 import type {ResponsiveProp} from '../../types'
 
 /** @public */

package/src/css/primitives/kbd/kbd.ts

@@ -1,5 +1,5 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {radius} from '../../props/radius'
+import {radius} from '../../props/radius/radius'
 import {root} from './kbd.css'
 import type {KBDStyleProps} from './types'
 

package/src/css/primitives/kbd/types.ts

@@ -1,4 +1,4 @@
-import type {RadiusStyleProps} from '../../props/radius'
+import type {RadiusStyleProps} from '../../props/radius/types'
 
 /** @public */
 export interface KBDStyleProps extends RadiusStyleProps {

package/src/css/primitives/label/label.ts

@@ -1,9 +1,9 @@
 import {_composeClassNames} from '../../_composeClassNames'
 import {_responsiveClassName} from '../../_responsiveClassName'
-import {display} from '../../props/display'
-import {flex} from '../../props/flex'
-import {font} from '../../props/font'
-import {textAlign} from '../../props/textAlign'
+import {display} from '../../props/display/display'
+import {flex} from '../../props/flex/flex'
+import {font} from '../../props/font/font'
+import {textAlign} from '../../props/textAlign/textAlign'
 import {muted, root, sizes} from './label.css'
 import type {LabelStyleProps} from './types'
 

package/src/css/primitives/label/types.ts

@@ -1,8 +1,8 @@
 import type {FontLabelSize} from '@sanity/ui/theme'
 
-import type {FlexStyleProps} from '../../props/flex'
-import type {FontStyleProps} from '../../props/font'
-import type {TextAlignStyleProps} from '../../props/textAlign'
+import type {FlexStyleProps} from '../../props/flex/types'
+import type {FontStyleProps} from '../../props/font/types'
+import type {TextAlignStyleProps} from '../../props/textAlign/types'
 import type {ResponsiveProp} from '../../types'
 
 /**

package/src/css/primitives/root/root.ts

@@ -1,7 +1,7 @@
 import {_composeClassNames} from '../../_composeClassNames'
 import {themeClassName} from '../../defaultTheme.css'
-import {height} from '../../props/height'
-import {card} from '../card'
+import {height} from '../../props/height/height'
+import {card} from '../card/card'
 import {_root} from './root.css'
 import type {RootStyleProps} from './types'
 

package/src/css/primitives/root/types.ts

@@ -1,6 +1,6 @@
 import type {ThemeColorCardToneKey, ThemeColorSchemeKey} from '@sanity/ui/theme'
 
-import type {HeightStyleProps} from '../../props/height'
+import type {HeightStyleProps} from '../../props/height/types'
 
 /** @public */
 export interface RootStyleProps extends HeightStyleProps {

package/src/css/primitives/select/select.ts

@@ -1,5 +1,5 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {_input, _inputPresentation} from '../_input'
+import {_input, _inputPresentation} from '../_input/input'
 import {presentation, root} from './select.css'
 import type {SelectStyleProps} from './types'
 

package/src/css/primitives/select/types.ts

@@ -1,4 +1,4 @@
-import type {InputStyleProps} from '../_input'
+import type {InputStyleProps} from '../_input/types'
 
 /** @public */
 // eslint-disable-next-line @typescript-eslint/no-empty-object-type

package/src/css/primitives/text/text.ts

@@ -1,10 +1,10 @@
 import {_composeClassNames} from '../../_composeClassNames'
 import {_responsiveClassName} from '../../_responsiveClassName'
-import {display} from '../../props/display'
-import {flex} from '../../props/flex'
-import {font} from '../../props/font'
-import {maxWidth} from '../../props/maxWidth'
-import {textAlign} from '../../props/textAlign'
+import {display} from '../../props/display/display'
+import {flex} from '../../props/flex/flex'
+import {font} from '../../props/font/font'
+import {maxWidth} from '../../props/maxWidth/maxWidth'
+import {textAlign} from '../../props/textAlign/textAlign'
 import {muted, root, sizes} from './text.css'
 import type {TextStyleProps} from './types'
 

package/src/css/primitives/text/types.ts

@@ -1,7 +1,7 @@
-import type {FlexStyleProps} from '../../props/flex'
-import type {FontStyleProps} from '../../props/font'
-import type {MaxWidthStyleProps} from '../../props/maxWidth'
-import type {TextAlignStyleProps} from '../../props/textAlign'
+import type {FlexStyleProps} from '../../props/flex/types'
+import type {FontStyleProps} from '../../props/font/types'
+import type {MaxWidthStyleProps} from '../../props/maxWidth/types'
+import type {TextAlignStyleProps} from '../../props/textAlign/types'
 import type {ResponsiveProp} from '../../types'
 
 /** @public */

package/src/css/primitives/textArea/textArea.ts

@@ -1,5 +1,5 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {_input} from '../_input'
+import {_input} from '../_input/input'
 import {root} from './textArea.css'
 import type {TextAreaStyleProps} from './types'
 

package/src/css/primitives/textArea/types.ts

@@ -1,4 +1,4 @@
-import type {InputStyleProps} from '../_input'
+import type {InputStyleProps} from '../_input/types'
 
 /** @public */
 

package/src/css/primitives/textInput/textInput.ts

@@ -1,5 +1,5 @@
 import {_composeClassNames} from '../../_composeClassNames'
-import {_input} from '../_input'
+import {_input} from '../_input/input'
 import {element, prefix, root, suffix} from './textInput.css'
 import type {TextInputStyleProps} from './types'
 

package/src/css/primitives/textInput/types.ts

@@ -1,4 +1,4 @@
-import type {InputStyleProps} from '../_input'
+import type {InputStyleProps} from '../_input/types'
 
 /** @public */
 

package/src/css/primitives/tooltip/tooltip.css.ts

@@ -1,6 +1,4 @@
 import {_style} from '../../_style.css'
 import {layers} from '../../layers.css'
 
-export const root = _style(layers.primitives, {
-  // pointerEvents: 'none',
-})
+export const root = _style(layers.primitives, {})

package/src/css/primitives/tooltip/tooltip.ts

@@ -1,10 +1,8 @@
 import {_composeClassNames} from '../../_composeClassNames'
-// import {_scopeClassNames} from '../../_scopeClassNames'
 import {root} from './tooltip.css'
 import type {TooltipStyleProps} from './types'
 
 /** @public */
 export function tooltip(props: TooltipStyleProps): string | undefined {
-  // return _scopeClassNames('tooltip')
   return _composeClassNames(props.className, root)
 }

package/src/theme/v3/defaultTokens.ts

@@ -146,11 +146,11 @@ export const defaultTokens: PartialTokens<Tokens> = {
           '*': {
             bg: {
               0: ['gray-50', 'black'],
-              4: ['200', '800'],
+              4: ['300 75%', '700 75%'],
             },
             border: {
-              0: ['200 50%', '800 50%'],
-              4: ['300', '600'],
+              0: ['200', '800 75%'],
+              4: ['400', '700'],
             },
             fg: {
               0: ['black', '100'],
@@ -166,11 +166,11 @@ export const defaultTokens: PartialTokens<Tokens> = {
           '*': {
             bg: {
               0: ['white', '950'],
-              4: ['300 50%', '700'],
+              4: ['300 75%', '700'],
             },
             border: {
-              0: ['200 50%', '800 50%'],
-              4: ['300 75%', '600'],
+              0: ['200', '800 75%'],
+              4: ['400', '700'],
             },
             fg: {
               0: ['black', 'white'],

package/src/core/_compat/index.ts

@@ -1,4 +0,0 @@
-export * from './helpers'
-export * from './styles'
-export * from './theme'
-export * from './types'

package/src/core/_compat/styles/index.ts

@@ -1 +0,0 @@
-export * from './_responsive'

package/src/core/_compat/theme/index.ts

@@ -1,5 +0,0 @@
-export * from './themeColorProvider'
-export * from './themeProvider'
-export * from './types'
-export * from './useRootTheme'
-export * from './useTheme'

package/src/core/components/breadcrumbs/index.ts

@@ -1 +0,0 @@
-export * from './breadcrumbs'

package/src/core/components/dialog/index.ts

@@ -1,5 +0,0 @@
-export * from './dialog'
-export * from './dialogContext'
-export * from './dialogProvider'
-export * from './types'
-export * from './useDialog'

package/src/core/components/hotkeys/index.ts

@@ -1 +0,0 @@
-export * from './hotkeys'

package/src/core/components/menu/index.ts

@@ -1,5 +0,0 @@
-export * from './menu'
-export * from './menuButton'
-export * from './menuDivider'
-export * from './menuGroup'
-export * from './menuItem'

package/src/core/components/tab/index.ts

@@ -1,3 +0,0 @@
-export * from './tab'
-export * from './tabList'
-export * from './tabPanel'

package/src/core/components/toast/index.ts

@@ -1,4 +0,0 @@
-export * from './toast'
-export * from './toastProvider'
-export * from './types'
-export * from './useToast'

package/src/core/components/tree/index.ts

@@ -1,4 +0,0 @@
-export * from './tree'
-export * from './treeItem'
-export * from './types'
-export * from './useTree'

package/src/core/components/virtualList/index.ts

@@ -1 +0,0 @@
-export * from './virtualList'

package/src/core/hooks/useElementRect/index.ts

@@ -1 +0,0 @@
-export * from './useElementRect'