@majapisoftwares/ui 4.3.16 → 5.0.0

package/components/ConfirmationButton/ConfirmationButton.jsx

@@ -1,13 +0,0 @@
-import Menu, {} from "../Menu/Menu";
-import Button, {} from "../Button";
-export default function ConfirmationButton({ label, confirm, confirmation, onConfirm, loading, className, cancel = "Cancel", position, buttonClassName, buttonProps, menuProps, }) {
-    return (<Menu position={position} button={<Button color="error" loading={loading} className={buttonClassName} {...buttonProps}>
-          {label}
-        </Button>} className={className} {...menuProps}>
-      <Menu.Label>{confirmation}</Menu.Label>
-      <Menu.Item className="text-red-500!" onClick={onConfirm}>
-        {confirm || label}
-      </Menu.Item>
-      <Menu.Item>{cancel}</Menu.Item>
-    </Menu>);
-}

package/components/ConfirmationButton/index.d.ts

@@ -1,3 +0,0 @@
-import ConfirmationButton from "./ConfirmationButton";
-export * from "./ConfirmationButton";
-export default ConfirmationButton;

package/components/ConfirmationButton/index.jsx

@@ -1,3 +0,0 @@
-import ConfirmationButton from "./ConfirmationButton";
-export * from "./ConfirmationButton";
-export default ConfirmationButton;

package/components/ContextMenu/ContextMenu.d.ts

@@ -1,28 +0,0 @@
-import React, { type ComponentProps } from "react";
-import * as RContextMenu from "@radix-ui/react-context-menu";
-declare function ContextMenuContent({ className, children, ...props }: ComponentProps<typeof RContextMenu.Content>): React.JSX.Element;
-declare function ContextMenuSeparator({ className, ...props }: ComponentProps<typeof RContextMenu.Separator>): React.JSX.Element;
-declare function ContextMenuItem({ className, href, ...props }: ComponentProps<typeof RContextMenu.Item> & {
-    href?: string;
-}): React.JSX.Element;
-declare function ContextMenuItemIndicator({ className, ...props }: ComponentProps<typeof RContextMenu.ItemIndicator>): React.JSX.Element;
-declare function ContextMenuCheckboxItem({ className, children, indicatorClassName, ...props }: ComponentProps<typeof RContextMenu.CheckboxItem> & {
-    indicatorClassName?: string;
-}): React.JSX.Element;
-declare function ContextMenuSubContent({ className, children, sideOffset, alignOffset, ...props }: ComponentProps<typeof RContextMenu.SubContent>): React.JSX.Element;
-declare function ContextMenuSubTrigger({ className, href, children, ...props }: ComponentProps<typeof RContextMenu.SubTrigger> & {
-    href?: string;
-}): React.JSX.Element;
-declare const ContextMenu: {
-    Root: React.FC<RContextMenu.ContextMenuProps>;
-    Trigger: React.ForwardRefExoticComponent<RContextMenu.ContextMenuTriggerProps & React.RefAttributes<HTMLSpanElement>>;
-    Content: typeof ContextMenuContent;
-    Item: typeof ContextMenuItem;
-    Separator: typeof ContextMenuSeparator;
-    CheckboxItem: typeof ContextMenuCheckboxItem;
-    ItemIndicator: typeof ContextMenuItemIndicator;
-    Sub: React.FC<RContextMenu.ContextMenuSubProps>;
-    SubContent: typeof ContextMenuSubContent;
-    SubTrigger: typeof ContextMenuSubTrigger;
-};
-export default ContextMenu;

package/components/ContextMenu/ContextMenu.jsx

