@refraktor/core 0.0.1

package/build/components/popover/use-popover.js

@@ -0,0 +1,109 @@
+import { useUncontrolled } from "@refraktor/utils";
+import { arrow, autoUpdate, flip, inline, offset, safePolygon, shift, useClick, useDismiss, useFloating, useFocus, useHover, useInteractions, useRole } from "@floating-ui/react";
+import { useCallback, useMemo, useRef } from "react";
+export function usePopover(options = {}) {
+    const { opened, defaultOpened, onOpenedChange, positioning = {
+        placement: "bottom",
+        offset: 8
+    }, middlewares = { flip: true, shift: true }, disabled = false, trigger = "click", showArrow = false, closeOnClickOutside = true, closeOnEscape = true, openDelay = 0, closeDelay = 0 } = options;
+    const arrowRef = useRef(null);
+    const [isOpen, setIsOpen] = useUncontrolled({
+        value: opened,
+        defaultValue: defaultOpened,
+        finalValue: false,
+        onChange: onOpenedChange
+    });
+    const middleware = useMemo(() => {
+        const middlewareList = [];
+        middlewareList.push(offset(positioning.offset ?? 8));
+        if (middlewares.flip) {
+            middlewareList.push(flip(typeof middlewares.flip === "boolean"
+                ? undefined
+                : middlewares.flip));
+        }
+        if (middlewares.shift) {
+            middlewareList.push(shift(typeof middlewares.shift === "boolean"
+                ? undefined
+                : middlewares.shift));
+        }
+        if (middlewares.inline) {
+            middlewareList.push(inline(typeof middlewares.inline === "boolean"
+                ? undefined
+                : middlewares.inline));
+        }
+        if (arrowRef.current && showArrow) {
+            middlewareList.push(arrow({
+                element: arrowRef.current
+            }));
+        }
+        return middlewareList;
+    }, [positioning.offset, middlewares, showArrow, arrowRef]);
+    const floating = useFloating({
+        placement: positioning.placement,
+        open: isOpen,
+        onOpenChange: setIsOpen,
+        middleware: middleware,
+        whileElementsMounted: autoUpdate
+    });
+    const click = useClick(floating.context, {
+        enabled: trigger === "click" && !disabled
+    });
+    const hover = useHover(floating.context, {
+        enabled: trigger === "hover" && !disabled,
+        handleClose: safePolygon(),
+        delay: {
+            open: openDelay,
+            close: closeDelay
+        }
+    });
+    const focus = useFocus(floating.context, {
+        enabled: trigger === "focus" && !disabled
+    });
+    const dismiss = useDismiss(floating.context, {
+        outsidePress: closeOnClickOutside,
+        escapeKey: closeOnEscape
+    });
+    const role = useRole(floating.context, {
+        role: "dialog"
+    });
+    const { getReferenceProps, getFloatingProps } = useInteractions([
+        click,
+        hover,
+        focus,
+        dismiss,
+        role
+    ]);
+    const open = useCallback(() => {
+        if (!disabled) {
+            setIsOpen(true);
+        }
+    }, [setIsOpen, disabled]);
+    const close = useCallback(() => {
+        setIsOpen(false);
+    }, [setIsOpen]);
+    const toggle = useCallback(() => {
+        if (!disabled) {
+            setIsOpen(!isOpen);
+        }
+    }, [setIsOpen, isOpen, disabled]);
+    return {
+        opened: isOpen,
+        open,
+        close,
+        toggle,
+        context: floating.context,
+        refs: {
+            setReference: floating.refs.setReference,
+            setFloating: floating.refs.setFloating,
+            reference: floating.refs
+                .reference,
+            floating: floating.refs
+                .floating
+        },
+        floatingStyles: floating.floatingStyles,
+        getReferenceProps,
+        getFloatingProps,
+        placement: floating.placement,
+        arrowRef
+    };
+}

package/build/components/portal/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Portal } from "./portal";
+export type { PortalProps } from "./portal.types";
+//# sourceMappingURL=index.d.ts.map

