@moduix/react 1.1.0

package/dist/components/date-picker/DatePicker.js

@@ -0,0 +1,284 @@
+import { CalendarIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, CloseIcon } from "../../lib/moduix/icons/ui/Icons.js";
+import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
+import { OverlayPortal, OverlayPortalProvider } from "../../lib/moduix/overlayPortal.js";
+import DatePicker_module_default from "./DatePicker.module.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { forwardRef } from "react";
+import { DatePicker } from "@ark-ui/react/date-picker";
+//#region src/components/date-picker/DatePicker.tsx
+const DatePickerRoot = forwardRef(function DatePickerRoot({ className, portalled, portalRef, ...props }, ref) {
+	return /* @__PURE__ */ jsx(OverlayPortalProvider, {
+		portalled,
+		portalRef,
+		children: /* @__PURE__ */ jsx(DatePicker.Root, {
+			ref,
+			"data-slot": "date-picker-root",
+			className: clsx(DatePicker_module_default.root, normalizeClassName(className)),
+			...props
+		})
+	});
+});
+const DatePickerRootProvider = forwardRef(function DatePickerRootProvider({ className, portalled, portalRef, ...props }, ref) {
+	return /* @__PURE__ */ jsx(OverlayPortalProvider, {
+		portalled,
+		portalRef,
+		children: /* @__PURE__ */ jsx(DatePicker.RootProvider, {
+			ref,
+			"data-slot": "date-picker-root-provider",
+			className: clsx(DatePicker_module_default.root, normalizeClassName(className)),
+			...props
+		})
+	});
+});
+const DatePickerLabel = forwardRef(function DatePickerLabel({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.Label, {
+		ref,
+		"data-slot": "date-picker-label",
+		className: clsx(DatePicker_module_default.label, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerControl = forwardRef(function DatePickerControl({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.Control, {
+		ref,
+		"data-slot": "date-picker-control",
+		className: clsx(DatePicker_module_default.control, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerInput = forwardRef(function DatePickerInput({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.Input, {
+		ref,
+		"data-slot": "date-picker-input",
+		className: clsx(DatePicker_module_default.input, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerTrigger = forwardRef(function DatePickerTrigger({ asChild, className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.Trigger, {
+		ref,
+		"data-slot": "date-picker-trigger",
+		asChild,
+		className: clsx(!asChild && DatePicker_module_default.trigger, normalizeClassName(className)),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(CalendarIcon, {})
+	});
+});
+const DatePickerClearTrigger = forwardRef(function DatePickerClearTrigger({ asChild, className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.ClearTrigger, {
+		ref,
+		"data-slot": "date-picker-clear-trigger",
+		asChild,
+		className: clsx(!asChild && DatePicker_module_default.trigger, DatePicker_module_default.clearTrigger, normalizeClassName(className)),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(CloseIcon, {})
+	});
+});
+const DatePickerPositioner = forwardRef(function DatePickerPositioner({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(OverlayPortal, { children: /* @__PURE__ */ jsx(DatePicker.Positioner, {
+		ref,
+		"data-slot": "date-picker-positioner",
+		className: clsx(DatePicker_module_default.positioner, normalizeClassName(className)),
+		...props
+	}) });
+});
+const DatePickerContent = forwardRef(function DatePickerContent({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.Content, {
+		ref,
+		"data-slot": "date-picker-content",
+		className: clsx(DatePicker_module_default.content, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerView = forwardRef(function DatePickerView({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.View, {
+		ref,
+		"data-slot": "date-picker-view",
+		className: clsx(DatePicker_module_default.view, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerViewControl = forwardRef(function DatePickerViewControl({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.ViewControl, {
+		ref,
+		"data-slot": "date-picker-view-control",
+		className: clsx(DatePicker_module_default.viewControl, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerPrevTrigger = forwardRef(function DatePickerPrevTrigger({ asChild, className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.PrevTrigger, {
+		ref,
+		"data-slot": "date-picker-prev-trigger",
+		asChild,
+		className: clsx(!asChild && DatePicker_module_default.navTrigger, normalizeClassName(className)),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ChevronLeftIcon, {})
+	});
+});
+const DatePickerNextTrigger = forwardRef(function DatePickerNextTrigger({ asChild, className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.NextTrigger, {
+		ref,
+		"data-slot": "date-picker-next-trigger",
+		asChild,
+		className: clsx(!asChild && DatePicker_module_default.navTrigger, normalizeClassName(className)),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ChevronRightIcon, {})
+	});
+});
+const DatePickerRangeText = forwardRef(function DatePickerRangeText({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.RangeText, {
+		ref,
+		"data-slot": "date-picker-range-text",
+		className: clsx(DatePicker_module_default.rangeText, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerViewTrigger = forwardRef(function DatePickerViewTrigger({ asChild, className, children, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.ViewTrigger, {
+		ref,
+		"data-slot": "date-picker-view-trigger",
+		asChild,
+		className: clsx(!asChild && DatePicker_module_default.viewTrigger, normalizeClassName(className)),
+		...props,
+		children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(DatePickerRangeText, {}), /* @__PURE__ */ jsx(ChevronDownIcon, {})] })
+	});
+});
+const DatePickerTable = forwardRef(function DatePickerTable({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.Table, {
+		ref,
+		"data-slot": "date-picker-table",
+		className: clsx(DatePicker_module_default.table, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerTableHead = forwardRef(function DatePickerTableHead({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.TableHead, {
+		ref,
+		"data-slot": "date-picker-table-head",
+		className: normalizeClassName(className),
+		...props
+	});
+});
+const DatePickerTableBody = forwardRef(function DatePickerTableBody({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.TableBody, {
+		ref,
+		"data-slot": "date-picker-table-body",
+		className: normalizeClassName(className),
+		...props
+	});
+});
+const DatePickerTableRow = forwardRef(function DatePickerTableRow({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.TableRow, {
+		ref,
+		"data-slot": "date-picker-table-row",
+		className: normalizeClassName(className),
+		...props
+	});
+});
+const DatePickerTableHeader = forwardRef(function DatePickerTableHeader({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.TableHeader, {
+		ref,
+		"data-slot": "date-picker-table-header",
+		className: clsx(DatePicker_module_default.tableHeader, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerWeekNumberHeaderCell = forwardRef(function DatePickerWeekNumberHeaderCell({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.WeekNumberHeaderCell, {
+		ref,
+		"data-slot": "date-picker-week-number-header-cell",
+		className: clsx(DatePicker_module_default.tableHeader, DatePicker_module_default.weekNumberCell, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerWeekNumberCell = forwardRef(function DatePickerWeekNumberCell({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.WeekNumberCell, {
+		ref,
+		"data-slot": "date-picker-week-number-cell",
+		className: clsx(DatePicker_module_default.weekNumberCell, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerTableCell = forwardRef(function DatePickerTableCell({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.TableCell, {
+		ref,
+		"data-slot": "date-picker-table-cell",
+		className: clsx(DatePicker_module_default.tableCell, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerTableCellTrigger = forwardRef(function DatePickerTableCellTrigger({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.TableCellTrigger, {
+		ref,
+		"data-slot": "date-picker-table-cell-trigger",
+		className: clsx(DatePicker_module_default.tableCellTrigger, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerMonthSelect = forwardRef(function DatePickerMonthSelect({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.MonthSelect, {
+		ref,
+		"data-slot": "date-picker-month-select",
+		className: clsx(DatePicker_module_default.select, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerYearSelect = forwardRef(function DatePickerYearSelect({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.YearSelect, {
+		ref,
+		"data-slot": "date-picker-year-select",
+		className: clsx(DatePicker_module_default.select, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerPresetTrigger = forwardRef(function DatePickerPresetTrigger({ asChild, className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.PresetTrigger, {
+		ref,
+		"data-slot": "date-picker-preset-trigger",
+		asChild,
+		className: clsx(!asChild && DatePicker_module_default.presetTrigger, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePickerValueText = forwardRef(function DatePickerValueText({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(DatePicker.ValueText, {
+		ref,
+		"data-slot": "date-picker-value-text",
+		className: clsx(DatePicker_module_default.valueText, normalizeClassName(className)),
+		...props
+	});
+});
+const DatePicker$1 = Object.assign(DatePickerRoot, {
+	Root: DatePickerRoot,
+	RootProvider: DatePickerRootProvider,
+	Label: DatePickerLabel,
+	Control: DatePickerControl,
+	Input: DatePickerInput,
+	Trigger: DatePickerTrigger,
+	ClearTrigger: DatePickerClearTrigger,
+	Positioner: DatePickerPositioner,
+	Content: DatePickerContent,
+	View: DatePickerView,
+	ViewControl: DatePickerViewControl,
+	PrevTrigger: DatePickerPrevTrigger,
+	NextTrigger: DatePickerNextTrigger,
+	ViewTrigger: DatePickerViewTrigger,
+	RangeText: DatePickerRangeText,
+	ValueText: DatePickerValueText,
+	Table: DatePickerTable,
+	TableHead: DatePickerTableHead,
+	TableBody: DatePickerTableBody,
+	TableRow: DatePickerTableRow,
+	TableHeader: DatePickerTableHeader,
+	TableCell: DatePickerTableCell,
+	TableCellTrigger: DatePickerTableCellTrigger,
+	WeekNumberHeaderCell: DatePickerWeekNumberHeaderCell,
+	WeekNumberCell: DatePickerWeekNumberCell,
+	MonthSelect: DatePickerMonthSelect,
+	YearSelect: DatePickerYearSelect,
+	PresetTrigger: DatePickerPresetTrigger
+});
+//#endregion
+export { DatePicker$1 as DatePicker };

package/dist/components/date-picker/DatePicker.module.js

@@ -0,0 +1,29 @@
+import './DatePicker.css';
+//#region src/components/date-picker/DatePicker.module.css
+var DatePicker_module_default = {
+	"clearTrigger": "Nbvdda_clearTrigger",
+	"content": "Nbvdda_content",
+	"control": "Nbvdda_control",
+	"date-picker-content-closed": "Nbvdda_date-picker-content-closed",
+	"date-picker-content-open": "Nbvdda_date-picker-content-open",
+	"input": "Nbvdda_input",
+	"label": "Nbvdda_label",
+	"navTrigger": "Nbvdda_navTrigger",
+	"positioner": "Nbvdda_positioner",
+	"presetTrigger": "Nbvdda_presetTrigger",
+	"rangeText": "Nbvdda_rangeText",
+	"root": "Nbvdda_root",
+	"select": "Nbvdda_select",
+	"table": "Nbvdda_table",
+	"tableCell": "Nbvdda_tableCell",
+	"tableCellTrigger": "Nbvdda_tableCellTrigger",
+	"tableHeader": "Nbvdda_tableHeader",
+	"trigger": "Nbvdda_trigger",
+	"valueText": "Nbvdda_valueText",
+	"view": "Nbvdda_view",
+	"viewControl": "Nbvdda_viewControl",
+	"viewTrigger": "Nbvdda_viewTrigger",
+	"weekNumberCell": "Nbvdda_weekNumberCell"
+};
+//#endregion
+export { DatePicker_module_default as default };

package/dist/components/date-picker/index.d.ts

@@ -0,0 +1,2 @@
+import { DatePicker, DatePickerRootProps, DatePickerRootProviderProps } from "./DatePicker.js";
+export { DatePicker, type DatePickerRootProps, type DatePickerRootProviderProps };

package/dist/components/dialog/Dialog.css

@@ -0,0 +1,221 @@
+@layer ui.components {
+  .gV-U6q_trigger, .gV-U6q_closeTrigger {
+    box-sizing: border-box;
+    min-height: var(--dialog-control-height, var(--size-lg));
+    padding: var(--dialog-control-padding-y, .5rem) var(--dialog-control-padding-x, .875rem);
+    border: var(--dialog-control-border-width, var(--border-width-sm)) solid
+      var(--dialog-control-border-color, var(--color-border));
+    border-radius: var(--dialog-control-radius, var(--radius-md));
+    background-color: var(--dialog-control-bg, var(--color-background));
+    color: var(--dialog-control-color, var(--color-foreground));
+    font: inherit;
+    font-size: var(--dialog-control-font-size, var(--text-md));
+    line-height: var(--dialog-control-line-height, var(--line-height-text-md));
+    cursor: pointer;
+    user-select: none;
+    transition: background-color var(--transition-default),
+      border-color var(--transition-default),
+      color var(--transition-default);
+    justify-content: center;
+    align-items: center;
+    margin: 0;
+    display: inline-flex;
+
+    @media (hover: hover) {
+      &:hover {
+        background-color: var(--dialog-control-bg-hover, var(--color-accent));
+      }
+    }
+
+    &:focus-visible {
+      outline: var(--dialog-focus-ring-width, var(--dialog-control-border-width, var(--border-width-sm)))
+        solid var(--dialog-focus-ring-color, var(--color-ring));
+      outline-offset: calc(var(--dialog-focus-ring-width, var(--dialog-control-border-width, var(--border-width-sm))) *
+          -1);
+    }
+
+    &[data-disabled], &[disabled] {
+      pointer-events: none;
+      opacity: var(--opacity-disabled);
+    }
+  }
+
+  .gV-U6q_backdrop {
+    z-index: calc(var(--z-backdrop) + var(--layer-index, 0));
+    background-color: var(--dialog-backdrop-bg, var(--backdrop-bg, var(--color-overlay)));
+    min-height: 100dvh;
+    backdrop-filter: var(--backdrop-filter, blur(var(--dialog-backdrop-blur, 4px)));
+    position: fixed;
+    inset: 0;
+
+    &[data-state="open"] {
+      animation: gV-U6q_dialog-backdrop-in var(--dialog-backdrop-transition, var(--transition-default));
+    }
+
+    &[data-state="closed"] {
+      animation: gV-U6q_dialog-backdrop-out var(--dialog-backdrop-transition, var(--transition-default));
+    }
+  }
+
+  .gV-U6q_positioner {
+    box-sizing: border-box;
+    z-index: calc(var(--z-modal) + var(--layer-index, 0));
+    overscroll-behavior: contain;
+    scrollbar-gutter: stable both-edges;
+    padding: var(--dialog-positioner-padding, var(--spacing-4));
+    place-items: center;
+    display: grid;
+    position: fixed;
+    inset: 0;
+    overflow-y: auto;
+  }
+
+  .gV-U6q_content {
+    box-sizing: border-box;
+    width: min(var(--dialog-width, 28rem),
+      var(--dialog-max-width, calc(100vw - var(--spacing-8, 2rem))));
+    max-width: 100%;
+    max-height: calc(100dvh - var(--spacing-8, 2rem));
+    padding: var(--dialog-padding, var(--spacing-6));
+    border: var(--dialog-border-width, var(--border-width-sm)) solid
+      var(--dialog-border-color, var(--color-border));
+    border-radius: var(--dialog-radius, var(--radius-lg));
+    background-color: var(--dialog-bg, var(--color-popover));
+    color: var(--dialog-color, var(--color-popover-foreground));
+    box-shadow: var(--dialog-shadow, var(--shadow-lg));
+    transform-origin: top;
+    transition: scale var(--dialog-nested-transition, var(--dialog-transition, var(--transition-default))),
+      translate var(--dialog-nested-transition, var(--dialog-transition, var(--transition-default)));
+    outline: 0;
+    position: relative;
+    translate: 0;
+    scale: 1;
+
+    &:after {
+      content: "";
+      z-index: 1;
+      border-radius: inherit;
+      background-color: var(--dialog-nested-overlay-bg, #0000000d);
+      opacity: 0;
+      pointer-events: none;
+      transition: opacity
+        var(--dialog-nested-transition, var(--dialog-transition, var(--transition-default)));
+      position: absolute;
+      inset: 0;
+    }
+
+    &[data-has-nested] {
+      scale: calc(1 - var(--dialog-nested-scale-step, .05) * var(--nested-layer-count, 0));
+      translate: 0
+        calc(var(--dialog-nested-translate-step, var(--spacing-10)) * var(--nested-layer-count, 0));
+
+      &:after {
+        opacity: 1;
+      }
+    }
+
+    &[data-state="open"] {
+      animation: gV-U6q_dialog-content-in var(--dialog-transition, var(--transition-default));
+    }
+
+    &[data-state="closed"] {
+      animation: gV-U6q_dialog-content-out var(--dialog-transition, var(--transition-default));
+    }
+  }
+
+  .gV-U6q_header {
+    align-items: start;
+    gap: var(--dialog-header-gap, var(--spacing-1));
+    grid-template-columns: minmax(0, 1fr) auto;
+    display: grid;
+
+    & > [data-slot="dialog-title"] {
+      grid-column: 1;
+    }
+
+    & > [data-slot="dialog-close-trigger"] {
+      grid-column: 2;
+      justify-self: end;
+    }
+
+    & > [data-slot="dialog-description"] {
+      grid-column: 1 / -1;
+    }
+  }
+
+  .gV-U6q_title {
+    color: var(--dialog-title-color, var(--dialog-color, var(--color-popover-foreground)));
+    font-size: var(--dialog-title-font-size, var(--text-lg));
+    font-weight: var(--dialog-title-font-weight, var(--weight-semibold));
+    line-height: var(--dialog-title-line-height, var(--line-height-text-lg));
+    margin: 0;
+  }
+
+  .gV-U6q_description, .gV-U6q_body {
+    color: var(--dialog-description-color, var(--dialog-muted-color, var(--color-muted-foreground)));
+    font-size: var(--dialog-description-font-size, var(--text-md));
+    line-height: var(--dialog-description-line-height, var(--line-height-text-md));
+  }
+
+  .gV-U6q_description {
+    margin: 0;
+  }
+
+  .gV-U6q_body {
+    margin: var(--dialog-content-margin, var(--spacing-4) 0 0);
+  }
+
+  .gV-U6q_footer {
+    justify-content: flex-end;
+    gap: var(--dialog-footer-gap, var(--spacing-2));
+    margin-top: var(--dialog-footer-margin-top, var(--spacing-6));
+    display: flex;
+  }
+
+  .gV-U6q_closeIcon {
+    --close-button-size: var(--dialog-close-icon-size, 1.75rem);
+    --close-button-radius: var(--dialog-close-icon-radius, var(--radius-md));
+    --close-button-color: var(--dialog-close-icon-color, var(--dialog-muted-color, var(--color-muted-foreground)));
+    --close-button-color-hover: var(--dialog-close-icon-color-hover, var(--dialog-close-icon-color, var(--dialog-color, var(--color-popover-foreground))));
+    --close-button-bg: var(--dialog-close-icon-bg, transparent);
+    --close-button-bg-hover: var(--dialog-close-icon-bg-hover, var(--color-accent));
+    --close-button-focus-ring-color: var(--dialog-close-icon-focus-ring-color, var(--dialog-focus-ring-color, var(--color-ring)));
+    --close-button-icon-size: var(--dialog-close-icon-glyph-size, .75rem);
+    z-index: 2;
+    position: absolute;
+    inset-block-start: var(--dialog-close-icon-inset-block-start, var(--spacing-4));
+    inset-inline-end: var(--dialog-close-icon-inset-inline-end, var(--spacing-4));
+  }
+
+  @keyframes gV-U6q_dialog-backdrop-in {
+    from {
+      opacity: var(--dialog-backdrop-starting-opacity, 0);
+      backdrop-filter: var(--dialog-backdrop-starting-blur, none);
+    }
+  }
+
+  @keyframes gV-U6q_dialog-backdrop-out {
+    to {
+      opacity: var(--dialog-backdrop-ending-opacity, 0);
+      backdrop-filter: var(--dialog-backdrop-ending-blur, none);
+    }
+  }
+
+  @keyframes gV-U6q_dialog-content-in {
+    from {
+      opacity: var(--dialog-content-starting-opacity, 0);
+      translate: var(--dialog-content-starting-translate-x, 0)
+        var(--dialog-content-starting-translate-y, 0);
+      scale: var(--dialog-content-starting-scale, var(--scale-popup));
+    }
+  }
+
+  @keyframes gV-U6q_dialog-content-out {
+    to {
+      opacity: var(--dialog-content-ending-opacity, 0);
+      translate: var(--dialog-content-ending-translate-x, 0)
+        var(--dialog-content-ending-translate-y, 0);
+      scale: var(--dialog-content-ending-scale, var(--scale-popup));
+    }
+  }
+}

package/dist/components/dialog/Dialog.d.ts

@@ -0,0 +1,46 @@
+import { OverlayPortalProps } from "../../lib/moduix/overlayPortal.js";
+import { ComponentProps } from "react";
+import { Dialog } from "@ark-ui/react/dialog";
+
+//#region src/components/dialog/Dialog.d.ts
+type DialogRootProps = ComponentProps<typeof Dialog.Root> & OverlayPortalProps;
+type DialogRootProviderProps = ComponentProps<typeof Dialog.RootProvider> & OverlayPortalProps;
+declare function DialogRoot({
+  portalled,
+  portalRef,
+  ...props
+}: DialogRootProps): import("react").JSX.Element;
+declare function DialogRootProvider({
+  portalled,
+  portalRef,
+  ...props
+}: DialogRootProviderProps): import("react").JSX.Element;
+declare function DialogHeader({
+  className,
+  ...props
+}: ComponentProps<'div'>): import("react").JSX.Element;
+declare function DialogBody({
+  className,
+  ...props
+}: ComponentProps<'div'>): import("react").JSX.Element;
+declare function DialogFooter({
+  className,
+  ...props
+}: ComponentProps<'div'>): import("react").JSX.Element;
+declare const Dialog$1: typeof DialogRoot & {
+  Root: typeof DialogRoot;
+  RootProvider: typeof DialogRootProvider;
+  Trigger: import("react").ForwardRefExoticComponent<Omit<Dialog.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+  Backdrop: import("react").ForwardRefExoticComponent<Omit<Dialog.BackdropProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Positioner: import("react").ForwardRefExoticComponent<Omit<Dialog.PositionerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Content: import("react").ForwardRefExoticComponent<Omit<Dialog.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  Title: import("react").ForwardRefExoticComponent<Omit<Dialog.TitleProps & import("react").RefAttributes<HTMLHeadingElement>, "ref"> & import("react").RefAttributes<HTMLHeadingElement>>;
+  Description: import("react").ForwardRefExoticComponent<Omit<Dialog.DescriptionProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+  CloseTrigger: import("react").ForwardRefExoticComponent<Omit<Dialog.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+  CloseIcon: import("react").ForwardRefExoticComponent<Omit<Omit<Dialog.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "asChild">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+  Header: typeof DialogHeader;
+  Body: typeof DialogBody;
+  Footer: typeof DialogFooter;
+};
+//#endregion
+export { Dialog$1 as Dialog, type DialogRootProps, type DialogRootProviderProps };