@lglab/compose-ui 0.0.0

package/LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Compose UI
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,39 @@
+
+# @lglab/compose-ui
+
+
+## Install
+
+```
+pnpm add @lglab/compose-ui
+```
+
+or
+
+```
+npm i @lglab/compose-ui
+```
+
+or
+
+```
+yarn add @lglab/compose-ui
+```
+
+or
+
+```
+bun add @lglab/compose-ui
+```
+
+## Quick Start
+
+```
+import { Button } from '@lglab/compose-ui'
+
+const Page = () => {
+  return (
+    <Button>Click</Button>
+  );
+}
+```

package/dist/components/button.d.ts

@@ -0,0 +1,20 @@
+import { Button as BaseButton } from '@base-ui/react/button';
+import * as React from 'react';
+type ButtonVariant = 'default' | 'secondary' | 'outline' | 'ghost' | 'destructive' | 'link';
+type ButtonSize = 'sm' | 'default' | 'lg' | 'icon';
+export type ButtonProps = React.ComponentProps<typeof BaseButton> & {
+    /** Visual style variant */
+    variant?: ButtonVariant;
+    /** Size of the button */
+    size?: ButtonSize;
+    /** Show loading state */
+    loading?: boolean;
+    /** Content to show when loading */
+    loadingText?: string;
+};
+declare const Button: {
+    ({ className, variant, size, loading, loadingText, disabled, children, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Button };
+//# sourceMappingURL=button.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAG5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,KAAK,aAAa,GACd,SAAS,GACT,WAAW,GACX,SAAS,GACT,OAAO,GACP,aAAa,GACb,MAAM,CAAA;AACV,KAAK,UAAU,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,CAAA;AAmClD,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,GAAG;IAClE,2BAA2B;IAC3B,OAAO,CAAC,EAAE,aAAa,CAAA;IACvB,yBAAyB;IACzB,IAAI,CAAC,EAAE,UAAU,CAAA;IACjB,yBAAyB;IACzB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,mCAAmC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAED,QAAA,MAAM,MAAM;uFAST,WAAW;;CAiBb,CAAA;AAID,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/components/dialog.d.ts

@@ -0,0 +1,67 @@
+import { Dialog as BaseDialog } from '@base-ui/react/dialog';
+import * as React from 'react';
+export type DialogRootProps = React.ComponentProps<typeof BaseDialog.Root>;
+declare const DialogRoot: {
+    (props: DialogRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogTriggerProps = React.ComponentProps<typeof BaseDialog.Trigger> & {
+    /** Visual style variant */
+    variant?: 'default' | 'secondary' | 'outline' | 'ghost';
+    /** Size of the trigger button */
+    size?: 'sm' | 'default' | 'lg';
+};
+declare const DialogTrigger: {
+    ({ className, variant, size, ...props }: DialogTriggerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogPortalProps = React.ComponentProps<typeof BaseDialog.Portal>;
+declare const DialogPortal: {
+    (props: DialogPortalProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogBackdropProps = React.ComponentProps<typeof BaseDialog.Backdrop>;
+declare const DialogBackdrop: {
+    ({ className, ...props }: DialogBackdropProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogPopupProps = React.ComponentProps<typeof BaseDialog.Popup> & {
+    /** Size of the dialog popup */
+    size?: 'sm' | 'default' | 'lg' | 'xl' | 'full';
+};
+declare const DialogPopup: {
+    ({ className, size, ...props }: DialogPopupProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogTitleProps = React.ComponentProps<typeof BaseDialog.Title>;
+declare const DialogTitle: {
+    ({ className, ...props }: DialogTitleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogDescriptionProps = React.ComponentProps<typeof BaseDialog.Description>;
+declare const DialogDescription: {
+    ({ className, ...props }: DialogDescriptionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogCloseProps = React.ComponentProps<typeof BaseDialog.Close> & {
+    /** Visual style variant */
+    variant?: 'default' | 'secondary' | 'outline' | 'ghost';
+    /** Size of the close button */
+    size?: 'sm' | 'default' | 'lg';
+};
+declare const DialogClose: {
+    ({ className, variant, size, ...props }: DialogCloseProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogHeaderProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DialogHeader: {
+    ({ className, ...props }: DialogHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DialogFooter: {
+    ({ className, ...props }: DialogFooterProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DialogRoot, DialogTrigger, DialogPortal, DialogBackdrop, DialogPopup, DialogTitle, DialogDescription, DialogClose, DialogHeader, DialogFooter, };
+//# sourceMappingURL=dialog.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../src/components/dialog.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAE5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,IAAI,CAAC,CAAA;AAE1E,QAAA,MAAM,UAAU;YAAW,eAAe;;CAEzC,CAAA;AAqCD,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,OAAO,CAAC,GAAG;IACjF,2BAA2B;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,CAAA;IACvD,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED,QAAA,MAAM,aAAa;6CAA4C,kBAAkB;;CAOhF,CAAA;AAQD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,MAAM,CAAC,CAAA;AAE9E,QAAA,MAAM,YAAY;YAAW,iBAAiB;;CAE7C,CAAA;AAQD,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAA;AAElF,QAAA,MAAM,cAAc;8BAA6B,mBAAmB;;CAYnE,CAAA;AAmCD,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,GAAG;IAC7E,+BAA+B;IAC/B,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAA;CAC/C,CAAA;AAED,QAAA,MAAM,WAAW;oCAAmC,gBAAgB;;CAOnE,CAAA;AAQD,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,CAAA;AAE5E,QAAA,MAAM,WAAW;8BAA6B,gBAAgB;;CAO7D,CAAA;AAQD,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,WAAW,CAAC,CAAA;AAExF,QAAA,MAAM,iBAAiB;8BAA6B,sBAAsB;;CAEzE,CAAA;AAqCD,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,GAAG;IAC7E,2BAA2B;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,CAAA;IACvD,+BAA+B;IAC/B,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED,QAAA,MAAM,WAAW;6CAA4C,gBAAgB;;CAO5E,CAAA;AAQD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEpE,QAAA,MAAM,YAAY;8BAA6B,iBAAiB;;CAE/D,CAAA;AAQD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEpE,QAAA,MAAM,YAAY;8BAA6B,iBAAiB;;CAU/D,CAAA;AAQD,OAAO,EACL,UAAU,EACV,aAAa,EACb,YAAY,EACZ,cAAc,EACd,WAAW,EACX,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,YAAY,GACb,CAAA"}

package/dist/components/drawer.d.ts

@@ -0,0 +1,72 @@
+import { Dialog as BaseDialog } from '@base-ui/react/dialog';
+import * as React from 'react';
+export type DrawerRootProps = React.ComponentProps<typeof BaseDialog.Root>;
+declare const DrawerRoot: {
+    (props: DrawerRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerTriggerProps = React.ComponentProps<typeof BaseDialog.Trigger> & {
+    /** Visual style variant */
+    variant?: 'default' | 'secondary' | 'outline' | 'ghost';
+    /** Size of the trigger button */
+    size?: 'sm' | 'default' | 'lg' | 'icon' | 'icon-sm' | 'icon-lg';
+};
+declare const DrawerTrigger: {
+    ({ className, variant, size, ...props }: DrawerTriggerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerPortalProps = React.ComponentProps<typeof BaseDialog.Portal>;
+declare const DrawerPortal: {
+    (props: DrawerPortalProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerBackdropProps = React.ComponentProps<typeof BaseDialog.Backdrop>;
+declare const DrawerBackdrop: {
+    ({ className, ...props }: DrawerBackdropProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerPopupProps = React.ComponentProps<typeof BaseDialog.Popup> & {
+    /** Side from which the drawer slides in */
+    side?: 'top' | 'right' | 'bottom' | 'left';
+};
+declare const DrawerPopup: {
+    ({ className, side, ...props }: DrawerPopupProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerTitleProps = React.ComponentProps<typeof BaseDialog.Title>;
+declare const DrawerTitle: {
+    ({ className, ...props }: DrawerTitleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerDescriptionProps = React.ComponentProps<typeof BaseDialog.Description>;
+declare const DrawerDescription: {
+    ({ className, ...props }: DrawerDescriptionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerCloseProps = React.ComponentProps<typeof BaseDialog.Close> & {
+    /** Visual style variant */
+    variant?: 'default' | 'secondary' | 'outline' | 'ghost';
+    /** Size of the close button */
+    size?: 'sm' | 'default' | 'lg' | 'icon' | 'icon-sm' | 'icon-lg';
+};
+declare const DrawerClose: {
+    ({ className, variant, size, ...props }: DrawerCloseProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerHeaderProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DrawerHeader: {
+    ({ className, ...props }: DrawerHeaderProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerContentProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DrawerContent: {
+    ({ className, ...props }: DrawerContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type DrawerFooterProps = React.HTMLAttributes<HTMLDivElement>;
+declare const DrawerFooter: {
+    ({ className, ...props }: DrawerFooterProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DrawerRoot, DrawerTrigger, DrawerPortal, DrawerBackdrop, DrawerPopup, DrawerTitle, DrawerDescription, DrawerClose, DrawerHeader, DrawerContent, DrawerFooter, };
+//# sourceMappingURL=drawer.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../src/components/drawer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAE5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,IAAI,CAAC,CAAA;AAE1E,QAAA,MAAM,UAAU;YAAW,eAAe;;CAEzC,CAAA;AAwCD,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,OAAO,CAAC,GAAG;IACjF,2BAA2B;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,CAAA;IACvD,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;CAChE,CAAA;AAED,QAAA,MAAM,aAAa;6CAA4C,kBAAkB;;CAOhF,CAAA;AAQD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,MAAM,CAAC,CAAA;AAE9E,QAAA,MAAM,YAAY;YAAW,iBAAiB;;CAE7C,CAAA;AAQD,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAA;AAElF,QAAA,MAAM,cAAc;8BAA6B,mBAAmB;;CAYnE,CAAA;AA+CD,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,GAAG;IAC7E,2CAA2C;IAC3C,IAAI,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAA;CAC3C,CAAA;AAED,QAAA,MAAM,WAAW;oCAAmC,gBAAgB;;CAOnE,CAAA;AAQD,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,CAAA;AAE5E,QAAA,MAAM,WAAW;8BAA6B,gBAAgB;;CAO7D,CAAA;AAQD,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,WAAW,CAAC,CAAA;AAExF,QAAA,MAAM,iBAAiB;8BAA6B,sBAAsB;;CAEzE,CAAA;AAwCD,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,KAAK,CAAC,GAAG;IAC7E,2BAA2B;IAC3B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,OAAO,CAAA;IACvD,+BAA+B;IAC/B,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;CAChE,CAAA;AAED,QAAA,MAAM,WAAW;6CAA4C,gBAAgB;;CAO5E,CAAA;AAQD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEpE,QAAA,MAAM,YAAY;8BAA6B,iBAAiB;;CAE/D,CAAA;AAQD,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAErE,QAAA,MAAM,aAAa;8BAA6B,kBAAkB;;CAEjE,CAAA;AAQD,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAA;AAEpE,QAAA,MAAM,YAAY;8BAA6B,iBAAiB;;CAE/D,CAAA;AAQD,OAAO,EACL,UAAU,EACV,aAAa,EACb,YAAY,EACZ,cAAc,EACd,WAAW,EACX,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,aAAa,EACb,YAAY,GACb,CAAA"}

package/dist/components/scroll-area.d.ts

@@ -0,0 +1,34 @@
+import { ScrollArea as BaseScrollArea } from '@base-ui/react/scroll-area';
+import * as React from 'react';
+export type ScrollAreaRootProps = React.ComponentProps<typeof BaseScrollArea.Root>;
+declare const ScrollAreaRoot: {
+    ({ className, ...props }: ScrollAreaRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type ScrollAreaViewportProps = React.ComponentProps<typeof BaseScrollArea.Viewport>;
+declare const ScrollAreaViewport: {
+    ({ className, ...props }: ScrollAreaViewportProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type ScrollAreaContentProps = React.ComponentProps<typeof BaseScrollArea.Content>;
+declare const ScrollAreaContent: {
+    ({ className, ...props }: ScrollAreaContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type ScrollAreaScrollbarProps = React.ComponentProps<typeof BaseScrollArea.Scrollbar>;
+declare const ScrollAreaScrollbar: {
+    ({ className, orientation, ...props }: ScrollAreaScrollbarProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type ScrollAreaThumbProps = React.ComponentProps<typeof BaseScrollArea.Thumb>;
+declare const ScrollAreaThumb: {
+    ({ className, ...props }: ScrollAreaThumbProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type ScrollAreaCornerProps = React.ComponentProps<typeof BaseScrollArea.Corner>;
+declare const ScrollAreaCorner: {
+    ({ className, ...props }: ScrollAreaCornerProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { ScrollAreaRoot, ScrollAreaViewport, ScrollAreaContent, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaCorner, };
+//# sourceMappingURL=scroll-area.d.ts.map

package/dist/components/scroll-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.d.ts","sourceRoot":"","sources":["../../src/components/scroll-area.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,4BAA4B,CAAA;AACzE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,CAAA;AAElF,QAAA,MAAM,cAAc;8BAA6B,mBAAmB;;CAEnE,CAAA;AAID,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,QAAQ,CAAC,CAAA;AAE1F,QAAA,MAAM,kBAAkB;8BAA6B,uBAAuB;;CAO3E,CAAA;AAID,MAAM,MAAM,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,OAAO,CAAC,CAAA;AAExF,QAAA,MAAM,iBAAiB;8BAA6B,sBAAsB;;CAEzE,CAAA;AAID,MAAM,MAAM,wBAAwB,GAAG,KAAK,CAAC,cAAc,CACzD,OAAO,cAAc,CAAC,SAAS,CAChC,CAAA;AAED,QAAA,MAAM,mBAAmB;2CAItB,wBAAwB;;CAc1B,CAAA;AAID,MAAM,MAAM,oBAAoB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,KAAK,CAAC,CAAA;AAEpF,QAAA,MAAM,eAAe;8BAA6B,oBAAoB;;CAWrE,CAAA;AAID,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,MAAM,CAAC,CAAA;AAEtF,QAAA,MAAM,gBAAgB;8BAA6B,qBAAqB;;CAEvE,CAAA;AAID,OAAO,EACL,cAAc,EACd,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,EACf,gBAAgB,GACjB,CAAA"}

package/dist/components/tabs.d.ts

@@ -0,0 +1,38 @@
+import { Tabs as BaseTabs } from '@base-ui/react/tabs';
+import * as React from 'react';
+export type TabsRootProps = React.ComponentProps<typeof BaseTabs.Root>;
+declare const TabsRoot: {
+    ({ className, ...props }: TabsRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type TabsListProps = React.ComponentProps<typeof BaseTabs.List> & {
+    /** Orientation of the tabs list */
+    orientation?: 'horizontal' | 'vertical';
+};
+declare const TabsList: {
+    ({ className, orientation, ...props }: TabsListProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type TabsTabProps = React.ComponentProps<typeof BaseTabs.Tab> & {
+    /** Size of the tab */
+    size?: 'sm' | 'default' | 'lg';
+};
+declare const TabsTab: {
+    ({ className, size, ...props }: TabsTabProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type TabsIndicatorProps = React.ComponentProps<typeof BaseTabs.Indicator> & {
+    /** Orientation of the indicator (should match the tabs list orientation) */
+    orientation?: 'horizontal' | 'vertical';
+};
+declare const TabsIndicator: {
+    ({ className, orientation, ...props }: TabsIndicatorProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export type TabsPanelProps = React.ComponentProps<typeof BaseTabs.Panel>;
+declare const TabsPanel: {
+    ({ className, ...props }: TabsPanelProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { TabsRoot, TabsList, TabsTab, TabsIndicator, TabsPanel };
+//# sourceMappingURL=tabs.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAEtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAQ9B,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,CAAA;AAEtE,QAAA,MAAM,QAAQ;8BAA6B,aAAa;;CAEvD,CAAA;AAuBD,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,IAAI,CAAC,GAAG;IACvE,mCAAmC;IACnC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;CACxC,CAAA;AAED,QAAA,MAAM,QAAQ;2CAAyD,aAAa;;CAOnF,CAAA;AAiCD,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,GAAG,CAAC,GAAG;IACrE,sBAAsB;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAA;CAC/B,CAAA;AAED,QAAA,MAAM,OAAO;oCAAmC,YAAY;;CAE3D,CAAA;AAyBD,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,SAAS,CAAC,GAAG;IACjF,4EAA4E;IAC5E,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAA;CACxC,CAAA;AAED,QAAA,MAAM,aAAa;2CAIhB,kBAAkB;;CAOpB,CAAA;AAQD,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,KAAK,CAAC,CAAA;AAExE,QAAA,MAAM,SAAS;8BAA6B,cAAc;;CAWzD,CAAA;AAQD,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,CAAA"}

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+export { Button } from './components/button';
+export { ScrollAreaRoot, ScrollAreaViewport, ScrollAreaContent, ScrollAreaScrollbar, ScrollAreaThumb, ScrollAreaCorner, } from './components/scroll-area';
+export { TabsRoot, TabsList, TabsTab, TabsIndicator, TabsPanel } from './components/tabs';
+export { DialogRoot, DialogTrigger, DialogPortal, DialogBackdrop, DialogPopup, DialogTitle, DialogDescription, DialogClose, DialogHeader, DialogFooter, } from './components/dialog';
+export { DrawerRoot, DrawerTrigger, DrawerPortal, DrawerBackdrop, DrawerPopup, DrawerTitle, DrawerDescription, DrawerClose, DrawerHeader, DrawerContent, DrawerFooter, } from './components/drawer';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAA;AAC5C,OAAO,EACL,cAAc,EACd,kBAAkB,EAClB,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,EACf,gBAAgB,GACjB,MAAM,0BAA0B,CAAA;AACjC,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AACzF,OAAO,EACL,UAAU,EACV,aAAa,EACb,YAAY,EACZ,cAAc,EACd,WAAW,EACX,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,YAAY,GACb,MAAM,qBAAqB,CAAA;AAC5B,OAAO,EACL,UAAU,EACV,aAAa,EACb,YAAY,EACZ,cAAc,EACd,WAAW,EACX,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,YAAY,EACZ,aAAa,EACb,YAAY,GACb,MAAM,qBAAqB,CAAA"}

package/dist/index.es.js

@@ -0,0 +1,589 @@
+"use client";
+import { jsx as a, jsxs as w, Fragment as N } from "react/jsx-runtime";
+import { Button as D } from "@base-ui/react/button";
+import { cva as i } from "class-variance-authority";
+import { clsx as k } from "clsx";
+import { twMerge as z } from "tailwind-merge";
+import { forwardRef as b, createElement as m } from "react";
+import { ScrollArea as d } from "@base-ui/react/scroll-area";
+import { Tabs as u } from "@base-ui/react/tabs";
+import { Dialog as s } from "@base-ui/react/dialog";
+const T = (e) => e.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), C = (e) => e.replace(
+  /^([A-Z])|[\s-_]+(\w)/g,
+  (r, t, n) => n ? n.toUpperCase() : t.toLowerCase()
+), f = (e) => {
+  const r = C(e);
+  return r.charAt(0).toUpperCase() + r.slice(1);
+}, v = (...e) => e.filter((r, t, n) => !!r && r.trim() !== "" && n.indexOf(r) === t).join(" ").trim(), V = (e) => {
+  for (const r in e)
+    if (r.startsWith("aria-") || r === "role" || r === "title")
+      return !0;
+};
+var A = {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: 24,
+  height: 24,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 2,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+};
+const P = b(
+  ({
+    color: e = "currentColor",
+    size: r = 24,
+    strokeWidth: t = 2,
+    absoluteStrokeWidth: n,
+    className: c = "",
+    children: l,
+    iconNode: g,
+    ...p
+  }, y) => m(
+    "svg",
+    {
+      ref: y,
+      ...A,
+      width: r,
+      height: r,
+      stroke: e,
+      strokeWidth: n ? Number(t) * 24 / Number(r) : t,
+      className: v("lucide", c),
+      ...!l && !V(p) && { "aria-hidden": "true" },
+      ...p
+    },
+    [
+      ...g.map(([h, x]) => m(h, x)),
+      ...Array.isArray(l) ? l : [l]
+    ]
+  )
+);
+const S = (e, r) => {
+  const t = b(
+    ({ className: n, ...c }, l) => m(P, {
+      ref: l,
+      iconNode: r,
+      className: v(
+        `lucide-${T(f(e))}`,
+        `lucide-${e}`,
+        n
+      ),
+      ...c
+    })
+  );
+  return t.displayName = f(e), t;
+};
+const R = [["path", { d: "M21 12a9 9 0 1 1-6.219-8.56", key: "13zald" }]], B = S("loader-circle", R);
+function o(...e) {
+  return z(k(e));
+}
+const j = i(
+  // Base styles
+  [
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+        outline: "border border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+        link: "text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+), L = ({
+  className: e,
+  variant: r,
+  size: t,
+  loading: n = !1,
+  loadingText: c,
+  disabled: l,
+  children: g,
+  ...p
+}) => /* @__PURE__ */ a(
+  D,
+  {
+    className: o(j({ variant: r, size: t }), e),
+    disabled: l || n,
+    ...p,
+    children: n ? /* @__PURE__ */ w(N, { children: [
+      /* @__PURE__ */ a(B, { className: "animate-spin" }),
+      c ?? g
+    ] }) : g
+  }
+);
+L.displayName = "Button";
+const I = ({ className: e, ...r }) => /* @__PURE__ */ a(d.Root, { className: o("relative", e), ...r });
+I.displayName = "ScrollArea.Root";
+const _ = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  d.Viewport,
+  {
+    className: o("h-full overscroll-contain pr-3", e),
+    ...r
+  }
+);
+_.displayName = "ScrollArea.Viewport";
+const F = ({ className: e, ...r }) => /* @__PURE__ */ a(d.Content, { className: o("min-w-full", e), ...r });
+F.displayName = "ScrollArea.Content";
+const $ = ({
+  className: e,
+  orientation: r = "vertical",
+  ...t
+}) => /* @__PURE__ */ a(
+  d.Scrollbar,
+  {
+    className: o(
+      "flex touch-none select-none p-0.5 transition-colors duration-150 ease-out",
+      "data-hovering:bg-muted/50",
+      r === "vertical" && "h-full w-2.5",
+      r === "horizontal" && "h-2.5 w-full flex-col",
+      e
+    ),
+    orientation: r,
+    ...t
+  }
+);
+$.displayName = "ScrollArea.Scrollbar";
+const H = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  d.Thumb,
+  {
+    className: o(
+      "relative flex-1 rounded-full bg-border transition-colors",
+      "hover:bg-muted-foreground/50",
+      e
+    ),
+    ...r
+  }
+);
+H.displayName = "ScrollArea.Thumb";
+const M = ({ className: e, ...r }) => /* @__PURE__ */ a(d.Corner, { className: o("bg-muted/50", e), ...r });
+M.displayName = "ScrollArea.Corner";
+const U = ({ className: e, ...r }) => /* @__PURE__ */ a(u.Root, { className: o("flex flex-col", e), ...r });
+U.displayName = "Tabs.Root";
+const W = i(
+  ["relative inline-flex w-fit items-center gap-1", "rounded-lg bg-muted p-1"],
+  {
+    variants: {
+      orientation: {
+        horizontal: "flex-row",
+        vertical: "flex-col"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal"
+    }
+  }
+), Z = ({ className: e, orientation: r = "horizontal", ...t }) => /* @__PURE__ */ a(
+  u.List,
+  {
+    className: o(W({ orientation: r }), e),
+    ...t
+  }
+);
+Z.displayName = "Tabs.List";
+const E = i(
+  [
+    "relative z-10 inline-flex items-center justify-center whitespace-nowrap",
+    "rounded-md px-3 py-1.5 text-sm font-medium",
+    "transition-all duration-200",
+    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "data-[disabled]:pointer-events-none data-[disabled]:opacity-70",
+    "text-foreground/80",
+    "data-[active]:text-foreground",
+    "hover:text-foreground"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "px-2 py-1 text-xs",
+        default: "px-3 py-1.5 text-sm",
+        lg: "px-4 py-2 text-base"
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+), K = ({ className: e, size: r, ...t }) => /* @__PURE__ */ a(u.Tab, { className: o(E({ size: r }), e), ...t });
+K.displayName = "Tabs.Tab";
+const O = i(
+  ["absolute rounded-md bg-background shadow-sm", "transition-all duration-200 ease-out"],
+  {
+    variants: {
+      orientation: {
+        horizontal: "bottom-1 top-1 left-[var(--active-tab-left)] w-[var(--active-tab-width)]",
+        vertical: "left-1 right-1 top-[var(--active-tab-top)] h-[var(--active-tab-height)]"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal"
+    }
+  }
+), q = ({
+  className: e,
+  orientation: r = "horizontal",
+  ...t
+}) => /* @__PURE__ */ a(
+  u.Indicator,
+  {
+    className: o(O({ orientation: r }), e),
+    ...t
+  }
+);
+q.displayName = "Tabs.Indicator";
+const G = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  u.Panel,
+  {
+    className: o(
+      "mt-2 ring-offset-background",
+      "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+      e
+    ),
+    ...r
+  }
+);
+G.displayName = "Tabs.Panel";
+const J = (e) => /* @__PURE__ */ a(s.Root, { ...e });
+J.displayName = "Dialog.Root";
+const Q = i(
+  [
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium",
+    "transition-all",
+    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline: "border border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground"
+      },
+      size: {
+        sm: "h-8 rounded-md px-3 text-xs",
+        default: "h-9 px-4 py-2",
+        lg: "h-10 rounded-md px-6"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+), X = ({ className: e, variant: r, size: t, ...n }) => /* @__PURE__ */ a(
+  s.Trigger,
+  {
+    className: o(Q({ variant: r, size: t }), e),
+    ...n
+  }
+);
+X.displayName = "Dialog.Trigger";
+const Y = (e) => /* @__PURE__ */ a(s.Portal, { ...e });
+Y.displayName = "Dialog.Portal";
+const ee = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  s.Backdrop,
+  {
+    className: o(
+      "fixed inset-0 z-50 bg-black/50 backdrop-blur-sm",
+      "transition-opacity duration-200",
+      "data-starting-style:opacity-0 data-ending-style:opacity-0",
+      e
+    ),
+    ...r
+  }
+);
+ee.displayName = "Dialog.Backdrop";
+const re = i(
+  [
+    "fixed left-1/2 top-1/2 z-50 -translate-x-1/2 -translate-y-1/2",
+    "w-full max-w-[calc(100vw-2rem)] rounded-lg border border-border bg-background p-6 shadow-lg",
+    "outline-none",
+    "transition-all duration-200",
+    "data-[starting-style]:scale-95 data-[starting-style]:opacity-0",
+    "data-[ending-style]:scale-95 data-[ending-style]:opacity-0",
+    "top-[calc(50%+1.25rem*var(--nested-dialogs))] scale-[calc(1-0.1*var(--nested-dialogs))]",
+    "data-[nested-dialog-open]:after:absolute data-[nested-dialog-open]:after:inset-0 data-[nested-dialog-open]:after:rounded-[inherit] data-[nested-dialog-open]:after:bg-black/5"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "w-sm",
+        default: "w-lg",
+        lg: "w-2xl",
+        xl: "w-4xl",
+        full: "h-[calc(100vh-2rem)]"
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+), ae = ({ className: e, size: r, ...t }) => /* @__PURE__ */ a(
+  s.Popup,
+  {
+    className: o(re({ size: r }), e),
+    ...t
+  }
+);
+ae.displayName = "Dialog.Popup";
+const te = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  s.Title,
+  {
+    className: o("text-lg font-semibold leading-none tracking-tight", e),
+    ...r
+  }
+);
+te.displayName = "Dialog.Title";
+const oe = ({ className: e, ...r }) => /* @__PURE__ */ a(s.Description, { className: o("mt-2", e), ...r });
+oe.displayName = "Dialog.Description";
+const ne = i(
+  [
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium",
+    "transition-all",
+    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline: "border border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground"
+      },
+      size: {
+        sm: "h-8 rounded-md px-3 text-xs",
+        default: "h-9 px-4 py-2",
+        lg: "h-10 rounded-md px-6"
+      }
+    },
+    defaultVariants: {
+      variant: "outline",
+      size: "default"
+    }
+  }
+), se = ({ className: e, variant: r, size: t, ...n }) => /* @__PURE__ */ a(
+  s.Close,
+  {
+    className: o(ne({ variant: r, size: t }), e),
+    ...n
+  }
+);
+se.displayName = "Dialog.Close";
+const ie = ({ className: e, ...r }) => /* @__PURE__ */ a("div", { className: o("flex flex-col space-y-1 mb-5", e), ...r });
+ie.displayName = "Dialog.Header";
+const le = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  "div",
+  {
+    className: o(
+      "mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+      e
+    ),
+    ...r
+  }
+);
+le.displayName = "Dialog.Footer";
+const de = (e) => /* @__PURE__ */ a(s.Root, { ...e });
+de.displayName = "Drawer.Root";
+const ce = i(
+  [
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium",
+    "transition-all",
+    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline: "border border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground"
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+), ue = ({ className: e, variant: r, size: t, ...n }) => /* @__PURE__ */ a(
+  s.Trigger,
+  {
+    className: o(ce({ variant: r, size: t }), e),
+    ...n
+  }
+);
+ue.displayName = "Drawer.Trigger";
+const ge = (e) => /* @__PURE__ */ a(s.Portal, { ...e });
+ge.displayName = "Drawer.Portal";
+const pe = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  s.Backdrop,
+  {
+    className: o(
+      "fixed inset-0 z-50 bg-black/50 backdrop-blur-sm",
+      "transition-opacity duration-300",
+      "data-starting-style:opacity-0 data-ending-style:opacity-0",
+      e
+    ),
+    ...r
+  }
+);
+pe.displayName = "Drawer.Backdrop";
+const me = i(
+  [
+    "fixed z-50 flex flex-col bg-background p-6 shadow-lg",
+    "outline-none",
+    "transition-transform duration-300 ease-out",
+    "scale-[calc(1-0.1*var(--nested-dialogs))]",
+    "data-[nested-dialog-open]:after:absolute data-[nested-dialog-open]:after:inset-0 data-[nested-dialog-open]:after:rounded-[inherit] data-[nested-dialog-open]:after:bg-black/5"
+  ],
+  {
+    variants: {
+      side: {
+        top: [
+          "inset-x-0 top-0 border-b border-border",
+          "data-starting-style:-translate-y-full",
+          "data-ending-style:-translate-y-full"
+        ],
+        right: [
+          "inset-y-0 right-0 h-full w-sm max-w-full border-l border-border",
+          "data-starting-style:translate-x-full",
+          "data-ending-style:translate-x-full"
+        ],
+        bottom: [
+          "inset-x-0 bottom-0 border-t border-border",
+          "data-starting-style:translate-y-full",
+          "data-ending-style:translate-y-full"
+        ],
+        left: [
+          "inset-y-0 left-0 h-full w-sm max-w-full border-r border-border",
+          "data-starting-style:-translate-x-full",
+          "data-ending-style:-translate-x-full"
+        ]
+      }
+    },
+    defaultVariants: {
+      side: "right"
+    }
+  }
+), fe = ({ className: e, side: r, ...t }) => /* @__PURE__ */ a(
+  s.Popup,
+  {
+    className: o(me({ side: r }), e),
+    ...t
+  }
+);
+fe.displayName = "Drawer.Popup";
+const be = ({ className: e, ...r }) => /* @__PURE__ */ a(
+  s.Title,
+  {
+    className: o("text-lg font-semibold leading-none tracking-tight", e),
+    ...r
+  }
+);
+be.displayName = "Drawer.Title";
+const ve = ({ className: e, ...r }) => /* @__PURE__ */ a(s.Description, { className: o("", e), ...r });
+ve.displayName = "Drawer.Description";
+const ye = i(
+  [
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium",
+    "transition-all",
+    "outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline: "border border-border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground"
+      },
+      size: {
+        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+        lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        icon: "size-9",
+        "icon-sm": "size-8",
+        "icon-lg": "size-10"
+      }
+    },
+    defaultVariants: {
+      variant: "outline",
+      size: "default"
+    }
+  }
+), he = ({ className: e, variant: r, size: t, ...n }) => /* @__PURE__ */ a(
+  s.Close,
+  {
+    className: o(ye({ variant: r, size: t }), e),
+    ...n
+  }
+);
+he.displayName = "Drawer.Close";
+const xe = ({ className: e, ...r }) => /* @__PURE__ */ a("div", { className: o("flex flex-col space-y-1.5", e), ...r });
+xe.displayName = "Drawer.Header";
+const we = ({ className: e, ...r }) => /* @__PURE__ */ a("div", { className: o("py-5", e), ...r });
+we.displayName = "Drawer.Content";
+const Ne = ({ className: e, ...r }) => /* @__PURE__ */ a("div", { className: o("", e), ...r });
+Ne.displayName = "Drawer.Footer";
+export {
+  L as Button,
+  ee as DialogBackdrop,
+  se as DialogClose,
+  oe as DialogDescription,
+  le as DialogFooter,
+  ie as DialogHeader,
+  ae as DialogPopup,
+  Y as DialogPortal,
+  J as DialogRoot,
+  te as DialogTitle,
+  X as DialogTrigger,
+  pe as DrawerBackdrop,
+  he as DrawerClose,
+  we as DrawerContent,
+  ve as DrawerDescription,
+  Ne as DrawerFooter,
+  xe as DrawerHeader,
+  fe as DrawerPopup,
+  ge as DrawerPortal,
+  de as DrawerRoot,
+  be as DrawerTitle,
+  ue as DrawerTrigger,
+  F as ScrollAreaContent,
+  M as ScrollAreaCorner,
+  I as ScrollAreaRoot,
+  $ as ScrollAreaScrollbar,
+  H as ScrollAreaThumb,
+  _ as ScrollAreaViewport,
+  q as TabsIndicator,
+  Z as TabsList,
+  G as TabsPanel,
+  U as TabsRoot,
+  K as TabsTab
+};

package/dist/lib/utils.d.ts

@@ -0,0 +1,3 @@
+import { ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;
+//# sourceMappingURL=utils.d.ts.map

package/dist/lib/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAG5C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}

package/dist/styles/default.css

@@ -0,0 +1,73 @@
+@theme inline {
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --radius-2xl: calc(var(--radius) + 8px);
+  --radius-3xl: calc(var(--radius) + 12px);
+  --radius-4xl: calc(var(--radius) + 16px);
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-border: var(--border);
+  --color-ring: var(--ring);
+}
+
+:root {
+  --radius: 0.5rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --primary: oklch(0.205 0 0);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --ring: oklch(0.556 0 0);
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not(.light) {
+    --background: oklch(0.145 0 0);
+    --foreground: oklch(0.985 0 0);
+    --primary: oklch(0.922 0 0);
+    --primary-foreground: oklch(0.205 0 0);
+    --secondary: oklch(0.269 0 0);
+    --secondary-foreground: oklch(0.985 0 0);
+    --muted: oklch(0.269 0 0);
+    --muted-foreground: oklch(0.708 0 0);
+    --accent: oklch(0.269 0 0);
+    --accent-foreground: oklch(0.985 0 0);
+    --destructive: oklch(0.704 0.191 22.216);
+    --border: oklch(1 0 0 / 10%);
+    --ring: oklch(0.556 0 0);
+  }
+}

package/package.json

@@ -0,0 +1,71 @@
+{
+  "name": "@lglab/compose-ui",
+  "version": "0.0.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "description": "compose-ui library",
+  "author": "LGLab",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/LGLabGreg/compose-ui.git",
+    "directory": "packages/compose-ui"
+  },
+  "homepage": "https://compose-ui.dev",
+  "keywords": [
+    "compose-ui",
+    "react",
+    "base-ui",
+    "tailwind",
+    "library",
+    "typescript",
+    "open-source",
+    "accessible"
+  ],
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "main": "./dist/index.es.js",
+  "module": "./dist/index.es.js",
+  "exports": {
+    ".": {
+      "import": "./dist/index.es.js",
+      "types": "./dist/index.d.ts"
+    },
+    "./styles/*": "./dist/styles/*"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "*.css"
+  ],
+  "peerDependencies": {
+    "@base-ui/react": "^1.0.0",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "react": "^19",
+    "react-dom": "^19.0.0",
+    "tailwind-merge": "^3.4.0",
+    "tailwindcss": "^4.0.0",
+    "lucide-react": "^0.562.0"
+  },
+  "devDependencies": {
+    "@types/node": "^25.0.3",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.2",
+    "globals": "^17.0.0",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "rollup-preserve-directives": "^1.1.3",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.51.0",
+    "vite": "^7.3.0",
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-static-copy": "^3.1.4"
+  },
+  "scripts": {
+    "build": "tsc -b && vite build"
+  }
+}