package/build/components/portal/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/portal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/build/components/portal/index.js

@@ -0,0 +1 @@
+export { default as Portal } from "./portal";

package/build/components/portal/portal.d.ts

@@ -0,0 +1,4 @@
+import { PortalFactoryPayload } from "./portal.types";
+declare const Portal: import("../..").RefraktorComponent<PortalFactoryPayload>;
+export default Portal;
+//# sourceMappingURL=portal.d.ts.map

package/build/components/portal/portal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal.d.ts","sourceRoot":"","sources":["../../../src/components/portal/portal.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAe,MAAM,gBAAgB,CAAC;AA+CnE,QAAA,MAAM,MAAM,0DAiDV,CAAC;AAKH,eAAe,MAAM,CAAC"}

package/build/components/portal/portal.js

@@ -0,0 +1,76 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+import { createComponentConfig, factory, useProps } from "../../utils";
+import { useEffect, useRef, useState } from "react";
+function createPortalNode(props) {
+    const node = document.createElement("div");
+    node.setAttribute("data-portal", "true");
+    typeof props.className === "string" &&
+        node.classList.add(...props.className.split(" ").filter(Boolean));
+    typeof props.style === "object" && Object.assign(node.style, props.style);
+    typeof props.id === "string" && node.setAttribute("id", props.id);
+    return node;
+}
+function getTargetNode({ target, reuseTargetNode, ...others }) {
+    if (target) {
+        if (typeof target === "string") {
+            return (document.querySelector(target) ||
+                createPortalNode(others));
+        }
+        return target;
+    }
+    if (reuseTargetNode) {
+        const existingNode = document.querySelector("[data-velra-shared-portal-node]");
+        if (existingNode) {
+            return existingNode;
+        }
+        const node = createPortalNode(others);
+        node.setAttribute("data-velra-shared-portal-node", "true");
+        document.body.appendChild(node);
+        return node;
+    }
+    return createPortalNode(others);
+}
+const Portal = factory((_props, ref) => {
+    const { children, target, reuseTargetNode, ...others } = useProps("Portal", null, _props);
+    const [mounted, setMounted] = useState(false);
+    const nodeRef = useRef(null);
+    useEffect(() => {
+        setMounted(true);
+        nodeRef.current = getTargetNode({ target, reuseTargetNode, ...others });
+        if (ref) {
+            if (typeof ref === "function") {
+                ref(nodeRef.current);
+            }
+            else {
+                ref.current = nodeRef.current;
+            }
+        }
+        if (target && nodeRef.current) {
+            const computedStyle = window.getComputedStyle(nodeRef.current);
+            if (computedStyle.position === "static") {
+                nodeRef.current.style.position = "relative";
+            }
+        }
+        if (!target && !reuseTargetNode && nodeRef.current) {
+            document.body.appendChild(nodeRef.current);
+        }
+        return () => {
+            if (!target && !reuseTargetNode && nodeRef.current) {
+                try {
+                    if (document.body.contains(nodeRef.current)) {
+                        document.body.removeChild(nodeRef.current);
+                    }
+                }
+                catch (error) { }
+            }
+        };
+    }, [target, reuseTargetNode]);
+    if (!mounted || !nodeRef.current) {
+        return null;
+    }
+    return createPortal(_jsx(_Fragment, { children: children }), nodeRef.current);
+});
+Portal.displayName = "@velra/core/Portal";
+Portal.configure = createComponentConfig();
+export default Portal;

package/build/components/portal/portal.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=portal.test.d.ts.map

package/build/components/portal/portal.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal.test.d.ts","sourceRoot":"","sources":["../../../src/components/portal/portal.test.tsx"],"names":[],"mappings":""}

