moduix 0.11.0 → 0.11.2

package/dist/components/Popover/Popover.js

@@ -0,0 +1,131 @@
+import { PopupArrowIcon } from "../../icons/ui/Icons.js";
+import { mergeClassName } from "../../utils/mergeClassName.js";
+import Popover_module_default from "./Popover.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { Popover } from "@base-ui/react/popover";
+//#region src/components/Popover/Popover.tsx
+const POPOVER_CONTENT_SIDE_OFFSET = 8;
+const Popover$1 = Popover.Root;
+const createPopoverHandle = Popover.createHandle;
+function PopoverTrigger({ className, render, ...props }) {
+	const triggerClassName = render ? className : mergeClassName(className, Popover_module_default.trigger);
+	return /* @__PURE__ */ jsx(Popover.Trigger, {
+		"data-slot": "popover-trigger",
+		render,
+		className: triggerClassName,
+		...props
+	});
+}
+function PopoverPortal({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Portal, {
+		"data-slot": "popover-portal",
+		className,
+		...props
+	});
+}
+function PopoverBackdrop({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Backdrop, {
+		"data-slot": "popover-backdrop",
+		className: mergeClassName(className, Popover_module_default.backdrop),
+		...props
+	});
+}
+function PopoverPositioner({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Positioner, {
+		"data-slot": "popover-positioner",
+		className: mergeClassName(className, Popover_module_default.positioner),
+		...props
+	});
+}
+function PopoverPopup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Popup, {
+		"data-slot": "popover-popup",
+		className: mergeClassName(className, Popover_module_default.popup),
+		...props
+	});
+}
+function PopoverViewport({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Viewport, {
+		"data-slot": "popover-viewport",
+		className: mergeClassName(className, Popover_module_default.viewport),
+		...props
+	});
+}
+function PopoverArrow({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Arrow, {
+		"data-slot": "popover-arrow",
+		className: mergeClassName(className, Popover_module_default.arrow),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ArrowSvg, { className: Popover_module_default.arrowSvg })
+	});
+}
+function PopoverTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Title, {
+		"data-slot": "popover-title",
+		className: mergeClassName(className, Popover_module_default.title),
+		...props
+	});
+}
+function PopoverDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Description, {
+		"data-slot": "popover-description",
+		className: mergeClassName(className, Popover_module_default.description),
+		...props
+	});
+}
+function PopoverHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "popover-header",
+		className: clsx(Popover_module_default.header, className),
+		...props
+	});
+}
+function PopoverBody({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "popover-body",
+		className: clsx(Popover_module_default.body, className),
+		...props
+	});
+}
+function PopoverFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "popover-footer",
+		className: clsx(Popover_module_default.footer, className),
+		...props
+	});
+}
+function PopoverClose({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Popover.Close, {
+		"data-slot": "popover-close",
+		className: mergeClassName(className, Popover_module_default.close),
+		...props
+	});
+}
+function PopoverContent({ className, children, showArrow = false, side, sideOffset = POPOVER_CONTENT_SIDE_OFFSET, align, alignOffset, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, ...popupProps }) {
+	return /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsx(PopoverPositioner, {
+		side,
+		sideOffset,
+		align,
+		alignOffset,
+		arrowPadding,
+		collisionAvoidance,
+		collisionBoundary,
+		collisionPadding,
+		children: /* @__PURE__ */ jsxs(PopoverPopup, {
+			className,
+			...popupProps,
+			children: [showArrow ? /* @__PURE__ */ jsx(PopoverArrow, {}) : null, children]
+		})
+	}) });
+}
+function ArrowSvg(props) {
+	return /* @__PURE__ */ jsx(PopupArrowIcon, {
+		fillClassName: Popover_module_default.arrowFill,
+		outerStrokeClassName: Popover_module_default.arrowOuterStroke,
+		innerStrokeClassName: Popover_module_default.arrowInnerStroke,
+		...props
+	});
+}
+//#endregion
+export { Popover$1 as Popover, PopoverArrow, PopoverBackdrop, PopoverBody, PopoverClose, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverTitle, PopoverTrigger, PopoverViewport, createPopoverHandle };

