@moduix/react 2.1.0 → 2.2.4

package/dist/components/file-upload/FileUpload_module.css

@@ -0,0 +1,378 @@
+@layer moduix.components {
+  .root-ULK4gN {
+    box-sizing: border-box;
+    align-items: flex-start;
+    gap: var(--moduix-file-upload-gap, var(--moduix-spacing-3));
+    width: var(--moduix-file-upload-width, 100%);
+    max-width: var(--moduix-file-upload-max-width, 28rem);
+    color: var(--moduix-file-upload-color, var(--moduix-color-foreground));
+    flex-direction: column;
+    display: flex;
+  }
+
+  .label-dPIdRm {
+    color: var(--moduix-file-upload-label-color, var(--moduix-file-upload-color, var(--moduix-color-foreground)));
+    font-size: var(--moduix-file-upload-label-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-file-upload-label-font-weight, var(--moduix-weight-medium));
+    line-height: var(--moduix-file-upload-label-line-height, var(--moduix-line-height-text-sm));
+  }
+
+  .label-dPIdRm[data-disabled] {
+    opacity: var(--moduix-file-upload-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .dropzone-Al2hO2 {
+    box-sizing: border-box;
+    place-items: center;
+    gap: var(--moduix-file-upload-dropzone-gap, var(--moduix-spacing-3));
+    width: 100%;
+    min-height: var(--moduix-file-upload-dropzone-min-height, 8rem);
+    border: var(--moduix-file-upload-dropzone-border-width, var(--moduix-border-width-sm)) dashed
+      var(--moduix-file-upload-dropzone-border-color, var(--moduix-color-border));
+    border-radius: var(--moduix-file-upload-radius, var(--moduix-radius-md));
+    padding: var(--moduix-file-upload-dropzone-padding, var(--moduix-spacing-5));
+    background-color: var(--moduix-file-upload-dropzone-bg, var(--moduix-color-background));
+    color: var(--moduix-file-upload-dropzone-color, var(--moduix-color-muted-foreground));
+    text-align: center;
+    transition: border-color var(--moduix-file-upload-transition, var(--moduix-transition-default)),
+      background-color var(--moduix-file-upload-transition, var(--moduix-transition-default)),
+      color var(--moduix-file-upload-transition, var(--moduix-transition-default)),
+      opacity var(--moduix-file-upload-transition, var(--moduix-transition-default));
+    display: grid;
+  }
+
+  .dropzone-Al2hO2[data-dragging] {
+    border-color: var(--moduix-file-upload-dropzone-border-color-dragging, var(--moduix-color-primary));
+    background-color: var(--moduix-file-upload-dropzone-bg-dragging, var(--moduix-color-accent));
+    color: var(--moduix-file-upload-dropzone-color-dragging, var(--moduix-color-foreground));
+  }
+
+  .dropzone-Al2hO2[data-invalid] {
+    border-color: var(--moduix-file-upload-invalid-color, var(--moduix-color-destructive));
+  }
+
+  .dropzone-Al2hO2[data-disabled], .dropzone-Al2hO2[data-readonly] {
+    cursor: default;
+    opacity: var(--moduix-file-upload-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .dropzone-Al2hO2[role="button"]:not([data-disabled], [data-readonly]) {
+    cursor: pointer;
+  }
+
+  .dropzone-Al2hO2:focus-visible {
+    outline: var(--moduix-file-upload-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
+        solid var(--moduix-file-upload-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-file-upload-focus-ring-offset, var(--moduix-border-width-sm));
+  }
+
+  .dropzoneIcon-kSiYgI {
+    box-sizing: border-box;
+    width: var(--moduix-file-upload-dropzone-icon-box-size, var(--moduix-spacing-10));
+    height: var(--moduix-file-upload-dropzone-icon-box-size, var(--moduix-spacing-10));
+    border: var(--moduix-file-upload-dropzone-icon-border-width, var(--moduix-border-width-sm))
+      solid var(--moduix-file-upload-dropzone-icon-border-color, var(--moduix-color-border));
+    border-radius: var(--moduix-file-upload-dropzone-icon-radius, var(--moduix-radius-full));
+    background-color: var(--moduix-file-upload-dropzone-icon-bg, var(--moduix-color-muted));
+    color: var(--moduix-file-upload-dropzone-icon-color, var(--moduix-color-foreground));
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+  }
+
+  .dropzoneIcon-kSiYgI > svg {
+    width: var(--moduix-file-upload-dropzone-icon-size, var(--moduix-spacing-4));
+    height: var(--moduix-file-upload-dropzone-icon-size, var(--moduix-spacing-4));
+  }
+
+  .trigger-AsEsy4 {
+    box-sizing: border-box;
+    justify-content: center;
+    align-items: center;
+    gap: var(--moduix-file-upload-trigger-gap, var(--moduix-button-content-gap, var(--moduix-spacing-2)));
+    min-height: var(--moduix-file-upload-trigger-height, var(--moduix-button-size-md, var(--moduix-size-md)));
+    border: var(--moduix-file-upload-trigger-border-width, var(--moduix-button-border-width, var(--moduix-border-width-sm)))
+      solid
+      var(--moduix-file-upload-trigger-border-color, var(--moduix-button-default-border-color, var(--moduix-color-primary)));
+    border-radius: var(--moduix-file-upload-trigger-radius, var(--moduix-button-radius, var(--moduix-radius-md)));
+    padding-inline: var(--moduix-file-upload-trigger-padding-x, var(--moduix-button-padding-x-md, var(--moduix-spacing-4)));
+    background-color: var(--moduix-file-upload-trigger-bg, var(--moduix-button-default-bg, var(--moduix-color-primary)));
+    color: var(--moduix-file-upload-trigger-color, var(--moduix-button-default-color, var(--moduix-color-primary-foreground)));
+    appearance: none;
+    font: inherit;
+    font-size: var(--moduix-file-upload-trigger-font-size, var(--moduix-button-font-size, var(--moduix-text-sm)));
+    font-weight: var(--moduix-file-upload-trigger-font-weight, var(--moduix-button-font-weight, var(--moduix-weight-medium)));
+    line-height: var(--moduix-file-upload-trigger-line-height, var(--moduix-button-line-height, var(--moduix-line-height-text-sm)));
+    -webkit-user-select: none;
+    user-select: none;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: border-color
+        var(--moduix-file-upload-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      background-color
+        var(--moduix-file-upload-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      color
+        var(--moduix-file-upload-transition, var(--moduix-button-transition, var(--moduix-transition-default))),
+      opacity
+        var(--moduix-file-upload-transition, var(--moduix-button-transition, var(--moduix-transition-default)));
+    display: inline-flex;
+  }
+
+  @media (hover: hover) {
+    .trigger-AsEsy4:hover:not(:disabled, [data-disabled], [data-readonly]) {
+      background-color: var(--moduix-file-upload-trigger-bg-hover, var(--moduix-button-default-bg-hover, var(--moduix-color-foreground)));
+    }
+  }
+
+  .trigger-AsEsy4:focus-visible {
+    outline: var(--moduix-file-upload-focus-ring-width, var(--moduix-button-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md))))
+        solid
+        var(--moduix-file-upload-focus-ring-color, var(--moduix-button-focus-ring-color, var(--moduix-color-ring)));
+    outline-offset: calc(var(--moduix-file-upload-trigger-border-width, var(--moduix-button-border-width, var(--moduix-border-width-sm))) *
+          -1);
+  }
+
+  .trigger-AsEsy4[data-invalid] {
+    border-color: var(--moduix-file-upload-invalid-color, var(--moduix-color-destructive));
+  }
+
+  .trigger-AsEsy4:is(:disabled, [data-disabled], [data-readonly]) {
+    pointer-events: none;
+    cursor: default;
+  }
+
+  .itemGroup-l7vSDL {
+    align-items: flex-start;
+    gap: var(--moduix-file-upload-item-group-gap, var(--moduix-spacing-2));
+    flex-wrap: wrap;
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    display: flex;
+  }
+
+  .itemGroup-l7vSDL:empty {
+    display: none;
+  }
+
+  .item-ZdUuIF {
+    box-sizing: border-box;
+    align-items: center;
+    column-gap: var(--moduix-file-upload-item-gap, var(--moduix-spacing-3));
+    row-gap: var(--moduix-file-upload-item-row-gap, var(--moduix-spacing-1));
+    min-height: var(--moduix-file-upload-item-min-height, var(--moduix-size-md));
+    border: var(--moduix-file-upload-item-border-width, var(--moduix-border-width-sm)) solid
+      var(--moduix-file-upload-item-border-color, var(--moduix-color-border));
+    border-radius: var(--moduix-file-upload-item-radius, var(--moduix-radius-md));
+    padding: var(--moduix-file-upload-item-padding-y, var(--moduix-spacing-2))
+      var(--moduix-file-upload-item-padding-x, var(--moduix-spacing-3));
+    background-color: var(--moduix-file-upload-item-bg, var(--moduix-color-background));
+    color: var(--moduix-file-upload-item-color, var(--moduix-color-foreground));
+    flex: 1 0 100%;
+    grid-template-columns: minmax(0, 1fr) auto;
+    display: grid;
+  }
+
+  .item-ZdUuIF[data-type="rejected"] {
+    border-color: var(--moduix-file-upload-invalid-color, var(--moduix-color-destructive));
+  }
+
+  .item-ZdUuIF[data-disabled] {
+    opacity: var(--moduix-file-upload-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview"]) {
+    min-height: var(--moduix-file-upload-item-preview-min-height, var(--moduix-size-xl));
+    padding-block: var(--moduix-file-upload-item-preview-padding-y, var(--moduix-spacing-2));
+    grid-template-columns: auto minmax(0, 1fr) auto;
+  }
+
+  .itemPreview-SlUuuu {
+    width: var(--moduix-file-upload-item-preview-size, var(--moduix-spacing-10));
+    height: var(--moduix-file-upload-item-preview-size, var(--moduix-spacing-10));
+    border-radius: var(--moduix-file-upload-item-preview-radius, var(--moduix-radius-sm));
+    background-color: var(--moduix-file-upload-item-preview-bg, var(--moduix-color-muted));
+    color: var(--moduix-file-upload-item-preview-color, var(--moduix-color-muted-foreground));
+    grid-area: 1 / 1 / span 2;
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+    overflow: hidden;
+  }
+
+  .itemPreviewImage-A81Uin {
+    object-fit: cover;
+    width: 100%;
+    height: 100%;
+  }
+
+  .itemPreviewIcon-ybgkyZ {
+    width: var(--moduix-file-upload-item-preview-icon-size, var(--moduix-spacing-4));
+    height: var(--moduix-file-upload-item-preview-icon-size, var(--moduix-spacing-4));
+  }
+
+  .itemMetadata-EmEskK {
+    align-items: center;
+    gap: var(--moduix-file-upload-item-row-gap, var(--moduix-spacing-1));
+    color: var(--moduix-file-upload-item-size-color, var(--moduix-color-muted-foreground));
+    font-size: var(--moduix-file-upload-item-size-font-size, var(--moduix-text-xs));
+    line-height: var(--moduix-file-upload-item-size-line-height, var(--moduix-line-height-text-xs));
+    grid-column: 1;
+    display: flex;
+  }
+
+  .itemMetadata-EmEskK > [data-slot="file-upload-item-size-text"]:before {
+    content: "·";
+    margin-inline-end: var(--moduix-file-upload-item-row-gap, var(--moduix-spacing-1));
+  }
+
+  .itemName-LSyV_n {
+    min-width: 0;
+    color: var(--moduix-file-upload-item-name-color, currentColor);
+    font-size: var(--moduix-file-upload-item-name-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-file-upload-item-name-font-weight, var(--moduix-weight-medium));
+    line-height: var(--moduix-file-upload-item-name-line-height, var(--moduix-line-height-text-sm));
+    -webkit-line-clamp: 1;
+    line-clamp: 1;
+    -webkit-box-orient: vertical;
+    grid-column: 1;
+    display: -webkit-box;
+    overflow: hidden;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview"]) .itemName-LSyV_n {
+    grid-column: 2;
+  }
+
+  .itemSizeText-euWMRd {
+    color: var(--moduix-file-upload-item-size-color, var(--moduix-color-muted-foreground));
+    font-size: var(--moduix-file-upload-item-size-font-size, var(--moduix-text-xs));
+    line-height: var(--moduix-file-upload-item-size-line-height, var(--moduix-line-height-text-xs));
+    grid-column: 1;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview"]) .itemSizeText-euWMRd {
+    grid-column: 2;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview"]) .itemMetadata-EmEskK {
+    grid-column: 2;
+  }
+
+  .itemDeleteTrigger-DgPANB {
+    box-sizing: border-box;
+    width: var(--moduix-file-upload-action-size, var(--moduix-size-sm));
+    height: var(--moduix-file-upload-action-size, var(--moduix-size-sm));
+    border-radius: var(--moduix-file-upload-action-radius, var(--moduix-radius-sm));
+    background-color: var(--moduix-file-upload-action-bg, transparent);
+    color: var(--moduix-file-upload-action-color, var(--moduix-color-muted-foreground));
+    appearance: none;
+    cursor: pointer;
+    transition: background-color var(--moduix-file-upload-transition, var(--moduix-transition-default)),
+      color var(--moduix-file-upload-transition, var(--moduix-transition-default)),
+      opacity var(--moduix-file-upload-transition, var(--moduix-transition-default));
+    border: 0;
+    justify-content: center;
+    align-items: center;
+    padding: 0;
+    display: inline-flex;
+  }
+
+  .itemDeleteTrigger-DgPANB > svg {
+    width: var(--moduix-file-upload-action-icon-size, var(--moduix-spacing-4));
+    height: var(--moduix-file-upload-action-icon-size, var(--moduix-spacing-4));
+  }
+
+  @media (hover: hover) {
+    .itemDeleteTrigger-DgPANB:hover:not(:disabled, [data-disabled], [data-readonly]) {
+      background-color: var(--moduix-file-upload-action-bg-hover, var(--moduix-color-muted));
+      color: var(--moduix-file-upload-action-color-hover, var(--moduix-color-foreground));
+    }
+  }
+
+  .itemDeleteTrigger-DgPANB:focus-visible {
+    outline: var(--moduix-file-upload-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)))
+        solid var(--moduix-file-upload-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-file-upload-focus-ring-offset, var(--moduix-border-width-sm));
+  }
+
+  .itemDeleteTrigger-DgPANB:is(:disabled, [data-disabled], [data-readonly]) {
+    pointer-events: none;
+    opacity: var(--moduix-file-upload-disabled-opacity, var(--moduix-opacity-disabled));
+    cursor: default;
+  }
+
+  .itemDeleteTrigger-DgPANB {
+    grid-area: 1 / 2;
+    justify-self: end;
+  }
+
+  :is(.item-ZdUuIF:has([data-slot="file-upload-item-size-text"]) .itemDeleteTrigger-DgPANB, .item-ZdUuIF:has([data-slot="file-upload-item-preview"]) .itemDeleteTrigger-DgPANB) {
+    grid-row: 1 / span 2;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview"]) .itemDeleteTrigger-DgPANB {
+    grid-column: 3;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview-image"]) {
+    flex: 0 1 min(100%, var(--moduix-file-upload-image-item-max-width, 10rem));
+    grid-template-rows: auto auto auto;
+    grid-template-columns: minmax(0, 1fr) auto;
+    align-items: start;
+    min-height: 0;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview-image"]) .itemPreview-SlUuuu {
+    aspect-ratio: 1;
+    grid-area: 1 / 1 / auto / -1;
+    width: 100%;
+    height: auto;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview-image"]) .itemName-LSyV_n {
+    grid-area: 2 / 1;
+    align-self: end;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview-image"]) .itemMetadata-EmEskK {
+    grid-area: 3 / 1;
+  }
+
+  .item-ZdUuIF:has([data-slot="file-upload-item-preview-image"]) .itemDeleteTrigger-DgPANB {
+    grid-area: 2 / 2 / span 2;
+    align-self: center;
+  }
+
+  .clearTrigger-dMa5C4 {
+    --moduix-close-button-size: var(--moduix-file-upload-action-size, var(--moduix-size-sm));
+    --moduix-close-button-radius: var(--moduix-file-upload-action-radius, var(--moduix-radius-sm));
+    --moduix-close-button-bg: var(--moduix-file-upload-action-bg, transparent);
+    --moduix-close-button-bg-hover: var(--moduix-file-upload-action-bg-hover, var(--moduix-color-muted));
+    --moduix-close-button-color: var(--moduix-file-upload-clear-trigger-color, var(--moduix-color-muted-foreground));
+    --moduix-close-button-color-hover: var(--moduix-file-upload-action-color-hover, var(--moduix-color-foreground));
+    --moduix-close-button-icon-size: var(--moduix-file-upload-action-icon-size, var(--moduix-spacing-4));
+    --moduix-close-button-transition: var(--moduix-file-upload-transition, var(--moduix-transition-default));
+    --moduix-close-button-focus-ring-width: var(--moduix-file-upload-focus-ring-width, var(--moduix-focus-ring-width, var(--moduix-border-width-md)));
+    --moduix-close-button-focus-ring-color: var(--moduix-file-upload-focus-ring-color, var(--moduix-color-ring));
+    --moduix-close-button-focus-ring-offset: var(--moduix-file-upload-focus-ring-offset, var(--moduix-border-width-sm));
+    --moduix-close-button-disabled-opacity: var(--moduix-file-upload-disabled-opacity, var(--moduix-opacity-disabled));
+    align-self: flex-start;
+  }
+
+  .clearTriggerWithContent-YGYoF4 {
+    gap: var(--moduix-file-upload-clear-trigger-gap, var(--moduix-spacing-2));
+    width: auto;
+    padding-inline: var(--moduix-file-upload-clear-trigger-padding-x, var(--moduix-spacing-2));
+    font: inherit;
+    font-size: var(--moduix-file-upload-clear-trigger-font-size, var(--moduix-text-sm));
+    line-height: var(--moduix-file-upload-clear-trigger-line-height, var(--moduix-line-height-text-sm));
+  }
+
+  .clearTrigger-dMa5C4[data-readonly] {
+    pointer-events: none;
+    opacity: var(--moduix-file-upload-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+}
+

package/dist/components/file-upload/index.d.ts

@@ -1,2 +1 @@
-import { FileUpload, useFileUpload, useFileUploadContext } from "./FileUpload.js";
-export { FileUpload, useFileUpload, useFileUploadContext };
+export { FileUpload, useFileUpload, useFileUploadContext } from './FileUpload.js';

package/dist/components/file-upload/index.js

@@ -0,0 +1 @@
+export { FileUpload, useFileUpload, useFileUploadContext } from "./FileUpload.js";

package/dist/components/floating-panel/FloatingPanel.d.ts

@@ -1,53 +1,35 @@
-import { OverlayPortalProps } from "../../lib/moduix/overlayPortal.js";
-import { ComponentProps } from "react";
-import { FloatingPanel, FloatingPanelResizeTriggerAxis } from "@ark-ui/react/floating-panel";
-
-//#region src/components/floating-panel/FloatingPanel.d.ts
+import { FloatingPanel as FloatingPanelPrimitive, useFloatingPanel, useFloatingPanelContext, type FloatingPanelResizeTriggerAxis } from '@ark-ui/react/floating-panel';
+import type { ComponentProps } from 'react';
+import { type OverlayPortalProps } from '../../internal/overlayPortal';
 declare const resizeTriggerAxes: ("s" | "w" | "e" | "n" | "sw" | "nw" | "se" | "ne")[];
-type FloatingPanelRootProps = ComponentProps<typeof FloatingPanel.Root> & OverlayPortalProps;
-type FloatingPanelRootProviderProps = ComponentProps<typeof FloatingPanel.RootProvider> & OverlayPortalProps;
-declare function FloatingPanelRoot({
-  closeOnEscape,
-  persistRect,
-  portalled,
-  portalRef,
-  ...props
-}: FloatingPanelRootProps): import("react").JSX.Element;
-declare function FloatingPanelRootProvider({
-  portalled,
-  portalRef,
-  ...props
-}: FloatingPanelRootProviderProps): import("react").JSX.Element;
-declare function FloatingPanelFooter({
-  className,
-  ...props
-}: ComponentProps<'div'>): import("react").JSX.Element;
-declare function FloatingPanelResizeTriggerGroup({
-  axes
-}: {
-  axes?: readonly FloatingPanelResizeTriggerAxis[];
+type FloatingPanelRootProps = ComponentProps<typeof FloatingPanelPrimitive.Root> & OverlayPortalProps;
+type FloatingPanelRootProviderProps = ComponentProps<typeof FloatingPanelPrimitive.RootProvider> & OverlayPortalProps;
+declare function FloatingPanelRoot({ closeOnEscape, lazyMount, persistRect, portalled, portalRef, unmountOnExit, ...props }: FloatingPanelRootProps): import("react").JSX.Element;
+declare function FloatingPanelRootProvider({ lazyMount, portalled, portalRef, unmountOnExit, ...props }: FloatingPanelRootProviderProps): import("react").JSX.Element;
+declare function FloatingPanelFooter({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
+declare function FloatingPanelResizeTriggerGroup({ axes, }: {
+    axes?: readonly FloatingPanelResizeTriggerAxis[];
 }): import("react").JSX.Element;
-declare const FloatingPanel$1: typeof FloatingPanelRoot & {
-  Context: (props: FloatingPanel.ContextProps) => import("react").ReactNode;
-  Root: typeof FloatingPanelRoot;
-  RootProvider: typeof FloatingPanelRootProvider;
-  Trigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  Positioner: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.PositionerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Content: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  DragTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.DragTriggerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Header: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.HeaderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Title: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.TitleProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Control: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  StageTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.StageTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  CloseTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  CloseIcon: import("react").ForwardRefExoticComponent<Omit<Omit<FloatingPanel.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "asChild">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  Body: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.BodyProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Footer: typeof FloatingPanelFooter;
-  ResizeTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanel.ResizeTriggerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ResizeTriggerGroup: typeof FloatingPanelResizeTriggerGroup;
-  DragIndicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
-  useFloatingPanel: (props?: import("@ark-ui/react/floating-panel").UseFloatingPanelProps) => import("@ark-ui/react/floating-panel").UseFloatingPanelReturn;
-  useFloatingPanelContext: () => import("@ark-ui/react/floating-panel").UseFloatingPanelContext;
+declare const FloatingPanel: typeof FloatingPanelRoot & {
+    Context: (props: FloatingPanelPrimitive.ContextProps) => import("react").ReactNode;
+    Root: typeof FloatingPanelRoot;
+    RootProvider: typeof FloatingPanelRootProvider;
+    Trigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Positioner: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.PositionerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Content: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    DragTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.DragTriggerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Header: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.HeaderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Title: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.TitleProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Control: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    StageTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.StageTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    CloseTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    CloseIcon: import("react").ForwardRefExoticComponent<Omit<Omit<FloatingPanelPrimitive.CloseTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "asChild">, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Body: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.BodyProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Footer: typeof FloatingPanelFooter;
+    ResizeTrigger: import("react").ForwardRefExoticComponent<Omit<FloatingPanelPrimitive.ResizeTriggerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ResizeTriggerGroup: typeof FloatingPanelResizeTriggerGroup;
+    DragIndicator: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    useFloatingPanel: (props?: import("@ark-ui/react/floating-panel").UseFloatingPanelProps) => import("@ark-ui/react/floating-panel").UseFloatingPanelReturn;
+    useFloatingPanelContext: () => import("@ark-ui/react/floating-panel").UseFloatingPanelContext;
 };
-//#endregion
-export { FloatingPanel$1 as FloatingPanel, resizeTriggerAxes };
+export { FloatingPanel, resizeTriggerAxes, useFloatingPanel, useFloatingPanelContext };