package/build/components/portal/portal.test.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "../../vitest";
+import Portal from "./portal";
+describe("@refraktor/core/Portal", () => {
+    it("renders into document.body by default", async () => {
+        await render(_jsx("div", { "data-testid": "root", children: _jsx(Portal, { children: _jsx("div", { "data-testid": "content", children: "Portal content" }) }) }));
+        const root = screen.getByTestId("root");
+        const content = await screen.findByTestId("content");
+        expect(document.body).toContainElement(content);
+        expect(root).not.toContainElement(content);
+    });
+    it("renders into custom target", async () => {
+        const target = document.createElement("div");
+        target.id = "portal-target";
+        document.body.appendChild(target);
+        await render(_jsx(Portal, { target: "#portal-target", children: _jsx("div", { "data-testid": "content", children: "Targeted content" }) }));
+        const content = await screen.findByTestId("content");
+        expect(target).toContainElement(content);
+        target.remove();
+    });
+});

package/build/components/portal/portal.types.d.ts

@@ -0,0 +1,23 @@
+import { ComponentPropsWithoutRef, ReactNode } from "react";
+import { createComponentConfig, FactoryPayload } from "../../utils";
+export interface BasePortalProps extends ComponentPropsWithoutRef<"div"> {
+    /** Target element to render the portal inside. Can be an HTMLElement or a CSS selector string. */
+    target?: HTMLElement | string;
+    /** Whether to reuse a shared portal node for all portals with this option enabled. @default false */
+    reuseTargetNode?: boolean;
+}
+export interface PortalProps extends BasePortalProps {
+    /** The content to render inside the portal */
+    children: ReactNode;
+}
+export type PortalClassNames = {
+    root?: string;
+};
+export interface PortalFactoryPayload extends FactoryPayload {
+    props: PortalProps;
+    ref: HTMLDivElement;
+    compound: {
+        configure: ReturnType<typeof createComponentConfig<PortalProps>>;
+    };
+}
+//# sourceMappingURL=portal.types.d.ts.map

package/build/components/portal/portal.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal.types.d.ts","sourceRoot":"","sources":["../../../src/components/portal/portal.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAEH,qBAAqB,EACrB,cAAc,EACjB,MAAM,aAAa,CAAC;AAErB,MAAM,WAAW,eAAgB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACpE,kGAAkG;IAClG,MAAM,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAE9B,qGAAqG;IACrG,eAAe,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED,MAAM,WAAW,WAAY,SAAQ,eAAe;IAChD,8CAA8C;IAC9C,QAAQ,EAAE,SAAS,CAAC;CACvB;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,WAAW,oBAAqB,SAAQ,cAAc;IACxD,KAAK,EAAE,WAAW,CAAC;IACnB,GAAG,EAAE,cAAc,CAAC;IACpB,QAAQ,EAAE;QACN,SAAS,EAAE,UAAU,CAAC,OAAO,qBAAqB,CAAC,WAAW,CAAC,CAAC,CAAC;KACpE,CAAC;CACL"}

package/build/components/portal/portal.types.js

@@ -0,0 +1 @@
+export {};

package/build/components/progress/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Progress } from "./progress";
+export type { ProgressProps, ProgressClassNames } from "./progress.types";
+//# sourceMappingURL=index.d.ts.map

package/build/components/progress/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/progress/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EAAE,aAAa,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC"}

package/build/components/progress/index.js

@@ -0,0 +1 @@
+export { default as Progress } from "./progress";

package/build/components/progress/progress.d.ts

@@ -0,0 +1,4 @@
+import { ProgressFactoryPayload } from "./progress.types";
+declare const Progress: import("../..").RefraktorComponent<ProgressFactoryPayload>;
+export default Progress;
+//# sourceMappingURL=progress.d.ts.map

package/build/components/progress/progress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../../src/components/progress/progress.tsx"],"names":[],"mappings":"AASA,OAAO,EAEH,sBAAsB,EAEzB,MAAM,kBAAkB,CAAC;AAa1B,QAAA,MAAM,QAAQ,4DA4DZ,CAAC;AAMH,eAAe,QAAQ,CAAC"}