@@ -1,70 +0,0 @@
-import React, { Fragment } from "react";
-import * as RContextMenu from "@radix-ui/react-context-menu";
-import { CheckIcon } from "@heroicons/react/16/solid";
-import Link from "next/link";
-import clsx from "../../utils/clsx";
-import { dropdownCheckboxItemClassName, dropdownItemClassName, dropdownItemIndicatorClassName, dropdownSeparatorClassName, dropdownSubTriggerClassName, } from "../../styles/Dropdown.classNames";
-import { modalContentClassName } from "../../styles/Modal.classNames";
-import { ChevronRightIcon } from "@heroicons/react/20/solid";
-function ContextMenuContent({ className, children, ...props }) {
-    return (<RContextMenu.Portal>
-      <RContextMenu.Content {...props} className={clsx(modalContentClassName, "ui-context-menu-content", className)}>
-        {children}
-      </RContextMenu.Content>
-    </RContextMenu.Portal>);
-}
-function ContextMenuSeparator({ className, ...props }) {
-    return (<RContextMenu.Separator {...props} className={clsx(dropdownSeparatorClassName, "ui-context-menu-separator", className)}/>);
-}
-function ContextMenuItem({ className, href, ...props }) {
-    const Wrapper = href ? Link : Fragment;
-    return (
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    <Wrapper {...(href ? { href } : {})}>
-      <RContextMenu.Item {...props} className={clsx(dropdownItemClassName, "ui-context-menu-item", className)}/>
-    </Wrapper>);
-}
-function ContextMenuItemIndicator({ className, ...props }) {
-    return (<RContextMenu.ItemIndicator className={clsx(dropdownItemIndicatorClassName, "ui-context-menu-checkbox-item-indicator", className)} {...props}/>);
-}
-function ContextMenuCheckboxItem({ className, children, indicatorClassName, ...props }) {
-    return (<RContextMenu.CheckboxItem {...props} className={clsx(dropdownCheckboxItemClassName, "ui-context-menu-checkbox-item", className)}>
-      <ContextMenuItemIndicator className={clsx("ui-context-menu-checkbox-item-indicator", indicatorClassName)}>
-        <CheckIcon />
-      </ContextMenuItemIndicator>
-      {children}
-    </RContextMenu.CheckboxItem>);
-}
-function ContextMenuSubContent({ className, children, sideOffset = 2, alignOffset = -4, ...props }) {
-    return (<RContextMenu.Portal>
-      <RContextMenu.SubContent sideOffset={sideOffset} alignOffset={alignOffset} {...props} className={clsx(modalContentClassName, "ui-context-menu-sub-content", className)}>
-        {children}
-      </RContextMenu.SubContent>
-    </RContextMenu.Portal>);
-}
-function ContextMenuSubTrigger({ className, href, children, ...props }) {
-    const Wrapper = href ? Link : Fragment;
-    return (
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    <Wrapper {...(href ? { href } : {})}>
-      <RContextMenu.SubTrigger {...props} className={clsx(dropdownSubTriggerClassName, "ui-context-menu-sub-trigger", className)}>
-        {children}
-        <div className={clsx("absolute top-1.5 right-1.5 inline-flex items-center justify-center", "[&>svg]:h-4 [&>svg]:w-4")}>
-          <ChevronRightIcon />
-        </div>
-      </RContextMenu.SubTrigger>
-    </Wrapper>);
-}
-const ContextMenu = {
-    Root: RContextMenu.Root,
-    Trigger: RContextMenu.Trigger,
-    Content: ContextMenuContent,
-    Item: ContextMenuItem,
-    Separator: ContextMenuSeparator,
-    CheckboxItem: ContextMenuCheckboxItem,
-    ItemIndicator: ContextMenuItemIndicator,
-    Sub: RContextMenu.Sub,
-    SubContent: ContextMenuSubContent,
-    SubTrigger: ContextMenuSubTrigger,
-};
-export default ContextMenu;

package/components/ContextMenu/index.d.ts

@@ -1,3 +0,0 @@
-import ContextMenu from "./ContextMenu";
-export * from "./ContextMenu";
-export default ContextMenu;

package/components/ContextMenu/index.jsx

@@ -1,3 +0,0 @@
-import ContextMenu from "./ContextMenu";
-export * from "./ContextMenu";
-export default ContextMenu;

package/components/CopyButton/CopyButton.d.ts

@@ -1,7 +0,0 @@
-export type CopyButtonProps = {
-    text: string;
-    copyText?: string;
-    copiedText?: string;
-    className?: string;
-};
-export default function CopyButton({ text, copyText, copiedText, className, }: CopyButtonProps): import("react").JSX.Element;

package/components/CopyButton/CopyButton.jsx

