@g4rcez/components 0.0.36 → 0.0.38

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

@@ -3,19 +3,14 @@ import React from "react";
 import { type Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
 declare const buttonVariants: (props?: ({
-    size?: "big" | "small" | "default" | "icon" | null | undefined;
+    size?: "big" | "small" | "min" | "default" | "icon" | null | undefined;
     rounded?: "circle" | "default" | "rough" | "squared" | null | undefined;
-    theme?: "main" | "raw" | "primary" | "warn" | "danger" | "secondary" | "success" | "info" | null | undefined;
+    theme?: "main" | "disabled" | "loading" | "raw" | "danger" | "info" | "neutral" | "primary" | "secondary" | "success" | "warn" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export type ButtonProps<T extends React.ElementType = "button"> = PolymorphicProps<VariantProps<typeof buttonVariants> & Partial<{
     icon: Label;
     loading: boolean;
 }>, T>;
 export declare const Button: <T extends React.ElementType = "button">(props: ButtonProps<T>) => any;
-type Props = {
-    active: string;
-    buttons: ButtonProps[];
-};
-export declare const ButtonGroup: (props: Props) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=button.d.ts.map

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":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,cAAc;;;;mFA6BnB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,gBAAgB,CAC9E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAChF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,GAsB7E,CAAC;AAEZ,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,WAAW,EAAE,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,WAAW,UAAW,KAAK,4CAkBvC,CAAC"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/core/button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,cAAc;;;;mFAiCnB,CAAC;AAEF,MAAM,MAAM,WAAW,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,IAAI,gBAAgB,CAC9E,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAChF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,QAAQ,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,CAAC,KAAK,GAsB7E,CAAC"}

package/dist/components/core/button.js

@@ -1,32 +1,36 @@
 import { __rest } from "tslib";
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { forwardRef } from "react";
 import { css } from "../../lib/dom";
 import { Polymorph } from "./polymorph";
-const buttonVariants = cva("inline-flex duration-700 enabled:hover:bg-opacity-80 data-[loading=true]:opacity-30 data-[loading=true]:animate-pulse gap-1.5 text-main-foreground border-2 border-transparent items-center justify-center align-middle cursor-pointer whitespace-nowrap font-medium transition-colors ease-in disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring ease-normal", {
+const buttonVariants = cva("inline-flex duration-500 enabled:hover:bg-opacity-70 data-[loading=true]:opacity-30 data-[loading=true]:animate-pulse gap-1.5 border-2 border-transparent items-center justify-center align-middle cursor-pointer whitespace-nowrap font-medium transition-colors ease-in disabled:cursor-not-allowed disabled:bg-opacity-40 disabled:text-opacity-80 focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring ease-normal", {
     variants: {
         size: {
             default: "h-10 px-4 py-2",
             big: "h-12 px-6 py-4",
             small: "h-8 p-2 text-sm",
+            min: "h-7 px-2 py-1 text-sm",
             icon: "p-1",
         },
         rounded: {
             rough: "rounded-sm",
-            default: "rounded-md",
+            default: "rounded-button",
             squared: "rounded-none",
             circle: "rounded-full aspect-square",
         },
         theme: {
             raw: "",
-            primary: "bg-primary text-primary-foreground",
+            danger: "bg-button-danger-bg text-button-danger-text",
+            disabled: "bg-disabled duration-700 opacity-70",
+            info: "bg-button-info-bg text-button-info-text",
+            loading: "animate-pulse bg-disabled duration-700 opacity-70",
             main: "bg-primary text-primary-foreground",
-            warn: "bg-warn text-warn-foreground",
-            danger: "bg-danger text-danger-foreground",
-            secondary: "bg-secondary-background text-secondary-foreground disabled:text-secondary-subtle",
-            success: "bg-success text-success-foreground",
-            info: "bg-info text-info-foreground",
+            neutral: "bg-transparent border border-card-border",
+            primary: "bg-button-primary-bg text-button-primary-text",
+            secondary: "bg-button-secondary-bg text-button-secondary-text",
+            success: "bg-button-success-bg text-button-success-text",
+            warn: "bg-button-warn-bg text-button-warn-text",
         },
     },
     defaultVariants: { theme: "main", size: "default", rounded: "default" },
@@ -37,4 +41,3 @@ export const Button = forwardRef(function Button(_a, ref) {
     const disabled = loading || props.disabled;
     return (_jsxs(Polymorph, Object.assign({}, props, { ref: ref, type: type, "data-theme": theme, "data-loading": loading, disabled: disabled, "aria-busy": disabled || loading, as: (_b = props.as) !== null && _b !== void 0 ? _b : "button", onClick: disabled ? undefined : props.onClick, className: css(buttonVariants({ size, rounded, theme }), className), children: [icon, props.children] })));
 });
-export const ButtonGroup = (props) => (_jsx("ul", { className: "border-main-bg text-main-foreground flex w-full flex-row rounded-md border-2", children: props.buttons.map((button) => (_jsx("li", { className: "flex flex-1", children: _jsx("button", Object.assign({}, button, { type: button.type || "button", "data-active": props.active === button.name ? "true" : "false", className: css("flex flex-1 items-center gap-1.5 rounded-sm border-r-2 px-4 py-2 last:border-r-0", "cursor-pointer justify-center whitespace-nowrap align-middle font-medium", "focus-visible:ring-ring shadow-sm focus-visible:outline-none focus-visible:ring-2 disabled:text-opacity-80", "data-[active=true]:bg-main-bg text-body data-[active=true]:text-main transition-colors ease-in disabled:cursor-not-allowed disabled:bg-opacity-50") })) }, `button-group-${button.name}`))) }));

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

@@ -3,11 +3,11 @@ import React from "react";
 import { Label } from "../../types";
 import { PolymorphicProps } from "./polymorph";
 declare const indicatorVariant: (props?: ({
-    theme?: "main" | "warn" | "danger" | "secondary" | "success" | "info" | null | undefined;
+    theme?: "main" | "danger" | "info" | "secondary" | "success" | "warn" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 declare const tagVariants: (props?: ({
     size?: "big" | "small" | "default" | "icon" | null | undefined;
-    theme?: "main" | "disabled" | "loading" | "raw" | "warn" | "danger" | "secondary" | "success" | "info" | "neutral" | null | undefined;
+    theme?: "disabled" | "loading" | "danger" | "info" | "neutral" | "primary" | "secondary" | "success" | "warn" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export type TagProps<T extends React.ElementType = "span"> = PolymorphicProps<VariantProps<typeof tagVariants> & Partial<{
     icon: Label;

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

@@ -1 +1 @@
-{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,gBAAgB;;mFAWpB,CAAC;AAEH,QAAA,MAAM,WAAW;;;mFAyBhB,CAAC;AAEF,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,YAAY,CAAC,OAAO,WAAW,CAAC,GAC5B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC;CAC7D,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAWrE,CAAC"}
+{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,gBAAgB;;mFAWpB,CAAC;AAEH,QAAA,MAAM,WAAW;;;mFAqBf,CAAC;AAEH,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,YAAY,CAAC,OAAO,WAAW,CAAC,GAC5B,OAAO,CAAC;IACJ,IAAI,EAAE,KAAK,CAAC;IACZ,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC;CAC7D,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAWrE,CAAC"}

package/dist/components/core/tag.js

@@ -16,7 +16,7 @@ const indicatorVariant = cva("size-2.5 aspect-square rounded-full border-0", {
         },
     },
 });
-const tagVariants = cva("inline-flex rounded-pill gap-1.5 text-main-foreground border-2 border-transparent items-center justify-center align-middle whitespace-nowrap", {
+const tagVariants = cva("inline-flex rounded-pill gap-1.5 border-2 border-transparent items-center justify-center align-middle whitespace-nowrap", {
     variants: {
         size: {
             icon: "p-1",
@@ -25,19 +25,18 @@ const tagVariants = cva("inline-flex rounded-pill gap-1.5 text-main-foreground b
             small: "h-6 p-2 px-3 text-sm",
         },
         theme: {
-            raw: "",
-            warn: "bg-warn-subtle text-warn-hover",
-            info: "bg-info-subtle text-info-hover",
-            main: "bg-primary-subtle text-primary-hover",
-            danger: "bg-danger-subtle text-danger-hover",
-            success: "bg-success-subtle text-success-hover",
+            primary: "bg-tag-primary-bg text-tag-primary-text",
+            danger: "bg-tag-danger-bg text-tag-danger-text",
+            info: "bg-tag-info-bg text-tag-info-text",
+            success: "bg-tag-success-bg text-tag-success-text",
+            secondary: "bg-tag-secondary-bg text-tag-secondary-text",
+            warn: "bg-tag-warn-bg text-tag-warn-text",
+            neutral: "bg-transparent border border-card-border",
             disabled: "bg-disabled duration-700 opacity-70",
             loading: "animate-pulse bg-disabled duration-700 opacity-70",
-            secondary: "bg-secondary-background text-secondary-foreground",
-            neutral: "bg-transparent border-card-border border text-foreground",
         },
     },
-    defaultVariants: { theme: "main", size: "default" },
+    defaultVariants: { theme: "primary", size: "default" },
 });
 export const Tag = forwardRef(function Tag(_a, ref) {
     var _b;

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

@@ -7,7 +7,7 @@ type CollapseProps = {
 } & HTMLMotionProps<"section">;
 export declare const Collapse: (props: PropsWithChildren<CollapseProps>) => import("react/jsx-runtime").JSX.Element;
 declare const alertVariants: (props?: ({
-    theme?: "danger" | "success" | "info" | "neutral" | null | undefined;
+    theme?: "danger" | "info" | "neutral" | "success" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 export type AlertProps<T extends React.ElementType = "div"> = PolymorphicProps<VariantProps<typeof alertVariants> & Partial<{
     container: string;

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

@@ -2,7 +2,7 @@ import { type VariantProps } from "class-variance-authority";
 import { type PropsWithChildren } from "react";
 import { Label } from "../../types";
 declare const variants: (props?: ({
-    theme?: "default" | "warn" | "danger" | "success" | "info" | null | undefined;
+    theme?: "default" | "danger" | "info" | "success" | "warn" | null | undefined;
 } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
 type NotificationOptions = Partial<{
     title: Label;

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

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/display/tabs.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA2B,iBAAiB,EAA4D,MAAM,OAAO,CAAC;AAGpI,OAAO,EAAE,KAAK,EAAY,MAAM,aAAa,CAAC;AAK9C,MAAM,MAAM,SAAS,GAAG;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAqCF,eAAO,MAAM,IAAI,UAAW,iBAAiB,CAAC,SAAS,CAAC,4CAmGvD,CAAC;AAIF,MAAM,MAAM,QAAQ,GACd;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,GAChD;IACI,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAER,eAAO,MAAM,GAAG,UAAW,iBAAiB,CAAC,QAAQ,CAAC,4CAGrD,CAAC"}
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/display/tabs.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA2B,iBAAiB,EAAkD,MAAM,OAAO,CAAC;AAG1H,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAGpC,MAAM,MAAM,SAAS,GAAG;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAIF,eAAO,MAAM,IAAI,UAAW,iBAAiB,CAAC,SAAS,CAAC,4CA2FvD,CAAC;AAIF,MAAM,MAAM,QAAQ,GACd;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,GAChD;IACI,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAER,eAAO,MAAM,GAAG,UAAW,iBAAiB,CAAC,QAAQ,CAAC,4CAGrD,CAAC"}

package/dist/components/display/tabs.js

@@ -1,29 +1,11 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { motion, useMotionValue } from "framer-motion";
-import React, { createContext, Fragment, useContext, useEffect, useLayoutEffect, useRef, useState } from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMotionValue } from "framer-motion";
+import React, { createContext, Fragment, useContext, useEffect, useLayoutEffect, useRef } from "react";
 import { useReactive } from "../../hooks/use-reactive";
 import { useStableRef } from "../../hooks/use-stable-ref";
-import { Button } from "../core/button";
-import { Modal } from "../floating/modal";
 import { Card } from "./card";
 const Context = createContext("");
-const SelectTab = (props) => {
-    var _a;
-    const [view, setView] = useState(false);
-    const title = props.items.find((x) => {
-        const inner = x.props;
-        return inner.id === props.active;
-    });
-    return (_jsxs("div", { className: "my-4 flex min-w-full px-8 text-center lg:hidden", children: [_jsx(Button, { className: "min-w-full", onClick: () => setView(true), children: (_a = title === null || title === void 0 ? void 0 : title.props) === null || _a === void 0 ? void 0 : _a.title }), _jsx(Modal, { closable: true, onChange: setView, open: view, type: "dialog", children: _jsx("ul", { className: "mt-4 space-y-4", children: props.items.map((x) => {
-                        const inner = x.props;
-                        const onClick = () => {
-                            props.setActive(inner.id);
-                            setView(false);
-                        };
-                        return (_jsx("li", { className: "min-w-full", children: _jsx(Button, { className: "w-full", onClick: onClick, theme: inner.id === props.active ? "primary" : "secondary", children: inner.title }) }, inner.id));
-                    }) }) })] }));
-};
 export const Tabs = (props) => {
     const [active, setActive] = useReactive(props.active);
     const left = useMotionValue(0);
@@ -73,10 +55,10 @@ export const Tabs = (props) => {
         left.set(anchor.offsetLeft);
         setActive(anchor.dataset.id || "");
     };
-    return (_jsx(Context.Provider, { value: active, children: _jsx(Card, { container: "pt-0", className: props.className, header: _jsxs("header", { ref: ref, className: "relative mb-2 border-b border-card-border", children: [_jsx(motion.div, { layout: true, initial: false, "aria-hidden": "true", style: { left, width }, transition: { type: "tween", left, width }, className: "absolute bottom-0 hidden h-0.5 w-28 bg-primary transition-all duration-300 lg:block" }), _jsxs("nav", { children: [_jsx(SelectTab, { setActive: setActive, items: items, active: active }), _jsx("ul", { className: "hidden justify-between divide-x divide-card-border overflow-x-auto md:justify-start lg:flex", children: items.map((x) => {
-                                    const inner = x.props;
-                                    return (_jsx("li", { "data-id": inner.id, "data-active": active === inner.id, className: "w-full data-[active=true]:text-primary md:w-auto", children: _jsx(Render, { "data-id": inner.id, onClick: onClick, "aria-current": "page", className: "block w-full whitespace-nowrap px-10 py-4 font-medium", href: props.useHash ? `#${inner.id}` : undefined, children: inner.title }) }, `tab-header-${inner.id}`));
-                                }) })] })] }), children: props.children }) }));
+    return (_jsx(Context.Provider, { value: active, children: _jsx(Card, { className: props.className, container: "pt-0 max-w-full w-full min-w-0", header: _jsx("header", { ref: ref, className: "relative mb-2 overflow-x-auto border-b border-card-border", children: _jsx("nav", { className: "min-w-0", children: _jsx("ul", { className: "flex w-0 min-w-full flex-1 justify-start overflow-x-auto", children: items.map((x) => {
+                            const inner = x.props;
+                            return (_jsx("li", { "data-id": inner.id, "data-active": active === inner.id, className: "w-full border-b-2 border-card-border data-[active=true]:border-primary data-[active=true]:font-bold data-[active=true]:text-primary", children: _jsx(Render, { "data-id": inner.id, onClick: onClick, "aria-current": "page", href: props.useHash ? `#${inner.id}` : undefined, className: "block w-full whitespace-nowrap px-10 py-4", children: inner.title }) }, `tab-header-${inner.id}`));
+                        }) }) }) }), children: props.children }) }));
 };
 const useTabs = () => useContext(Context);
 export const Tab = (props) => {

package/dist/components/floating/expand.js

@@ -13,8 +13,8 @@ export const Expand = (props) => {
     const { context, refs } = useFloating({
         transform: true,
         open: open !== null,
-        onOpenChange: setOpen,
         nodeId: id,
+        onOpenChange: setOpen,
         strategy: "absolute",
     });
     const click = useClick(context);

package/dist/components/floating/menu.d.ts

@@ -2,11 +2,13 @@ import { LucideProps } from "lucide-react";
 import React from "react";
 import { Override } from "../../types";
 export type MenuProps = Partial<{
+    FloatingComponent: React.ElementType;
+    floatingClassName: string;
     hover: boolean;
     nested: boolean;
     isParent: boolean;
-    children: React.ReactNode;
     asChild: boolean;
+    children: React.ReactNode;
 } & ({
     label: string;
 } | {
@@ -24,20 +26,24 @@ type MenuItemProps = {
     Right?: React.FC<LucideProps>;
 };
 export declare const MenuItem: React.ForwardRefExoticComponent<Override<React.ButtonHTMLAttributes<HTMLButtonElement>, MenuItemProps> & React.RefAttributes<HTMLButtonElement>>;
-export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "asChild" | "hover" | "nested" | "isParent"> & Partial<{
+export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "FloatingComponent" | "floatingClassName" | "nested" | "isParent" | "asChild"> & Partial<{
+    FloatingComponent: React.ElementType;
+    floatingClassName: string;
     hover: boolean;
     nested: boolean;
     isParent: boolean;
-    children: React.ReactNode;
     asChild: boolean;
+    children: React.ReactNode;
 } & {
     label: string;
-}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "asChild" | "hover" | "nested" | "isParent"> & Partial<{
+}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "FloatingComponent" | "floatingClassName" | "nested" | "isParent" | "asChild"> & Partial<{
+    FloatingComponent: React.ElementType;
+    floatingClassName: string;
     hover: boolean;
     nested: boolean;
     isParent: boolean;
-    children: React.ReactNode;
     asChild: boolean;
+    children: React.ReactNode;
 } & {
     label: React.ReactElement;
     title: string;

package/dist/components/floating/menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AAGhG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAyBvC,MAAM,MAAM,SAAS,GAAG,OAAO,CAC3B;IACI,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC;CACpB,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACzE,CAAC;AA6JF,KAAK,aAAa,GACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,GACpE;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEtG,eAAO,MAAM,QAAQ,kJAiCpB,CAAC;AAEF,eAAO,MAAM,IAAI;WA1MF,OAAO;YACN,OAAO;cACL,OAAO;cACP,KAAK,CAAC,SAAS;aAChB,OAAO;;WACN,MAAM;;WALT,OAAO;YACN,OAAO;cACL,OAAO;cACP,KAAK,CAAC,SAAS;aAChB,OAAO;;WACc,KAAK,CAAC,YAAY;WAAS,MAAM;qDA8MrE,CAAC"}
+{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AAGhG,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAyBvC,MAAM,MAAM,SAAS,GAAG,OAAO,CAC3B;IACI,iBAAiB,EAAE,KAAK,CAAC,WAAW,CAAC;IACrC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACzE,CAAC;AAkKF,KAAK,aAAa,GACZ;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,GACpE;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAEtG,eAAO,MAAM,QAAQ,kJAiCpB,CAAC;AAEF,eAAO,MAAM,IAAI;uBAjNU,KAAK,CAAC,WAAW;uBACjB,MAAM;WAClB,OAAO;YACN,OAAO;cACL,OAAO;aACR,OAAO;cACN,KAAK,CAAC,SAAS;;WACf,MAAM;;uBAPG,KAAK,CAAC,WAAW;uBACjB,MAAM;WAClB,OAAO;YACN,OAAO;cACL,OAAO;aACR,OAAO;cACN,KAAK,CAAC,SAAS;;WACK,KAAK,CAAC,YAAY;WAAS,MAAM;qDAmNrE,CAAC"}

package/dist/components/floating/menu.js

@@ -5,18 +5,18 @@ import { autoUpdate, flip, FloatingFocusManager, FloatingList, FloatingNode, Flo
 import { Slot } from "@radix-ui/react-slot";
 import { ChevronRightIcon } from "lucide-react";
 import React, { createContext, Fragment, useContext, useEffect, useRef, useState } from "react";
-import { FLOATING_DELAY } from "../../constants";
+import { FLOATING_DELAY, TYPEAHEAD_RESET_DELAY } from "../../constants";
 import { css } from "../../lib/dom";
-const menuItemClassName = (highlight = "") => css("w-full min-w-36 outline-none px-2 py-1 items-center flex justify-between text-left", "hover:bg-primary data-[open]:bg-primary focus:bg-primary aria-expanded:opacity-80", "first-of-type:rounded-t-lg last-of-type:rounded-b-lg", "disabled:opacity-40 disabled:cursor-not-allowed", highlight);
+const menuItemClassName = (highlight = "") => css("w-full min-w-36 outline-none p-2.5  items-center flex justify-between text-left", "hover:bg-primary data-[open]:bg-primary focus:bg-primary aria-expanded:opacity-80", "first-of-type:rounded-t-lg last-of-type:rounded-b-lg", "disabled:opacity-40 disabled:cursor-not-allowed", highlight);
 const MenuContext = createContext({
-    isOpen: false,
     activeIndex: null,
     getItemProps: () => ({}),
+    isOpen: false,
     setActiveIndex: () => { },
     setHasFocusInside: () => { },
 });
 const MenuComponent = React.forwardRef((_a, forwardedRef) => {
-    var { children, hover = true, isParent, label } = _a, props = __rest(_a, ["children", "hover", "isParent", "label"]);
+    var { children, FloatingComponent = "div", hover = true, isParent, floatingClassName = "", label } = _a, props = __rest(_a, ["children", "FloatingComponent", "hover", "isParent", "floatingClassName", "label"]);
     const parentId = useFloatingParentNodeId();
     const isNested = parentId !== null;
     const [isOpen, setIsOpen] = useState(false);
@@ -34,7 +34,8 @@ const MenuComponent = React.forwardRef((_a, forwardedRef) => {
         transform: true,
         onOpenChange: setIsOpen,
         whileElementsMounted: autoUpdate,
-        placement: isNested ? "right-start" : "bottom-start",
+        placement: isNested ? "right" : "bottom-start",
+        strategy: "absolute",
         middleware: [offset({ mainAxis: isNested ? 0 : 4, alignmentAxis: isNested ? -4 : 0 }), flip(), shift()],
     });
     const role = useRole(context, { role: "menu", enabled: true });
@@ -63,6 +64,7 @@ const MenuComponent = React.forwardRef((_a, forwardedRef) => {
     const typeahead = useTypeahead(context, {
         activeIndex,
         listRef: labelsRef,
+        resetMs: TYPEAHEAD_RESET_DELAY,
         onMatch: isOpen ? setActiveIndex : undefined,
     });
     const { getReferenceProps, getFloatingProps, getItemProps } = useInteractions([hoverModule, click, role, dismiss, listNavigation, typeahead]);
@@ -86,18 +88,18 @@ const MenuComponent = React.forwardRef((_a, forwardedRef) => {
         if (isOpen && tree)
             tree.events.emit("menuopen", { parentId, nodeId });
     }, [tree, isOpen, nodeId, parentId]);
-    const className = isParent ? props.className : menuItemClassName(props.className);
+    const className = isParent ? props.className : css(menuItemClassName(props.className));
     return (_jsxs(FloatingNode, { id: nodeId, children: [_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ children: label, ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className }, getReferenceProps(parent.getItemProps(Object.assign(Object.assign({}, props), { onFocus(event) {
                         var _a;
                         (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
                         setHasFocusInside(false);
                         parent.setHasFocusInside(true);
-                    } })))))) : (_jsxs("button", Object.assign({ ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className }, getReferenceProps(parent.getItemProps(Object.assign(Object.assign({}, props), { onFocus(event) {
+                    } })))))) : (_jsxs("button", Object.assign({ type: "button", ref: useMergeRefs([refs.setReference, item.ref, forwardedRef]), tabIndex: !isNested ? undefined : parent.activeIndex === item.index ? 0 : -1, "data-open": isOpen ? "" : undefined, "data-nested": isNested ? "" : undefined, role: isNested ? "menuitem" : undefined, "data-focus-inside": hasFocusInside ? "" : undefined, className: className }, getReferenceProps(parent.getItemProps(Object.assign(Object.assign({}, props), { onFocus(event) {
                         var _a;
                         (_a = props.onFocus) === null || _a === void 0 ? void 0 : _a.call(props, event);
                         setHasFocusInside(false);
                         parent.setHasFocusInside(true);
-                    } }))), { children: [label, isNested && (_jsxs("span", { style: { marginLeft: 10, fontSize: 10 }, children: [_jsx("span", { className: "sr-only", children: "Next menu" }), _jsx(ChevronRightIcon, { size: 14 })] }))] }))) }), _jsx(MenuContext.Provider, { value: { activeIndex, setActiveIndex, getItemProps, setHasFocusInside, isOpen }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: isNested ? -1 : 0, returnFocus: !isNested, children: _jsx("div", Object.assign({ ref: refs.setFloating, style: floatingStyles, className: "isolate z-tooltip flex flex-col items-start rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none" }, getFloatingProps(), { children: children })) }) })) }) })] }));
+                    } }))), { children: [label, isNested && (_jsxs("span", { style: { marginLeft: 10, fontSize: 10 }, children: [_jsx("span", { className: "sr-only", children: "Next menu" }), _jsx(ChevronRightIcon, { size: 14 })] }))] }))) }), _jsx(MenuContext.Provider, { value: { activeIndex, setActiveIndex, getItemProps, setHasFocusInside, isOpen }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: isNested ? -1 : 0, returnFocus: !isNested, children: _jsx(FloatingComponent, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, style: Object.assign(Object.assign({}, props.style), floatingStyles), className: css("isolate z-tooltip flex flex-col items-start rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none", floatingClassName), children: children })) }) })) }) })] }));
 });
 export const MenuItem = React.forwardRef((_a, forwardedRef) => {
     var { label, title, Right, disabled } = _a, props = __rest(_a, ["label", "title", "Right", "disabled"]);

package/dist/components/floating/modal.js

@@ -82,7 +82,7 @@ export const Modal = (_a) => {
     var { type: _type = "dialog", resizer = true, overlayClickClose = false, forceType = false, closable = true } = _a, props = __rest(_a, ["type", "resizer", "overlayClickClose", "forceType", "closable"]);
     const headingId = useId();
     const descriptionId = useId();
-    const isDesktop = useMediaQuery("(min-width: 48rem)");
+    const isDesktop = useMediaQuery("(min-width: 64rem)");
     const useResizer = _type !== "dialog";
     const position = isDesktop ? (_type === "drawer" ? props.position : positions[_type]) : forceType ? positions[_type] : positions.sheet;
     const func = isDesktop ? animations[_type] : forceType ? animations[_type] : animations.sheet;

package/dist/components/floating/toolbar.d.ts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from "react";
+export type ToolbarProps = {
+    root?: HTMLElement;
+};
+export declare const Toolbar: (props: PropsWithChildren<ToolbarProps>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=toolbar.d.ts.map

package/dist/components/floating/toolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar.d.ts","sourceRoot":"","sources":["../../../src/components/floating/toolbar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,MAAM,YAAY,GAAG;IACvB,IAAI,CAAC,EAAE,WAAW,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,OAAO,UAAW,iBAAiB,CAAC,YAAY,CAAC,4CAI7D,CAAC"}

package/dist/components/floating/toolbar.js

@@ -0,0 +1,4 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { motion } from "framer-motion";
+export const Toolbar = (props) => (_jsx(motion.div, { className: "sticky bottom-4 flex items-center justify-center rounded-lg border border-card-border bg-background p-4", children: props.children }));

package/dist/components/floating/tooltip.d.ts

@@ -6,6 +6,7 @@ export type TooltipProps<T extends ComponentLike = "span"> = Override<Polymorphi
     title: Label;
     enabled?: boolean;
     placement?: Placement;
+    followCursor?: boolean;
 }>;
-export declare const Tooltip: <T extends ComponentLike = "span">({ children, placement, enabled, as, title, ...props }: TooltipProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const Tooltip: <T extends ComponentLike = "span">({ children, followCursor, placement, enabled, as, title, ...props }: TooltipProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=tooltip.d.ts.map

package/dist/components/floating/tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/floating/tooltip.tsx"],"names":[],"mappings":"AACA,OAAO,EAOH,KAAK,SAAS,EAQjB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAqC,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAa,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE7D,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,aAAa,GAAG,MAAM,IAAI,QAAQ,CACjE,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAC5C;IACI,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;CACzB,CACJ,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,aAAa,kEAAkE,YAAY,CAAC,CAAC,CAAC,4CAsC/H,CAAC"}
+{"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../src/components/floating/tooltip.tsx"],"names":[],"mappings":"AACA,OAAO,EAOH,KAAK,SAAS,EASjB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAqC,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAa,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAE9E,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAE7D,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,aAAa,GAAG,MAAM,IAAI,QAAQ,CACjE,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAC5C;IACI,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B,CACJ,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,CAAC,SAAS,aAAa,gFAAwF,YAAY,CAAC,CAAC,CAAC,4CAuCrJ,CAAC"}

package/dist/components/floating/tooltip.js

@@ -1,12 +1,12 @@
 "use client";
 import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { arrow, autoUpdate, flip, FloatingArrow, FloatingPortal, offset, shift, useDismiss, useFloating, useFocus, useHover, useInteractions, useRole, } from "@floating-ui/react";
+import { arrow, autoUpdate, flip, FloatingArrow, FloatingPortal, offset, shift, useClientPoint, useDismiss, useFloating, useFocus, useHover, useInteractions, useRole, } from "@floating-ui/react";
 import { Fragment, useRef, useState } from "react";
 import { Polymorph } from "../../components/core/polymorph";
 import { FLOATING_DELAY } from "../../constants";
 export const Tooltip = (_a) => {
-    var { children, placement, enabled, as, title } = _a, props = __rest(_a, ["children", "placement", "enabled", "as", "title"]);
+    var { children, followCursor = false, placement, enabled, as, title } = _a, props = __rest(_a, ["children", "followCursor", "placement", "enabled", "as", "title"]);
     const [open, setOpen] = useState(false);
     const arrowRef = useRef(null);
     const Component = as || "span";
@@ -22,6 +22,7 @@ export const Tooltip = (_a) => {
     const focus = useFocus(context, { enabled });
     const dismiss = useDismiss(context, { enabled });
     const role = useRole(context, { role: "tooltip", enabled });
-    const { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, dismiss, role]);
+    const clientPoint = useClientPoint(context, { enabled: !!enabled && !!followCursor });
+    const { getReferenceProps, getFloatingProps } = useInteractions([hover, focus, dismiss, role, clientPoint]);
     return (_jsxs(Fragment, { children: [_jsx(Component, Object.assign({ ref: refs.setReference }, getReferenceProps(props), { children: title })), _jsx(FloatingPortal, { children: open && (_jsxs(Polymorph, Object.assign({}, getFloatingProps(), { ref: refs.setFloating, style: floatingStyles, className: "z-tooltip rounded-lg border border-tooltip-border bg-tooltip-background p-3 text-tooltip-foreground shadow-lg", children: [_jsx(FloatingArrow, { ref: arrowRef, context: context, strokeWidth: 0.1, className: "fill-tooltip-background stroke-tooltip-border" }), children] }))) })] }));
 };

package/dist/components/form/input-field.js

@@ -10,5 +10,5 @@ export const InputField = ({ optionalText: _optionalText, left, rightLabel, cont
     const ID = id !== null && id !== void 0 ? id : name;
     const translation = useTranslations();
     const optionalText = _optionalText !== null && _optionalText !== void 0 ? _optionalText : translation.inputOptionalLabel;
-    return (_jsxs("fieldset", { form: form, "data-error": !!error, "data-interactive": !!interactive, className: css("group inline-flex w-full gap-1.5", container), children: [_jsxs("label", { form: form, htmlFor: ID, className: "inline-flex w-full cursor-text flex-row flex-wrap justify-between gap-1 text-sm transition-colors empty:hidden group-hover:border-primary group-error:text-danger", children: [!hideLeft && !rightLabel ? (_jsx(InputFeedback, { info: info, hideLeft: hideLeft, reportStatus: true, title: title, placeholder: placeholder, children: optionalText || rightLabel ? (_jsxs(Fragment, { children: [!required ? _jsx("span", { className: "text-opacity-70", children: optionalText }) : null, rightLabel ? _jsx(Fragment, { children: rightLabel }) : null] })) : null })) : null, _jsxs("div", { className: `group relative flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-focus-within:border-primary group-hover:border-primary group-error:border-danger ${labelClassName} focus:ring-2 focus:ring-inset focus:ring-primary`, children: [left ? _jsx("span", { className: "absolute left-0 flex flex-nowrap gap-1 whitespace-nowrap pl-2", children: left }) : null, children, right ? _jsx("span", { className: "absolute right-0 flex flex-nowrap gap-2 whitespace-nowrap pr-1", children: right }) : null] })] }), _jsx("p", { className: "hidden text-xs empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:block group-error:block group-error:text-danger", children: error }), _jsx("p", { className: "text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block group-assert:block group-error:hidden", children: feedback })] }));
+    return (_jsxs("fieldset", { form: form, "data-error": !!error, "data-interactive": !!interactive, className: css("group inline-flex w-full gap-input-gap", container), children: [_jsxs("label", { form: form, htmlFor: ID, className: "inline-flex w-full cursor-text flex-row flex-wrap justify-between gap-1 text-sm transition-colors empty:hidden group-hover:border-primary group-error:text-danger", children: [!hideLeft && !rightLabel ? (_jsx(InputFeedback, { info: info, hideLeft: hideLeft, reportStatus: true, title: title, placeholder: placeholder, children: optionalText || rightLabel ? (_jsxs(Fragment, { children: [!required ? _jsx("span", { className: "text-opacity-70", children: optionalText }) : null, rightLabel ? _jsx(Fragment, { children: rightLabel }) : null] })) : null })) : null, _jsxs("div", { className: `group relative flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-focus-within:border-primary group-hover:border-primary group-error:border-danger ${labelClassName} focus:ring-2 focus:ring-inset focus:ring-primary`, children: [left ? _jsx("span", { className: "absolute left-0 flex flex-nowrap gap-1 whitespace-nowrap pl-2", children: left }) : null, children, right ? _jsx("span", { className: "absolute right-0 flex flex-nowrap gap-2 whitespace-nowrap pr-1", children: right }) : null] })] }), _jsx("p", { className: "hidden text-xs empty:hidden group-has-[input:not(:focus):invalid[data-initialized=true]]:block group-error:block group-error:text-danger", children: error }), _jsx("p", { className: "text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block group-assert:block group-error:hidden", children: feedback })] }));
 };

package/dist/components/form/input.js

@@ -34,5 +34,5 @@ export const Input = forwardRef((_a, ref) => {
             input.removeEventListener("keydown", goNextInputImpl);
         };
     }, []);
-    return (_jsx(InputField, { info: info, container: css("group inline-block w-full", container), error: error, feedback: feedback, hideLeft: hideLeft, left: left, optionalText: optionalText, right: right, rightLabel: rightLabel, interactive: interactive, form: props.form, id: props.name || props.id, name: props.name, labelClassName: labelClassName, title: props.title, placeholder: props.placeholder, required: props.required, children: _jsx(MaskInput, Object.assign({}, props, { type: type, "data-next": next, ref: mergeRefs(ref, inputRef), id: id, name: id, className: css("input placeholder-input-mask group h-10 w-full flex-1 rounded-md bg-transparent px-2 py-1 text-foreground outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", !!right ? "pe-4" : "", !!left ? "ps-4" : "", props.className) })) }));
+    return (_jsx(InputField, { info: info, container: css("group inline-block w-full", container), error: error, feedback: feedback, hideLeft: hideLeft, left: left, optionalText: optionalText, right: right, rightLabel: rightLabel, interactive: interactive, form: props.form, id: props.name || props.id, name: props.name, labelClassName: labelClassName, title: props.title, placeholder: props.placeholder, required: props.required, children: _jsx(MaskInput, Object.assign({}, props, { type: type, "data-next": next, ref: mergeRefs(ref, inputRef), id: id, name: id, className: css("input  placeholder-input-mask h-input-height px-input-x py-input-y group w-full flex-1 rounded-md bg-transparent text-foreground outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", !!right ? "pe-input-inline" : "", !!left ? "ps-input-inline" : "", props.className) })) }));
 });

package/dist/components/form/select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/form/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAGlF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE5D,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE/G,MAAM,MAAM,WAAW,GAAG,QAAQ,CAC9B,eAAe,CAAC,QAAQ,CAAC,EACzB;IACI,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CACJ,CAAC;AAEF,eAAO,MAAM,MAAM,oGA4FlB,CAAC"}
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/form/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6D,MAAM,OAAO,CAAC;AAGlF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE5D,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAE/G,MAAM,MAAM,WAAW,GAAG,QAAQ,CAC9B,eAAe,CAAC,QAAQ,CAAC,EACzB;IACI,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC,CAAC;AAEP,eAAO,MAAM,MAAM,oGA4FlB,CAAC"}

package/dist/components/form/switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/form/switch.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8E,MAAM,OAAO,CAAC;AAInG,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,MAAM,mGAwDjB,CAAC"}
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../src/components/form/switch.tsx"],"names":[],"mappings":"AACA,OAAO,KAA8E,MAAM,OAAO,CAAC;AAInG,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,GAAG;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AAEF,eAAO,MAAM,MAAM,mGAiEjB,CAAC"}

package/dist/components/form/switch.js

@@ -3,7 +3,7 @@ import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef, useEffect, useId, useImperativeHandle, useRef, useState } from "react";
 import { useCallbackRef } from "../../hooks/use-callback-ref";
-import { css, dispatchInput } from "../../lib/dom";
+import { css } from "../../lib/dom";
 export const Switch = forwardRef((_a, ref) => {
     var _b;
     var { children, container, error } = _a, props = __rest(_a, ["children", "container", "error"]);
@@ -25,16 +25,15 @@ export const Switch = forwardRef((_a, ref) => {
             }
         }
     }, []);
-    const onCheck = (e) => {
-        var _a;
-        const button = e.target;
-        const checked = !(button.dataset.checked === "true");
+    const onCheck = () => {
+        var _a, _b;
+        const checked = !((_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.checked);
         setInnerChecked(checked);
-        (_a = props === null || props === void 0 ? void 0 : props.onCheck) === null || _a === void 0 ? void 0 : _a.call(props, checked);
+        (_b = props === null || props === void 0 ? void 0 : props.onCheck) === null || _b === void 0 ? void 0 : _b.call(props, checked);
         if (innerRef.current !== null) {
-            dispatchInput(innerRef.current, checked.toString());
+            innerRef.current.checked = checked;
             innerRef.current.dispatchEvent(new Event("change", { bubbles: true }));
         }
     };
-    return (_jsxs("fieldset", { className: css("flex flex-wrap items-center", container), children: [_jsx("input", Object.assign({}, props, { id: props.id || id, ref: innerRef, hidden: true, type: "checkbox", checked: checked, onChange: (e) => setInnerChecked(e.target.checked) })), _jsx("button", { type: "button", role: "switch", onClick: onCheck, "aria-checked": checked, "data-checked": checked, "aria-labelledby": `${id}-label`, className: "duration-300 ease-in-out relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary", children: _jsx("span", { "aria-hidden": "true", "data-checked": checked, className: "duration-300 duration-300 ease-in-out inline-block aspect-square size-5 transform rounded-full shadow ring-0 transition data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch" }) }), _jsx("label", { htmlFor: props.id || id, className: "inline-block ml-3 text-sm", id: `${id}-label`, children: _jsx("span", { className: "font-medium text-foreground", children: children }) }), _jsx("span", { className: "mt-1 flex-1 whitespace-nowrap text-xs text-danger empty:mt-0 empty:hidden", children: error })] }));
+    return (_jsxs("fieldset", { className: css("flex flex-wrap items-center", container), children: [_jsx("input", Object.assign({}, props, { checked: checked, "data-checked": checked, "data-trigger": "change", hidden: true, id: props.id || id, onChange: (e) => setInnerChecked(e.target.checked), ref: innerRef, type: "checkbox" })), _jsx("button", { type: "button", role: "switch", onClick: onCheck, "aria-checked": checked, "data-checked": checked, "aria-labelledby": `${id}-label`, className: "relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-300 ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary", children: _jsx("span", { "aria-hidden": "true", "data-checked": checked, className: "inline-block aspect-square size-5 transform rounded-full shadow ring-0 transition duration-300 ease-in-out data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch" }) }), _jsx("label", { htmlFor: props.id || id, className: "ml-3 inline-block text-sm", id: `${id}-label`, children: _jsx("span", { className: "font-medium text-foreground", children: children }) }), _jsx("span", { className: "mt-1 flex-1 whitespace-nowrap text-xs text-danger empty:mt-0 empty:hidden", children: error })] }));
 });

package/dist/components/index.d.ts

@@ -7,11 +7,13 @@ export * from "./display/card";
 export * from "./display/stats";
 export * from "./display/tabs";
 export * from "./floating/dropdown";
+export * from "./floating/expand";
+export * from "./floating/menu";
 export * from "./floating/modal";
+export * from "./floating/toolbar";
 export * from "./floating/tooltip";
 export * from "./form/autocomplete";
 export * from "./form/checkbox";
-export * from "./form/task-list";
 export * from "./form/date-picker";
 export * from "./form/file-upload";
 export * from "./form/form";
@@ -21,9 +23,8 @@ export * from "./form/radiobox";
 export * from "./form/select";
 export * from "./form/select";
 export * from "./form/switch";
+export * from "./form/task-list";
 export * from "./form/transfer-list";
 export * from "./table/index";
-export * from "./floating/menu";
-export * from "./floating/expand";
 export { createColumns, createOptionCols, type ColType, useTablePreferences, type TablePagination } from "./table/table-lib";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,OAAO,EAAE,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,OAAO,EAAE,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/components/index.js

@@ -7,11 +7,13 @@ export * from "./display/card";
 export * from "./display/stats";
 export * from "./display/tabs";
 export * from "./floating/dropdown";
+export * from "./floating/expand";
+export * from "./floating/menu";
 export * from "./floating/modal";
+export * from "./floating/toolbar";
 export * from "./floating/tooltip";
 export * from "./form/autocomplete";
 export * from "./form/checkbox";
-export * from "./form/task-list";
 export * from "./form/date-picker";
 export * from "./form/file-upload";
 export * from "./form/form";
@@ -21,8 +23,7 @@ export * from "./form/radiobox";
 export * from "./form/select";
 export * from "./form/select";
 export * from "./form/switch";
+export * from "./form/task-list";
 export * from "./form/transfer-list";
 export * from "./table/index";
-export * from "./floating/menu";
-export * from "./floating/expand";
 export { createColumns, createOptionCols, useTablePreferences } from "./table/table-lib";

package/dist/components/table/index.d.ts

@@ -22,13 +22,16 @@ type InnerTableProps<T extends {}> = HTMLAttributes<HTMLTableElement> & TableOpe
     loadingMore?: boolean;
 };
 export type TableProps<T extends {}> = Pick<InnerTableProps<T>, "cols" | "rows" | "loadingMore" | "border"> & {
-    useControl?: boolean;
     name: string;
-    operations?: boolean;
-    onScrollEnd?: () => void;
 } & Partial<TableOperationProps<T> & {
-    reference: keyof T;
+    inlineFilter: boolean;
+    inlineSorter: boolean;
     loading: boolean;
+    onScrollEnd: () => void;
+    operations: boolean;
+    reference: keyof T;
+    sticky: number;
+    useControl: boolean;
 }>;
 export declare const Table: <T extends {}>(props: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
 export {};