package/build/components/progress/progress.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { clamp, useId } from "@refraktor/utils";
+import { useTheme } from "../../theme";
+import { createClassNamesConfig, createComponentConfig, factory, useClassNames, useProps } from "../../utils";
+import { getSize } from "./progress.styles";
+const defaultProps = {
+    value: 0,
+    min: 0,
+    max: 100,
+    indeterminate: false,
+    animated: true,
+    size: "md",
+    radius: "full"
+};
+const Progress = factory((_props, ref) => {
+    const { cx, getRadius } = useTheme();
+    const { id, value, min, max, indeterminate, animated, size, radius, className, classNames, ...props } = useProps("Progress", defaultProps, _props);
+    const classes = useClassNames("Progress", classNames);
+    const _id = useId(id);
+    const sizeStyles = getSize(size);
+    const lowerBound = Math.min(min, max);
+    const upperBound = Math.max(min, max);
+    const clampedValue = clamp(value, lowerBound, upperBound);
+    const percentage = upperBound === lowerBound
+        ? 0
+        : ((clampedValue - lowerBound) / (upperBound - lowerBound)) * 100;
+    return (_jsx("div", { className: cx("w-full", classes.root, className), children: _jsx("div", { ...props, ref: ref, id: _id, role: "progressbar", "aria-valuemin": indeterminate ? undefined : lowerBound, "aria-valuemax": indeterminate ? undefined : upperBound, "aria-valuenow": indeterminate ? undefined : clampedValue, className: cx("relative w-full overflow-hidden bg-[var(--refraktor-bg)]", sizeStyles.track, getRadius(radius), classes.track), children: _jsx("div", { className: cx("h-full bg-[var(--refraktor-primary)]", getRadius(radius), indeterminate &&
+                    "absolute inset-y-0 left-0 refraktor-progress-indeterminate", animated && !indeterminate &&
+                    "transition-[width] duration-300 ease-out", classes.bar), style: indeterminate ? undefined : { width: `${percentage}%` } }) }) }));
+});
+Progress.displayName = "@refraktor/core/Progress";
+Progress.configure = createComponentConfig();
+Progress.classNames = createClassNamesConfig();
+export default Progress;

package/build/components/progress/progress.styles.d.ts

@@ -0,0 +1,7 @@
+import { RefraktorSize } from "../../theme";
+type ProgressSizeStyles = {
+    track: string;
+};
+export declare const getSize: (size?: RefraktorSize) => ProgressSizeStyles;
+export {};
+//# sourceMappingURL=progress.styles.d.ts.map

package/build/components/progress/progress.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.styles.d.ts","sourceRoot":"","sources":["../../../src/components/progress/progress.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,KAAK,kBAAkB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAoBF,eAAO,MAAM,OAAO,GAAI,OAAM,aAAoB,uBAAgB,CAAC"}

package/build/components/progress/progress.styles.js

@@ -0,0 +1,18 @@
+const sizes = {
+    xs: {
+        track: "h-1"
+    },
+    sm: {
+        track: "h-1.5"
+    },
+    md: {
+        track: "h-2"
+    },
+    lg: {
+        track: "h-2.5"
+    },
+    xl: {
+        track: "h-3"
+    }
+};
+export const getSize = (size = "md") => sizes[size];

package/build/components/progress/progress.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=progress.test.d.ts.map

package/build/components/progress/progress.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.test.d.ts","sourceRoot":"","sources":["../../../src/components/progress/progress.test.tsx"],"names":[],"mappings":""}

package/build/components/progress/progress.test.js