@@ -1,29 +0,0 @@
-import { useEffect, useState } from "react";
-import clsx from "../../utils/clsx";
-import { ClipboardIcon } from "@heroicons/react/24/outline";
-import Button from "../Button";
-export default function CopyButton({ text, copyText = "Copy", copiedText = "Copied!", className, }) {
-    const [copyCount, setCopyCount] = useState(0);
-    const copied = copyCount > 0;
-    useEffect(() => {
-        if (copyCount > 0) {
-            const timeout = setTimeout(() => setCopyCount(0), 1000);
-            return () => {
-                clearTimeout(timeout);
-            };
-        }
-    }, [copyCount]);
-    return (<Button type="button" color={copied ? "success" : undefined} size="sm" className={clsx("absolute right-2.5 top-2.5 opacity-0 backdrop-blur-sm focus:opacity-100 group-hover:opacity-100", className)} onClick={() => {
-            window.navigator.clipboard.writeText(text).then(() => {
-                setCopyCount((count) => count + 1);
-            });
-        }} rounded>
-      <span aria-hidden={copied} className={clsx("pointer-events-none flex items-center gap-0.5 transition-[transform,opacity]", copied && "-translate-y-1.5 opacity-0")}>
-        <ClipboardIcon className="mr-2 h-4 w-4"/>
-        {copyText}
-      </span>
-      <span aria-hidden={!copied} className={clsx("pointer-events-none absolute inset-0 flex items-center justify-center transition-[transform,opacity]", !copied && "translate-y-1.5 opacity-0")}>
-        {copiedText}
-      </span>
-    </Button>);
-}

package/components/CopyButton/index.d.ts

@@ -1,3 +0,0 @@
-import CopyButton from "./CopyButton";
-export * from "./CopyButton";
-export default CopyButton;

package/components/CopyButton/index.jsx

@@ -1,3 +0,0 @@
-import CopyButton from "./CopyButton";
-export * from "./CopyButton";
-export default CopyButton;

package/components/DateInput/DateInput.d.ts

@@ -1,6 +0,0 @@
-import { type InputProps } from "../Input";
-declare function DateInput({ readOnly, value, onValueChange, ref, ...props }: Omit<InputProps<false>, "value"> & {
-    value?: string;
-    onValueChange?: (value?: string) => void;
-}): import("react").JSX.Element;
-export default DateInput;

package/components/DateInput/DateInput.jsx

@@ -1,19 +0,0 @@
-import { useMemo } from "react";
-import Input, {} from "../Input";
-import { CalendarIcon } from "@heroicons/react/20/solid";
-import { useRefValue } from "./useRefValue";
-import dayjs from "dayjs";
-function DateInput({ readOnly, value, onValueChange, ref, ...props }) {
-    const realRef = useRefValue(ref);
-    const formattedValue = useMemo(() => (value && value.includes("T") ? value.split("T")[0] : value) || "", [value]);
-    return (<Input {...props} onChange={(e) => onValueChange?.(e.target.value
-            ? `${e.target.value}T${dayjs()
-                .set("hour", 0)
-                .set("minute", 0)
-                .set("second", 0)
-                .set("millisecond", 0)
-                .toISOString()
-                .split("T")[1]}`
-            : e.target.value)} ref={realRef} type="date" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}" trailing={!readOnly ? <CalendarIcon className="w-5"/> : undefined} inputClassName="pr-3!" readOnly={readOnly} value={formattedValue}/>);
-}
-export default DateInput;

package/components/DateInput/DateTimeInput.d.ts

@@ -1,3 +0,0 @@
-import { type InputProps } from "../Input";
-declare function DateTimeInput({ readOnly, ref, ...props }: InputProps<false>): import("react").JSX.Element;
-export default DateTimeInput;

package/components/DateInput/DateTimeInput.jsx

@@ -1,8 +0,0 @@
-import Input, {} from "../Input";
-import { CalendarIcon } from "@heroicons/react/20/solid";
-import { useRefValue } from "./useRefValue";
-function DateTimeInput({ readOnly, ref, ...props }) {
-    const realRef = useRefValue(ref);
-    return (<Input {...props} ref={realRef} type="datetime-local" pattern="[0-9]{4}-[0-9]{2}-[0-9]{2}T[0-9]{2}:[0-9]{2}" trailing={!readOnly ? <CalendarIcon className="w-5"/> : undefined} inputClassName="pr-3!" readOnly={readOnly}/>);
-}
-export default DateTimeInput;

package/components/DateInput/index.d.ts

@@ -1,4 +0,0 @@
-import DateInput from "./DateInput";
-export * from "./DateInput";
-export default DateInput;
-export { default as DateTimeInput } from "./DateTimeInput";

package/components/DateInput/index.jsx

