@g4rcez/components 3.0.0-0 → 3.0.0

package/dist/components/floating/command-palette.jsx

@@ -7,31 +7,31 @@ import { useStableRef } from "../../hooks/use-stable-ref";
 import { useTranslations } from "../../hooks/use-translations";
 import { CombiKeys } from "../../lib/combi-keys";
 import { Dict } from "../../lib/dict";
-import { css, isReactFC } from "../../lib/dom";
+import { css, isChildVisible, isReactFC } from "../../lib/dom";
 import { fzf } from "../../lib/fzf";
 import { Shortcut } from "../display/shortcut";
 import { SkeletonCell } from "../display/skeleton";
 import { Modal } from "./modal";
-const Group = (props) => (<span className="flex items-center h-full text-sm font-medium text-left text-secondary">
-    {isReactFC(props.item.title) ? <props.item.title text={props.text}/> : props.item.title}
-  </span>);
+const Group = (props) => (<span className="flex h-full items-center text-left text-sm font-medium text-secondary">
+        {isReactFC(props.item.title) ? <props.item.title text={props.text}/> : props.item.title}
+    </span>);
 const Item = forwardRef((props, ref) => {
     const id = useId();
     const active = props.active;
     const item = props.item;
     if (item.type === "group")
-        return (<div id={id} className="px-2 pt-2 pb-1 h-10">
-        <Group text={props.text} item={item}/>
-      </div>);
+        return (<div id={id} className="h-10 px-2 pb-1 pt-2">
+                <Group text={props.text} item={item}/>
+            </div>);
     if (item.type !== "shortcut")
         return <Fragment />;
     return (<button {...props} id={id} ref={ref} role="option" type="button" aria-selected={active} data-component="command-palette-item" className={css("flex h-10 items-center justify-between rounded-lg p-2 hover:bg-floating-hover", active ? "bg-floating-hover" : "")}>
-      <span className="flex gap-2 items-center">
-        {item.Icon ? item.Icon : null}
-        <span>{isReactFC(item.title) ? <item.title text={props.text}/> : item.title}</span>
-      </span>
-      {item.shortcut ? <Shortcut value={item.shortcut}/> : null}
-    </button>);
+            <span className="flex items-center gap-2">
+                {item.Icon ? item.Icon : null}
+                <span>{isReactFC(item.title) ? <item.title text={props.text}/> : item.title}</span>
+            </span>
+            {item.shortcut ? <Shortcut value={item.shortcut}/> : null}
+        </button>);
 });
 const getFuzzyData = (commands, value) => {
     if (value.length === 0)
@@ -53,57 +53,74 @@ const getFuzzyData = (commands, value) => {
     return Dict.unique(filter.concat(withEnabled), (x) => x.title);
 };
 const loadingSkeleton = [0, 0, 0, 0, 0];
+const findFirstClickable = (items) => {
+    for (let index = 0; index < items.length; index++) {
+        const element = items[index];
+        if (element.type === "shortcut")
+            return element;
+        const recursive = findFirstClickable(element.items);
+        if (recursive)
+            return recursive;
+    }
+    return null;
+};
 export const CommandPalette = (props) => {
-    const bindKey = props.bind ?? "Mod + k";
+    const id = useId();
+    const scrollContainerRef = useRef(null);
+    const [text, setText] = useState("");
     const listRef = useRef([]);
     const translations = useTranslations();
-    const [value, setValue] = useState("");
-    const valueRef = useStableRef(value);
-    const id = useId();
-    const ref = useRef(null);
+    const valueRef = useStableRef(text);
     const [activeIndex, setActiveIndex] = useState(null);
+    const bindKey = props.bind ?? "Mod + k";
     const root = useFloating({
         open: props.open,
         strategy: "absolute",
         whileElementsMounted: autoUpdate,
         onOpenChange: props.onChangeVisibility,
     });
+    const commands = props.commands.flatMap((x) => (x.type === "group" ? [x, ...x.items] : [x]));
+    const fuzzy = getFuzzyData(commands, text);
+    const displayItems = text === ""
+        ? commands
+        : [
+            {
+                type: "group",
+                title: "Results",
+                items: [],
+            },
+            ...fuzzy.filter((x) => x.type !== "group"),
+        ];
     const listNav = useListNavigation(root.context, {
-        cols: 0,
         listRef,
         loop: true,
         activeIndex,
         virtual: true,
-        allowEscape: true,
-        focusItemOnHover: false,
-        focusItemOnOpen: "auto",
+        allowEscape: false,
+        focusItemOnOpen: true,
+        focusItemOnHover: true,
         openOnArrowKeyDown: true,
         scrollItemIntoView: false,
         selectedIndex: activeIndex,
+        disabledIndices: (n) => {
+            const item = displayItems[n];
+            if (item)
+                return item.type === "group";
+            return false;
+        },
         onNavigate: (n) => {
             if (Is.number(n)) {
-                listRef.current[n]?.scrollIntoView({ block: "start", inline: "start" });
+                if (!isChildVisible(scrollContainerRef.current, listRef.current[n]))
+                    listRef.current[n]?.scrollIntoView({ block: "start", inline: "start" });
             }
             setActiveIndex((prev) => {
                 if (Is.number(n))
                     return n;
                 return props.open ? (prev ?? 0) : null;
             });
-        }
+        },
     });
-    const { getItemProps, getReferenceProps } = useInteractions([listNav]);
-    const commands = props.commands.flatMap((x) => (x.type === "group" ? [x, ...x.items] : [x]));
-    const fuzzy = getFuzzyData(commands, value);
-    const displayItems = value === ""
-        ? commands
-        : [
-            {
-                type: "group",
-                title: "Results",
-                items: [],
-            },
-            ...fuzzy.filter((x) => x.type !== "group"),
-        ];
+    const { getItemProps, getReferenceProps, getFloatingProps } = useInteractions([listNav]);
     useEffect(() => {
         const combi = new CombiKeys();
         combi.add(bindKey, () => props.onChangeVisibility?.(true));
@@ -113,6 +130,7 @@ export const CommandPalette = (props) => {
             if (cmd.type === "shortcut" && cmd.shortcut !== undefined)
                 combi.add(cmd.shortcut, (event) => cmd.action({
                     event,
+                    setText,
                     text: valueRef.current,
                     setOpen: props.onChangeVisibility,
                 }));
@@ -121,34 +139,38 @@ export const CommandPalette = (props) => {
     }, [bindKey, commands, props, valueRef]);
     const Icon = props.Icon ?? FilterIcon;
     return (<Fragment>
-      <Modal ref={ref} animated={false} closable={false} open={props.open} overlayClickClose ariaTitle="Command palette" bodyClassName="px-0 py-0 pt-0" data-component="command-palette" onChange={props.onChangeVisibility} className="container relative py-0 md:max-w-(--breakpoint-sm) lg:max-w-(--breakpoint-md) overflow-clip">
-        <header className="flex sticky top-0 items-center w-full h-12 border-b overflow-clip isolate z-floating border-floating-border bg-floating-background">
-          <div className="flex justify-center items-center size-10">
-            {props.Icon ? <Icon Default={FilterIcon} text={value} size={16}/> : <FilterIcon size={16}/>}
-
-          </div>
-          <input {...getReferenceProps({
+            <Modal {...getFloatingProps()} animated={false} closable={false} open={props.open} overlayClickClose ariaTitle="Command palette" bodyClassName="px-0 py-0 pt-0" data-component="command-palette" onChange={props.onChangeVisibility} className="container relative overflow-clip py-0 md:max-w-screen-sm lg:max-w-screen-md">
+                <header className="sticky top-0 isolate z-floating flex h-12 w-full items-center overflow-clip border-b border-floating-border bg-floating-background">
+                    <div className="flex size-10 items-center justify-center">
+                        {props.Icon ? <Icon Default={FilterIcon} text={text} size={16}/> : <FilterIcon size={16}/>}
+                    </div>
+                    <input {...getReferenceProps({
         ref: root.refs.setReference,
         onKeyDown: (e) => {
             const item = Is.number(activeIndex) ? displayItems[activeIndex] : null;
-            if (item) {
-                const key = e.key;
-                if (key === "Enter") {
+            const key = e.key;
+            if (key === "Enter") {
+                if (item) {
                     if (item.type === "shortcut")
-                        item.action({ event: e, text: value, setOpen: props.onChangeVisibility, });
+                        item.action({ event: e, text: text, setOpen: props.onChangeVisibility, setText });
+                }
+                else {
+                    const item = findFirstClickable(fuzzy);
+                    if (item?.type === "shortcut")
+                        item.action({ event: e, text: text, setOpen: props.onChangeVisibility, setText });
                 }
             }
-        }
-    })} autoFocus value={value} data-combikeysbypass="true" placeholder="Search for..." onChange={(e) => setValue(e.target.value)} className="items-center py-2 px-2 pb-2 w-full h-12 text-lg text-left bg-transparent outline-hidden"/>
-        </header>
-        {props.loading ? (<ul role="listbox" data-component="command-palette-list" className="flex overflow-y-auto flex-col gap-1 px-2 my-2 w-full max-h-96 origin-[top_center]">
-            <div className="px-2 pt-2 pb-1 h-10">{translations.commandPaletteLoading}</div>
-            {loadingSkeleton.map((_, i) => (<li key={`${id}-${i}-skeleton-index`} className={css("flex h-10 items-center justify-between rounded-lg p-2 hover:bg-primary hover:text-primary-foreground")}>
-                {SkeletonCell}
-              </li>))}
-          </ul>) : (<div className="flex flex-row flex-nowrap min-w-full" data-component="command-palette-container">
-            <ul role="listbox" data-component="command-palette-list" className="flex overflow-y-auto flex-col gap-1 px-2 my-2 w-full max-h-96 h-fit origin-[top_center]">
-              {displayItems.map((item, index) => (<Item {...getItemProps({
+        },
+    })} autoFocus value={text} data-combikeysbypass="true" placeholder="Search for..." onChange={(e) => setText(e.target.value)} className="h-12 w-full items-center bg-transparent px-2 py-2 pb-2 text-left text-lg outline-none"/>
+                </header>
+                {props.loading ? (<ul role="listbox" data-component="command-palette-list" className="my-2 flex max-h-96 w-full origin-[top_center] flex-col gap-1 overflow-y-auto px-2">
+                        <div className="h-10 px-2 pb-1 pt-2">{translations.commandPaletteLoading}</div>
+                        {loadingSkeleton.map((_, i) => (<li key={`${id}-${i}-skeleton-index`} className={css("flex h-10 items-center justify-between rounded-lg p-2 hover:bg-primary hover:text-primary-foreground")}>
+                                {SkeletonCell}
+                            </li>))}
+                    </ul>) : (<div className="flex min-w-full flex-row flex-nowrap" data-component="command-palette-container">
+                        <ul role="listbox" ref={scrollContainerRef} data-component="command-palette-list" className="my-2 flex h-fit max-h-96 w-full origin-[top_center] flex-col gap-1 overflow-y-auto px-2">
+                            {displayItems.map((item, index) => (<Item {...getItemProps({
                 onMouseEnter: () => setActiveIndex(index),
                 ref(node) {
                     listRef.current[index] = node;
@@ -157,16 +179,16 @@ export const CommandPalette = (props) => {
                     e.preventDefault();
                     props.onChangeVisibility(false);
                     if (item.type === "shortcut")
-                        item.action({ event: e, text: value, setOpen: props.onChangeVisibility, });
+                        item.action({ event: e, text: text, setOpen: props.onChangeVisibility, setText });
                 },
-            })} item={item} text={value} active={activeIndex === index} key={`${id}-${item.type}-${index}`}/>))}
-              {displayItems.length === 1 ? (<div className={css("flex items-center justify-between rounded-lg p-2 text-secondary")}>
-                  {translations.commandPaletteEmpty ?? props.emptyMessage}
-                </div>) : null}
-            </ul>
-            {props.Preview && Is.number(activeIndex) ? <props.Preview command={displayItems[activeIndex]} text={value}/> : null}
-          </div>)}
-        {props.footer ? <footer className="flex items-center p-2 h-8 rounded-b-lg bg-background">{props.footer}</footer> : null}
-      </Modal>
-    </Fragment>);
+            })} item={item} text={text} active={activeIndex === index} key={`${id}-${item.type}-${index}`}/>))}
+                            {displayItems.length === 1 ? (<div className={css("flex items-center justify-between rounded-lg p-2 text-secondary")}>
+                                    {translations.commandPaletteEmpty ?? props.emptyMessage}
+                                </div>) : null}
+                        </ul>
+                        {props.Preview && Is.number(activeIndex) ? <props.Preview command={displayItems[activeIndex]} text={text}/> : null}
+                    </div>)}
+                {props.footer ? (<footer className="flex h-8 items-center rounded-b-lg border-t border-floating-border p-2">{props.footer}</footer>) : null}
+            </Modal>
+        </Fragment>);
 };

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/floating/dropdown.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAA+C,MAAM,OAAO,CAAC;AAExG,KAAK,aAAa,GAAG;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC;CACvD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,sBAqE/D,CAAC"}
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/components/floating/dropdown.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAA+C,MAAM,OAAO,CAAC;AAExG,KAAK,aAAa,GAAG;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC;IAC9C,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,YAAY,GAAG,MAAM,CAAC;CACzD,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,OAAO,iBAAiB,CAAC,aAAa,CAAC,sBAqE/D,CAAC"}

package/dist/components/floating/dropdown.jsx

@@ -35,19 +35,19 @@ export const Dropdown = (props) => {
     const role = useRole(context, { role: "tooltip" });
     const { getReferenceProps, getFloatingProps } = useInteractions([click, dismiss, role]);
     return (<Fragment>
-      <button ref={refs.setReference} {...getReferenceProps(props.buttonProps)} type="button">
-        {props.trigger}
-      </button>
-      {open && (<FloatingPortal preserveTabOrder id={`${headingId}-portal`}>
-          <FloatingFocusManager guards restoreFocus={true} returnFocus={true} visuallyHiddenDismiss context={context} modal={false}>
-            <div className="relative p-4 rounded-lg border isolate z-floating min-w-96 border-floating-border bg-floating-background shadow-shadow-floating" ref={refs.setFloating} aria-labelledby={headingId} style={floatingStyles} {...getFloatingProps()}>
-              <FloatingArrow ref={arrowRef} context={context} strokeWidth={0.1} className="fill-floating-background stroke-floating-border"/>
-              <header className="mb-2">
-                <h3 className="text-2xl font-medium tracking-wide leading-snug text-left">{props.title}</h3>
-              </header>
-              {props.children}
-            </div>
-          </FloatingFocusManager>
-        </FloatingPortal>)}
-    </Fragment>);
+            <button ref={refs.setReference} {...getReferenceProps(props.buttonProps)} type="button">
+                {props.trigger}
+            </button>
+            {open && (<FloatingPortal preserveTabOrder id={`${headingId}-portal`}>
+                    <FloatingFocusManager guards restoreFocus={true} returnFocus={true} visuallyHiddenDismiss context={context} modal={false}>
+                        <div className="relative isolate z-floating min-w-96 rounded-lg border border-floating-border bg-floating-background p-4 shadow-shadow-floating" ref={refs.setFloating} aria-labelledby={headingId} style={floatingStyles} {...getFloatingProps()}>
+                            <FloatingArrow ref={arrowRef} context={context} strokeWidth={0.1} className="fill-floating-background stroke-floating-border"/>
+                            <header className="mb-2">
+                                <h3 className="text-left text-2xl font-medium leading-snug tracking-wide">{props.title}</h3>
+                            </header>
+                            {props.children}
+                        </div>
+                    </FloatingFocusManager>
+                </FloatingPortal>)}
+        </Fragment>);
 };

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

@@ -22,7 +22,7 @@ type MenuItemProps = {
     Right?: React.FC<LucideProps>;
 };
 export declare const MenuItem: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof MenuItemProps> & MenuItemProps & React.RefAttributes<HTMLButtonElement>>;
-export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "restoreFocus" | "nested" | "asChild" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
+export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "asChild" | "restoreFocus" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
     hover: boolean;
     open?: boolean;
     nested: boolean;
@@ -34,7 +34,7 @@ export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.Deta
     FloatingComponent: React.ElementType;
 } & {
     label: string;
-}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "restoreFocus" | "nested" | "asChild" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
+}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "hover" | "open" | "asChild" | "restoreFocus" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
     hover: boolean;
     open?: boolean;
     nested: boolean;