package/dist/components/Popover/Popover.module.js

@@ -0,0 +1,22 @@
+import './Popover.css';
+//#region src/components/Popover/Popover.module.css
+var Popover_module_default = {
+	"arrow": "_7iI68a_arrow",
+	"arrowFill": "_7iI68a_arrowFill",
+	"arrowInnerStroke": "_7iI68a_arrowInnerStroke",
+	"arrowOuterStroke": "_7iI68a_arrowOuterStroke",
+	"arrowSvg": "_7iI68a_arrowSvg",
+	"backdrop": "_7iI68a_backdrop",
+	"body": "_7iI68a_body",
+	"close": "_7iI68a_close",
+	"description": "_7iI68a_description",
+	"footer": "_7iI68a_footer",
+	"header": "_7iI68a_header",
+	"popup": "_7iI68a_popup",
+	"positioner": "_7iI68a_positioner",
+	"title": "_7iI68a_title",
+	"trigger": "_7iI68a_trigger",
+	"viewport": "_7iI68a_viewport"
+};
+//#endregion
+export { Popover_module_default as default };

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

@@ -1 +1 @@
-export { Popover, createPopoverHandle, PopoverTrigger, PopoverPortal, PopoverBackdrop, PopoverPositioner, PopoverPopup, PopoverViewport, PopoverArrow, PopoverTitle, PopoverDescription, PopoverHeader, PopoverBody, PopoverFooter, PopoverClose, PopoverContent, } from './Popover';
+import { Popover, PopoverArrow, PopoverBackdrop, PopoverBody, PopoverClose, PopoverContent, PopoverDescription, PopoverFooter, PopoverHeader, PopoverPopup, PopoverPortal, PopoverPositioner, PopoverTitle, PopoverTrigger, PopoverViewport, createPopoverHandle } from "./Popover.js";

package/dist/components/PreviewCard/PreviewCard.css