@@ -1,4 +0,0 @@
-import DateInput from "./DateInput";
-export * from "./DateInput";
-export default DateInput;
-export { default as DateTimeInput } from "./DateTimeInput";

package/components/DateInput/useRefValue.d.ts

@@ -1,5 +0,0 @@
-import { type Ref } from "react";
-import "dayjs/locale/pt-br";
-export declare function parseDate(value: string): string;
-export declare function formatDate(value: string): string;
-export declare function useRefValue(ref?: Ref<HTMLInputElement>): import("react").RefObject<HTMLInputElement | null>;

package/components/DateInput/useRefValue.js

@@ -1,48 +0,0 @@
-import { useEffect, useRef } from "react";
-import dayjs from "dayjs";
-import "dayjs/locale/pt-br";
-dayjs.locale("pt-br");
-export function parseDate(value) {
-    try {
-        // noinspection SpellCheckingInspection
-        return dayjs(value, "YYYY-MM-DDTHH:mm").toISOString();
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    }
-    catch (e) {
-        return value;
-    }
-}
-export function formatDate(value) {
-    try {
-        // noinspection SpellCheckingInspection
-        return dayjs(value).format("YYYY-MM-DDTHH:mm");
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    }
-    catch (e) {
-        return value;
-    }
-}
-export function useRefValue(ref) {
-    const realRef = useRef(null);
-    const innerRef = useRef({
-        get value() {
-            return parseDate(realRef.current?.value || "");
-        },
-        set value(value) {
-            if (realRef.current) {
-                realRef.current.value = formatDate(value);
-            }
-        },
-    });
-    useEffect(() => {
-        if (ref) {
-            if (typeof ref === "function") {
-                ref(innerRef.current);
-            }
-            else {
-                ref.current = innerRef.current;
-            }
-        }
-    }, [ref]);
-    return realRef;
-}

package/components/DatePicker/DatePicker.d.ts

@@ -1,19 +0,0 @@
-import React, { type ComponentProps, type ReactElement, type ReactNode } from "react";
-import type { DayPickerProps } from "react-day-picker";
-import { type DateRange, type Matcher, type ModifiersClassNames } from "react-day-picker";
-import Button from "../Button";
-export type { DateRange };
-export default function DatePicker({ value, onValueChange, children, buttonProps, fromDate, toDate, footer, monthFooter, modifiers, modifiersClassNames, disabled, defaultMonth, }: {
-    value?: Date | string;
-    onValueChange?: (value?: Date) => void;
-    children?: (value: string) => ReactElement;
-    buttonProps?: ComponentProps<typeof Button>;
-    fromDate?: Date;
-    toDate?: Date;
-    footer?: ReactNode;
-    monthFooter?: ReactNode;
-    modifiers?: DayPickerProps["modifiers"];
-    modifiersClassNames?: ModifiersClassNames;
-    disabled?: Matcher | Matcher[];
-    defaultMonth?: Date;
-}): React.JSX.Element;

package/components/DatePicker/DatePicker.jsx

@@ -1,55 +0,0 @@
-import React, { useCallback, useMemo, useState, } from "react";
-import { DayPicker, } from "react-day-picker";
-import dayjs from "dayjs";
-import { CalendarIcon } from "@heroicons/react/20/solid";
-import Button from "../Button";
-import clsx from "../../utils/clsx";
-import { useDeepCompareEffect } from "react-use";
-import Popover from "../Popover";
-import { dayPickerButtonClassName, dayPickerClassNames, } from "../../styles/DayPicker.classNames";
-export default function DatePicker({ value, onValueChange, children, buttonProps, fromDate, toDate, footer, monthFooter, modifiers, modifiersClassNames, disabled, defaultMonth, }) {
-    const [open, setOpen] = useState(false);
-    const convertedValue = value && typeof value === "string"
-        ? dayjs(value).toDate()
-        : (value || undefined);
-    const [date, setDate] = useState(convertedValue);
-    useDeepCompareEffect(() => {
-        onValueChange?.(date);
-    }, [date || {}]);
-    useDeepCompareEffect(() => {
-        setDate(convertedValue);
-    }, [convertedValue || {}]);
-    const buttonText = useMemo(() => {
-        return date ? dayjs(date).format("ll") : "";
-    }, [date]);
-    const children2 = children ? (children(buttonText)) : (<Button {...buttonProps} leading={buttonProps?.leading || <CalendarIcon />} className={clsx(dayPickerButtonClassName, buttonProps?.className)}>
-      {buttonText}
-    </Button>);
-    const defaultDisabled = useMemo(() => [
-        ...(fromDate
-            ? [
-                {
-                    before: fromDate,
-                },
-            ]
-            : []),
-        ...(toDate
-            ? [
-                {
-                    after: toDate,
-                },
-            ]
-            : []),
-    ], [fromDate, toDate]);
-    const onSelect = useCallback((value) => {
-        setOpen(false);
-        setDate(value);
-    }, []);
-    return (<Popover.Root open={open} onOpenChange={setOpen}>
-      <Popover.Trigger asChild>{children2}</Popover.Trigger>
-      <Popover.Content>
-        <DayPicker mode="single" selected={date} onSelect={onSelect} showOutsideDays classNames={dayPickerClassNames} startMonth={fromDate} endMonth={toDate} footer={monthFooter} modifiers={modifiers} modifiersClassNames={modifiersClassNames} disabled={disabled || defaultDisabled} defaultMonth={defaultMonth}/>
-        {footer}
-      </Popover.Content>
-    </Popover.Root>);
-}

