@g4rcez/components 2.2.9 → 2.3.0

package/dist/components/core/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/core/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACtD,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCb,CAAC;AAUF,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE7C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,iBAAiB,CAC/E,gBAAgB,CAAC,QAAQ,GAAG,OAAO,CAAC;IAChC,oCAAoC;IACpC,IAAI,EAAE,KAAK,CAAC;IACZ,+CAA+C;IAC/C,OAAO,EAAE,OAAO,CAAA;CACnB,CAAC,EAAE,CAAC,CAAC,CACT,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAwBjF,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/core/button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACtD,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCb,CAAC;AAUF,KAAK,QAAQ,GAAG,WAAW,CAAC,OAAO,QAAQ,CAAC,CAAC;AAE7C,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,iBAAiB,CAC/E,gBAAgB,CACZ,QAAQ,GACJ,OAAO,CAAC;IACJ,oCAAoC;IACpC,IAAI,EAAE,KAAK,CAAC;IACZ,+CAA+C;IAC/C,OAAO,EAAE,OAAO,CAAC;CACpB,CAAC,EACN,CAAC,CACJ,CACJ,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAwBjF,CAAC"}

package/dist/components/core/polymorph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"polymorph.d.ts","sourceRoot":"","sources":["../../../src/components/core/polymorph.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,KAAK,OAAO,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;AAE9E,MAAM,MAAM,gBAAgB,CAAC,KAAK,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,GAAG;IACzE,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,GAAG,IAAI,GAAG,KAAK,CAAC,GAAG;IACjD,GAAG,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;CACtC,CAAC;AAEF,eAAO,MAAM,SAAS,kFAKrB,CAAC"}
+{"version":3,"file":"polymorph.d.ts","sourceRoot":"","sources":["../../../src/components/core/polymorph.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,KAAK,OAAO,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC,CAAC,CAAC;AAE9E,MAAM,MAAM,gBAAgB,CAAC,KAAK,EAAE,CAAC,SAAS,KAAK,CAAC,WAAW,IAAI,KAAK,GAAG;IACvE,EAAE,CAAC,EAAE,CAAC,CAAC;CACV,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,MAAM,KAAK,GAAG,IAAI,GAAG,KAAK,CAAC,GAAG;IAC3C,GAAG,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;CACxC,CAAC;AAEN,eAAO,MAAM,SAAS,kFAGpB,CAAC"}

package/dist/components/core/slot.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as React from "react";
 export type Usable<T> = PromiseLike<T> | React.Context<T>;
 interface SlotProps extends React.HTMLAttributes<HTMLElement> {
     children?: React.ReactNode;

package/dist/components/core/slot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../../src/components/core/slot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAiD/B,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAI1D,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC3D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAiBD,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,iFA6C3C;AAED,eAAO,MAAM,IAAI,+EAAqB,CAAC;AAgCvC,UAAU,cAAc;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,UAAU,kBAAmB,SAAQ,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC;IAC3D,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,sBAOhD"}
+{"version":3,"file":"slot.d.ts","sourceRoot":"","sources":["../../../src/components/core/slot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgD/B,MAAM,MAAM,MAAM,CAAC,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;AAI1D,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACzD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC9B;AAiBD,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,iFAyC3C;AAED,eAAO,MAAM,IAAI,+EAAqB,CAAC;AAgCvC,UAAU,cAAc;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,UAAU,kBAAmB,SAAQ,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC;IACzD,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,wBAAgB,eAAe,CAAC,SAAS,EAAE,MAAM,sBAOhD"}

package/dist/components/core/slot.jsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
-const REACT_LAZY_TYPE = Symbol.for('react.lazy');
+import * as React from "react";
+const REACT_LAZY_TYPE = Symbol.for("react.lazy");
 function setRef(ref, value) {
-    if (typeof ref === 'function') {
+    if (typeof ref === "function") {
         return ref(value);
     }
     else if (ref !== null && ref !== undefined) {
@@ -13,7 +13,7 @@ function composeRefs(...refs) {
         let hasCleanup = false;
         const cleanups = refs.map((ref) => {
             const cleanup = setRef(ref, node);
-            if (!hasCleanup && typeof cleanup == 'function') {
+            if (!hasCleanup && typeof cleanup == "function") {
                 hasCleanup = true;
             }
             return cleanup;
@@ -22,7 +22,7 @@ function composeRefs(...refs) {
             return () => {
                 for (let i = 0; i < cleanups.length; i++) {
                     const cleanup = cleanups[i];
-                    if (typeof cleanup == 'function') {
+                    if (typeof cleanup == "function") {
                         cleanup();
                     }
                     else {
@@ -33,23 +33,23 @@ function composeRefs(...refs) {
         }
     };
 }
-const use = React[' use '.trim().toString()];
+const use = React[" use ".trim().toString()];
 function isPromiseLike(value) {
-    return typeof value === 'object' && value !== null && 'then' in value;
+    return typeof value === "object" && value !== null && "then" in value;
 }
 function isLazyComponent(element) {
     return (element != null &&
-        typeof element === 'object' &&
-        '$$typeof' in element &&
+        typeof element === "object" &&
+        "$$typeof" in element &&
         element.$$typeof === REACT_LAZY_TYPE &&
-        '_payload' in element &&
+        "_payload" in element &&
         isPromiseLike(element._payload));
 }
 export function createSlot(ownerName) {
     const SlotClone = createSlotClone(ownerName);
     const Slot = React.forwardRef((props, forwardedRef) => {
         let { children, ...slotProps } = props;
-        if (isLazyComponent(children) && typeof use === 'function') {
+        if (isLazyComponent(children) && typeof use === "function") {
             children = use(children._payload);
         }
         const childrenArray = React.Children.toArray(children);
@@ -63,32 +63,28 @@ export function createSlot(ownerName) {
                     // in grabbing its children (`newElement.props.children`)
                     if (React.Children.count(newElement) > 1)
                         return React.Children.only(null);
-                    return React.isValidElement(newElement)
-                        ? newElement.props.children
-                        : null;
+                    return React.isValidElement(newElement) ? newElement.props.children : null;
                 }
                 else {
                     return child;
                 }
             });
             return (<SlotClone {...slotProps} ref={forwardedRef}>
-          {React.isValidElement(newElement)
-                    ? React.cloneElement(newElement, undefined, newChildren)
-                    : null}
-        </SlotClone>);
+                    {React.isValidElement(newElement) ? React.cloneElement(newElement, undefined, newChildren) : null}
+                </SlotClone>);
         }
         return (<SlotClone {...slotProps} ref={forwardedRef}>
-        {children}
-      </SlotClone>);
+                {children}
+            </SlotClone>);
     });
     Slot.displayName = `${ownerName}.Slot`;
     return Slot;
 }
-export const Slot = createSlot('Slot');
+export const Slot = createSlot("Slot");
 function createSlotClone(ownerName) {
     const SlotClone = React.forwardRef((props, forwardedRef) => {
         let { children, ...slotProps } = props;
-        if (isLazyComponent(children) && typeof use === 'function') {
+        if (isLazyComponent(children) && typeof use === "function") {
             children = use(children._payload);
         }
         if (React.isValidElement(children)) {
@@ -105,7 +101,7 @@ function createSlotClone(ownerName) {
     SlotClone.displayName = `${ownerName}.SlotClone`;
     return SlotClone;
 }
-const SLOTTABLE_IDENTIFIER = Symbol('radix.slottable');
+const SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
 export function createSlottable(ownerName) {
     const Slottable = ({ children }) => {
         return <>{children}</>;
@@ -114,12 +110,9 @@ export function createSlottable(ownerName) {
     Slottable.__radixId = SLOTTABLE_IDENTIFIER;
     return Slottable;
 }
-const Slottable = createSlottable('Slottable');
+const Slottable = createSlottable("Slottable");
 function isSlottable(child) {
-    return (React.isValidElement(child) &&
-        typeof child.type === 'function' &&
-        '__radixId' in child.type &&
-        child.type.__radixId === SLOTTABLE_IDENTIFIER);
+    return (React.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER);
 }
 function mergeProps(slotProps, childProps) {
     const overrideProps = { ...childProps };
@@ -139,23 +132,23 @@ function mergeProps(slotProps, childProps) {
                 overrideProps[propName] = slotPropValue;
             }
         }
-        else if (propName === 'style') {
+        else if (propName === "style") {
             overrideProps[propName] = { ...slotPropValue, ...childPropValue };
         }
-        else if (propName === 'className') {
-            overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ');
+        else if (propName === "className") {
+            overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
         }
     }
     return { ...slotProps, ...overrideProps };
 }
 function getElementRef(element) {
-    let getter = Object.getOwnPropertyDescriptor(element.props, 'ref')?.get;
-    let mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;
+    let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get;
+    let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
     if (mayWarn) {
         return element.ref;
     }
-    getter = Object.getOwnPropertyDescriptor(element, 'ref')?.get;
-    mayWarn = getter && 'isReactWarning' in getter && getter.isReactWarning;
+    getter = Object.getOwnPropertyDescriptor(element, "ref")?.get;
+    mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
     if (mayWarn) {
         return element.props.ref;
     }

package/dist/components/core/tag.jsx

@@ -24,7 +24,7 @@ const variants = {
         loading: "animate-pulse bg-disabled duration-700 opacity-70",
     },
 };
-const indicatorVariant = cva("size-2.5 aspect-square rounded-full border-0", {
+const indicatorVariant = cva("size-2 aspect-square rounded-full border-0", {
     variants: {
         theme: {
             info: "bg-info",

package/dist/components/core/typography.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../src/components/core/typography.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,EAAE,KAAK,cAAc,EAAY,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,CAAC,GAAG,CAAC,sBAEnD,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,OAAO,cAAc,CAAC,GAAG,CAAC,sBAErD,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,OAAO,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,sBAS7D,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,sBAKpE,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,KAAK,CAAC;CACpB,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,OAAO,iBAAiB,CAAC,eAAe,CAAC,sBAWnE,CAAA"}
+{"version":3,"file":"typography.d.ts","sourceRoot":"","sources":["../../../src/components/core/typography.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EAAE,EAAE,KAAK,cAAc,EAAY,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,CAAC,GAAG,CAAC,sBAAgF,CAAC;AAErI,eAAO,MAAM,WAAW,GAAI,OAAO,cAAc,CAAC,GAAG,CAAC,sBAAwF,CAAC;AAE/I,MAAM,MAAM,SAAS,GAAG;IACpB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,KAAK,CAAC;IACb,GAAG,CAAC,EAAE,OAAO,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,OAAO,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,sBAO7D,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,iBAAiB,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,sBAKpE,CAAC;AAEF,KAAK,eAAe,GAAG;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,KAAK,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,iBAAiB,CAAC,eAAe,CAAC,sBASnE,CAAC"}

package/dist/components/core/typography.jsx

@@ -1,26 +1,22 @@
 import React, { Fragment } from "react";
 import { css } from "../../lib/dom";
-export const Paragraph = (props) => (<p {...props} className={css("text-base leading-snug", props.className)}/>);
-export const Description = (props) => (<p {...props} className={css("mb-kilo text-sm text-secondary", props.className)}/>);
+export const Paragraph = (props) => <p {...props} className={css("text-base leading-snug", props.className)}/>;
+export const Description = (props) => <p {...props} className={css("mb-kilo text-sm text-secondary", props.className)}/>;
 export const Info = (props) => (<div className={css(`flex ${props.row ? "flex-row items-center" : "flex-col"} gap-1`, props.className)}>
-    <Fragment>
-      <span className="text-sm font-medium tracking-wide">{props.row ? `${props.label}:` : props.label}</span>
-      <span className={css(props.disabled ? "text-disabled" : "", props.row ? "text-base w-fit" : "w-full text-lg")}>
-        {props.children}
-      </span>
-    </Fragment>
-  </div>);
+        <Fragment>
+            <span className="text-sm font-medium tracking-wide">{props.row ? `${props.label}:` : props.label}</span>
+            <span className={css(props.disabled ? "text-disabled" : "", props.row ? "w-fit text-base" : "w-full text-lg")}>{props.children}</span>
+        </Fragment>
+    </div>);
 export const PageTitle = (props) => (<div>
-    <h2 className="text-3xl font-bold typography tracking-wide">{props.title}</h2>
-    <p className="text-secondary typography">{props.children}</p>
-  </div>);
+        <h2 className="typography text-3xl font-bold tracking-wide">{props.title}</h2>
+        <p className="typography text-secondary">{props.children}</p>
+    </div>);
 export const PageHeader = (props) => {
-    return (<header className="flex flex-row flex-wrap justify-between items-center gap-mega">
-      <div>
-        <PageTitle title={props.title}>{props.description}</PageTitle>
-      </div>
-      <div className="flex gap-kilo items-center flex-wrap">
-        {props.children}
-      </div>
-    </header>);
+    return (<header className="gap-mega flex flex-row flex-wrap items-center justify-between">
+            <div>
+                <PageTitle title={props.title}>{props.description}</PageTitle>
+            </div>
+            <div className="gap-kilo flex flex-wrap items-center">{props.children}</div>
+        </header>);
 };

package/dist/components/display/alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,eAAe,EAAU,MAAM,cAAc,CAAC;AAExE,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAahE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,sBAiB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;;;;;;;;;CAUlB,CAAC;AAOF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC5E,WAAW,CAAC,OAAO,aAAa,CAAC,GACjC,OAAO,CAAC;IACN,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACvC,CAAC,EACF,CAAC,CACF,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GAiDxE,CAAC"}
+{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,eAAe,EAAU,MAAM,cAAc,CAAC;AAExE,OAAO,KAAK,EAAE,EAAc,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAahE,KAAK,aAAa,GAAG,eAAe,CAAC,SAAS,CAAC,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAEpE,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,sBAiB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;;;;;;;;;CAUlB,CAAC;AAOF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,WAAW,CAAC,OAAO,aAAa,CAAC,GAC7B,OAAO,CAAC;IACJ,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC;IACzB,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GAiDxE,CAAC"}

package/dist/components/display/alert.jsx

@@ -15,8 +15,8 @@ const transition = {
     ease: [0.04, 0.62, 0.23, 0.98],
 };
 export const Collapse = (props) => (<motion.div {...props} layout layoutRoot layoutScroll initial={false} variants={variants} exit={variants.false} transition={transition} aria-hidden={!props.open} data-component="collapse" animate={props.open.toString()} className={css("aria-hidden:pointer-events-none", props.className)}>
-    {props.children}
-  </motion.div>);
+        {props.children}
+    </motion.div>);
 const themeVariants = {
     theme: {
         primary: "bg-alert-primary-bg text-alert-primary-text border-alert-primary-border",
@@ -35,26 +35,24 @@ const alertVariants = cva("p-4 w-full block border relative rounded-lg text-sm",
 export const Alert = forwardRef(function Alert({ className, theme, Icon, onClose, open = true, ...props }, ref) {
     const close = () => onClose?.(false);
     return (<AnimatePresence presenceAffectsLayout propagate mode="sync">
-      {open ? <motion.div data-open={!!open} aria-hidden={!open} data-component="alert" className={css("isolate w-full", open ? "pointer-events-auto" : "pointer-events-none")}>
-        <Collapse data-open={!!open} open={!!open}>
-          <Polymorph {...props} ref={ref} role="alert" data-theme={theme} as={props.as ?? "div"} className={css(alertVariants({ theme }), className)}>
-            <div className="grid grid-cols-[auto_1fr] gap-base">
-              {onClose !== undefined && open ? (<button type="button" onClick={close} className="absolute top-3 right-3 transition-colors duration-300 ease-in-out text-foreground hover:text-danger">
-                  <XIcon size={20}/>
-                </button>) : null}
-              <div className={css("flex gap-2 items-center", props.title ? "" : "w-fit")}>
-                {!Icon && theme === "success" ? <CheckCircleIcon aria-hidden="true" size={20}/> : null}
-                {!Icon && theme === "info" ? <InfoIcon aria-hidden="true" size={20}/> : null}
-                {!Icon && theme === "danger" ? <TriangleAlertIcon aria-hidden="true" size={20}/> : null}
-                {Icon}
-              </div>
-              {props.title ? <h4 className="col-start-2 text-lg font-semibold tracking-3 text-balance">{props.title}</h4> : null}
-              <div className="col-start-2 w-full">
-                {props.children}
-              </div>
-            </div>
-          </Polymorph>
-        </Collapse>
-      </motion.div> : null}
-    </AnimatePresence>);
+            {open ? (<motion.div data-open={!!open} aria-hidden={!open} data-component="alert" className={css("isolate w-full", open ? "pointer-events-auto" : "pointer-events-none")}>
+                    <Collapse data-open={!!open} open={!!open}>
+                        <Polymorph {...props} ref={ref} role="alert" data-theme={theme} as={props.as ?? "div"} className={css(alertVariants({ theme }), className)}>
+                            <div className="grid grid-cols-[auto_1fr] gap-base">
+                                {onClose !== undefined && open ? (<button type="button" onClick={close} className="absolute right-3 top-3 text-foreground transition-colors duration-300 ease-in-out hover:text-danger">
+                                        <XIcon size={20}/>
+                                    </button>) : null}
+                                <div className={css("flex items-center gap-2", props.title ? "" : "w-fit")}>
+                                    {!Icon && theme === "success" ? <CheckCircleIcon aria-hidden="true" size={20}/> : null}
+                                    {!Icon && theme === "info" ? <InfoIcon aria-hidden="true" size={20}/> : null}
+                                    {!Icon && theme === "danger" ? <TriangleAlertIcon aria-hidden="true" size={20}/> : null}
+                                    {Icon}
+                                </div>
+                                {props.title ? <h4 className="tracking-3 col-start-2 text-balance text-lg font-semibold">{props.title}</h4> : null}
+                                <div className="col-start-2 w-full">{props.children}</div>
+                            </div>
+                        </Polymorph>
+                    </Collapse>
+                </motion.div>) : null}
+        </AnimatePresence>);
 });

package/dist/components/display/calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAEjE,OAAqB,EAAE,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AA0B5D,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,KAAK,SAAS,GAAG,CAAC,CAAC,EAAE,IAAI,KAAK,MAAM,CAAC;AAErC,KAAK,cAAc,GAAG,OAAO,CAAC;IAC1B,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,IAAI,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,MAAM,CAAC,CAAC;IAC1C,QAAQ,EAAE,MAAM,GAAG,CAAC,CAAC,WAAW,EAAE,IAAI,EAAE,KAAK,MAAM,CAAC,CAAC;CACxD,CAAC,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC;IAChC,IAAI,EAAE,IAAI,CAAC;IACX,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAA;IACrB,MAAM,EAAE,cAAc,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;IAC1B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,QAAQ,EAAE,aAAa,GAAG,YAAY,CAAC;IACvC,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5C,CAAC,CAAC;AA0IH,eAAO,MAAM,QAAQ,GAAI,qLAgBtB,aAAa,sBA+Rf,CAAC"}
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../src/components/display/calendar.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAEjE,OAAqB,EAAE,KAAK,OAAO,EAAE,MAAM,gBAAgB,CAAC;AA0B5D,KAAK,KAAK,GAAG;IAAE,IAAI,CAAC,EAAE,IAAI,CAAC;IAAC,EAAE,CAAC,EAAE,IAAI,CAAA;CAAE,CAAC;AAExC,KAAK,YAAY,GAAG,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,KAAK,IAAI,CAAC;AAElD,KAAK,aAAa,GAAG,CAAC,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;AAEpD,KAAK,SAAS,GAAG,CAAC,CAAC,EAAE,IAAI,KAAK,MAAM,CAAC;AAErC,KAAK,cAAc,GAAG,OAAO,CAAC;IAC1B,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IACxB,OAAO,EAAE,MAAM,GAAG,SAAS,CAAC;IAC5B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,IAAI,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,MAAM,CAAC,CAAC;IAC1C,QAAQ,EAAE,MAAM,GAAG,CAAC,CAAC,WAAW,EAAE,IAAI,EAAE,KAAK,MAAM,CAAC,CAAC;CACxD,CAAC,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC;IAChC,IAAI,EAAE,IAAI,CAAC;IACX,KAAK,EAAE,KAAK,CAAC;IACb,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,cAAc,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC3B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,YAAY,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IAChC,aAAa,EAAE,CAAC,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACjC,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACtC,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;QAAE,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC,CAAC;IACtC,QAAQ,EAAE,aAAa,GAAG,YAAY,CAAC;IACvC,UAAU,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5C,CAAC,CAAC;AA2IH,eAAO,MAAM,QAAQ,GAAI,qLAgBtB,aAAa,sBAwRf,CAAC"}

package/dist/components/display/calendar.jsx

@@ -79,8 +79,9 @@ const CalendarBody = (props) => {
                     const sameMonth = isSameMonth(day, props.stateDate);
                     const disableDate = !sameMonth || disabledByFn;
                     const isInRange = props.rangeMode ? inRange(props.range?.from, day, props.range?.to) : false;
-                    return (<td key={key} align="center" className={css("relative", Is.function(props.styles?.dayFrame) ? props.styles?.dayFrame(day) : props.styles?.dayFrame)}>
-                                    <button type="button" data-date={key} disabled={disabledByFn} data-samemonth={sameMonth} data-range={props.rangeMode} onClick={props.dispatch.onSelectDate} data-view={props.stateDate.getMonth().toString()} className={css(`flex size-10 items-center justify-center rounded-full proportional-nums disabled:cursor-not-allowed ${today ? "text-emphasis" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, isInRange && props.markRange ? "size-10 border border-dashed border-card-border" : "", Is.function(props.styles?.day) ? props.styles?.day(day) : props.styles?.day)}>
+                    return (<td key={key} align="center" className={css("relative p-1", Is.function(props.styles?.dayFrame) ? props.styles?.dayFrame(day) : props.styles?.dayFrame)}>
+                                    <button type="button" data-date={key} disabled={disabledByFn} data-samemonth={sameMonth} data-range={props.rangeMode} onClick={props.dispatch.onSelectDate} data-view={props.stateDate.getMonth().toString()} className={css(`relative flex size-9 items-center justify-center rounded-full proportional-nums disabled:cursor-not-allowed ${today ? "text-emphasis" : ""} ${disableDate ? "text-disabled" : ""} ${isSelected ? "bg-primary text-primary-foreground" : ""}`, isInRange && props.markRange ? "size-9 border border-dashed border-card-border" : "", Is.function(props.styles?.day) ? props.styles?.day(day) : props.styles?.day)}>
+                                        <div></div>
                                         {day.getDate()}
                                         {isSelected && props.stateRange.from?.toISOString() === key ? (<span className="absolute -top-2 left-0 h-full w-full">
                                                 <span className="text-xs text-foreground">
@@ -261,9 +262,6 @@ export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, d
                                 <motion.button layout type="button" data-focustrap="next" variants={removeImmediately} onClick={dispatch.nextMonth} title={translations.calendarNextMonth} className="z-calendar rounded-full p-1.5 hover:bg-primary hover:text-primary-foreground">
                                     <ChevronRightIcon className="h-4 w-4"/>
                                 </motion.button>
-                                <div className="absolute inset-0" style={{
-            backgroundImage: "linear-gradient(to right, hsla(var(--card-background)) 15%, transparent 30%, transparent 70%, hsla(var(--card-background)) 85%)",
-        }}/>
                             </header>
                             <motion.table className="mt-2 table min-w-full table-auto border-0">
                                 <thead>
@@ -278,8 +276,8 @@ export const Calendar = ({ RenderOnDay, changeOnlyOnClick = false, labelRange, d
                         </motion.div>
                     </AnimatePresence>
                 </div>
-                {type === "datetime" ? (<section className="grid items-center my-4">
-                        <Input info={null} mask="time" optionalText=" " container="w-full" reportStatus={false} defaultValue={date ? format(date, "HH:mm") : undefined} title={datetimeTitle || translations.calendarDatetimeTitle} onChange={e => {
+                {type === "datetime" ? (<section className="my-4 grid items-center">
+                        <Input info={null} mask="time" optionalText=" " container="w-full" reportStatus={false} defaultValue={date ? format(date, "HH:mm") : undefined} title={datetimeTitle || translations.calendarDatetimeTitle} onChange={(e) => {
                 const value = e.target.value;
                 const match = timeRegex.exec(value);
                 if (!match)

package/dist/components/display/card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/display/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,UAAU,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAGhE,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CACzE;IACI,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;CACtC,EACD,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,IAAI;KAAI,CAAC,SAAS,KAAK,CAAC,WAAW,yFAS7C,iBAAiB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;wDAuC0B,iBAAiB,CAAC,oBAAoB,CAAC;CAXlG,CAAC;AAEF,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CACpF;IACI,MAAM,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC7B,KAAK,EAAE,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC;CACtC,EACD,CAAC,CACJ,CAAC;AAoBF,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG;IACxD,IAAI,CAAC,EAAE,UAAU,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,KAAK,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CACvF,CAAA;AAED,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,sBAuB9C,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/components/display/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,UAAU,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,EAAE,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAGhE,MAAM,MAAM,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CACzE;IACI,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,MAAM,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,IAAI,CAAC;CACtC,EACD,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,IAAI;KAAI,CAAC,SAAS,KAAK,CAAC,WAAW,yFAS7C,iBAAiB,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;wDAyC0B,iBAAiB,CAAC,oBAAoB,CAAC;CAXlG,CAAC;AAEF,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CACpF;IACI,MAAM,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC7B,KAAK,EAAE,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC;CACtC,EACD,CAAC,CACJ,CAAC;AAoBF,MAAM,MAAM,cAAc,GAAG,SAAS,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG;IACxD,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,sBAuB9C,CAAC"}

package/dist/components/display/card.jsx

@@ -4,7 +4,7 @@ import { Is } from "sidekicker";
 import { css } from "../../lib/dom";
 import { Polymorph } from "../core/polymorph";
 import { Skeleton } from "./skeleton";
-export const Card = ({ title, loading, children, as, header = null, container = "", titleClassName = "", ...props }) => (<Polymorph {...props} as={as || "div"} data-component="card" className={css("flex shadow-shadow-card flex-col gap-4 rounded-card border border-card-border bg-card-background w-full py-3", container)}>
+export const Card = ({ title, loading, children, as, header = null, container = "", titleClassName = "", ...props }) => (<Polymorph {...props} as={as || "div"} data-component="card" className={css("flex w-full flex-col gap-4 rounded-card border border-card-border bg-card-background py-3 shadow-shadow-card", container)}>
         {title ? (<header data-component="card-title" className={css("mb-2 w-full border-b border-card-border px-6 pb-2 text-xl font-medium", titleClassName)}>
                 {title}
             </header>) : (header)}
@@ -14,7 +14,7 @@ export const Card = ({ title, loading, children, as, header = null, container =
                     <Skeleton className="w-8/12"/>
                     <Skeleton className="w-10/12"/>
                     <Skeleton className="w-1/2"/>
-                </div>) : children}
+                </div>) : (children)}
         </div>
     </Polymorph>);
 Card.Title = ({ as, titleTag, navTag, children, ...props }) => {
@@ -23,18 +23,18 @@ Card.Title = ({ as, titleTag, navTag, children, ...props }) => {
     const Nav = (navTag || "nav");
     return (<Component {...props} title={Is.string(props.title) ? props.title : undefined} className={css("flex w-full flex-col flex-wrap items-start justify-between gap-base sm:flex-row sm:items-center", props.className)}>
             <Title className="font-semibold">{props.title}</Title>
-            {children ? (<Nav className="flex flex-col justify-start items-start sm:flex-row sm:justify-end sm:items-center gap-kilo">{children}</Nav>) : null}
+            {children ? (<Nav className="gap-kilo flex flex-col items-start justify-start sm:flex-row sm:items-center sm:justify-end">{children}</Nav>) : null}
         </Component>);
 };
 export const StatsCard = (props) => {
     const interactive = props.interactive ?? true;
     const Icon = props.Icon ?? InfoIcon;
-    return (<Card {...props} title={null} loading={undefined} container="px-0 py-0" className="flex gap-4 items-center px-0">
+    return (<Card {...props} title={null} loading={undefined} container="px-0 py-0" className="flex items-center gap-4 px-0">
             <div className={`flex w-full items-center gap-4 rounded-card px-0 lg:px-0 ${interactive ? "transition-colors duration-300 ease-linear hover:bg-primary-hover/10" : ""}`}>
                 <div className={css("flex aspect-square h-[stretch] w-20 items-center justify-center rounded-l-card bg-primary p-4 text-primary-foreground", props.mark)}>
                     {<Icon size={48}/>}
                 </div>
-                <div className="flex flex-col gap-2 justify-center py-2">
+                <div className="flex flex-col justify-center gap-2 py-2">
                     <p className="text-lg">{props.title}</p>
                     {props.loading ? <Skeleton className="h-10"/> : <p className="text-4xl font-bold tracking-wide">{props.value}</p>}
                 </div>

package/dist/components/display/empty.jsx

@@ -4,7 +4,7 @@ import { useTranslations } from "../../hooks/use-translations";
 export const Empty = (props) => {
     const Icon = props.Icon ?? FileIcon;
     const translate = useTranslations();
-    return (<div className="flex flex-col gap-4 justify-center items-center py-12 px-8 w-full">
+    return (<div className="flex w-full flex-col items-center justify-center gap-4 px-8 py-12">
             <Icon size={64} className="text-disabled"/>
             <p className="text-disabled">{props.message ?? translate.emptyDataMessage}</p>
         </div>);

package/dist/components/display/notifications.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AASlE,OAAO,EAAiB,KAAK,iBAAiB,EAAmC,MAAM,OAAO,CAAC;AAG/F,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAgBb,CAAC;AAYF,KAAK,mBAAmB,GAAG,OAAO,CAAC;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC;CAC/C,CAAC,CAAC;AAQH,KAAK,sBAAsB,GAAG;IAAE,KAAK,EAAE,MAAM,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAEvE,KAAK,eAAe,GAAG,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,mBAAmB,KAAK,sBAAsB,CAAC;AAMlG,eAAO,MAAM,eAAe,uBAAwC,CAAC;AAoDrE,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAyF1E,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAO,EAAE,OAAc,EAAE,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,+BAMxG"}
+{"version":3,"file":"notifications.d.ts","sourceRoot":"","sources":["../../../src/components/display/notifications.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,OAAO,EAAiB,KAAK,iBAAiB,EAAmC,MAAM,OAAO,CAAC;AAG/F,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,QAAQ;;mFAgBb,CAAC;AAYF,KAAK,mBAAmB,GAAG,OAAO,CAAC;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC;CACjD,CAAC,CAAC;AAQH,KAAK,sBAAsB,GAAG;IAAE,KAAK,EAAE,MAAM,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAEvE,KAAK,eAAe,GAAG,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,EAAE,mBAAmB,KAAK,sBAAsB,CAAC;AAMlG,eAAO,MAAM,eAAe,uBAAwC,CAAC;AAkDrE,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAsF1E,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAO,EAAE,OAAc,EAAE,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,+BAMxG"}

package/dist/components/display/notifications.jsx

@@ -1,7 +1,7 @@
 "use client";
 import { Toast as Base } from "@base-ui/react/toast";
 import { cva } from "class-variance-authority";
-import { XIcon, CheckCircleIcon, TriangleAlertIcon, InfoIcon, Loader2Icon, } from "lucide-react";
+import { XIcon, CheckCircleIcon, TriangleAlertIcon, InfoIcon, Loader2Icon } from "lucide-react";
 import { AnimatePresence, motion } from "motion/react";
 import { createContext, useCallback, useContext, useRef } from "react";
 import { useHover } from "../../hooks/use-hover";
@@ -38,31 +38,31 @@ function Notification(props) {
     const loading = props.toast.data?.loading ?? false;
     const theme = props.toast.data?.theme || "default";
     const className = variants({ theme });
-    const Icon = loading ? Loader2Icon : (themeIcons[theme] || InfoIcon);
+    const Icon = loading ? Loader2Icon : themeIcons[theme] || InfoIcon;
     return (<Base.Root toast={props.toast} swipeDirection="right">
-      <motion.li layout initial={{ opacity: 0, y: -20, scale: 0.95 }} animate={{ opacity: 1, y: 0, scale: 1 }} exit={{ opacity: 0, scale: 0.9, y: -20, transition: { duration: 0.2 } }} transition={{
+            <motion.li layout initial={{ opacity: 0, y: -20, scale: 0.95 }} animate={{ opacity: 1, y: 0, scale: 1 }} exit={{ opacity: 0, scale: 0.9, y: -20, transition: { duration: 0.2 } }} transition={{
             type: "spring",
             damping: 25,
             stiffness: 300,
-        }} className="pointer-events-auto list-none w-full">
-        <Base.Content className={css(className, "shadow-lg")}>
-          <div className="flex items-start gap-3 p-4">
-            <div className={css("mt-0.5 shrink-0 opacity-80", loading && "animate-spin")}>
-              <Icon className="size-4"/>
-            </div>
+        }} className="pointer-events-auto w-full list-none">
+                <Base.Content className={css(className, "shadow-lg")}>
+                    <div className="flex items-start gap-3 p-4">
+                        <div className={css("mt-0.5 shrink-0 opacity-80", loading && "animate-spin")}>
+                            <Icon className="size-4"/>
+                        </div>
 
-            <div className="flex flex-1 flex-col gap-1 overflow-hidden">
-              {props.toast.title ? (<Base.Title className="truncate font-semibold leading-tight tracking-tight select-text"/>) : null}
-              <Base.Description className="text-xs font-medium opacity-90 select-text leading-relaxed line-clamp-2"/>
-            </div>
+                        <div className="flex flex-1 flex-col gap-1 overflow-hidden">
+                            {props.toast.title ? <Base.Title className="select-text truncate font-semibold leading-tight tracking-tight"/> : null}
+                            <Base.Description className="line-clamp-2 select-text text-xs font-medium leading-relaxed opacity-90"/>
+                        </div>
 
-            {closable && !loading ? (<Base.Close className="shrink-0 -mr-1 -mt-1 p-1.5 rounded-lg text-foreground/40 transition hover:bg-foreground/10 hover:text-foreground">
-                <XIcon className="size-3.5"/>
-              </Base.Close>) : null}
-          </div>
-        </Base.Content>
-      </motion.li>
-    </Base.Root>);
+                        {closable && !loading ? (<Base.Close className="-mr-1 -mt-1 shrink-0 rounded-lg p-1.5 text-foreground/40 transition hover:bg-foreground/10 hover:text-foreground">
+                                <XIcon className="size-3.5"/>
+                            </Base.Close>) : null}
+                    </div>
+                </Base.Content>
+            </motion.li>
+        </Base.Root>);
 }
 function NotificationsViewport({ max = 5 }) {
     const ref = useRef(null);
@@ -71,15 +71,15 @@ function NotificationsViewport({ max = 5 }) {
     const allToasts = max ? toastManager.toasts.slice(0, max) : toastManager.toasts;
     const visibleToasts = hover ? allToasts : allToasts.slice(0, 3);
     const hiddenCount = allToasts.length - visibleToasts.length;
-    return (<Base.Viewport ref={ref} className="fixed left-1/2 top-6 z-[100] flex w-full max-w-[380px] -translate-x-1/2 flex-col gap-3 outline-none pointer-events-none overflow-visible">
-      <AnimatePresence mode="popLayout" initial={false}>
-        {visibleToasts.map((toast) => (<Notification key={toast.id} toast={toast}/>))}
-      </AnimatePresence>
+    return (<Base.Viewport ref={ref} className="pointer-events-none fixed left-1/2 top-6 z-[100] flex w-full max-w-[380px] -translate-x-1/2 flex-col gap-3 overflow-visible outline-none">
+            <AnimatePresence mode="popLayout" initial={false}>
+                {visibleToasts.map((toast) => (<Notification key={toast.id} toast={toast}/>))}
+            </AnimatePresence>
 
-      {!hover && hiddenCount > 0 && (<motion.div layout initial={{ opacity: 0, y: -10 }} animate={{ opacity: 1, y: 0 }} exit={{ opacity: 0, y: -10 }} className="self-center px-3 py-1 text-[10px] font-bold tracking-wider uppercase bg-card-background/80 backdrop-blur shadow-sm border border-card-border rounded-full text-foreground/50 pointer-events-auto cursor-default transition-all hover:bg-card-background hover:text-foreground/80">
-          +{hiddenCount} more
-        </motion.div>)}
-    </Base.Viewport>);
+            {!hover && hiddenCount > 0 && (<motion.div layout initial={{ opacity: 0, y: -10 }} animate={{ opacity: 1, y: 0 }} exit={{ opacity: 0, y: -10 }} className="pointer-events-auto cursor-default self-center rounded-full border border-card-border bg-card-background/80 px-3 py-1 text-[10px] font-bold uppercase tracking-wider text-foreground/50 shadow-sm backdrop-blur transition-all hover:bg-card-background hover:text-foreground/80">
+                    +{hiddenCount} more
+                </motion.div>)}
+        </Base.Viewport>);
 }
 function NotificationsInner({ children, max = 5 }) {
     const toastManager = Base.useToastManager();
@@ -113,14 +113,14 @@ function NotificationsInner({ children, max = 5 }) {
         };
     }, [toastManager, clear]);
     return (<NotificationContext.Provider value={notify}>
-      {children}
-      <Base.Portal>
-        <NotificationsViewport max={max}/>
-      </Base.Portal>
-    </NotificationContext.Provider>);
+            {children}
+            <Base.Portal>
+                <NotificationsViewport max={max}/>
+            </Base.Portal>
+        </NotificationContext.Provider>);
 }
 export function Notifications({ children, max = 5, timeout = 5000 }) {
     return (<Base.Provider limit={max} timeout={timeout}>
-      <NotificationsInner max={max}>{children}</NotificationsInner>
-    </Base.Provider>);
+            <NotificationsInner max={max}>{children}</NotificationsInner>
+        </Base.Provider>);
 }

package/dist/components/display/progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../src/components/display/progress.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,KAAK,aAAa,GAAG;IACnB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAA;AAED,eAAO,MAAM,QAAQ,GAAI,OAAO,eAAe,CAAC,aAAa,CAAC,gCAoB7D,CAAA"}
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../src/components/display/progress.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,KAAK,aAAa,GAAG;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,eAAe,CAAC,aAAa,CAAC,gCAwB7D,CAAC"}

package/dist/components/display/progress.jsx

@@ -2,12 +2,10 @@ import { Is } from "sidekicker";
 import { Progress as RadixProgress } from "@base-ui/react/progress";
 import { css } from "../../lib/dom";
 export const Progress = (props) => {
-    return (<RadixProgress.Root max={props.max} value={props.percent ?? null} style={{ transform: "translateZ(0)", }} className={css("overflow-hidden relative w-full rounded-full h-6 bg-background", props.container)}>
-      <RadixProgress.Indicator style={{ transform: Is.number(props.percent) ? `translateX(-${100 - props.percent}%)` : undefined }} className={css("bg-primary transition-transform ease-in-out size-full duration-500", props.className)}/>
-      {Is.number(props.percent)
-            ? <p className={css("flex absolute inset-0 justify-center items-center w-full font-semibold tabular-nums text-primary-foreground", props.textClassName)}>
-          {props.label ? props.label : `${props.percent} %`}
-        </p>
-            : null}
-    </RadixProgress.Root>);
+    return (<RadixProgress.Root max={props.max} value={props.percent ?? null} style={{ transform: "translateZ(0)" }} className={css("relative h-6 w-full overflow-hidden rounded-full bg-background", props.container)}>
+            <RadixProgress.Indicator style={{ transform: Is.number(props.percent) ? `translateX(-${100 - props.percent}%)` : undefined }} className={css("size-full bg-primary transition-transform duration-500 ease-in-out", props.className)}/>
+            {Is.number(props.percent) ? (<p className={css("absolute inset-0 flex w-full items-center justify-center font-semibold tabular-nums text-primary-foreground", props.textClassName)}>
+                    {props.label ? props.label : `${props.percent} %`}
+                </p>) : null}
+        </RadixProgress.Root>);
 };

package/dist/components/display/shortcut.jsx

@@ -11,7 +11,7 @@ const remap = (x) => {
 };
 export const Shortcut = (props) => {
     const p = props.value.trim().split("+");
-    return (<span className="flex text-sm items-center gap-1">
+    return (<span className="flex items-center gap-1 text-sm">
             {p.map((x, i) => {
             const isLast = p.length - 1 === i;
             return (<Fragment key={`${props.value}-${x}-key-${i}`}>

package/dist/components/display/skeleton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/display/skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAU,KAAK,WAAW,EAAE,MAAM,OAAO,CAAC;AAIvE,eAAO,MAAM,YAAY,mBAAiE,CAAC;AAE3F,eAAO,MAAM,QAAQ,GAAI,OAAO;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,WAAW,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,sBAE9F,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,sBAUvE,CAAA"}
+{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../../src/components/display/skeleton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAU,KAAK,WAAW,EAAE,MAAM,OAAO,CAAC;AAIvE,eAAO,MAAM,YAAY,mBAAiE,CAAC;AAE3F,eAAO,MAAM,QAAQ,GAAI,OAAO;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,WAAW,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAA;CAAE,sBAE9F,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,sBAQvE,CAAC"}

package/dist/components/display/skeleton.jsx

@@ -1,14 +1,12 @@
 import React, { useRef } from "react";
 import { css } from "../../lib/dom";
 import { Polymorph } from "../core/polymorph";
-export const SkeletonCell = <div className="w-10/12 h-6 rounded animate-pulse bg-muted"/>;
-export const Skeleton = (props) => (<Polymorph {...props} as={props.as || "span"} className={css("block rounded h-8 w-32 animate-pulse bg-muted", props.className)}/>);
+export const SkeletonCell = <div className="h-6 w-10/12 animate-pulse rounded bg-muted"/>;
+export const Skeleton = (props) => (<Polymorph {...props} as={props.as || "span"} className={css("block h-8 w-32 animate-pulse rounded bg-muted", props.className)}/>);
 export const SkeletonList = (props) => {
     const items = useRef(Array.from({ length: props.rows }).map((_, i) => {
         const rand = Math.max(100, Math.random() * 99);
         return <Skeleton key={`skeleton-${rand}-${i}`} style={{ width: `${rand}%` }} as="li"/>;
     }));
-    return (<ul className={css("flex flex-col gap-6", props.className)}>
-      {items.current}
-    </ul>);
+    return <ul className={css("flex flex-col gap-6", props.className)}>{items.current}</ul>;
 };