@masaraxui/react 1.0.0

package/dist/components/pagination/pagination.d.ts

@@ -0,0 +1,84 @@
+import type { PaginationVariants } from "@masaraxui/styles";
+import type { ComponentPropsWithRef } from "react";
+import React from "react";
+import { Button as ButtonPrimitive } from "react-aria-components";
+interface PaginationRootProps extends ComponentPropsWithRef<"nav">, PaginationVariants {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const PaginationRoot: {
+    ({ children, className, size, ...props }: PaginationRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationSummaryProps extends ComponentPropsWithRef<"div"> {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const PaginationSummary: {
+    ({ children, className, ...props }: PaginationSummaryProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationContentProps extends ComponentPropsWithRef<"ul"> {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const PaginationContent: {
+    ({ children, className, ...props }: PaginationContentProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationItemProps extends ComponentPropsWithRef<"li"> {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const PaginationItem: {
+    ({ children, className, ...props }: PaginationItemProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationLinkProps extends ComponentPropsWithRef<typeof ButtonPrimitive> {
+    className?: string;
+    children: React.ReactNode;
+    isActive?: boolean;
+}
+declare const PaginationLink: {
+    ({ children, className, isActive, ...props }: PaginationLinkProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationPreviousProps extends ComponentPropsWithRef<typeof ButtonPrimitive> {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const PaginationPrevious: {
+    ({ children, className, ...props }: PaginationPreviousProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationPreviousIconProps extends Omit<ComponentPropsWithRef<"span">, "children"> {
+    children?: React.ReactNode;
+}
+declare const PaginationPreviousIcon: {
+    ({ children, className, ...props }: PaginationPreviousIconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationNextProps extends ComponentPropsWithRef<typeof ButtonPrimitive> {
+    className?: string;
+    children: React.ReactNode;
+}
+declare const PaginationNext: {
+    ({ children, className, ...props }: PaginationNextProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationNextIconProps extends Omit<ComponentPropsWithRef<"span">, "children"> {
+    children?: React.ReactNode;
+}
+declare const PaginationNextIcon: {
+    ({ children, className, ...props }: PaginationNextIconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface PaginationEllipsisProps extends ComponentPropsWithRef<"span"> {
+    className?: string;
+}
+declare const PaginationEllipsis: {
+    ({ className, ...props }: PaginationEllipsisProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { PaginationRoot, PaginationSummary, PaginationContent, PaginationItem, PaginationLink, PaginationPrevious, PaginationPreviousIcon, PaginationNext, PaginationNextIcon, PaginationEllipsis, };
+export type { PaginationRootProps, PaginationSummaryProps, PaginationContentProps, PaginationItemProps, PaginationLinkProps, PaginationPreviousProps, PaginationPreviousIconProps, PaginationNextProps, PaginationNextIconProps, PaginationEllipsisProps, };

package/dist/components/pagination/pagination.js

@@ -0,0 +1,230 @@
+"use client";
+import { paginationVariants } from '@masaraxui/styles';
+import React__default, { createContext, useContext } from 'react';
+import { Button } from 'react-aria-components';
+import { composeSlotClassName, composeTwRenderProps } from '../../utils/compose.js';
+import { IconChevronLeft, IconChevronRight } from '../icons.js';
+import { jsx } from 'react/jsx-runtime';
+
+const PaginationContext = /*#__PURE__*/createContext({});
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Root
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationRoot = ({
+  children,
+  className,
+  size,
+  ...props
+}) => {
+  const slots = React__default.useMemo(() => paginationVariants({
+    size
+  }), [size]);
+  return /*#__PURE__*/jsx(PaginationContext, {
+    value: {
+      slots
+    },
+    children: /*#__PURE__*/jsx("nav", {
+      "aria-label": "pagination",
+      "data-slot": "pagination",
+      role: "navigation",
+      ...props,
+      className: composeSlotClassName(slots.base, className),
+      children: children
+    })
+  });
+};
+PaginationRoot.displayName = "MasaraxUI.Pagination";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Summary
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationSummary = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  return /*#__PURE__*/jsx("div", {
+    className: composeSlotClassName(slots?.summary, className),
+    "data-slot": "pagination-summary",
+    ...props,
+    children: children
+  });
+};
+PaginationSummary.displayName = "MasaraxUI.Pagination.Summary";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Content
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationContent = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  return /*#__PURE__*/jsx("ul", {
+    className: composeSlotClassName(slots?.content, className),
+    "data-slot": "pagination-content",
+    ...props,
+    children: children
+  });
+};
+PaginationContent.displayName = "MasaraxUI.Pagination.Content";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Item
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationItem = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  return /*#__PURE__*/jsx("li", {
+    className: composeSlotClassName(slots?.item, className),
+    "data-slot": "pagination-item",
+    ...props,
+    children: children
+  });
+};
+PaginationItem.displayName = "MasaraxUI.Pagination.Item";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Link
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationLink = ({
+  children,
+  className,
+  isActive,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  return /*#__PURE__*/jsx(Button, {
+    "aria-current": isActive ? "page" : undefined,
+    className: composeTwRenderProps(className, slots?.link()),
+    "data-active": isActive ? "true" : undefined,
+    "data-slot": "pagination-link",
+    ...props,
+    children: children
+  });
+};
+PaginationLink.displayName = "MasaraxUI.Pagination.Link";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Previous
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationPrevious = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  const baseClass = `${slots?.link() ?? ""} pagination__link--nav`.trim();
+  return /*#__PURE__*/jsx(Button, {
+    className: composeTwRenderProps(className, baseClass),
+    "data-slot": "pagination-previous",
+    ...props,
+    children: children
+  });
+};
+PaginationPrevious.displayName = "MasaraxUI.Pagination.Previous";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Previous Icon
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationPreviousIcon = ({
+  children,
+  className,
+  ...props
+}) => {
+  return /*#__PURE__*/jsx("span", {
+    "aria-hidden": "true",
+    className: className,
+    "data-slot": "pagination-previous-icon",
+    ...props,
+    children: children ?? /*#__PURE__*/jsx(IconChevronLeft, {})
+  });
+};
+PaginationPreviousIcon.displayName = "MasaraxUI.Pagination.PreviousIcon";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Next
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationNext = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  const baseClass = `${slots?.link() ?? ""} pagination__link--nav`.trim();
+  return /*#__PURE__*/jsx(Button, {
+    className: composeTwRenderProps(className, baseClass),
+    "data-slot": "pagination-next",
+    ...props,
+    children: children
+  });
+};
+PaginationNext.displayName = "MasaraxUI.Pagination.Next";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Next Icon
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationNextIcon = ({
+  children,
+  className,
+  ...props
+}) => {
+  return /*#__PURE__*/jsx("span", {
+    "aria-hidden": "true",
+    className: className,
+    "data-slot": "pagination-next-icon",
+    ...props,
+    children: children ?? /*#__PURE__*/jsx(IconChevronRight, {})
+  });
+};
+PaginationNextIcon.displayName = "MasaraxUI.Pagination.NextIcon";
+
+/* -------------------------------------------------------------------------------------------------
+ * Pagination Ellipsis
+ * -----------------------------------------------------------------------------------------------*/
+
+const PaginationEllipsis = ({
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PaginationContext);
+  return /*#__PURE__*/jsx("span", {
+    "aria-hidden": "true",
+    className: composeSlotClassName(slots?.ellipsis, className),
+    "data-slot": "pagination-ellipsis",
+    ...props,
+    children: "\u2026"
+  });
+};
+PaginationEllipsis.displayName = "MasaraxUI.Pagination.Ellipsis";
+
+export { PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationNextIcon, PaginationPrevious, PaginationPreviousIcon, PaginationRoot, PaginationSummary };

package/dist/components/popover/index.d.ts

@@ -0,0 +1,23 @@
+import type { ComponentProps } from "react";
+import { PopoverArrow, PopoverContent, PopoverDialog, PopoverHeading, PopoverRoot, PopoverTrigger } from "./popover";
+export declare const Popover: (({ children, ...props }: import("react").ComponentPropsWithRef<typeof import("react-aria-components").DialogTrigger>) => import("react/jsx-runtime").JSX.Element) & {
+    Root: ({ children, ...props }: import("react").ComponentPropsWithRef<typeof import("react-aria-components").DialogTrigger>) => import("react/jsx-runtime").JSX.Element;
+    Trigger: ({ children, className, ...props }: import("./popover").PopoverTriggerProps) => import("react/jsx-runtime").JSX.Element;
+    Dialog: ({ children, className, ...props }: import("./popover").PopoverDialogProps) => import("react/jsx-runtime").JSX.Element;
+    Arrow: ({ children, className, ...props }: import("./popover").PopoverArrowProps) => import("react/jsx-runtime").JSX.Element;
+    Content: ({ children, className, ...props }: import("./popover").PopoverContentProps) => import("react/jsx-runtime").JSX.Element;
+    Heading: ({ children, className, ...props }: import("./popover").PopoverHeadingProps) => import("react/jsx-runtime").JSX.Element;
+};
+export type Popover = {
+    Props: ComponentProps<typeof PopoverRoot>;
+    RootProps: ComponentProps<typeof PopoverRoot>;
+    TriggerProps: ComponentProps<typeof PopoverTrigger>;
+    DialogProps: ComponentProps<typeof PopoverDialog>;
+    ArrowProps: ComponentProps<typeof PopoverArrow>;
+    ContentProps: ComponentProps<typeof PopoverContent>;
+    HeadingProps: ComponentProps<typeof PopoverHeading>;
+};
+export { PopoverArrow, PopoverContent, PopoverDialog, PopoverHeading, PopoverRoot, PopoverTrigger };
+export type { PopoverRootProps, PopoverRootProps as PopoverProps, PopoverTriggerProps, PopoverDialogProps, PopoverArrowProps, PopoverContentProps, PopoverHeadingProps, } from "./popover";
+export { popoverVariants } from "@masaraxui/styles";
+export type { PopoverVariants } from "@masaraxui/styles";

package/dist/components/popover/index.js

@@ -0,0 +1,17 @@
+"use strict";
+import { PopoverRoot, PopoverHeading, PopoverContent, PopoverArrow, PopoverDialog, PopoverTrigger } from './popover.js';
+export { popoverVariants } from '@masaraxui/styles';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const Popover = Object.assign(PopoverRoot, {
+  Root: PopoverRoot,
+  Trigger: PopoverTrigger,
+  Dialog: PopoverDialog,
+  Arrow: PopoverArrow,
+  Content: PopoverContent,
+  Heading: PopoverHeading
+});
+
+export { Popover, PopoverArrow, PopoverContent, PopoverDialog, PopoverHeading, PopoverRoot, PopoverTrigger };

package/dist/components/popover/popover.d.ts

@@ -0,0 +1,24 @@
+import type { PopoverVariants } from "@masaraxui/styles";
+import type { ComponentPropsWithRef } from "react";
+import React from "react";
+import { Dialog as DialogPrimitive, Heading as HeadingPrimitive, OverlayArrow, Popover as PopoverPrimitive, DialogTrigger as PopoverTriggerPrimitive } from "react-aria-components";
+type PopoverRootProps = ComponentPropsWithRef<typeof PopoverTriggerPrimitive>;
+declare const PopoverRoot: ({ children, ...props }: ComponentPropsWithRef<typeof PopoverTriggerPrimitive>) => import("react/jsx-runtime").JSX.Element;
+interface PopoverContentProps extends Omit<ComponentPropsWithRef<typeof PopoverPrimitive>, "children">, PopoverVariants {
+    children: React.ReactNode;
+}
+declare const PopoverContent: ({ children, className, ...props }: PopoverContentProps) => import("react/jsx-runtime").JSX.Element;
+type PopoverArrowProps = Omit<ComponentPropsWithRef<typeof OverlayArrow>, "children"> & {
+    children?: React.ReactNode;
+};
+declare const PopoverArrow: ({ children, className, ...props }: PopoverArrowProps) => import("react/jsx-runtime").JSX.Element;
+type PopoverDialogProps = Omit<ComponentPropsWithRef<typeof DialogPrimitive>, "children"> & {
+    children: React.ReactNode;
+};
+declare const PopoverDialog: ({ children, className, ...props }: PopoverDialogProps) => import("react/jsx-runtime").JSX.Element;
+type PopoverTriggerProps = ComponentPropsWithRef<"div">;
+declare const PopoverTrigger: ({ children, className, ...props }: PopoverTriggerProps) => import("react/jsx-runtime").JSX.Element;
+type PopoverHeadingProps = ComponentPropsWithRef<typeof HeadingPrimitive> & {};
+declare const PopoverHeading: ({ children, className, ...props }: PopoverHeadingProps) => import("react/jsx-runtime").JSX.Element;
+export { PopoverRoot, PopoverTrigger, PopoverDialog, PopoverArrow, PopoverContent, PopoverHeading };
+export type { PopoverRootProps, PopoverTriggerProps, PopoverDialogProps, PopoverArrowProps, PopoverContentProps, PopoverHeadingProps, };

package/dist/components/popover/popover.js

@@ -0,0 +1,153 @@
+"use client";
+import { popoverVariants } from '@masaraxui/styles';
+import React__default, { createContext, useContext } from 'react';
+import { DialogTrigger, Heading, Popover, OverlayArrow, Dialog, Pressable } from 'react-aria-components';
+import { composeSlotClassName, composeTwRenderProps } from '../../utils/compose.js';
+import { jsx } from 'react/jsx-runtime';
+import { SurfaceContext } from '../surface/surface.js';
+
+const PopoverContext = /*#__PURE__*/createContext({});
+
+/* -------------------------------------------------------------------------------------------------
+ * Popover Root
+ * -----------------------------------------------------------------------------------------------*/
+
+const PopoverRoot = ({
+  children,
+  ...props
+}) => {
+  const slots = React__default.useMemo(() => popoverVariants(), []);
+  return /*#__PURE__*/jsx(PopoverContext, {
+    value: {
+      slots
+    },
+    children: /*#__PURE__*/jsx(DialogTrigger, {
+      "data-slot": "popover-root",
+      ...props,
+      children: children
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Popover Content
+ * -----------------------------------------------------------------------------------------------*/
+
+const PopoverContent = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PopoverContext);
+  return /*#__PURE__*/jsx(PopoverContext, {
+    value: {
+      slots
+    },
+    children: /*#__PURE__*/jsx(SurfaceContext, {
+      value: {
+        variant: "default"
+      },
+      children: /*#__PURE__*/jsx(Popover, {
+        ...props,
+        className: composeTwRenderProps(className, slots?.base()),
+        children: children
+      })
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Popover Arrow
+ * -----------------------------------------------------------------------------------------------*/
+
+const PopoverArrow = ({
+  children,
+  className,
+  ...props
+}) => {
+  const defaultArrow = /*#__PURE__*/jsx("svg", {
+    "data-slot": "popover-overlay-arrow",
+    height: 12,
+    viewBox: "0 0 12 12",
+    width: 12,
+    children: /*#__PURE__*/jsx("path", {
+      d: "M0 0 Q6 9 12 0"
+    })
+  });
+  const arrow = /*#__PURE__*/React__default.isValidElement(children) ? /*#__PURE__*/React__default.cloneElement(children, {
+    "data-slot": "popover-overlay-arrow"
+  }) : defaultArrow;
+  return /*#__PURE__*/jsx(OverlayArrow, {
+    "data-slot": "popover-overlay-arrow-group",
+    ...props,
+    className: className,
+    children: arrow
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Popover Dialog
+ * -----------------------------------------------------------------------------------------------*/
+
+const PopoverDialog = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PopoverContext);
+  return /*#__PURE__*/jsx(Dialog, {
+    "data-slot": "popover-dialog",
+    ...props,
+    className: composeSlotClassName(slots?.dialog, className),
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Popover Trigger
+ * -----------------------------------------------------------------------------------------------*/
+
+const PopoverTrigger = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PopoverContext);
+  return /*#__PURE__*/jsx(Pressable, {
+    children: /*#__PURE__*/jsx("div", {
+      className: composeSlotClassName(slots?.trigger, className),
+      "data-slot": "popover-trigger",
+      role: "button",
+      ...props,
+      children: children
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * Popover Heading
+ * -----------------------------------------------------------------------------------------------*/
+
+const PopoverHeading = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PopoverContext);
+  return /*#__PURE__*/jsx(Heading, {
+    slot: "title",
+    ...props,
+    className: composeSlotClassName(slots?.heading, className),
+    children: children
+  });
+};
+
+export { PopoverArrow, PopoverContent, PopoverDialog, PopoverHeading, PopoverRoot, PopoverTrigger };

package/dist/components/progress-bar/index.d.ts

@@ -0,0 +1,34 @@
+import type { ComponentProps } from "react";
+import { ProgressBarFill, ProgressBarOutput, ProgressBarRoot, ProgressBarTrack } from "./progress-bar";
+export declare const ProgressBar: {
+    ({ children, className, color, size, ...props }: import("./progress-bar").ProgressBarRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+} & {
+    Root: {
+        ({ children, className, color, size, ...props }: import("./progress-bar").ProgressBarRootProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Output: {
+        ({ children, className, ...props }: import("./progress-bar").ProgressBarOutputProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Track: {
+        ({ children, className, ...props }: import("./progress-bar").ProgressBarTrackProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+    Fill: {
+        ({ className, style, ...props }: import("./progress-bar").ProgressBarFillProps): import("react/jsx-runtime").JSX.Element;
+        displayName: string;
+    };
+};
+export type ProgressBar = {
+    Props: ComponentProps<typeof ProgressBarRoot>;
+    RootProps: ComponentProps<typeof ProgressBarRoot>;
+    OutputProps: ComponentProps<typeof ProgressBarOutput>;
+    TrackProps: ComponentProps<typeof ProgressBarTrack>;
+    FillProps: ComponentProps<typeof ProgressBarFill>;
+};
+export { ProgressBarRoot, ProgressBarOutput, ProgressBarTrack, ProgressBarFill };
+export type { ProgressBarRootProps, ProgressBarRootProps as ProgressBarProps, ProgressBarOutputProps, ProgressBarTrackProps, ProgressBarFillProps, } from "./progress-bar";
+export { progressBarVariants } from "@masaraxui/styles";
+export type { ProgressBarVariants } from "@masaraxui/styles";

package/dist/components/progress-bar/index.js

@@ -0,0 +1,15 @@
+"use strict";
+import { ProgressBarRoot, ProgressBarFill, ProgressBarTrack, ProgressBarOutput } from './progress-bar.js';
+export { progressBarVariants } from '@masaraxui/styles';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const ProgressBar = Object.assign(ProgressBarRoot, {
+  Root: ProgressBarRoot,
+  Output: ProgressBarOutput,
+  Track: ProgressBarTrack,
+  Fill: ProgressBarFill
+});
+
+export { ProgressBar, ProgressBarFill, ProgressBarOutput, ProgressBarRoot, ProgressBarTrack };

package/dist/components/progress-bar/progress-bar.d.ts

@@ -0,0 +1,29 @@
+import type { ProgressBarVariants } from "@masaraxui/styles";
+import type { ComponentPropsWithRef } from "react";
+import { ProgressBar as ProgressBarPrimitive } from "react-aria-components";
+interface ProgressBarRootProps extends ComponentPropsWithRef<typeof ProgressBarPrimitive>, ProgressBarVariants {
+}
+declare const ProgressBarRoot: {
+    ({ children, className, color, size, ...props }: ProgressBarRootProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface ProgressBarOutputProps extends ComponentPropsWithRef<"span"> {
+}
+declare const ProgressBarOutput: {
+    ({ children, className, ...props }: ProgressBarOutputProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface ProgressBarTrackProps extends ComponentPropsWithRef<"div"> {
+}
+declare const ProgressBarTrack: {
+    ({ children, className, ...props }: ProgressBarTrackProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+interface ProgressBarFillProps extends ComponentPropsWithRef<"div"> {
+}
+declare const ProgressBarFill: {
+    ({ className, style, ...props }: ProgressBarFillProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { ProgressBarRoot, ProgressBarOutput, ProgressBarTrack, ProgressBarFill };
+export type { ProgressBarRootProps, ProgressBarOutputProps, ProgressBarTrackProps, ProgressBarFillProps, };