package/components/DatePicker/index.d.ts

@@ -1,3 +0,0 @@
-import DatePicker from "./DatePicker";
-export * from "./DatePicker";
-export default DatePicker;

package/components/DatePicker/index.jsx

@@ -1,3 +0,0 @@
-import DatePicker from "./DatePicker";
-export * from "./DatePicker";
-export default DatePicker;

package/components/DateRangePicker/DateRangePicker.d.ts

@@ -1,16 +0,0 @@
-import React, { type ComponentProps, type ReactElement, type ReactNode } from "react";
-import { type DateRange } from "react-day-picker";
-import Button from "../Button";
-export type { DateRange };
-export default function DateRangePicker({ value, onValueChange, children, buttonProps, fromDate, toDate, min, max, footer, monthFooter, }: {
-    value?: DateRange;
-    onValueChange?: (value?: DateRange) => void;
-    children?: (value: string) => ReactElement;
-    buttonProps?: ComponentProps<typeof Button>;
-    fromDate?: Date;
-    toDate?: Date;
-    min?: number;
-    max?: number;
-    footer?: ReactNode;
-    monthFooter?: ReactNode;
-}): React.JSX.Element;

package/components/DateRangePicker/DateRangePicker.jsx

@@ -1,56 +0,0 @@
-import React, { useMemo, useState, } from "react";
-import { DayPicker } from "react-day-picker";
-import dayjs from "dayjs";
-import { CalendarIcon } from "@heroicons/react/20/solid";
-import Button from "../Button";
-import clsx from "../../utils/clsx";
-import { useDeepCompareEffect } from "react-use";
-import Popover from "../Popover";
-import { dayPickerButtonClassName, dayPickerClassNames, } from "../../styles/DayPicker.classNames";
-export default function DateRangePicker({ value, onValueChange, children, buttonProps, fromDate, toDate, min, max, footer, monthFooter, }) {
-    const [range, setRange] = useState(value);
-    useDeepCompareEffect(() => {
-        onValueChange?.(range);
-    }, [range || {}]);
-    useDeepCompareEffect(() => {
-        setRange(value);
-    }, [value || {}]);
-    const buttonText = useMemo(() => {
-        let buttonText = "";
-        if (range?.from) {
-            if (!range.to) {
-                buttonText = dayjs(range.from).format("ll");
-            }
-            else if (range.to) {
-                buttonText = `${dayjs(range.from).format("ll")} – ${dayjs(range.to).format("ll")}`;
-            }
-        }
-        return buttonText;
-    }, [range]);
-    const children2 = children ? (children(buttonText)) : (<Button {...buttonProps} leading={buttonProps?.leading || <CalendarIcon />} className={clsx(dayPickerButtonClassName, buttonProps?.className)}>
-      {buttonText}
-    </Button>);
-    const hidden = useMemo(() => [
-        ...(fromDate
-            ? [
-                {
-                    before: fromDate,
-                },
-            ]
-            : []),
-        ...(toDate
-            ? [
-                {
-                    after: toDate,
-                },
-            ]
-            : []),
-    ], [fromDate, toDate]);
-    return (<Popover.Root>
-      <Popover.Trigger asChild>{children2}</Popover.Trigger>
-      <Popover.Content>
-        <DayPicker mode="range" defaultMonth={value?.from} selected={range} onSelect={setRange} numberOfMonths={2} showOutsideDays classNames={dayPickerClassNames} startMonth={fromDate} endMonth={toDate} hidden={hidden} min={min} max={max} footer={monthFooter} excludeDisabled/>
-        {footer}
-      </Popover.Content>
-    </Popover.Root>);
-}