@@ -0,0 +1,74 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createRef } from "react";
+import { describe, expect, it } from "vitest";
+import { render, screen, waitFor } from "../../vitest";
+import Progress from "./progress";
+describe("@refraktor/core/Progress", () => {
+    it("renders with determinate values", async () => {
+        await render(_jsx(Progress, { value: 45, "aria-label": "Upload progress" }));
+        const track = screen.getByRole("progressbar", {
+            name: "Upload progress"
+        });
+        const bar = track.firstElementChild;
+        expect(track).toHaveAttribute("aria-valuemin", "0");
+        expect(track).toHaveAttribute("aria-valuemax", "100");
+        expect(track).toHaveAttribute("aria-valuenow", "45");
+        expect(bar).toHaveStyle({ width: "45%" });
+    });
+    it("forwards ref correctly", async () => {
+        const ref = createRef();
+        await render(_jsx(Progress, { ref: ref, "aria-label": "Progress" }));
+        expect(ref.current).toBeInstanceOf(HTMLDivElement);
+        expect(ref.current?.tagName).toBe("DIV");
+        expect(ref.current).toHaveAttribute("role", "progressbar");
+    });
+    it("clamps values outside range", async () => {
+        const { rerender } = await render(_jsx(Progress, { value: -20, "aria-label": "Clamped progress" }));
+        let track = screen.getByRole("progressbar", { name: "Clamped progress" });
+        let bar = track.firstElementChild;
+        expect(track).toHaveAttribute("aria-valuenow", "0");
+        expect(bar).toHaveStyle({ width: "0%" });
+        rerender(_jsx(Progress, { value: 180, "aria-label": "Clamped progress" }));
+        await waitFor(() => {
+            track = screen.getByRole("progressbar", { name: "Clamped progress" });
+            bar = track.firstElementChild;
+            expect(track).toHaveAttribute("aria-valuenow", "100");
+            expect(bar).toHaveStyle({ width: "100%" });
+        });
+    });
+    it("supports custom min and max", async () => {
+        await render(_jsx(Progress, { value: 25, min: 20, max: 40, "aria-label": "Custom range progress" }));
+        const track = screen.getByRole("progressbar", {
+            name: "Custom range progress"
+        });
+        const bar = track.firstElementChild;
+        expect(track).toHaveAttribute("aria-valuemin", "20");
+        expect(track).toHaveAttribute("aria-valuemax", "40");
+        expect(track).toHaveAttribute("aria-valuenow", "25");
+        expect(bar).toHaveStyle({ width: "25%" });
+    });
+    it("supports indeterminate mode", async () => {
+        await render(_jsx(Progress, { indeterminate: true, "aria-label": "Loading progress" }));
+        const track = screen.getByRole("progressbar", {
+            name: "Loading progress"
+        });
+        const bar = track.firstElementChild;
+        expect(track).not.toHaveAttribute("aria-valuemin");
+        expect(track).not.toHaveAttribute("aria-valuemax");
+        expect(track).not.toHaveAttribute("aria-valuenow");
+        expect(bar).toHaveClass("refraktor-progress-indeterminate");
+        expect(bar.style.width).toBe("");
+    });
+    it("supports root and slot class names", async () => {
+        const { container } = await render(_jsx(Progress, { "aria-label": "Styled progress", className: "custom-root", classNames: {
+                track: "custom-track",
+                bar: "custom-bar"
+            } }));
+        const root = container.firstElementChild;
+        const track = screen.getByRole("progressbar", { name: "Styled progress" });
+        const bar = track.firstElementChild;
+        expect(root).toHaveClass("custom-root");
+        expect(track).toHaveClass("custom-track");
+        expect(bar).toHaveClass("custom-bar");
+    });
+});

package/build/components/progress/progress.types.d.ts

@@ -0,0 +1,37 @@
+import { ComponentPropsWithoutRef } from "react";
+import { RefraktorRadius, RefraktorSize } from "../../theme";
+import { createClassNamesConfig, createComponentConfig, FactoryPayload } from "../../utils";
+export type ProgressClassNames = {
+    root?: string;
+    track?: string;
+    bar?: string;
+};
+export interface ProgressProps extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
+    /** Current progress value @default `0` */
+    value?: number;
+    /** Minimum progress value @default `0` */
+    min?: number;
+    /** Maximum progress value @default `100` */
+    max?: number;
+    /** Whether progress is indeterminate @default `false` */
+    indeterminate?: boolean;
+    /** Whether width transitions are animated @default `true` */
+    animated?: boolean;
+    /** Track size @default `md` */
+    size?: RefraktorSize;
+    /** Track radius @default `full` */
+    radius?: RefraktorRadius;
+    /** Used for editing root class name */
+    className?: string;
+    /** Used for styling different parts of the component */
+    classNames?: ProgressClassNames;
+}
+export interface ProgressFactoryPayload extends FactoryPayload {
+    props: ProgressProps;
+    ref: HTMLDivElement;
+    compound: {
+        configure: ReturnType<typeof createComponentConfig<ProgressProps>>;
+        classNames: ReturnType<typeof createClassNamesConfig<ProgressClassNames>>;
+    };
+}
+//# sourceMappingURL=progress.types.d.ts.map

