@a-type/ui 2.7.6 → 2.8.1

package/dist/esm/components/navBar/NavBar.js

@@ -15,25 +15,25 @@ import { Slot } from '@radix-ui/react-slot';
 import classNames, { clsx } from 'clsx';
 import { withClassName } from '../../hooks.js';
 import { Icon } from '../icon/index.js';
-export const navBarItemClass = classNames('layer-components:flex layer-components:flex-col layer-components:items-center layer-components:justify-center layer-components:whitespace-nowrap layer-components:py-1 layer-components:px-3 layer-components:bg-transparent layer-components:rounded-sm layer-components:border-none layer-components:cursor-pointer layer-components:text-sm layer-components:transition-colors layer-components:h-full layer-components:gap-6px layer-components:relative layer-components:color-black layer-components:select-none', 'layer-components:active:bg-darken-2', 'layer-components:hover:bg-darken-1', 'layer-components:focus-visible:outline-none layer-components:focus-visible:bg-darken-2 layer-components:focus-visible:ring-1 layer-components:focus-visible:ring-primary', 'layer-components:[&[data-active=true]]:bg-primary-light/50 layer-components:[&[data-active=true]]:color-lighten-2 layer-components:[&[data-active=true]]:color-black', 'layer-components:[--fill:var(--color-primary)]', 'layer-responsive:md:flex-row-reverse layer-responsive:md:h-auto layer-responsive:md:justify-start layer-responsive:md:gap-2 layer-responsive:md:overflow-visible layer-responsive:md:active:bg-darken-2');
+export const navBarItemClass = classNames('layer-components:(flex flex-col items-center justify-center whitespace-nowrap py-1 px-3 bg-transparent rounded-sm border-none cursor-pointer text-sm transition-colors h-full gap-6px relative color-black select-none)', 'layer-components:active:bg-darken-2', 'layer-components:hover:bg-darken-1', 'layer-components:focus-visible:(outline-none bg-darken-2 ring-1 ring-primary)', 'layer-components:[&[data-active=true]]:(bg-primary-light/50 color-lighten-2 color-black)', 'layer-components:([--fill:var(--color-primary)])', 'layer-responsive:md:(flex-row-reverse h-auto justify-start gap-2 overflow-visible active:bg-darken-2)');
 export const NavBarItem = function NavBarItem(_a) {
     var { ref, asChild, className, active, color } = _a, rest = __rest(_a, ["ref", "asChild", "className", "active", "color"]);
     const Comp = asChild ? Slot : 'button';
     return (_jsx(Comp, Object.assign({ ref: ref, className: classNames(navBarItemClass, color === 'neutral' && [
-            'layer-variants:[&[data-active=true]]:bg-gray/30 layer-variants:[&[data-active=true]]:color-black',
-            'layer-variants:[--fill:var(--color-gray)]',
+            'layer-variants:[&[data-active=true]]:(bg-gray/30 color-black)',
+            'layer-variants:([--fill:var(--color-gray)])',
             'layer-variants:focus-visible:ring-gray',
         ], className), "data-active": active }, rest)));
 };
-export const NavBarItemIconWrapper = withClassName('div', 'layer-components:relative layer-components:flex layer-components:md:p-6px layer-components:md:rounded-lg layer-components:md:bg-gray-blend', 'layer-variants:md:[*[data-active=true]_&]:bg-[var(--bg)]');
-export const NavBarItemText = withClassName('span', 'layer-components:overflow-hidden layer-components:inline-block layer-components:text-xxs layer-components:whitespace-nowrap layer-components:text-ellipsis layer-components:md:text-md layer-components:md:leading-normal');
+export const NavBarItemIconWrapper = withClassName('div', 'layer-components:(relative flex) layer-components:md:(p-6px rounded-lg bg-gray-blend)', 'layer-variants:md:[*[data-active=true]_&]:bg-[var(--bg)]');
+export const NavBarItemText = withClassName('span', 'layer-components:(overflow-hidden inline-block text-xxs whitespace-nowrap text-ellipsis) layer-components:md:(text-md leading-normal)');
 export const NavBarItemIcon = function NavBarItemIcon(_a) {
     var { ref, children, asChild, className, name = 'placeholder' } = _a, rest = __rest(_a, ["ref", "children", "asChild", "className", "name"]);
     const Comp = asChild ? Slot : Icon;
-    return (_jsx(Comp, Object.assign({ name: name, className: clsx('layer-components:relative layer-components:z-1 layer-components:flex layer-components:fill-none layer-components:color-inherit', 'layer-variants:[*[data-active=true]_&]:fill-[var(--fill)]', className) }, rest, { ref: ref, children: children })));
+    return (_jsx(Comp, Object.assign({ name: name, className: clsx('layer-components:(relative z-1 flex fill-none color-inherit)', 'layer-variants:[*[data-active=true]_&]:fill-[var(--fill)]', className) }, rest, { ref: ref, children: children })));
 };