package/components/DateRangePicker/index.d.ts

@@ -1,3 +0,0 @@
-import DateRangePicker from "./DateRangePicker";
-export * from "./DateRangePicker";
-export default DateRangePicker;

package/components/DateRangePicker/index.jsx

@@ -1,3 +0,0 @@
-import DateRangePicker from "./DateRangePicker";
-export * from "./DateRangePicker";
-export default DateRangePicker;

package/components/Dialog/Dialog.d.ts

@@ -1,25 +0,0 @@
-import * as RDialog from "@radix-ui/react-dialog";
-import type { DialogContentProps } from "@radix-ui/react-dialog";
-import { type ReactNode } from "react";
-export interface DialogProps {
-    title: ReactNode;
-    description?: ReactNode;
-    contentClassName?: string;
-    contentOverflowClassName?: string;
-    closeButtonClassName?: string;
-    overlayClassName?: string;
-    titleClassName?: string;
-    descriptionClassName?: string;
-    hideTitle?: boolean;
-    contentProps?: Omit<DialogContentProps, "children">;
-    hideCloseButton?: boolean;
-}
-declare function Dialog({ children, title, description, open, onOpenChange, contentClassName, contentOverflowClassName, closeButtonClassName, overlayClassName, titleClassName, descriptionClassName, hideTitle, contentProps, hideCloseButton, }: {
-    children: ReactNode;
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-} & DialogProps): import("react").JSX.Element;
-declare namespace Dialog {
-    var Close: import("react").ForwardRefExoticComponent<RDialog.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-}
-export default Dialog;

package/components/Dialog/Dialog.jsx

@@ -1,35 +0,0 @@
-import * as RDialog from "@radix-ui/react-dialog";
-import { Fragment } from "react";
-import { XMarkIcon } from "@heroicons/react/20/solid";
-import Button from "../Button";
-import clsx from "../../utils/clsx";
-import { modalContentClassName } from "../../styles/Modal.classNames";
-import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
-export default function Dialog({ children, title, description, open, onOpenChange, contentClassName, contentOverflowClassName, closeButtonClassName, overlayClassName, titleClassName, descriptionClassName, hideTitle, contentProps, hideCloseButton, }) {
-    const TitleWrapper = !hideTitle ? Fragment : VisuallyHidden;
-    return (<RDialog.Root open={open} onOpenChange={onOpenChange}>
-      <RDialog.Portal>
-        <RDialog.Overlay className={clsx("ui-dialog-overlay", "fixed inset-0 z-20 flex items-center justify-center bg-black/50", "data-[state=closed]:animate-fade-out data-[state=open]:animate-slide-up-and-fade will-change-[opacity,transform]", overlayClassName)}>
-          <RDialog.Content className={clsx(modalContentClassName, "ui-dialog-content", "relative p-0 focus:outline-hidden", contentClassName, contentProps?.className)} {...(!description ? { "aria-describedby": undefined } : {})} {...contentProps}>
-            <div className={clsx("flex max-h-[85vh] w-[90vw] max-w-[450px] flex-col gap-3 overflow-auto p-4", contentOverflowClassName)}>
-              <TitleWrapper>
-                <RDialog.Title className={clsx("ui-dialog-title", "text-lg leading-none font-medium text-zinc-900 dark:text-zinc-50", titleClassName)}>
-                  {title}
-                </RDialog.Title>
-              </TitleWrapper>
-              {description && (<RDialog.Description className={clsx("ui-dialog-description", "text-zinc-700 dark:text-zinc-300", descriptionClassName)}>
-                  {description}
-                </RDialog.Description>)}
-              {children}
-              {!hideCloseButton && (<RDialog.Close asChild>
-                  <Button className={clsx("absolute top-1 right-1 p-1.5", "ui-dialog-close-button", closeButtonClassName)} aria-label="Close" variant="text" icon>
-                    <XMarkIcon />
-                  </Button>
-                </RDialog.Close>)}
-            </div>
-          </RDialog.Content>
-        </RDialog.Overlay>
-      </RDialog.Portal>
-    </RDialog.Root>);
-}
-Dialog.Close = RDialog.Close;