package/build/components/progress/progress.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.types.d.ts","sourceRoot":"","sources":["../../../src/components/progress/progress.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC7D,OAAO,EACH,sBAAsB,EACtB,qBAAqB,EACrB,cAAc,EACjB,MAAM,aAAa,CAAC;AAErB,MAAM,MAAM,kBAAkB,GAAG;IAC7B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,WAAW,aACb,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACzD,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,0CAA0C;IAC1C,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,yDAAyD;IACzD,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,+BAA+B;IAC/B,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB,mCAAmC;IACnC,MAAM,CAAC,EAAE,eAAe,CAAC;IAEzB,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,wDAAwD;IACxD,UAAU,CAAC,EAAE,kBAAkB,CAAC;CACnC;AAED,MAAM,WAAW,sBAAuB,SAAQ,cAAc;IAC1D,KAAK,EAAE,aAAa,CAAC;IACrB,GAAG,EAAE,cAAc,CAAC;IACpB,QAAQ,EAAE;QACN,SAAS,EAAE,UAAU,CAAC,OAAO,qBAAqB,CAAC,aAAa,CAAC,CAAC,CAAC;QACnE,UAAU,EAAE,UAAU,CAAC,OAAO,sBAAsB,CAAC,kBAAkB,CAAC,CAAC,CAAC;KAC7E,CAAC;CACL"}

package/build/components/progress/progress.types.js

@@ -0,0 +1 @@
+export {};

package/build/components/progress-circle/index.d.ts

@@ -0,0 +1,3 @@
+export { default as ProgressCircle } from "./progress-circle";
+export type { ProgressCircleProps, ProgressCircleClassNames } from "./progress-circle.types";
+//# sourceMappingURL=index.d.ts.map

package/build/components/progress-circle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/progress-circle/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAC9D,YAAY,EACR,mBAAmB,EACnB,wBAAwB,EAC3B,MAAM,yBAAyB,CAAC"}

package/build/components/progress-circle/index.js

@@ -0,0 +1 @@
+export { default as ProgressCircle } from "./progress-circle";

package/build/components/progress-circle/progress-circle.d.ts

@@ -0,0 +1,4 @@
+import { ProgressCircleFactoryPayload } from "./progress-circle.types";
+declare const ProgressCircle: import("../..").RefraktorComponent<ProgressCircleFactoryPayload>;
+export default ProgressCircle;
+//# sourceMappingURL=progress-circle.d.ts.map

package/build/components/progress-circle/progress-circle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress-circle.d.ts","sourceRoot":"","sources":["../../../src/components/progress-circle/progress-circle.tsx"],"names":[],"mappings":"AASA,OAAO,EAEH,4BAA4B,EAE/B,MAAM,yBAAyB,CAAC;AAYjC,QAAA,MAAM,cAAc,kEA4FlB,CAAC;AAMH,eAAe,cAAc,CAAC"}