@@ -0,0 +1,136 @@
+@layer ui.components {
+  .ygM3WW_trigger {
+    color: var(--preview-card-trigger-color, var(--color-primary));
+    text-decoration-line: underline;
+    text-decoration-thickness: var(--preview-card-trigger-decoration-thickness, 1px);
+    text-decoration-color: var(--preview-card-trigger-decoration-color, color-mix(in oklab, var(--preview-card-trigger-color, var(--color-primary)), transparent 40%));
+    text-underline-offset: var(--preview-card-trigger-underline-offset, 2px);
+    transition: color var(--preview-card-transition, var(--transition-default)),
+      text-decoration-color var(--preview-card-transition, var(--transition-default));
+    outline: 0;
+
+    @media (hover: hover) {
+      &:hover {
+        text-decoration-color: var(--preview-card-trigger-decoration-color-hover, var(--preview-card-trigger-color, var(--color-primary)));
+      }
+    }
+
+    &[data-popup-open] {
+      text-decoration-color: var(--preview-card-trigger-decoration-color-open, var(--preview-card-trigger-color, var(--color-primary)));
+    }
+
+    &:focus-visible {
+      border-radius: var(--preview-card-trigger-focus-radius, var(--radius-xs));
+      outline: var(--preview-card-focus-ring-width, var(--border-width-sm)) solid
+        var(--preview-card-focus-ring-color, var(--color-ring));
+      outline-offset: var(--preview-card-trigger-focus-offset, 1px);
+      text-decoration-line: none;
+    }
+
+    &[data-disabled], &[disabled] {
+      pointer-events: none;
+      opacity: var(--preview-card-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .ygM3WW_backdrop {
+    z-index: var(--z-backdrop);
+    pointer-events: none;
+    background-color: var(--preview-card-backdrop-bg, var(--backdrop-bg, var(--color-overlay)));
+    min-height: 100dvh;
+    backdrop-filter: var(--backdrop-filter, blur(var(--preview-card-backdrop-blur, 4px)));
+    transition: opacity var(--preview-card-backdrop-transition, var(--transition-default)),
+      backdrop-filter var(--preview-card-backdrop-transition, var(--transition-default));
+    position: fixed;
+    inset: 0;
+
+    &[data-starting-style], &[data-ending-style] {
+      opacity: 0;
+      backdrop-filter: none;
+    }
+  }
+
+  .ygM3WW_positioner {
+    z-index: var(--z-popup);
+    width: var(--positioner-width);
+    height: var(--positioner-height);
+    max-width: var(--available-width);
+    outline: 0;
+  }
+
+  .ygM3WW_popup {
+    box-sizing: border-box;
+    width: var(--popup-width, var(--preview-card-width, auto));
+    height: var(--popup-height, var(--preview-card-height, auto));
+    min-width: min(var(--preview-card-min-width, 14rem), var(--available-width));
+    max-width: min(var(--preview-card-max-width, 24rem), var(--available-width));
+    max-height: min(var(--preview-card-max-height, 24rem), var(--available-height, 100dvh));
+    padding: var(--preview-card-padding-y, var(--spacing-2))
+      var(--preview-card-padding-x, var(--spacing-2));
+    border-radius: var(--preview-card-radius, var(--radius-lg));
+    background-color: var(--preview-card-bg, var(--color-popover));
+    color: var(--preview-card-color, var(--color-popover-foreground));
+    outline: var(--preview-card-border-width, var(--border-width-sm)) solid
+      var(--preview-card-border-color, var(--color-border));
+    box-shadow: var(--preview-card-shadow, var(--shadow-lg));
+    transform-origin: var(--transform-origin);
+    transition: transform var(--preview-card-transition, var(--transition-default)),
+      opacity var(--preview-card-transition, var(--transition-default));
+    overflow: visible;
+
+    &[data-starting-style], &[data-ending-style] {
+      opacity: 0;
+      transform: scale(var(--preview-card-scale, var(--scale-popup)));
+    }
+  }
+
+  .ygM3WW_arrow {
+    color: var(--preview-card-bg, var(--color-popover));
+    display: flex;
+
+    &[data-side="top"] {
+      bottom: calc(var(--preview-card-arrow-size, 8px) * -1);
+      rotate: 180deg;
+    }
+
+    &[data-side="bottom"] {
+      top: calc(var(--preview-card-arrow-size, 8px) * -1);
+    }
+
+    &[data-side="left"] {
+      right: calc(var(--preview-card-arrow-inline-offset, 13px) * -1);
+      rotate: 90deg;
+    }
+
+    &[data-side="right"] {
+      left: calc(var(--preview-card-arrow-inline-offset, 13px) * -1);
+      rotate: -90deg;
+    }
+  }
+
+  .ygM3WW_arrowSvg {
+    width: var(--preview-card-arrow-width, 1.25rem);
+    height: var(--preview-card-arrow-height, .625rem);
+    display: block;
+    overflow: visible;
+  }
+
+  .ygM3WW_arrowFill {
+    fill: currentColor;
+  }
+
+  .ygM3WW_arrowOuterStroke {
+    fill: var(--preview-card-arrow-stroke-color, var(--preview-card-border-color, var(--color-border)));
+  }
+
+  .ygM3WW_arrowInnerStroke {
+    fill: var(--preview-card-bg, var(--color-popover));
+  }
+
+  .ygM3WW_viewport {
+    width: 100%;
+    height: 100%;
+    position: relative;
+    overflow: clip;
+  }
+}

package/dist/components/PreviewCard/PreviewCard.d.ts

@@ -1,16 +1,52 @@
-import { PreviewCard as PreviewCardPrimitive } from '@base-ui/react/preview-card';
-type PreviewCardPositionerProps = Pick<PreviewCardPrimitive.Positioner.Props, 'side' | 'sideOffset' | 'align' | 'alignOffset' | 'arrowPadding' | 'collisionAvoidance' | 'collisionBoundary' | 'collisionPadding'>;
-type PreviewCardContentProps = PreviewCardPrimitive.Popup.Props & PreviewCardPositionerProps & {
-    showArrow?: boolean;
+import { PreviewCard } from "@base-ui/react/preview-card";
+
+//#region src/components/PreviewCard/PreviewCard.d.ts
+type PreviewCardPositionerProps = Pick<PreviewCard.Positioner.Props, 'side' | 'sideOffset' | 'align' | 'alignOffset' | 'arrowPadding' | 'collisionAvoidance' | 'collisionBoundary' | 'collisionPadding'>;
+type PreviewCardContentProps = PreviewCard.Popup.Props & PreviewCardPositionerProps & {
+  showArrow?: boolean;
 };
-declare const PreviewCard: <Payload>(props: PreviewCardPrimitive.Root.Props<Payload>) => import("react").JSX.Element;
-declare const createPreviewCardHandle: typeof PreviewCardPrimitive.createHandle;
-declare function PreviewCardTrigger<Payload = unknown>({ className, render, ...props }: PreviewCardPrimitive.Trigger.Props<Payload>): import("react").JSX.Element;
-declare function PreviewCardPortal(props: PreviewCardPrimitive.Portal.Props): import("react").JSX.Element;
-declare function PreviewCardBackdrop({ className, ...props }: PreviewCardPrimitive.Backdrop.Props): import("react").JSX.Element;
-declare function PreviewCardPositioner({ className, ...props }: PreviewCardPrimitive.Positioner.Props): import("react").JSX.Element;
-declare function PreviewCardPopup({ className, ...props }: PreviewCardPrimitive.Popup.Props): import("react").JSX.Element;
-declare function PreviewCardArrow({ className, children, ...props }: PreviewCardPrimitive.Arrow.Props): import("react").JSX.Element;
-declare function PreviewCardViewport({ className, ...props }: PreviewCardPrimitive.Viewport.Props): import("react").JSX.Element;
-declare function PreviewCardContent({ className, sideOffset, side, align, alignOffset, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, showArrow, children, ...props }: PreviewCardContentProps): import("react").JSX.Element;
-export { PreviewCard, createPreviewCardHandle, PreviewCardTrigger, PreviewCardPortal, PreviewCardBackdrop, PreviewCardPositioner, PreviewCardPopup, PreviewCardArrow, PreviewCardViewport, PreviewCardContent, };
+declare const PreviewCard$1: <Payload>(props: PreviewCard.Root.Props<Payload>) => import("react").JSX.Element;
+declare const createPreviewCardHandle: typeof PreviewCard.createHandle;
+declare function PreviewCardTrigger<Payload = unknown>({
+  className,
+  render,
+  ...props
+}: PreviewCard.Trigger.Props<Payload>): import("react").JSX.Element;
+declare function PreviewCardPortal(props: PreviewCard.Portal.Props): import("react").JSX.Element;
+declare function PreviewCardBackdrop({
+  className,
+  ...props
+}: PreviewCard.Backdrop.Props): import("react").JSX.Element;
+declare function PreviewCardPositioner({
+  className,
+  ...props
+}: PreviewCard.Positioner.Props): import("react").JSX.Element;
+declare function PreviewCardPopup({
+  className,
+  ...props
+}: PreviewCard.Popup.Props): import("react").JSX.Element;
+declare function PreviewCardArrow({
+  className,
+  children,
+  ...props
+}: PreviewCard.Arrow.Props): import("react").JSX.Element;
+declare function PreviewCardViewport({
+  className,
+  ...props
+}: PreviewCard.Viewport.Props): import("react").JSX.Element;
+declare function PreviewCardContent({
+  className,
+  sideOffset,
+  side,
+  align,
+  alignOffset,
+  arrowPadding,
+  collisionAvoidance,
+  collisionBoundary,
+  collisionPadding,
+  showArrow,
+  children,
+  ...props
+}: PreviewCardContentProps): import("react").JSX.Element;
+//#endregion
+export { PreviewCard$1 as PreviewCard, PreviewCardArrow, PreviewCardBackdrop, PreviewCardContent, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardTrigger, PreviewCardViewport, createPreviewCardHandle };

package/dist/components/PreviewCard/PreviewCard.js

@@ -0,0 +1,87 @@
+import { PopupArrowIcon } from "../../icons/ui/Icons.js";
+import { mergeClassName } from "../../utils/mergeClassName.js";
+import PreviewCard_module_default from "./PreviewCard.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { PreviewCard } from "@base-ui/react/preview-card";
+//#region src/components/PreviewCard/PreviewCard.tsx
+const DEFAULT_SIDE_OFFSET = 8;
+const PreviewCard$1 = PreviewCard.Root;
+const createPreviewCardHandle = PreviewCard.createHandle;
+function PreviewCardTrigger({ className, render, ...props }) {
+	const triggerClassName = render ? className : mergeClassName(className, PreviewCard_module_default.trigger);
+	return /* @__PURE__ */ jsx(PreviewCard.Trigger, {
+		"data-slot": "preview-card-trigger",
+		render,
+		className: triggerClassName,
+		...props
+	});
+}
+function PreviewCardPortal(props) {
+	return /* @__PURE__ */ jsx(PreviewCard.Portal, {
+		"data-slot": "preview-card-portal",
+		...props
+	});
+}
+function PreviewCardBackdrop({ className, ...props }) {
+	return /* @__PURE__ */ jsx(PreviewCard.Backdrop, {
+		"data-slot": "preview-card-backdrop",
+		className: mergeClassName(className, PreviewCard_module_default.backdrop),
+		...props
+	});
+}
+function PreviewCardPositioner({ className, ...props }) {
+	return /* @__PURE__ */ jsx(PreviewCard.Positioner, {
+		"data-slot": "preview-card-positioner",
+		className: mergeClassName(className, PreviewCard_module_default.positioner),
+		...props
+	});
+}
+function PreviewCardPopup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(PreviewCard.Popup, {
+		"data-slot": "preview-card-popup",
+		className: mergeClassName(className, PreviewCard_module_default.popup),
+		...props
+	});
+}
+function PreviewCardArrow({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(PreviewCard.Arrow, {
+		"data-slot": "preview-card-arrow",
+		className: mergeClassName(className, PreviewCard_module_default.arrow),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ArrowSvg, { className: PreviewCard_module_default.arrowSvg })
+	});
+}
+function PreviewCardViewport({ className, ...props }) {
+	return /* @__PURE__ */ jsx(PreviewCard.Viewport, {
+		"data-slot": "preview-card-viewport",
+		className: mergeClassName(className, PreviewCard_module_default.viewport),
+		...props
+	});
+}
+function PreviewCardContent({ className, sideOffset = DEFAULT_SIDE_OFFSET, side, align, alignOffset, arrowPadding, collisionAvoidance, collisionBoundary, collisionPadding, showArrow = false, children, ...props }) {
+	return /* @__PURE__ */ jsx(PreviewCardPortal, { children: /* @__PURE__ */ jsx(PreviewCardPositioner, {
+		side,
+		sideOffset,
+		align,
+		alignOffset,
+		arrowPadding,
+		collisionAvoidance,
+		collisionBoundary,
+		collisionPadding,
+		children: /* @__PURE__ */ jsxs(PreviewCardPopup, {
+			className,
+			...props,
+			children: [showArrow ? /* @__PURE__ */ jsx(PreviewCardArrow, {}) : null, /* @__PURE__ */ jsx(PreviewCardViewport, { children })]
+		})
+	}) });
+}
+function ArrowSvg(props) {
+	return /* @__PURE__ */ jsx(PopupArrowIcon, {
+		fillClassName: PreviewCard_module_default.arrowFill,
+		outerStrokeClassName: PreviewCard_module_default.arrowOuterStroke,
+		innerStrokeClassName: PreviewCard_module_default.arrowInnerStroke,
+		...props
+	});
+}
+//#endregion
+export { PreviewCard$1 as PreviewCard, PreviewCardArrow, PreviewCardBackdrop, PreviewCardContent, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardTrigger, PreviewCardViewport, createPreviewCardHandle };

package/dist/components/PreviewCard/PreviewCard.module.js

@@ -0,0 +1,16 @@
+import './PreviewCard.css';
+//#region src/components/PreviewCard/PreviewCard.module.css
+var PreviewCard_module_default = {
+	"arrow": "ygM3WW_arrow",
+	"arrowFill": "ygM3WW_arrowFill",
+	"arrowInnerStroke": "ygM3WW_arrowInnerStroke",
+	"arrowOuterStroke": "ygM3WW_arrowOuterStroke",
+	"arrowSvg": "ygM3WW_arrowSvg",
+	"backdrop": "ygM3WW_backdrop",
+	"popup": "ygM3WW_popup",
+	"positioner": "ygM3WW_positioner",
+	"trigger": "ygM3WW_trigger",
+	"viewport": "ygM3WW_viewport"
+};
+//#endregion
+export { PreviewCard_module_default as default };

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

@@ -1 +1 @@
-export { PreviewCard, createPreviewCardHandle, PreviewCardTrigger, PreviewCardPortal, PreviewCardBackdrop, PreviewCardPositioner, PreviewCardPopup, PreviewCardArrow, PreviewCardViewport, PreviewCardContent, } from './PreviewCard';
+import { PreviewCard, PreviewCardArrow, PreviewCardBackdrop, PreviewCardContent, PreviewCardPopup, PreviewCardPortal, PreviewCardPositioner, PreviewCardTrigger, PreviewCardViewport, createPreviewCardHandle } from "./PreviewCard.js";

package/dist/components/Progress/Progress.css

@@ -0,0 +1,68 @@
+@layer ui.components {
+  .iWwZDW_root {
+    box-sizing: border-box;
+    gap: var(--progress-gap, .5rem);
+    width: var(--progress-width, 12rem);
+    color: var(--progress-color, var(--color-foreground));
+    grid-template-columns: minmax(0, 1fr) auto;
+    display: grid;
+  }
+
+  .iWwZDW_label {
+    font-size: var(--progress-label-font-size, var(--text-sm));
+    font-weight: var(--progress-label-font-weight, var(--weight-regular));
+    line-height: var(--progress-label-line-height, var(--line-height-text-sm));
+    color: var(--progress-label-color, currentColor);
+  }
+
+  .iWwZDW_value {
+    font-size: var(--progress-value-font-size, var(--text-sm));
+    font-weight: var(--progress-value-font-weight, var(--weight-regular));
+    line-height: var(--progress-value-line-height, var(--line-height-text-sm));
+    color: var(--progress-value-color, currentColor);
+    text-align: right;
+    justify-self: end;
+  }
+
+  .iWwZDW_track {
+    width: 100%;
+    height: var(--progress-track-height, .5rem);
+    border-radius: var(--progress-track-radius, var(--radius-full));
+    background-color: var(--progress-track-bg, var(--color-muted));
+    box-shadow: inset 0 0 0 var(--progress-track-border-width, var(--border-width-sm))
+      var(--progress-track-border-color, var(--color-border));
+    grid-column: 1 / -1;
+    display: block;
+    overflow: hidden;
+  }
+
+  .iWwZDW_indicator {
+    border-radius: var(--progress-indicator-radius, inherit);
+    background-color: var(--progress-indicator-bg, var(--color-primary));
+    height: 100%;
+    transition: width var(--progress-indicator-transition, var(--transition-default));
+    display: block;
+
+    &[data-indeterminate] {
+      width: var(--progress-indicator-indeterminate-width, 35%);
+      animation: var(--progress-indicator-indeterminate-animation, progress-indeterminate 1.5s ease-in-out infinite);
+    }
+  }
+
+  @keyframes iWwZDW_progress-indeterminate {
+    from {
+      transform: translateX(-100%);
+    }
+
+    to {
+      transform: translateX(300%);
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .iWwZDW_indicator[data-indeterminate] {
+      animation: none;
+      transform: translateX(0);
+    }
+  }
+}

package/dist/components/Progress/Progress.d.ts

@@ -1,7 +1,9 @@
-declare const Progress: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').ProgressRootProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const ProgressRoot: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').ProgressRootProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const ProgressTrack: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').ProgressTrackProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const ProgressIndicator: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').ProgressIndicatorProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-declare const ProgressLabel: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').ProgressLabelProps, "ref"> & import('react').RefAttributes<HTMLSpanElement>>;
-declare const ProgressValue: import('react').ForwardRefExoticComponent<Omit<import('@base-ui/react').ProgressValueProps, "ref"> & import('react').RefAttributes<HTMLSpanElement>>;
-export { Progress, ProgressRoot, ProgressTrack, ProgressIndicator, ProgressLabel, ProgressValue };
+//#region src/components/Progress/Progress.d.ts
+declare const Progress: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ProgressRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ProgressRoot: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ProgressRootProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ProgressTrack: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ProgressTrackProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ProgressIndicator: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ProgressIndicatorProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const ProgressLabel: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ProgressLabelProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+declare const ProgressValue: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").ProgressValueProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+//#endregion
+export { Progress, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue };

package/dist/components/Progress/Progress.js

@@ -0,0 +1,55 @@
+import { mergeClassName } from "../../utils/mergeClassName.js";
+import Progress_module_default from "./Progress.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { Progress } from "@base-ui/react/progress";
+//#region src/components/Progress/Progress.tsx
+const Progress$1 = forwardRef(function Progress({ children, ...props }, ref) {
+	return /* @__PURE__ */ jsxs(ProgressRoot, {
+		ref,
+		...props,
+		children: [children, /* @__PURE__ */ jsx(ProgressTrack, { children: /* @__PURE__ */ jsx(ProgressIndicator, {}) })]
+	});
+});
+const ProgressRoot = forwardRef(function ProgressRoot({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Progress.Root, {
+		ref,
+		"data-slot": "progress-root",
+		className: mergeClassName(className, Progress_module_default.root),
+		...props
+	});
+});
+const ProgressTrack = forwardRef(function ProgressTrack({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Progress.Track, {
+		ref,
+		"data-slot": "progress-track",
+		className: mergeClassName(className, Progress_module_default.track),
+		...props
+	});
+});
+const ProgressIndicator = forwardRef(function ProgressIndicator({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Progress.Indicator, {
+		ref,
+		"data-slot": "progress-indicator",
+		className: mergeClassName(className, Progress_module_default.indicator),
+		...props
+	});
+});
+const ProgressLabel = forwardRef(function ProgressLabel({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Progress.Label, {
+		ref,
+		"data-slot": "progress-label",
+		className: mergeClassName(className, Progress_module_default.label),
+		...props
+	});
+});
+const ProgressValue = forwardRef(function ProgressValue({ className, ...props }, ref) {
+	return /* @__PURE__ */ jsx(Progress.Value, {
+		ref,
+		"data-slot": "progress-value",
+		className: mergeClassName(className, Progress_module_default.value),
+		...props
+	});
+});
+//#endregion
+export { Progress$1 as Progress, ProgressIndicator, ProgressLabel, ProgressRoot, ProgressTrack, ProgressValue };

package/dist/components/Progress/Progress.module.js

@@ -0,0 +1,12 @@
+import './Progress.css';
+//#region src/components/Progress/Progress.module.css
+var Progress_module_default = {
+	"indicator": "iWwZDW_indicator",
+	"label": "iWwZDW_label",
+	"progress-indeterminate": "iWwZDW_progress-indeterminate",
+	"root": "iWwZDW_root",
+	"track": "iWwZDW_track",
+	"value": "iWwZDW_value"
+};
+//#endregion
+export { Progress_module_default as default };