-export const NavBarItemPip = withClassName('div', 'layer-components:absolute layer-components:top-6px layer-components:right-6px layer-components:w-6px layer-components:h-6px layer-components:rounded-lg layer-components:bg-attention layer-components:shadow-sm');
-export const NavBarRoot = withClassName('div', 'layer-components:grid layer-components:[grid-auto-columns:1fr] layer-components:[grid-auto-flow:column] layer-components:justify-items-center layer-components:w-full layer-components:rounded-none layer-components:overflow-hidden layer-components:z-50 layer-components:p-1 layer-components:h-auto', 'pb-[calc(0.25rem+env(safe-area-inset-bottom,0px))]', 'layer-components:md:bg-transparent layer-components:md:flex layer-components:md:flex-col layer-components:md:rounded-none layer-components:md:border-none layer-components:md:border-transparent layer-components:md:shadow-none layer-components:md:h-min-content layer-components:md:overflow-y-auto layer-components:md:overflow-x-hidden layer-components:md:justify-start layer-components:md:items-stretch layer-components:md:gap-2 layer-components:md:pb-10');
+export const NavBarItemPip = withClassName('div', 'layer-components:(absolute top-6px right-6px w-6px h-6px rounded-lg bg-attention shadow-sm)');
+export const NavBarRoot = withClassName('div', 'layer-components:(grid [grid-auto-columns:1fr] [grid-auto-flow:column] justify-items-center w-full rounded-none overflow-hidden z-50 p-1 h-auto)', 'pb-[calc(0.25rem+env(safe-area-inset-bottom,0px))]', 'layer-components:md:(bg-transparent flex flex-col rounded-none border-none border-transparent shadow-none h-min-content overflow-y-auto overflow-x-hidden justify-start items-stretch gap-2 pb-10)');
 export const NavBar = Object.assign(NavBarRoot, {
     Item: NavBarItem,
     ItemIcon: NavBarItemIcon,

package/dist/esm/components/note/Note.js

@@ -14,6 +14,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'clsx';
 export function Note(_a) {
     var { className, children } = _a, rest = __rest(_a, ["className", "children"]);
-    return (_jsx("div", Object.assign({ className: classNames(className) }, rest, { children: _jsxs("div", { className: "layer-components:flex layer-components:flex-row", children: [_jsx("div", { className: "layer-components:flex-1 layer-components:p-2 layer-components:border layer-components:border-solid layer-components:border-primary-dark layer-components:bg-primary-wash layer-components:color-black layer-components:relative layer-components:text-sm layer-components:italic layer-variants:border-r-0", children: children }), _jsxs("div", { className: "layer-components:flex layer-components:flex-col layer-components:items-stretch layer-components:justify-stretch layer-components:flex-[0_0_20px]", "aria-hidden": true, children: [_jsxs("div", { className: "layer-components:border-0 layer-components:border-solid layer-components:border-primary-dark layer-components:flex-[0_0_20px] layer-components:w-[20px] layer-components:h-[20px] layer-components:relative layer-variants:border-b-1px layer-variants:border-l-1px", children: [_jsx("div", { className: "layer-components:absolute layer-components:w-0.5px layer-components:bg-primary-dark layer-components:h-27px layer-components:rotate--45 layer-components:left-9px layer-components:top--3px layer-components:transform-origin-cc" }), _jsx("div", { className: `layer-components:border-solid layer-components:box-content layer-components:border-transparent layer-components:border-r-primary-wash layer-components:border-13px layer-components:w-0 layer-components:h-0 layer-components:rotate--45 layer-components:translate--7px layer-components:transform-origin-br` })] }), _jsx("div", { className: "layer-components:bg-primary-wash layer-components:flex-1 layer-components:border-0 layer-components:border-solid layer-components:border-primary-dark layer-variants:border-r-1px layer-variants:border-b-1px" })] })] }) })));
+    return (_jsx("div", Object.assign({ className: classNames(className) }, rest, { children: _jsxs("div", { className: "layer-components:(flex flex-row)", children: [_jsx("div", { className: "layer-components:(flex-1 p-2 border border-solid border-primary-dark bg-primary-wash color-black relative text-sm italic) layer-variants:border-r-0", children: children }), _jsxs("div", { className: "layer-components:(flex flex-col items-stretch justify-stretch flex-[0_0_20px])", "aria-hidden": true, children: [_jsxs("div", { className: "layer-components:(border-0 border-solid border-primary-dark flex-[0_0_20px] w-[20px] h-[20px] relative) layer-variants:(border-b-1px border-l-1px)", children: [_jsx("div", { className: "layer-components:(absolute w-0.5px bg-primary-dark h-27px rotate--45 left-9px top--3px transform-origin-cc)" }), _jsx("div", { className: `layer-components:(border-solid box-content border-transparent border-r-primary-wash border-13px w-0 h-0 rotate--45 translate--7px transform-origin-br)` })] }), _jsx("div", { className: "layer-components:(bg-primary-wash flex-1 border-0 border-solid border-primary-dark) layer-variants:(border-r-1px border-b-1px)" })] })] }) })));
 }
 //# sourceMappingURL=Note.js.map

package/dist/esm/components/numberStepper/NumberStepper.js

@@ -47,9 +47,9 @@ export function NumberStepper(_a) {
     const canDecrement = !disabled &&
         (steps ? index > 0 : true) &&
         (min === undefined || value > min);
-    return (_jsxs("div", Object.assign({ className: classNames('layer-components:flex layer-components:items-center layer-components:border-solid layer-components:border layer-components:border-gray-dark layer-components:rounded-lg layer-components:overflow-hidden layer-components:w-min-content layer-components:flex-shrink-0 layer-components:bg-white layer-components:shadow-sm', disabled &&
-            'layer-variants:border-gray-dark-blend layer-variants:bg-transparent layer-variants:shadow-none', {
-            'layer-variants:bg-accent-wash layer-variants:color-black': !!highlightChange && value !== 1,
+    return (_jsxs("div", Object.assign({ className: classNames('layer-components:(flex items-center border-solid border border-gray-dark rounded-lg overflow-hidden w-min-content flex-shrink-0 bg-white shadow-sm)', disabled &&
+            'layer-variants:(border-gray-dark-blend bg-transparent shadow-none)', {
+            'layer-variants:(bg-accent-wash color-black)': !!highlightChange && value !== 1,
         }, className) }, rest, { children: [_jsx(Button, { color: "ghost", onClick: decrement, disabled: !canDecrement, "aria-label": "Decrement value", children: _jsx(Icon, { name: "minus" }) }), _jsx("div", { className: "w-80px text-center", children: renderValue(value) }), _jsx(Button, { color: "ghost", onClick: increment, disabled: !canIncrement, "aria-label": "Increment value", children: _jsx(Icon, { name: "plus" }) })] })));
 }
 //# sourceMappingURL=NumberStepper.js.map

package/dist/esm/components/peek/Peek.js

@@ -27,9 +27,9 @@ export function Peek({ peekHeight = 120, children, className }) {
     }, [peekHeight]);
     const id = useId();
     return (_jsxs("div", { className: classNames('relative', '[&[data-state=closed]]:max-h-[var(--peek-height,120px)] overflow-hidden', hasInteracted.current &&
-            'animate-ease-default animate-forwards [&[data-state=closed]]:animate-keyframes-peek-close [&[data-state=closed]]:animate-duration-300 [&[data-state=open]]:animate-keyframes-peek-open [&[data-state=open]]:animate-duration-600 [&[data-state=open]]:animate-forwards', className), ref: containerRef, "data-state": isPeekable ? (open ? 'open' : 'closed') : 'closed', style: {
+            'animate-ease-default animate-forwards [&[data-state=closed]]:(animate-keyframes-peek-close animate-duration-300) [&[data-state=open]]:(animate-keyframes-peek-open animate-duration-600 animate-forwards)', className), ref: containerRef, "data-state": isPeekable ? (open ? 'open' : 'closed') : 'closed', style: {
             '--peek-height': `${peekHeight}px`,
             '--collapsible-height': '0px',
-        }, children: [_jsx("div", { ref: contentRef, id: id, children: children }), isPeekable && (_jsx("button", { "data-state": open ? 'open' : 'closed', className: classNames('h-80px absolute bottom-0 z-1 bg-transparent border-none w-full cursor-pointer border-b border-b-solid border-white', 'animate-fade-in', 'focus-visible:(outline-none bg-gradient-to-b from-transparent to-primary-wash border-b border-b-solid border-primary', 'after:content-["-_tap_to_expand_-"] after:p-3 after:color-gray-dark after:text-xs after:flex after:flex-col after:justify-end after:items-center after:absolute after:inset-0 after:top-auto after:h-80px after:bg-gradient-to-b after:from-transparent after:to-white', 'after:[&[data-state=open]]:content-["-_tap_to_collapse_-"]'), onClick: toggle, "aria-label": "Toggle show description", "aria-expanded": open, "aria-controls": id }))] }));
+        }, children: [_jsx("div", { ref: contentRef, id: id, children: children }), isPeekable && (_jsx("button", { "data-state": open ? 'open' : 'closed', className: classNames('h-80px absolute bottom-0 z-1 bg-transparent border-none w-full cursor-pointer border-b border-b-solid border-white', 'animate-fade-in', 'focus-visible:(outline-none bg-gradient-to-b from-transparent to-primary-wash border-b border-b-solid border-primary', 'after:(content-["-_tap_to_expand_-"] p-3 color-gray-dark text-xs flex flex-col justify-end items-center absolute inset-0 top-auto h-80px bg-gradient-to-b from-transparent to-white)', 'after:[&[data-state=open]]:content-["-_tap_to_collapse_-"]'), onClick: toggle, "aria-label": "Toggle show description", "aria-expanded": open, "aria-controls": id }))] }));
 }
 //# sourceMappingURL=Peek.js.map

package/dist/esm/components/popover/Popover.js

@@ -16,9 +16,9 @@ import * as PopoverPrimitive from '@radix-ui/react-popover';
 import classNames from 'clsx';
 import { withClassName } from '../../hooks/withClassName.js';
 import { BoxContext } from '../box/Box.js';
-const StyledContent = withClassName(PopoverPrimitive.Content, 'layer-components:rounded-xl layer-components:min-w-120px layer-components:bg-white layer-components:z-menu layer-components:shadow-lg layer-components:op-0 layer-components:hidden layer-components:max-w-90vw layer-components:border layer-components:border-gray-dark', 'will-change-transform', 'layer-components:transform-origin-[var(--radix-popover-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'important:motion-reduce:animate-none', 'layer-components:max-h-[var(--radix-popover-content-available-height)]', 'layer-components:[&[data-state=open]]:opacity-100 layer-components:[&[data-state=open]]:flex layer-components:[&[data-state=open]]:flex-col', 'layer-components:[&[data-state=closed]]:pointer-events-none');
-const StyledArrow = withClassName(PopoverPrimitive.Arrow, 'layer-components:arrow');
-const StyledClose = withClassName(PopoverPrimitive.Close, 'layer-components:[all:unset] layer-components:[font-family:inherit] layer-components:rounded-lg layer-components:h-25px layer-components:w-25px layer-components:inline-flex layer-components:items-center layer-components:justify-center layer-components:color-dark-blend layer-components:absolute layer-components:top-5px layer-components:right-5px layer-components:hover:bg-lightBlend layer-components:focus:shadow-focus');
+const StyledContent = withClassName(PopoverPrimitive.Content, 'layer-components:(rounded-xl min-w-120px bg-white z-menu shadow-lg op-0 hidden max-w-90vw border border-gray-dark)', 'will-change-transform', 'layer-components:transform-origin-[var(--radix-popover-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'important:motion-reduce:animate-none', 'layer-components:(max-h-[var(--radix-popover-content-available-height)])', 'layer-components:[&[data-state=open]]:(opacity-100 flex flex-col)', 'layer-components:[&[data-state=closed]]:pointer-events-none');
+const StyledArrow = withClassName(PopoverPrimitive.Arrow, 'layer-components:(arrow)');
+const StyledClose = withClassName(PopoverPrimitive.Close, 'layer-components:([all:unset] [font-family:inherit] rounded-lg h-25px w-25px inline-flex items-center justify-center color-dark-blend absolute top-5px right-5px hover:bg-lightBlend focus:shadow-focus)');
 // Exports
 export const PopoverRoot = PopoverPrimitive.Root;
 export const PopoverTrigger = PopoverPrimitive.Trigger;

package/dist/esm/components/progress/Progress.js

@@ -13,8 +13,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as ProgressPrimitive from '@radix-ui/react-progress';
 import { withClassName } from '../../hooks.js';
-export const ProgressRoot = withClassName(ProgressPrimitive.Root, 'layer-components:w-full layer-components:relative layer-components:overflow-hidden layer-components:border layer-components:border-default layer-components:rounded-lg');
-export const ProgressIndicator = withClassName(ProgressPrimitive.Indicator, 'layer-components:bg-primary layer-components:w-full layer-components:h-6px layer-components:translate-x-[calc(-100%*(1-var(--value)))] layer-components:rounded-lg layer-components:transition-transform', 'layer-components:[&[data-state=complete]]:bg-accent', 'layer-variants:[&[data-color=accent]]:bg-accent');
+export const ProgressRoot = withClassName(ProgressPrimitive.Root, 'layer-components:(w-full relative overflow-hidden border border-default rounded-lg)');
+export const ProgressIndicator = withClassName(ProgressPrimitive.Indicator, 'layer-components:(bg-primary w-full h-6px translate-x-[calc(-100%*(1-var(--value)))] rounded-lg transition-transform)', 'layer-components:[&[data-state=complete]]:(bg-accent)', 'layer-variants:[&[data-color=accent]]:(bg-accent)');
 const ProgressBase = function ProgressBase(_a) {
     var { ref, children, color, max = 100, value } = _a, props = __rest(_a, ["ref", "children", "color", "max", "value"]);
     return (_jsx(ProgressRoot, Object.assign({}, props, { value: value, max: max, ref: ref, children: _jsx(ProgressIndicator, { "data-color": color, 

package/dist/esm/components/richEditor/index.js

@@ -1,5 +1,5 @@
 // @unocss-include
 import clsx from 'clsx';
-export const tipTapClassName = clsx('layer-components:w-full layer-components:leading-relaxed', 'layer-components:[&_.ProseMirror:focus]:outline-none layer-components:[&_.ProseMirror:focus]:shadow-focus', 'layer-components:[&_h1,h2,h3,p]:mt-0', 'layer-components:[&_h1]:text-2xl layer-components:[&_h1]:font-semibold layer-components:[&_h1]:mb-md layer-components:[&_h1]:[&:not:first-child]:mt-xl', 'layer-components:[&_h2]:text-lg layer-components:[&_h2]:font-bold layer-components:[&_h2]:color-gray-dark layer-components:[&_h2]:color-darken-3 layer-components:[&_h2]:mb-md layer-components:[&_h2]:[&:not:first-child]:mt-lg', 'layer-components:[&_h3]:text-md layer-components:[&_h3]:font-500 layer-components:[&_h3]:color-gray-dark layer-components:[&_h3]:color-darken-2 layer-components:[&_h3]:mb-sm layer-components:[&_h3]:[&:not:first-child]:mt-md', 'layer-components:[&_h4]:text-xs layer-components:[&_h4]:color-gray-dark layer-components:[&_h4]:color-darken-1 layer-components:[&_h4]:mb-sm layer-components:[&_h4]:[&:not:first-child]:mt-md layer-components:[&_h4]:uppercase', 'layer-components:[&_p]:mb-md layer-components:[&_p]:mt-0', 'layer-components:[&_a]:underline', 'layer-components:[&_blockquote]:border-l-4 layer-components:[&_blockquote]:border-l-solid layer-components:[&_blockquote]:border-gray layer-components:[&_blockquote]:pl-4 layer-components:[&_blockquote]:mb-md layer-components:[&_blockquote]:mt-md layer-components:[&_blockquote]:ml-md', 'layer-components:[&_ul]:list-disc layer-components:[&_ul]:pl-6 layer-components:[&_ul]:mb-md layer-components:[&_ul]:mt-md', 'layer-components:[&_ol]:list-decimal layer-components:[&_ol]:pl-6 layer-components:[&_ol]:mb-md layer-components:[&_ol]:mt-md', 'layer-components:[&_li]:mb-sm', 'layer-components:[&_mark]:bg-primary-wash layer-components:[&_mark]:bg-darken-2', 'layer-components:[&_strong]:font-semibold', 'layer-components:[&_em]:italic', 'layer-components:[&_hr]:my-lg layer-components:[&_hr]:border-gray', 'layer-components:[&_a]:underline', 'layer-components:[&_a:hover]:underline', 'layer-components:[&_a:focus]:outline-none layer-components:[&_a:focus]:shadow-focus', 'layer-components:[&_a:focus-visible]:outline-none layer-components:[&_a:focus-visible]:ring-inset layer-components:[&_a:focus-visible]:ring-4 layer-components:[&_a:focus-visible]:ring-gray', 'layer-components:[&_.ProseMirror]:bg-white layer-components:[&_.ProseMirror]:rounded-[20px] layer-components:[&_.ProseMirror]:px-4 layer-components:[&_.ProseMirror]:py-2 layer-components:[&_.ProseMirror]:shadow-sm-inset layer-components:[&_.ProseMirror]:border-gray-dark layer-components:[&_.ProseMirror]:border-solid layer-components:[&_.ProseMirror]:border-1');
-export const tipTapReadonlyClassName = clsx('[&_.ProseMirror]:bg-transparent [&_.ProseMirror]:border-none [&_.ProseMirror]:shadow-none', '[&_.ProseMirror:focus]:outline-none [&_.ProseMirror:focus]:shadow-none [&_.ProseMirror:focus]:bg-transparent');
+export const tipTapClassName = clsx('layer-components:(w-full leading-relaxed)', 'layer-components:[&_.ProseMirror:focus]:(outline-none shadow-focus)', 'layer-components:[&_h1,h2,h3,p]:mt-0', 'layer-components:[&_h1]:(text-2xl font-semibold mb-md [&:not:first-child]:mt-xl)', 'layer-components:[&_h2]:(text-lg font-bold color-gray-dark color-darken-3 mb-md [&:not:first-child]:mt-lg)', 'layer-components:[&_h3]:(text-md font-500 color-gray-dark color-darken-2 mb-sm [&:not:first-child]:mt-md)', 'layer-components:[&_h4]:(text-xs color-gray-dark color-darken-1 mb-sm [&:not:first-child]:mt-md uppercase)', 'layer-components:[&_p]:(mb-md mt-0)', 'layer-components:[&_a]:underline', 'layer-components:[&_blockquote]:(border-l-4 border-l-solid border-gray pl-4 mb-md mt-md ml-md)', 'layer-components:[&_ul]:(list-disc pl-6 mb-md mt-md)', 'layer-components:[&_ol]:(list-decimal pl-6 mb-md mt-md)', 'layer-components:[&_li]:(mb-sm)', 'layer-components:[&_mark]:(bg-primary-wash bg-darken-2)', 'layer-components:[&_strong]:(font-semibold)', 'layer-components:[&_em]:(italic)', 'layer-components:[&_hr]:(my-lg border-gray)', 'layer-components:[&_a]:(underline)', 'layer-components:[&_a:hover]:(underline)', 'layer-components:[&_a:focus]:(outline-none shadow-focus)', 'layer-components:[&_a:focus-visible]:(outline-none ring-inset ring-4 ring-gray)', 'layer-components:[&_.ProseMirror]:(bg-white rounded-[20px] px-4 py-2 shadow-sm-inset border-gray-dark border-solid border-1)');
+export const tipTapReadonlyClassName = clsx('[&_.ProseMirror]:(bg-transparent border-none shadow-none)', '[&_.ProseMirror:focus]:(outline-none shadow-none bg-transparent)');
 //# sourceMappingURL=index.js.map

package/dist/esm/components/scrollArea/ScrollArea.js

@@ -20,8 +20,8 @@ export const ScrollAreaRoot = function ScrollAreaRoot(_a) {
     return _jsx(ScrollAreaRootImpl, Object.assign({ ref: ref }, props));
 };
 export const ScrollAreaViewport = withClassName(Primitive.Viewport, 'h-full w-full rounded-inherit', '[background:linear-gradient(var(--v-bg)_30%,rgba(255,255,255,0))_center_top,linear-gradient(rgba(255,255,255,0),var(--v-bg)_70%)_center_bottom,radial-gradient(farthest-side_at_50%_0,oklch(from_var(--v-bg)_calc(l*0.9)_c_h),rgba(0,0,0,0))_center_top,radial-gradient(farthest-side_at_50%_100%,oklch(from_var(--v-bg)_calc(l*0.9)_c_h),rgba(0,0,0,0))_center_bottom]', '![background-repeat:no-repeat] ![background-size:100%_40px,100%_40px,100%_14px,100%_14px]', '![background-attachment:local,local,scroll,scroll]');
-export const ScrollAreaScrollbarRoot = withClassName(Primitive.Scrollbar, 'layer-components:flex layer-components:select-none layer-components:touch-none layer-components:p-0.5 layer-components:bg-inherit layer-components:bg-lighten-2 layer-components:transition-colors layer-components:duration-160ms layer-components:ease-out', 'layer-components:[&[data-orientation=vertical]]:w-2.5', 'layer-components:[&[data-orientation=horizontal]]:flex-col layer-components:[&[data-orientation=horizontal]]:h-2.5');
-export const ScrollAreaThumb = withClassName(Primitive.Thumb, 'layer-components:flex-1 layer-components:rounded-lg layer-components:relative layer-components:bg-inherit layer-components:bg-darken-2', 'before:content-[""] before:absolute before:left-1/2 before:top-1/2 before:-translate-x-1/2 before:-translate-y-1/2 before:w-full before:min-w-44px before:min-h-44px');
+export const ScrollAreaScrollbarRoot = withClassName(Primitive.Scrollbar, 'layer-components:(flex select-none touch-none p-0.5 bg-inherit bg-lighten-2 transition-colors duration-160ms ease-out)', 'layer-components:[&[data-orientation=vertical]]:w-2.5', 'layer-components:[&[data-orientation=horizontal]]:(flex-col h-2.5)');
+export const ScrollAreaThumb = withClassName(Primitive.Thumb, 'layer-components:(flex-1 rounded-lg relative bg-inherit bg-darken-2)', 'before:(content-[""] absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-full min-w-44px min-h-44px)');
 export const ScrollAreaScrollbar = function ScrollAreaScrollbar(_a) {
     var { ref } = _a, props = __rest(_a, ["ref"]);
     return (_jsx(ScrollAreaScrollbarRoot, Object.assign({}, props, { ref: ref, children: _jsx(ScrollAreaThumb, {}) })));

package/dist/esm/components/select/Select.js

@@ -28,7 +28,7 @@ export const SelectItem = (_a) => {
     }
     return (_jsxs(SelectItemRoot, Object.assign({ className: className }, props, { ref: forwardedRef, children: [_jsx(SelectPrimitive.ItemText, { children: children }), _jsx(SelectItemIndicator, {})] })));
 };
-export const SelectItemRoot = withClassName(SelectPrimitive.Item, 'layer-components:text-md layer-components:leading-4 layer-components:color-black layer-components:flex layer-components:items-center layer-components:flex-row layer-components:h-36px layer-components:pr-4 layer-components:pl-35px layer-components:relative layer-components:select-none', 'layer-components:[&[data-disabled]]:color-gray layer-components:[&[data-disabled]]:pointer-events-none [&[data-highlighted]]:outline-none [&[data-highlighted]]:bg-gray [&[data-highlighted]]:bg-lighten-3 [&[data-highlighted]]:color-black');
+export const SelectItemRoot = withClassName(SelectPrimitive.Item, 'layer-components:(text-md leading-4 color-black flex items-center flex-row h-36px pr-4 pl-35px relative select-none)', 'layer-components:[&[data-disabled]]:(color-gray pointer-events-none) [&[data-highlighted]]:(outline-none bg-gray bg-lighten-3 color-black)');
 export const SelectItemIndicatorRoot = withClassName(SelectPrimitive.ItemIndicator, 'absolute left-0 w-25px inline-flex items-center justify-center');
 export const SelectItemIndicator = withNoNativeRender((props) => (_jsx(SelectItemIndicatorRoot, Object.assign({}, props, { children: _jsx(Icon, { name: "check" }) }))));
 export const SelectItemText = withClassName(SelectPrimitive.ItemText, '');
@@ -40,7 +40,7 @@ export const SelectGroup = (props) => {
     return _jsx(SelectPrimitive.Group, Object.assign({}, props));
 };
 export const SelectRoot = SelectPrimitive.Root;
-export const selectTriggerClassName = classNames(getButtonClassName({ color: 'default' }), 'layer-components:[all:unset] layer-components:inline-flex layer-components:[&[data-placeholder]]:color-gray-dark');
+export const selectTriggerClassName = classNames(getButtonClassName({ color: 'default' }), 'layer-components:([all:unset] inline-flex [&[data-placeholder]]:color-gray-dark)');
 export const SelectTriggerBase = withNoNativeRender(withClassName(SelectPrimitive.Trigger, selectTriggerClassName));
 export const UnstyledSelectTrigger = withNoNativeRender(SelectPrimitive.Trigger);
 export const SelectTrigger = function SelectTrigger(_a) {
@@ -61,7 +61,7 @@ const contentStyle = {
 const viewportStyle = { '--local-corner-scale': '0.9' };
 export const SelectContent = withPassthroughNativeRender((_a) => {
     var { ref: forwardedRef, children, inDialog, className } = _a, props = __rest(_a, ["ref", "children", "inDialog", "className"]);
-    return (_jsx(SelectPrimitive.Portal, { children: _jsx(BoxContext.Provider, { value: { spacingScale: 1 }, children: _jsxs(SelectPrimitive.Content, Object.assign({ className: classNames('layer-components:overflow-hidden layer-components:bg-white layer-components:rounded-md layer-components:border layer-components:border-solid layer-components:border layer-components:border-black layer-components:z-menu layer-components:shadow-lg', 'layer-components:transform-origin-[var(--radix-select-content-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'layer-components:min-w-[var(--radix-select-trigger-width)] layer-components:max-h-[var(--radix-select-content-available-height)]', inDialog && 'z-[calc(var(--z-dialog)+1)]', className), style: contentStyle }, props, { ref: forwardedRef, children: [_jsx(SelectPrimitive.ScrollUpButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: _jsx(Icon, { name: "chevron", className: "rotate-180" }) }), _jsx(SelectPrimitive.Viewport, { style: viewportStyle, children: children }), _jsx(SelectPrimitive.ScrollDownButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: _jsx(Icon, { name: "chevron" }) })] })) }) }));
+    return (_jsx(SelectPrimitive.Portal, { children: _jsx(BoxContext.Provider, { value: { spacingScale: 1 }, children: _jsxs(SelectPrimitive.Content, Object.assign({ className: classNames('layer-components:(overflow-hidden bg-white rounded-md border border-solid border border-black z-menu shadow-lg)', 'layer-components:transform-origin-[var(--radix-select-content-transform-origin)]', 'layer-components:[&[data-state=open]]:animate-popover-in', 'layer-components:[&[data-state=closed]]:animate-popover-out', 'layer-components:(min-w-[var(--radix-select-trigger-width)] max-h-[var(--radix-select-content-available-height)])', inDialog && 'z-[calc(var(--z-dialog)+1)]', className), style: contentStyle }, props, { ref: forwardedRef, children: [_jsx(SelectPrimitive.ScrollUpButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: _jsx(Icon, { name: "chevron", className: "rotate-180" }) }), _jsx(SelectPrimitive.Viewport, { style: viewportStyle, children: children }), _jsx(SelectPrimitive.ScrollDownButton, { className: "flex items-center justify-center h-25px bg-white color-primary-dark cursor-default", children: _jsx(Icon, { name: "chevron" }) })] })) }) }));
 });
 export const NativeSelect = (_a) => {
     var { ref: forwardedRef, className } = _a, props = __rest(_a, ["ref", "className"]);

package/dist/esm/components/slider/Slider.js

@@ -13,10 +13,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as SliderPrimitive from '@radix-ui/react-slider';
 import { withClassName } from '../../hooks.js';
-export const SliderRoot = withClassName(SliderPrimitive.Root, 'layer-components:relative layer-components:flex layer-components:items-center layer-components:select-none layer-components:touch-none layer-components:w-full layer-components:h-30px layer-components:translate-z-0');
-export const SliderTrack = withClassName(SliderPrimitive.Track, 'layer-components:bg-transparent layer-components:relative layer-components:grow layer-components:rounded-lg layer-components:h-9px layer-components:border layer-components:borderpx layer-components:border-solid layer-components:border-black');
-export const SliderRange = withClassName(SliderPrimitive.Range, 'layer-components:absolute layer-components:bg-accent layer-components:rounded-lg layer-components:h-full', 'layer-variants:[&[data-color=primary]]:bg-primary');
-export const SliderThumb = withClassName(SliderPrimitive.Thumb, 'layer-components:block layer-components:w-5 layer-components:h-5 layer-components:bg-white layer-components:shadow-sm layer-components:rounded-lg layer-components:ring-2 layer-components:ring-black layer-components:touch-none layer-components:transition-all', 'layer-components:hover:shadow-md', 'layer-components:active:shadow-lg layer-components:active:ring-4 layer-components:active:ring-accent-dark layer-components:active:ring-opacity-50 layer-components:active:bg-accent-light', 'layer-components:focus-visible:shadow-lg layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-accent-dark layer-components:focus-visible:ring-opacity-50 layer-components:focus-visible:outline-none layer-components:focus-visible:bg-accent-light', 'layer-components:focus:outline-none', 'layer-components:disabled:opacity-50', 'layer-variants:[&[data-color=primary]]:active:bg-primary layer-variants:[&[data-color=primary]]:active:ring-primary-dark', 'layer-variants:[&[data-color=primary]]:focus-visible:bg-primary layer-variants:[&[data-color=primary]]:focus-visible:ring-primary-dark');
+export const SliderRoot = withClassName(SliderPrimitive.Root, 'layer-components:(relative flex items-center select-none touch-none w-full h-30px translate-z-0)');
+export const SliderTrack = withClassName(SliderPrimitive.Track, 'layer-components:(bg-transparent relative grow rounded-lg h-9px border borderpx border-solid border-black)');
+export const SliderRange = withClassName(SliderPrimitive.Range, 'layer-components:(absolute bg-accent rounded-lg h-full)', 'layer-variants:[&[data-color=primary]]:bg-primary');
+export const SliderThumb = withClassName(SliderPrimitive.Thumb, 'layer-components:(block w-5 h-5 bg-white shadow-sm rounded-lg ring-2 ring-black touch-none transition-all)', 'layer-components:hover:(shadow-md)', 'layer-components:active:(shadow-lg ring-4 ring-accent-dark ring-opacity-50 bg-accent-light)', 'layer-components:focus-visible:(shadow-lg ring-4 ring-accent-dark ring-opacity-50 outline-none bg-accent-light)', 'layer-components:focus:(outline-none)', 'layer-components:disabled:(opacity-50)', 'layer-variants:[&[data-color=primary]]:active:(bg-primary ring-primary-dark)', 'layer-variants:[&[data-color=primary]]:focus-visible:(bg-primary ring-primary-dark)');
 export const Slider = Object.assign(function Slider(_a) {
     var { ref, label, color } = _a, props = __rest(_a, ["ref", "label", "color"]);
     return (_jsxs(SliderRoot, Object.assign({ ref: ref }, props, { children: [_jsx(SliderTrack, { children: _jsx(SliderRange, { "data-color": color }) }), _jsx(SliderThumb, { "aria-label": label, "data-color": color })] })));

package/dist/esm/components/tabs/tabs.js

@@ -16,16 +16,16 @@ import clsx from 'clsx';
 import { withClassName } from '../../hooks/withClassName.js';
 export const TabsRoot = withClassName(TabsPrimitive.Root, '');
 export const TabsList = withClassName(TabsPrimitive.List, 'flex flex-row flex-wrap py-2 px-2 items-start gap-2');
-export const TabsTriggerBase = withClassName(TabsPrimitive.Trigger, 'layer-components:flex layer-components:flex-row layer-components:items-center layer-components:cursor-pointer layer-components:justify-center layer-components:gap-2 layer-components:color-black layer-components:py-1 layer-components:px-5 layer-components:bg-wash layer-components:text-md layer-components:min-w-100px layer-components:rounded-lg layer-components:border-default layer-components:font-semibold layer-components:color-gray-ink layer-components:border-gray-dark layer-components:transition-all layer-components:cursor-pointer layer-components:select-none layer-components:font-inherit layer-components:flex-shrink-0 layer-components:shadow-sm', 'layer-components:hover:bg-darken-1 layer-components:hover:ring-4 layer-components:hover:ring-bg', 'layer-components:focus-visible:bg-darken-1 layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-bg layer-components:focus-visible:outline-off', '[&[data-state=active]]:bg-[var(--bg)] [&[data-state=active]]:font-semibold [&[data-state=active]]:color-black [&[data-state=active]]:cursor-default [&[data-state=active]]:hover:bg-darken-1 [&[data-state=active]]:relative [&[data-state=active]]:z-1');
+export const TabsTriggerBase = withClassName(TabsPrimitive.Trigger, 'layer-components:(flex flex-row items-center cursor-pointer justify-center gap-2 color-black py-1 px-5 bg-wash text-md min-w-100px rounded-lg border-default font-semibold color-gray-ink border-gray-dark transition-all cursor-pointer select-none font-inherit flex-shrink-0 shadow-sm)', 'layer-components:hover:(bg-darken-1 ring-4 ring-bg)', 'layer-components:focus-visible:(bg-darken-1 ring-4 ring-bg outline-off)', '[&[data-state=active]]:(bg-[var(--bg)] font-semibold color-black cursor-default hover:bg-darken-1 relative z-1)');
 const colorClasses = {
-    default: 'layer-variants:[--bg:var(--color-white)]',
-    primary: 'layer-variants:[--bg:var(--color-primary)]',
+    default: 'layer-variants:([--bg:var(--color-white)])',
+    primary: 'layer-variants:([--bg:var(--color-primary)])',
 };
 export const TabsTrigger = (_a) => {
     var { className, color = 'primary' } = _a, props = __rest(_a, ["className", "color"]);
     return (_jsx(TabsTriggerBase, Object.assign({ className: clsx(colorClasses[color], `btn-color-${color}`, className) }, props)));
 };
-export const TabsContent = withClassName(TabsPrimitive.Content, 'layer-components:focus:outline-none layer-components:focus-visible:outline-none layer-components:focus-visible:ring-inset layer-components:focus-visible:ring-2 layer-components:focus-visible:ring-gray');
+export const TabsContent = withClassName(TabsPrimitive.Content, 'layer-components:(focus:outline-none focus-visible:(outline-none ring-inset ring-2 ring-gray))');
 export const Tabs = Object.assign(TabsRoot, {
     List: TabsList,
     Trigger: TabsTrigger,

package/dist/esm/components/textArea/TextArea.js

@@ -55,7 +55,7 @@ export const TextArea = function TextArea(_a) {
         }
     }, [autoSelect, onFocus]);
     const randomPlaceholder = useRotatingShuffledValue(placeholders !== null && placeholders !== void 0 ? placeholders : [], placeholdersIntervalMs);
-    return (_jsx("textarea", Object.assign({ ref: finalRef, className: classNames(inputClassName, 'layer-components:[font-family:inherit] layer-components:color-inherit layer-components:overflow-hidden layer-components:resize-none', 'layer-variants:rounded-lg layer-variants:px-4 layer-variants:py-4', {
+    return (_jsx("textarea", Object.assign({ ref: finalRef, className: classNames(inputClassName, 'layer-components:([font-family:inherit] color-inherit overflow-hidden resize-none)', 'layer-variants:(rounded-lg px-4 py-4)', {
             'layer-components:[resize:vertical]': !autoSize,
             'layer-components:[resize:none]': autoSize,
         }, className), rows: autoSize ? 1 : rows, onChange: handleChange, onFocus: handleFocus, placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : randomPlaceholder }, rest)));

package/dist/esm/components/toggleGroup/toggleGroup.js

@@ -1,8 +1,8 @@
 // @unocss-include
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import { withClassName } from '../../hooks/withClassName.js';
-export const ToggleGroupRoot = withClassName(ToggleGroupPrimitive.Root, 'layer-components:inline-flex layer-components:bg-gray-wash layer-components:bg-darken-1 layer-components:rounded-lg layer-components:gap-sm');
-export const ToggleGroupItem = withClassName(ToggleGroupPrimitive.Item, 'layer-components:rounded-full layer-components:color-black layer-components:bg-gray layer-components:bg-lighten-3 layer-components:py-sm layer-components:px-md layer-components:flex layer-components:items-center layer-components:border-transparent layer-components:border-1 layer-components:border-solid layer-components:justify-center layer-components:cursor-pointer', 'layer-components:hover:bg-lighten-2 layer-components:active:bg-lighten-2 layer-components:focus-visible:ring-4 layer-components:focus-visible:ring-primary layer-components:focus-visible:outline-off', 'layer-components:[&[data-state=on]]:bg-primary-light layer-components:[&[data-state=on]]:border-default');
+export const ToggleGroupRoot = withClassName(ToggleGroupPrimitive.Root, 'layer-components:(inline-flex bg-gray-wash bg-darken-1 rounded-lg gap-sm)');
+export const ToggleGroupItem = withClassName(ToggleGroupPrimitive.Item, 'layer-components:(rounded-full color-black bg-gray bg-lighten-3 py-sm px-md flex items-center border-transparent border-1 border-solid justify-center cursor-pointer)', 'layer-components:(hover:bg-lighten-2 active:bg-lighten-2 focus-visible:(ring-4 ring-primary outline-off))', 'layer-components:[&[data-state=on]]:(bg-primary-light border-default)');
 export const ToggleGroup = Object.assign(ToggleGroupRoot, {
     Item: ToggleGroupItem,
 });

package/dist/esm/components/tooltip/Tooltip.js

@@ -17,10 +17,10 @@ import classNames from 'clsx';
 import { BoxContext } from '../box/Box.js';
 function Content(_a) {
     var { children, className, color = 'contrast' } = _a, props = __rest(_a, ["children", "className", "color"]);
-    return (_jsx(TooltipPrimitive.Portal, { children: _jsx(BoxContext.Provider, { value: { spacingScale: 1 }, children: _jsxs(TooltipPrimitive.Content, Object.assign({ className: classNames('layer-components:relative layer-components:rounded-sm layer-components:py-2 layer-components:px-3 layer-components:text-sm layer-components:leading-tight layer-components:shadow-sm layer-components:select-none layer-components:hidden layer-components:z-tooltip', '[&[data-state=delayed-open]]:flex', '[&[data-state=instant-open]]:flex', 'layer-components:transform-origin-[var(--radix-tooltip-content-transform-origin)]', 'layer-components:[&[data-state=delayed-open]]:animate-popover-in', {
-                    'layer-variants:bg-black layer-variants:color-white': color === 'contrast',
-                    'layer-variants:bg-white layer-variants:color-black': color === 'white' || color === 'neutral',
-                    'layer-variants:bg-attention-ink layer-variants:color-white': color === 'attention',
+    return (_jsx(TooltipPrimitive.Portal, { children: _jsx(BoxContext.Provider, { value: { spacingScale: 1 }, children: _jsxs(TooltipPrimitive.Content, Object.assign({ className: classNames('layer-components:(relative rounded-sm py-2 px-3 text-sm leading-tight shadow-sm select-none hidden z-tooltip)', '[&[data-state=delayed-open]]:flex', '[&[data-state=instant-open]]:flex', 'layer-components:transform-origin-[var(--radix-tooltip-content-transform-origin)]', 'layer-components:[&[data-state=delayed-open]]:animate-popover-in', {
+                    'layer-variants:(bg-black color-white)': color === 'contrast',
+                    'layer-variants:(bg-white color-black)': color === 'white' || color === 'neutral',
+                    'layer-variants:(bg-attention-ink color-white)': color === 'attention',
                 }, className) }, props, { children: [children, _jsx(TooltipPrimitive.Arrow, { className: "layer-components:arrow" })] })) }) }));
 }
 export const TooltipProvider = TooltipPrimitive.Provider;

package/dist/esm/components/typography/typography.js

@@ -1,10 +1,10 @@
 // @unocss-include
 import { withClassName } from '../../hooks/withClassName.js';
 const baseHeadingClass = 'layer-components:my-0';
-export const H1 = withClassName('h1', baseHeadingClass, 'layer-components:font-title layer-components:text-2xl layer-components:font-semibold layer-components:color-inherit layer-components:color-darken-1');
-export const H2 = withClassName('h2', baseHeadingClass, 'layer-components:text-lg layer-components:font-title layer-components:font-bold layer-components:color-inherit layer-components:color-lighten-1');
-export const H3 = withClassName('h3', baseHeadingClass, 'layer-components:font-title layer-components:text-md layer-components:font-500 layer-components:color-inherit layer-components:color-lighten-2');
-export const H4 = withClassName('h4', baseHeadingClass, 'layer-components:text-xs layer-components:uppercase layer-components:color-inherit layer-components:color-lighten-2');
+export const H1 = withClassName('h1', baseHeadingClass, 'layer-components:(font-title text-2xl font-semibold color-inherit color-darken-1)');
+export const H2 = withClassName('h2', baseHeadingClass, 'layer-components:(text-lg font-title font-bold color-inherit color-lighten-1)');
+export const H3 = withClassName('h3', baseHeadingClass, 'layer-components:(font-title text-md font-500 color-inherit color-lighten-2)');
+export const H4 = withClassName('h4', baseHeadingClass, 'layer-components:(text-xs uppercase color-inherit color-lighten-2)');
 export const H5 = withClassName('h5', baseHeadingClass);
-export const P = withClassName('p', 'layer-components:my-0 layer-components:leading-normal');
+export const P = withClassName('p', 'layer-components:(my-0 leading-normal)');
 //# sourceMappingURL=typography.js.map

package/package.json

@@ -1,119 +1,125 @@
 {
-  "name": "@a-type/ui",
-  "version": "2.7.6",
-  "type": "module",
-  "files": [
-    "/dist",
-    "/src"
-  ],
-  "exports": {
-    ".": {
-      "import": "./dist/esm/index.js",
-      "node": "./dist/esm/index.js",
-      "require": "./dist/cjs/index.js",
-      "default": "./dist/cjs/index.js"
-    },
-    "./uno-preset": {
-      "types": "./dist/esm/uno/uno.preset.d.ts",
-      "import": "./dist/esm/uno/uno.preset.js",
-      "node": "./dist/esm/uno/uno.preset.js",
-      "require": "./dist/cjs/uno/uno.preset.js",
-      "default": "./dist/cjs/uno/uno.preset.js"
-    },
-    "./main.css": {
-      "import": "./dist/css/main.css",
-      "node": "./dist/css/main.css",
-      "require": "./dist/css/main.css",
-      "default": "./dist/css/main.css"
-    }
-  },
-  "peerDependencies": {
-    "react": "^19",
-    "react-dom": "^19",
-    "unocss": "^66"
-  },
-  "dependencies": {
-    "@a-type/utils": "^1.1.4",
-    "@radix-ui/react-accordion": "^1.2.2",
-    "@radix-ui/react-checkbox": "^1.1.3",
-    "@radix-ui/react-collapsible": "^1.1.2",
-    "@radix-ui/react-context-menu": "^2.2.3",
-    "@radix-ui/react-dialog": "^1.1.3",
-    "@radix-ui/react-dropdown-menu": "^2.1.3",
-    "@radix-ui/react-icons": "^1.3.2",
-    "@radix-ui/react-menu": "^2.1.3",
-    "@radix-ui/react-popover": "^1.1.3",
-    "@radix-ui/react-progress": "^1.1.1",
-    "@radix-ui/react-radio-group": "^1.2.2",
-    "@radix-ui/react-scroll-area": "^1.2.2",
-    "@radix-ui/react-select": "^2.1.3",
-    "@radix-ui/react-slider": "^1.2.2",
-    "@radix-ui/react-slot": "^1.1.1",
-    "@radix-ui/react-switch": "^1.1.2",
-    "@radix-ui/react-tabs": "^1.1.2",
-    "@radix-ui/react-toast": "^1.2.3",
-    "@radix-ui/react-toggle-group": "^1.1.1",
-    "@radix-ui/react-tooltip": "^1.1.5",
-    "@react-spring/web": "^9.7.5",
-    "@unocss/preset-mini": "66.0.0",
-    "@unocss/preset-wind3": "66.0.0",
-    "@use-gesture/react": "^10.3.1",
-    "browser-image-resizer": "^2.4.1",
-    "calendar-blocks": "^0.3.1",
-    "clsx": "^2.1.1",
-    "color-interpolate": "^1.0.5",
-    "color-parse": "^2.0.2",
-    "color-space": "^2.0.1",
-    "csstype": "^3.1.3",
-    "date-fns": "^4.1.0",
-    "formik": "^2.4.6",
-    "frimousse": "^0.2.0",
-    "motion": "^12.23.6",
-    "pluralize": "^8.0.0",
-    "react-hot-toast": "^2.4.1",
-    "react-is": "^19.1.0",
-    "valtio": "^2.1.4"
-  },
-  "devDependencies": {
-    "@changesets/changelog-git": "^0.2.1",
-    "@changesets/cli": "^2.27.10",
-    "@storybook/addon-essentials": "8.4.7",
-    "@storybook/addon-interactions": "8.4.7",
-    "@storybook/addon-links": "8.4.7",
-    "@storybook/blocks": "8.4.7",
-    "@storybook/react": "8.4.7",
-    "@storybook/react-vite": "8.4.7",
-    "@storybook/test": "8.4.7",
-    "@types/pluralize": "^0.0.33",
-    "@types/react": "^19.0.1",
-    "@types/react-dom": "^19.0.2",
-    "@types/react-is": "^19.0.0",
-    "@types/w3c-image-capture": "^1.0.10",
-    "@unocss/cli": "66.0.0",
-    "@unocss/core": "66.0.0",
-    "@unocss/transformer-variant-group": "66.0.0",
-    "axios": "^1.5.0",
-    "change-case": "^4.1.2",
-    "dotenv": "^16.3.1",
-    "fs-extra": "^11.1.1",
-    "prettier": "^3.0.3",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "storybook": "8.4.7",
-    "typescript": "^5.7.2",
-    "unocss": "66.0.0"
-  },
-  "scripts": {
-    "build:transpile": "tsc && tsc -P tsconfig-cjs.json",
-    "build:prefix": "node ./scripts/addUnoInclude.js",
-    "build:process": "unocss \"./dist/**/*.js\" -o ./dist/css/main.css --write-transformed -m -c uno.config.js",
-    "build": "pnpm run build:transpile && pnpm run build:prefix && pnpm run build:process",
-    "ci:version": "pnpm changeset version",
-    "ci:publish": "pnpm changeset publish --access=public",
-    "prepublish": "pnpm run build",
-    "icons": "node ./scripts/generateIcons.js",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build",
-    "up-radix": "pnpm update \"@radix-ui/*\" --latest"
-  }
-}
+	"name": "@a-type/ui",
+	"version": "2.8.1",
+	"type": "module",
+	"files": [
+		"/dist",
+		"/src"
+	],
+	"sideEffects": false,
+	"exports": {
+		".": {
+			"import": "./dist/esm/index.js",
+			"node": "./dist/esm/index.js",
+			"require": "./dist/cjs/index.js",
+			"default": "./dist/cjs/index.js"
+		},
+		"./uno-preset": {
+			"types": "./dist/esm/uno/uno.preset.d.ts",
+			"import": "./dist/esm/uno/uno.preset.js",
+			"node": "./dist/esm/uno/uno.preset.js",
+			"require": "./dist/cjs/uno/uno.preset.js",
+			"default": "./dist/cjs/uno/uno.preset.js"
+		},
+		"./main.css": {
+			"import": "./dist/css/main.css",
+			"node": "./dist/css/main.css",
+			"require": "./dist/css/main.css",
+			"default": "./dist/css/main.css"
+		}
+	},
+	"scripts": {
+		"build:transpile": "tsc && tsc -P tsconfig-cjs.json",
+		"build:prefix": "node ./scripts/addUnoInclude.js",
+		"build:process": "unocss \"./dist/**/*.js\" -o ./dist/css/main.css --write-transformed -m -c uno.config.js",
+		"build": "pnpm run build:transpile && pnpm run build:process && pnpm run build:prefix",
+		"prepublish": "pnpm run build",
+		"icons": "node ./scripts/generateIcons.js",
+		"storybook": "storybook dev -p 6006",
+		"build-storybook": "storybook build",
+		"up-radix": "pnpm update \"@radix-ui/*\" --latest",
+		"bump": "pnpx bumpp"
+	},
+	"peerDependencies": {
+		"react": "^19",
+		"react-dom": "^19",
+		"unocss": "^66"
+	},
+	"dependencies": {
+		"@a-type/utils": "^1.1.4",
+		"@radix-ui/react-accordion": "^1.2.2",
+		"@radix-ui/react-checkbox": "^1.1.3",
+		"@radix-ui/react-collapsible": "^1.1.2",
+		"@radix-ui/react-context-menu": "^2.2.3",
+		"@radix-ui/react-dialog": "^1.1.3",
+		"@radix-ui/react-dropdown-menu": "^2.1.3",
+		"@radix-ui/react-icons": "^1.3.2",
+		"@radix-ui/react-menu": "^2.1.3",
+		"@radix-ui/react-popover": "^1.1.3",
+		"@radix-ui/react-progress": "^1.1.1",
+		"@radix-ui/react-radio-group": "^1.2.2",
+		"@radix-ui/react-scroll-area": "^1.2.2",
+		"@radix-ui/react-select": "^2.1.3",
+		"@radix-ui/react-slider": "^1.2.2",
+		"@radix-ui/react-slot": "^1.1.1",
+		"@radix-ui/react-switch": "^1.1.2",
+		"@radix-ui/react-tabs": "^1.1.2",
+		"@radix-ui/react-toast": "^1.2.3",
+		"@radix-ui/react-toggle-group": "^1.1.1",
+		"@radix-ui/react-tooltip": "^1.1.5",
+		"@react-spring/web": "^9.7.5",
+		"@unocss/preset-mini": "66.0.0",
+		"@unocss/preset-wind3": "66.0.0",
+		"@use-gesture/react": "^10.3.1",
+		"browser-image-resizer": "^2.4.1",
+		"calendar-blocks": "^0.3.1",
+		"clsx": "^2.1.1",
+		"color-interpolate": "^1.0.5",
+		"color-parse": "^2.0.2",
+		"color-space": "^2.0.1",
+		"csstype": "^3.1.3",
+		"date-fns": "^4.1.0",
+		"formik": "^2.4.6",
+		"frimousse": "^0.2.0",
+		"motion": "^12.23.6",
+		"pluralize": "^8.0.0",
+		"react-hot-toast": "^2.4.1",
+		"react-is": "^19.1.0",
+		"valtio": "^2.1.4"
+	},
+	"devDependencies": {
+		"@storybook/addon-essentials": "8.4.7",
+		"@storybook/addon-interactions": "8.4.7",
+		"@storybook/addon-links": "8.4.7",
+		"@storybook/blocks": "8.4.7",
+		"@storybook/react": "8.4.7",
+		"@storybook/react-vite": "8.4.7",
+		"@storybook/test": "8.4.7",
+		"@types/pluralize": "^0.0.33",
+		"@types/react": "^19.0.1",
+		"@types/react-dom": "^19.0.2",
+		"@types/react-is": "^19.0.0",
+		"@types/w3c-image-capture": "^1.0.10",
+		"@unocss/cli": "66.0.0",
+		"@unocss/core": "66.0.0",
+		"@unocss/transformer-variant-group": "66.0.0",
+		"axios": "^1.5.0",
+		"change-case": "^4.1.2",
+		"dotenv": "^16.3.1",
+		"fs-extra": "^11.1.1",
+		"prettier": "^3.0.3",
+		"react": "19.0.0",
+		"react-dom": "19.0.0",
+		"storybook": "8.4.7",
+		"typescript": "^5.7.2",
+		"unocss": "66.0.0"
+	},
+	"pnpm": {
+		"ignoredBuiltDependencies": [
+			"esbuild"
+		],
+		"onlyBuiltDependencies": [
+			"esbuild"
+		]
+	}
+}