package/build/components/progress-circle/progress-circle.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { clamp, useId } from "@refraktor/utils";
+import { useTheme } from "../../theme";
+import { createClassNamesConfig, createComponentConfig, factory, useClassNames, useProps } from "../../utils";
+import { getSize } from "./progress-circle.styles";
+const defaultProps = {
+    value: 0,
+    min: 0,
+    max: 100,
+    indeterminate: false,
+    animated: true,
+    size: "md"
+};
+const ProgressCircle = factory((_props, ref) => {
+    const { cx } = useTheme();
+    const { id, value, min, max, indeterminate, animated, size, className, classNames, ...props } = useProps("ProgressCircle", defaultProps, _props);
+    const classes = useClassNames("ProgressCircle", classNames);
+    const _id = useId(id);
+    const sizeStyles = getSize(size);
+    const diameter = sizeStyles.size;
+    const strokeWidth = sizeStyles.stroke;
+    const radius = Math.max(0, diameter / 2 - strokeWidth / 2);
+    const circumference = 2 * Math.PI * radius;
+    const lowerBound = Math.min(min, max);
+    const upperBound = Math.max(min, max);
+    const clampedValue = clamp(value, lowerBound, upperBound);
+    const percentage = upperBound === lowerBound
+        ? 0
+        : ((clampedValue - lowerBound) / (upperBound - lowerBound)) * 100;
+    const strokeDashoffset = circumference - (percentage / 100) * circumference;
+    return (_jsx("div", { ...props, ref: ref, id: _id, role: "progressbar", "aria-valuemin": indeterminate ? undefined : lowerBound, "aria-valuemax": indeterminate ? undefined : upperBound, "aria-valuenow": indeterminate ? undefined : clampedValue, className: cx("inline-flex items-center justify-center", classes.root, className), children: _jsxs("svg", { viewBox: `0 0 ${diameter} ${diameter}`, width: diameter, height: diameter, className: cx("block -rotate-90", classes.svg), children: [_jsx("circle", { cx: diameter / 2, cy: diameter / 2, r: radius, fill: "none", strokeWidth: strokeWidth, className: cx("stroke-[var(--refraktor-bg)]", classes.track) }), _jsx("circle", { cx: diameter / 2, cy: diameter / 2, r: radius, fill: "none", strokeWidth: strokeWidth, strokeLinecap: "round", strokeDasharray: indeterminate
+                        ? `${circumference * 0.4} ${circumference}`
+                        : circumference, strokeDashoffset: indeterminate ? circumference * 0.15 : strokeDashoffset, className: cx("stroke-[var(--refraktor-primary)]", indeterminate && "loader-spin", animated && !indeterminate &&
+                        "transition-[stroke-dashoffset] duration-300 ease-out", classes.bar) })] }) }));
+});
+ProgressCircle.displayName = "@refraktor/core/ProgressCircle";
+ProgressCircle.configure = createComponentConfig();
+ProgressCircle.classNames = createClassNamesConfig();
+export default ProgressCircle;

package/build/components/progress-circle/progress-circle.styles.d.ts

@@ -0,0 +1,8 @@
+import { RefraktorSize } from "../../theme";
+type ProgressCircleSizeStyles = {
+    size: number;
+    stroke: number;
+};
+export declare const getSize: (size?: RefraktorSize) => ProgressCircleSizeStyles;
+export {};
+//# sourceMappingURL=progress-circle.styles.d.ts.map

package/build/components/progress-circle/progress-circle.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress-circle.styles.d.ts","sourceRoot":"","sources":["../../../src/components/progress-circle/progress-circle.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAE5C,KAAK,wBAAwB,GAAG;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAClB,CAAC;AAyBF,eAAO,MAAM,OAAO,GAAI,OAAM,aAAoB,6BAAgB,CAAC"}

package/build/components/progress-circle/progress-circle.styles.js

@@ -0,0 +1,23 @@
+const sizes = {
+    xs: {
+        size: 16,
+        stroke: 2
+    },
+    sm: {
+        size: 20,
+        stroke: 2.5
+    },
+    md: {
+        size: 24,
+        stroke: 3
+    },
+    lg: {
+        size: 32,
+        stroke: 4
+    },
+    xl: {
+        size: 40,
+        stroke: 5
+    }
+};
+export const getSize = (size = "md") => sizes[size];

package/build/components/progress-circle/progress-circle.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=progress-circle.test.d.ts.map

package/build/components/progress-circle/progress-circle.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress-circle.test.d.ts","sourceRoot":"","sources":["../../../src/components/progress-circle/progress-circle.test.tsx"],"names":[],"mappings":""}