package/components/Dialog/Dialogs.d.ts

@@ -1 +0,0 @@
-export default function Dialogs(): import("react").JSX.Element;

package/components/Dialog/Dialogs.jsx

@@ -1,21 +0,0 @@
-import { useSnapshot } from "valtio";
-import dialogsState, { closeDialog } from "./dialogs.state";
-import { useEffect } from "react";
-import Dialog from "./Dialog";
-export default function Dialogs() {
-    const { dialogs, setRendered } = useSnapshot(dialogsState);
-    useEffect(() => {
-        setRendered(true);
-        return () => {
-            setRendered(false);
-        };
-    }, [setRendered]);
-    return (<>
-      {dialogs.map((dialog) => (<Dialog key={dialog._id} open={dialog.open} onOpenChange={() => {
-                closeDialog(dialog._id);
-                dialog.props.onClose?.(dialog._id);
-            }} {...dialog.props} title={dialog.props.title} description={dialog.props.description}>
-          {dialog.props.content}
-        </Dialog>))}
-    </>);
-}

package/components/Dialog/dialogs.state.d.ts

@@ -1,21 +0,0 @@
-import type { ReactNode } from "react";
-import type { DialogProps } from "./Dialog";
-export type IDialog = {
-    _id: string;
-    open: boolean;
-    props: {
-        content: ReactNode;
-        onClose?: (_id: string) => void;
-    } & DialogProps;
-};
-declare const dialogsState: {
-    rendered: boolean;
-    setRendered(rendered: boolean): void;
-    dialogs: IDialog[];
-    add({ _id, open, ...dialog }: Partial<Omit<IDialog, "props">> & IDialog["props"]): void;
-    remove(_id: string): void;
-    update(dialog: Pick<IDialog, "_id"> & Partial<Omit<IDialog, "_id">>): void;
-};
-export declare function showDialog(dialog: Partial<Omit<IDialog, "props">> & IDialog["props"]): void;
-export declare function closeDialog(_id: string): void;
-export default dialogsState;

package/components/Dialog/dialogs.state.js

@@ -1,40 +0,0 @@
-import { proxy, ref } from "valtio";
-import isomorphicObjectId from "@majapisoftwares/next/utils/isomorphicObjectId";
-import { find } from "lodash-es";
-const dialogsState = proxy({
-    rendered: false,
-    setRendered(rendered) {
-        dialogsState.rendered = rendered;
-    },
-    dialogs: [],
-    add({ _id = isomorphicObjectId().toString(), open = true, ...dialog }) {
-        if (!dialogsState.rendered) {
-            console.error("<Dialogs /> is not rendered. The dialog will be ignored.");
-        }
-        dialogsState.dialogs.push({
-            _id,
-            open,
-            props: ref(dialog),
-        });
-    },
-    remove(_id) {
-        dialogsState.dialogs.splice(dialogsState.dialogs.findIndex((n) => n._id === _id), 1);
-    },
-    update(dialog) {
-        const updateDialog = find(dialogsState.dialogs, { _id: dialog._id });
-        if (updateDialog) {
-            Object.assign(updateDialog, dialog);
-        }
-    },
-});
-export function showDialog(dialog) {
-    dialogsState.add(dialog);
-}
-export function closeDialog(_id) {
-    dialogsState.update({
-        _id,
-        open: false,
-    });
-    setTimeout(() => dialogsState.remove(_id), 300);
-}
-export default dialogsState;

package/components/Dialog/index.d.ts

@@ -1,6 +0,0 @@
-import Dialog from "./Dialog";
-export * from "./Dialogs";
-export { default as Dialogs } from "./Dialogs";
-export default Dialog;
-export { default as dialogsState } from "./dialogs.state";
-export * from "./dialogs.state";

package/components/Dialog/index.jsx

@@ -1,7 +0,0 @@
-import Dialog from "./Dialog";
-export * from "./Dialogs";
-export { default as Dialogs } from "./Dialogs";
-export default Dialog;
-// noinspection JSUnusedGlobalSymbols
-export { default as dialogsState } from "./dialogs.state";
-export * from "./dialogs.state";