package/dist/components/floating/menu.jsx

@@ -5,7 +5,7 @@ import { ChevronRightIcon } from "lucide-react";
 import React, { createContext, Fragment, useContext, useEffect, useRef, useState } from "react";
 import { FLOATING_DELAY, TYPEAHEAD_RESET_DELAY } from "../../constants";
 import { css, mergeRefs } from "../../lib/dom";
-const menuItemClassName = (highlight = "") => css("w-full min-w-36 outline-hidden p-2.5 items-center flex justify-between text-left", "hover:bg-primary focus:bg-primary aria-expanded:opacity-80", "focus:text-primary-foreground hover:text-primary-foreground", "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 focus:bg-primary aria-expanded:opacity-80", "focus:text-primary-foreground hover:text-primary-foreground", "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,
@@ -111,7 +111,7 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
                     <FloatingList elementsRef={elementsRef} labelsRef={labelsRef}>
                         {isOpen && (<FloatingPortal>
                                 <FloatingFocusManager context={context} modal={false} initialFocus={isNested ? -1 : 0} returnFocus={isParent ? restoreFocus : !isNested}>
-                                    <FloatingComponent {...getFloatingProps()} ref={refs.setFloating} style={{ ...props.style, ...floatingStyles }} className={css("isolate z-tooltip flex max-h-80 flex-col items-start overflow-y-auto rounded-lg border border-floating-border bg-floating-background text-left shadow-shadow-floating outline-hidden", floatingClassName)}>
+                                    <FloatingComponent {...getFloatingProps()} ref={refs.setFloating} style={{ ...props.style, ...floatingStyles }} className={css("isolate z-tooltip flex max-h-80 flex-col items-start overflow-y-auto rounded-lg border border-floating-border bg-floating-background text-left shadow-shadow-floating outline-none", floatingClassName)}>
                                         {children}
                                     </FloatingComponent>
                                 </FloatingFocusManager>

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

@@ -2,6 +2,8 @@ import { type ElementProps } from "@floating-ui/react";
 import { HTMLMotionProps } from "motion/react";
 import React from "react";
 import { Label, Override } from "../../types";
+import { ButtonProps } from "../core/button";
+export declare const useConfirm: () => (options: ConfirmOptions) => Promise<boolean>;
 export type ModalType = "dialog" | "drawer" | "sheet";
 export type DrawerPosition = "left" | "right";
 export type ModalProps = Override<HTMLMotionProps<"div">, ({
@@ -32,62 +34,27 @@ export type ModalProps = Override<HTMLMotionProps<"div">, ({
     interactions: ElementProps[];
     trigger: Label | React.FC<any>;
 }>>;
-type ModalRef = {
+export type ModalRef = {
     context: any;
     floating: HTMLElement | null;
 };
-export declare const Modal: React.ForwardRefExoticComponent<(Omit<Omit<HTMLMotionProps<"div">, "footer" | "title" | "className" | "role" | "onChange" | "position" | "open" | "resizer" | "type" | "layoutId" | "trigger" | "closeOnFocusOut" | "asChild" | "animated" | "closable" | "forceType" | "bodyClassName" | "overlayClassName" | "overlayClickClose" | "interactions" | "ariaTitle"> & {
-    title: Label;
-    ariaTitle?: string;
-} & {
-    open: boolean;
-    onChange: (nextState: boolean) => void;
-} & Partial<{
-    footer: Label;
-    type: ModalType;
-    animated: boolean;
-    asChild: boolean;
-    layoutId: string;
-    resizer: boolean;
-    className: string;
-    closable: boolean;
-    forceType: boolean;
-    bodyClassName: string;
-    overlayClassName: string;
-    position: DrawerPosition;
-    overlayClickClose: boolean;
-    closeOnFocusOut: boolean;
-    role: "dialog";
-    interactions: ElementProps[];
-    trigger: Label | React.FC<any>;
-}> & {
-    children?: React.ReactNode | undefined;
-}, "ref"> | Omit<Omit<HTMLMotionProps<"div">, "footer" | "title" | "className" | "role" | "onChange" | "position" | "open" | "resizer" | "type" | "layoutId" | "trigger" | "closeOnFocusOut" | "asChild" | "animated" | "closable" | "forceType" | "bodyClassName" | "overlayClassName" | "overlayClickClose" | "interactions" | "ariaTitle"> & {
-    ariaTitle: string;
+type ModalComponent = React.FC<ModalProps> & {
+    confirm: <T>(options: ConfirmOptions) => Promise<T>;
+};
+export declare const Modal: ModalComponent;
+type ButtonConfirmationAction = {
+    value?: any;
+    text?: Label;
+    theme?: ButtonProps["theme"];
+};
+export type ConfirmOptions = {
     title?: Label;
-} & {
-    open: boolean;
-    onChange: (nextState: boolean) => void;
-} & Partial<{
-    footer: Label;
-    type: ModalType;
-    animated: boolean;
-    asChild: boolean;
-    layoutId: string;
-    resizer: boolean;
-    className: string;
-    closable: boolean;
-    forceType: boolean;
-    bodyClassName: string;
-    overlayClassName: string;
-    position: DrawerPosition;
-    overlayClickClose: boolean;
-    closeOnFocusOut: boolean;
-    role: "dialog";
-    interactions: ElementProps[];
-    trigger: Label | React.FC<any>;
-}> & {
-    children?: React.ReactNode | undefined;
-}, "ref">) & React.RefAttributes<ModalRef>>;
+    description?: Label;
+    cancel?: ButtonConfirmationAction;
+    confirm?: ButtonConfirmationAction;
+};
+export declare const ModalConfirmProvider: ({ children }: {
+    children: React.ReactNode;
+}) => React.JSX.Element;
 export {};
 //# sourceMappingURL=modal.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AACA,OAAO,EASL,KAAK,YAAY,EAClB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAmB,eAAe,EAA4F,MAAM,cAAc,CAAC;AAE1J,OAAO,KAA+G,MAAM,OAAO,CAAC;AAGpI,OAAO,EAAE,KAAK,EAAO,QAAQ,EAAE,MAAM,aAAa,CAAC;AAKnD,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC;AAuD9C,MAAM,MAAM,UAAU,GAAG,QAAQ,CAC/B,eAAe,CAAC,KAAK,CAAC,EACtB,CAAC;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GAAG;IAC9E,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC,GAAG,OAAO,CAAC;IACV,MAAM,EAAE,KAAK,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,cAAc,CAAC;IACzB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,eAAe,EAAE,OAAO,CAAC;IACzB,IAAI,EAAE,QAAQ,CAAC;IACf,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAChC,CAAC,CACH,CAAC;AAgFF,KAAK,QAAQ,GAAG;IAAE,OAAO,EAAE,GAAG,CAAC;IAAC,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAA;CAAE,CAAC;AAI/D,eAAO,MAAM,KAAK;WA1GN,KAAK;gBAAc,MAAM;;UAC3B,OAAO;cACH,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI;;YAE9B,KAAK;UACP,SAAS;cACL,OAAO;aACR,OAAO;cACN,MAAM;aACP,OAAO;eACL,MAAM;cACP,OAAO;eACN,OAAO;mBACH,MAAM;sBACH,MAAM;cACd,cAAc;uBACL,OAAO;qBACT,OAAO;UAClB,QAAQ;kBACA,YAAY,EAAE;aACnB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;;eApBqB,MAAM;YAAU,KAAK;;UAClE,OAAO;cACH,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI;;YAE9B,KAAK;UACP,SAAS;cACL,OAAO;aACR,OAAO;cACN,MAAM;aACP,OAAO;eACL,MAAM;cACP,OAAO;eACN,OAAO;mBACH,MAAM;sBACH,MAAM;cACd,cAAc;uBACL,OAAO;qBACT,OAAO;UAClB,QAAQ;kBACA,YAAY,EAAE;aACnB,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC;;;2CA0UjC,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AACA,OAAO,EASH,KAAK,YAAY,EACpB,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAEH,eAAe,EAQlB,MAAM,cAAc,CAAC;AAEtB,OAAO,KAWN,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,EAAO,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EAAU,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAMrD,eAAO,MAAM,UAAU,kBAF8B,cAAc,KAAK,OAAO,CAAC,OAAO,CAEvB,CAAC;AAEjE,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,OAAO,CAAC;AAuD9C,MAAM,MAAM,UAAU,GAAG,QAAQ,CAC7B,eAAe,CAAC,KAAK,CAAC,EACtB,CAAC;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GAAG;IAC5E,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,GAAG,OAAO,CAAC;IACJ,MAAM,EAAE,KAAK,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,cAAc,CAAC;IACzB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,eAAe,EAAE,OAAO,CAAC;IACzB,IAAI,EAAE,QAAQ,CAAC;IACf,YAAY,EAAE,YAAY,EAAE,CAAC;IAC7B,OAAO,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CAClC,CAAC,CACT,CAAC;AAgFF,MAAM,MAAM,QAAQ,GAAG;IAAE,OAAO,EAAE,GAAG,CAAC;IAAC,QAAQ,EAAE,WAAW,GAAG,IAAI,CAAA;CAAE,CAAC;AAItE,KAAK,cAAc,GAAG,KAAK,CAAC,EAAE,CAAC,UAAU,CAAC,GAAG;IACzC,OAAO,EAAE,CAAC,CAAC,EAAE,OAAO,EAAE,cAAc,KAAK,OAAO,CAAC,CAAC,CAAC,CAAC;CACvD,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,cA8PZ,CAAC;AAET,KAAK,wBAAwB,GAAG;IAC5B,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,MAAM,CAAC,EAAE,wBAAwB,CAAC;IAClC,OAAO,CAAC,EAAE,wBAAwB,CAAC;CACtC,CAAC;AAaF,eAAO,MAAM,oBAAoB,GAAI,cAAc;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,sBAuD/E,CAAC"}