@webiny/admin-ui 0.0.0-unstable.2aaa1916d9

package/List/components/ListItemAction.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import type { IconButtonProps as IconButtonProps } from "../../Button";
+type ListItemActionProps = IconButtonProps;
+declare const ListItemAction: ((props: ListItemActionProps) => React.JSX.Element) & {
+    original: (props: ListItemActionProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: ListItemActionProps) => React.JSX.Element) & {
+        original: (props: ListItemActionProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ListItemActionProps) => React.JSX.Element) & {
+        original: (props: ListItemActionProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+} & {
+    Separator: ((props: import("../../Separator/Separator").SeparatorProps) => React.JSX.Element) & {
+        original: (props: import("../../Separator/Separator").SeparatorProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    } & {
+        original: ((props: import("../../Separator/Separator").SeparatorProps) => React.JSX.Element) & {
+            original: (props: import("../../Separator/Separator").SeparatorProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        };
+        originalName: string;
+        displayName: string;
+    } & {
+        createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: import("../../Separator/Separator").SeparatorProps) => React.JSX.Element) & {
+            original: (props: import("../../Separator/Separator").SeparatorProps) => React.JSX.Element;
+            originalName: string;
+            displayName: string;
+        }>) => (props: unknown) => React.JSX.Element;
+    };
+};
+export { ListItemAction, type ListItemActionProps };

package/List/components/ListItemAction.js

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { makeDecoratable, withStaticProps } from "../../utils";
+import { IconButton } from "../../Button";
+import { ListItemSeparator } from "./ListItemSeparator";
+const DecoratableListItemAction = props => {
+  return /*#__PURE__*/React.createElement(IconButton, Object.assign({
+    variant: "ghost",
+    size: "sm"
+  }, props));
+};
+const ListItemAction = withStaticProps(makeDecoratable("ListItemAction", DecoratableListItemAction), {
+  Separator: ListItemSeparator
+});
+export { ListItemAction };
+
+//# sourceMappingURL=ListItemAction.js.map

package/List/components/ListItemAction.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","makeDecoratable","withStaticProps","IconButton","ListItemSeparator","DecoratableListItemAction","props","createElement","Object","assign","variant","size","ListItemAction","Separator"],"sources":["ListItemAction.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils\";\nimport type { IconButtonProps as IconButtonProps } from \"~/Button\";\nimport { IconButton } from \"~/Button\";\nimport { ListItemSeparator } from \"./ListItemSeparator\";\n\ntype ListItemActionProps = IconButtonProps;\n\nconst DecoratableListItemAction = (props: ListItemActionProps) => {\n    return <IconButton variant={\"ghost\"} size={\"sm\"} {...props} />;\n};\n\nconst ListItemAction = withStaticProps(\n    makeDecoratable(\"ListItemAction\", DecoratableListItemAction),\n    {\n        Separator: ListItemSeparator\n    }\n);\n\nexport { ListItemAction, type ListItemActionProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe,EAAEC,eAAe;AAEzC,SAASC,UAAU;AACnB,SAASC,iBAAiB;AAI1B,MAAMC,yBAAyB,GAAIC,KAA0B,IAAK;EAC9D,oBAAON,KAAA,CAAAO,aAAA,CAACJ,UAAU,EAAAK,MAAA,CAAAC,MAAA;IAACC,OAAO,EAAE,OAAQ;IAACC,IAAI,EAAE;EAAK,GAAKL,KAAK,CAAG,CAAC;AAClE,CAAC;AAED,MAAMM,cAAc,GAAGV,eAAe,CAClCD,eAAe,CAAC,gBAAgB,EAAEI,yBAAyB,CAAC,EAC5D;EACIQ,SAAS,EAAET;AACf,CACJ,CAAC;AAED,SAASQ,cAAc","ignoreList":[]}

package/List/components/ListItemHandle.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+import type { IconProps as IconProps } from "../../Icon";
+interface ListItemHandleProps extends Omit<IconProps, "icon" | "label"> {
+    icon?: React.ReactElement;
+    label?: string;
+}
+declare const ListItemHandle: ((props: ListItemHandleProps) => React.JSX.Element) & {
+    original: (props: ListItemHandleProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: ListItemHandleProps) => React.JSX.Element) & {
+        original: (props: ListItemHandleProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ListItemHandleProps) => React.JSX.Element) & {
+        original: (props: ListItemHandleProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { ListItemHandle, type ListItemHandleProps };

package/List/components/ListItemHandle.js

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { ReactComponent as DragHandleIcon } from "@webiny/icons/drag_indicator.svg";
+import { makeDecoratable } from "../../utils";
+import { Icon } from "../../Icon";
+const DecoratableListItemHandle = props => {
+  return /*#__PURE__*/React.createElement(Icon, Object.assign({
+    size: "md",
+    color: "neutral-light",
+    className: "wby-mx-xxs wby-cursor-grab",
+    icon: /*#__PURE__*/React.createElement(DragHandleIcon, null),
+    label: "Drag handle"
+  }, props));
+};
+const ListItemHandle = makeDecoratable("ListItemHandle", DecoratableListItemHandle);
+export { ListItemHandle };
+
+//# sourceMappingURL=ListItemHandle.js.map

package/List/components/ListItemHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ReactComponent","DragHandleIcon","makeDecoratable","Icon","DecoratableListItemHandle","props","createElement","Object","assign","size","color","className","icon","label","ListItemHandle"],"sources":["ListItemHandle.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ReactComponent as DragHandleIcon } from \"@webiny/icons/drag_indicator.svg\";\nimport { makeDecoratable } from \"~/utils\";\nimport type { IconProps as IconProps } from \"~/Icon\";\nimport { Icon } from \"~/Icon\";\n\ninterface ListItemHandleProps extends Omit<IconProps, \"icon\" | \"label\"> {\n    icon?: React.ReactElement;\n    label?: string;\n}\n\nconst DecoratableListItemHandle = (props: ListItemHandleProps) => {\n    return (\n        <Icon\n            size={\"md\"}\n            color={\"neutral-light\"}\n            className={\"wby-mx-xxs wby-cursor-grab\"}\n            icon={<DragHandleIcon />}\n            label={\"Drag handle\"}\n            {...props}\n        />\n    );\n};\n\nconst ListItemHandle = makeDecoratable(\"ListItemHandle\", DecoratableListItemHandle);\n\nexport { ListItemHandle, type ListItemHandleProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,cAAc,IAAIC,cAAc,QAAQ,kCAAkC;AACnF,SAASC,eAAe;AAExB,SAASC,IAAI;AAOb,MAAMC,yBAAyB,GAAIC,KAA0B,IAAK;EAC9D,oBACIN,KAAA,CAAAO,aAAA,CAACH,IAAI,EAAAI,MAAA,CAAAC,MAAA;IACDC,IAAI,EAAE,IAAK;IACXC,KAAK,EAAE,eAAgB;IACvBC,SAAS,EAAE,4BAA6B;IACxCC,IAAI,eAAEb,KAAA,CAAAO,aAAA,CAACL,cAAc,MAAE,CAAE;IACzBY,KAAK,EAAE;EAAc,GACjBR,KAAK,CACZ,CAAC;AAEV,CAAC;AAED,MAAMS,cAAc,GAAGZ,eAAe,CAAC,gBAAgB,EAAEE,yBAAyB,CAAC;AAEnF,SAASU,cAAc","ignoreList":[]}

package/List/components/ListItemIcon.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+import type { IconProps as IconComponentProps } from "../../Icon";
+type ListItemIconProps = IconComponentProps;
+export declare const ListItemIcon: ((props: ListItemIconProps) => React.JSX.Element) & {
+    original: (props: ListItemIconProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: ListItemIconProps) => React.JSX.Element) & {
+        original: (props: ListItemIconProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ListItemIconProps) => React.JSX.Element) & {
+        original: (props: ListItemIconProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export {};

package/List/components/ListItemIcon.js

@@ -0,0 +1,12 @@
+import * as React from "react";
+import { makeDecoratable } from "../../utils";
+import { Icon as IconComponent } from "../../Icon";
+const DecoratableListItemIcon = props => {
+  return /*#__PURE__*/React.createElement(IconComponent, Object.assign({
+    size: "md",
+    color: "inherit"
+  }, props));
+};
+export const ListItemIcon = makeDecoratable("ListItemIcon", DecoratableListItemIcon);
+
+//# sourceMappingURL=ListItemIcon.js.map

package/List/components/ListItemIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","makeDecoratable","Icon","IconComponent","DecoratableListItemIcon","props","createElement","Object","assign","size","color","ListItemIcon"],"sources":["ListItemIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport type { IconProps as IconComponentProps } from \"~/Icon\";\nimport { Icon as IconComponent } from \"~/Icon\";\n\ntype ListItemIconProps = IconComponentProps;\n\nconst DecoratableListItemIcon = (props: ListItemIconProps) => {\n    return <IconComponent size={\"md\"} color={\"inherit\"} {...props} />;\n};\n\nexport const ListItemIcon = makeDecoratable(\"ListItemIcon\", DecoratableListItemIcon);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;AAExB,SAASC,IAAI,IAAIC,aAAa;AAI9B,MAAMC,uBAAuB,GAAIC,KAAwB,IAAK;EAC1D,oBAAOL,KAAA,CAAAM,aAAA,CAACH,aAAa,EAAAI,MAAA,CAAAC,MAAA;IAACC,IAAI,EAAE,IAAK;IAACC,KAAK,EAAE;EAAU,GAAKL,KAAK,CAAG,CAAC;AACrE,CAAC;AAED,OAAO,MAAMM,YAAY,GAAGV,eAAe,CAAC,cAAc,EAAEG,uBAAuB,CAAC","ignoreList":[]}

package/List/components/ListItemSeparator.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+import { type SeparatorProps } from "../../Separator";
+type ListItemSeparatorProps = SeparatorProps;
+declare const ListItemSeparator: ((props: ListItemSeparatorProps) => React.JSX.Element) & {
+    original: (props: ListItemSeparatorProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: ((props: ListItemSeparatorProps) => React.JSX.Element) & {
+        original: (props: ListItemSeparatorProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<((props: ListItemSeparatorProps) => React.JSX.Element) & {
+        original: (props: ListItemSeparatorProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { ListItemSeparator, type ListItemSeparatorProps };

package/List/components/ListItemSeparator.js

@@ -0,0 +1,13 @@
+import * as React from "react";
+import { makeDecoratable } from "../../utils";
+import { Separator } from "../../Separator";
+const DecoratableListItemSeparator = props => {
+  return /*#__PURE__*/React.createElement(Separator, Object.assign({
+    orientation: "vertical",
+    className: "wby-h-lg wby-mx-sm-plus"
+  }, props));
+};
+const ListItemSeparator = makeDecoratable("ListItemSeparator", DecoratableListItemSeparator);
+export { ListItemSeparator };
+
+//# sourceMappingURL=ListItemSeparator.js.map

package/List/components/ListItemSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","makeDecoratable","Separator","DecoratableListItemSeparator","props","createElement","Object","assign","orientation","className","ListItemSeparator"],"sources":["ListItemSeparator.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport { Separator, type SeparatorProps } from \"~/Separator\";\n\ntype ListItemSeparatorProps = SeparatorProps;\n\nconst DecoratableListItemSeparator = (props: ListItemSeparatorProps) => {\n    return <Separator orientation={\"vertical\"} className={\"wby-h-lg wby-mx-sm-plus\"} {...props} />;\n};\n\nconst ListItemSeparator = makeDecoratable(\"ListItemSeparator\", DecoratableListItemSeparator);\n\nexport { ListItemSeparator, type ListItemSeparatorProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;AACxB,SAASC,SAAS;AAIlB,MAAMC,4BAA4B,GAAIC,KAA6B,IAAK;EACpE,oBAAOJ,KAAA,CAAAK,aAAA,CAACH,SAAS,EAAAI,MAAA,CAAAC,MAAA;IAACC,WAAW,EAAE,UAAW;IAACC,SAAS,EAAE;EAA0B,GAAKL,KAAK,CAAG,CAAC;AAClG,CAAC;AAED,MAAMM,iBAAiB,GAAGT,eAAe,CAAC,mBAAmB,EAAEE,4BAA4B,CAAC;AAE5F,SAASO,iBAAiB","ignoreList":[]}

package/List/components/index.d.ts

@@ -0,0 +1 @@
+export * from "./ListItem";

package/List/components/index.js

@@ -0,0 +1,3 @@
+export * from "./ListItem";
+
+//# sourceMappingURL=index.js.map

package/List/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ListItem\";\n"],"mappings":"AAAA","ignoreList":[]}

package/List/index.d.ts

@@ -0,0 +1 @@
+export * from "./List";

package/List/index.js

@@ -0,0 +1,3 @@
+export * from "./List";
+
+//# sourceMappingURL=index.js.map

package/List/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./List\";\n"],"mappings":"AAAA","ignoreList":[]}

package/Loader/Loader.d.ts

@@ -0,0 +1,36 @@
+import React from "react";
+import { type VariantProps } from "../utils";
+declare const loaderVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+declare const loaderBaseVariant: (props?: ({
+    variant?: "accent" | "subtle" | "negative" | null | undefined;
+} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
+interface LoaderProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof loaderVariants>, VariantProps<typeof loaderBaseVariant> {
+    max?: number;
+    value?: number;
+    min?: number;
+    className?: string;
+    indeterminate?: boolean;
+    text?: React.ReactNode;
+}
+declare const Loader: (({ max, min, value, indeterminate, className, size, variant, text, ...props }: LoaderProps) => React.JSX.Element) & {
+    original: ({ max, min, value, indeterminate, className, size, variant, text, ...props }: LoaderProps) => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (({ max, min, value, indeterminate, className, size, variant, text, ...props }: LoaderProps) => React.JSX.Element) & {
+        original: ({ max, min, value, indeterminate, className, size, variant, text, ...props }: LoaderProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ max, min, value, indeterminate, className, size, variant, text, ...props }: LoaderProps) => React.JSX.Element) & {
+        original: ({ max, min, value, indeterminate, className, size, variant, text, ...props }: LoaderProps) => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { Loader, type LoaderProps };

package/Loader/Loader.js

@@ -0,0 +1,117 @@
+import React, { useState, useEffect } from "react";
+import { Text } from "../Text";
+import { cn, cva, makeDecoratable } from "../utils";
+const loaderVariants = cva("wby-relative wby-translate", {
+  variants: {
+    size: {
+      xs: "wby-size-[16px]",
+      sm: "wby-size-[20px]",
+      md: "wby-size-[24px]",
+      lg: "wby-size-[40px]"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+const loaderBaseVariant = cva("wby-stroke ", {
+  variants: {
+    variant: {
+      accent: "wby-opacity-10 wby-text-neutral-primary",
+      subtle: "wby-opacity-10 wby-text-neutral-primary",
+      negative: "wby-opacity-20 wby-text-neutral-light"
+    }
+  },
+  defaultVariants: {
+    variant: "accent"
+  }
+});
+const loaderActiveVariant = cva("wby-opacity-100", {
+  variants: {
+    variant: {
+      accent: "wby-text-accent-primary",
+      subtle: "wby-opacity-50 wby-text-neutral-primary",
+      negative: "wby-text-neutral-light"
+    }
+  },
+  defaultVariants: {
+    variant: "accent"
+  }
+});
+const DecoratableLoader = ({
+  max = 100,
+  min = 0,
+  value = 66,
+  indeterminate = true,
+  className,
+  size,
+  variant,
+  text,
+  ...props
+}) => {
+  const circumference = 2 * Math.PI * 45;
+  const percentPx = circumference / 100;
+  const currentPercent = Math.round((value - min) / (max - min) * 100);
+  const [rotation, setRotation] = useState(0);
+  useEffect(() => {
+    let interval;
+    if (indeterminate) {
+      // Rotate the loader by 10 degrees every 30ms when indeterminate
+      interval = setInterval(() => {
+        setRotation(prev => (prev + 10) % 360);
+      }, 30);
+    } else {
+      setRotation(0);
+    }
+    return () => clearInterval(interval);
+  }, [indeterminate]);
+  return /*#__PURE__*/React.createElement("div", Object.assign({}, props, {
+    className: "wby-text-center wby-flex wby-flex-col wby-items-center"
+  }), /*#__PURE__*/React.createElement("div", {
+    className: cn(loaderVariants({
+      size
+    }), className)
+  }, /*#__PURE__*/React.createElement("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    className: "wby-size-full wby-stroke-current",
+    strokeWidth: "12",
+    viewBox: "0 0 100 100"
+  }, /*#__PURE__*/React.createElement("circle", {
+    cx: "50",
+    cy: "50",
+    r: "44",
+    strokeDashoffset: "0",
+    className: cn(loaderBaseVariant({
+      variant
+    })),
+    style: {
+      strokeDasharray: `${circumference}px ${circumference}px`,
+      transition: "all 1s ease 0s",
+      transformOrigin: "50px 50px"
+    }
+  }), /*#__PURE__*/React.createElement("circle", {
+    cx: "50",
+    cy: "50",
+    r: "44",
+    strokeDashoffset: "0",
+    className: cn(loaderActiveVariant({
+      variant
+    })),
+    style: {
+      strokeDasharray: `${currentPercent * percentPx}px ${circumference}px`,
+      transition: indeterminate ? "none" : "500ms ease 0s",
+      transitionProperty: indeterminate ? "transform" : "stroke-dasharray, transform",
+      transform: indeterminate ? `rotate(${rotation}deg)` // Rotate when indeterminate
+      : "rotate(-90deg)",
+      transformOrigin: "50px 50px"
+    }
+  }))), text && /*#__PURE__*/React.createElement(Text, {
+    as: "div",
+    className: "wby-text-neutral-strong wby-w-full wby-pt-sm-plus"
+  }, text));
+};
+const Loader = makeDecoratable("Loader", DecoratableLoader);
+export { Loader };
+
+//# sourceMappingURL=Loader.js.map

package/Loader/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","useEffect","Text","cn","cva","makeDecoratable","loaderVariants","variants","size","xs","sm","md","lg","defaultVariants","loaderBaseVariant","variant","accent","subtle","negative","loaderActiveVariant","DecoratableLoader","max","min","value","indeterminate","className","text","props","circumference","Math","PI","percentPx","currentPercent","round","rotation","setRotation","interval","setInterval","prev","clearInterval","createElement","Object","assign","xmlns","fill","strokeWidth","viewBox","cx","cy","r","strokeDashoffset","style","strokeDasharray","transition","transformOrigin","transitionProperty","transform","as","Loader"],"sources":["Loader.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport { Text } from \"~/Text\";\nimport { cn, cva, makeDecoratable, type VariantProps } from \"~/utils\";\n\nconst loaderVariants = cva(\"wby-relative wby-translate\", {\n    variants: {\n        size: {\n            xs: \"wby-size-[16px]\",\n            sm: \"wby-size-[20px]\",\n            md: \"wby-size-[24px]\",\n            lg: \"wby-size-[40px]\"\n        }\n    },\n    defaultVariants: {\n        size: \"md\"\n    }\n});\n\nconst loaderBaseVariant = cva(\"wby-stroke \", {\n    variants: {\n        variant: {\n            accent: \"wby-opacity-10 wby-text-neutral-primary\",\n            subtle: \"wby-opacity-10 wby-text-neutral-primary\",\n            negative: \"wby-opacity-20 wby-text-neutral-light\"\n        }\n    },\n    defaultVariants: {\n        variant: \"accent\"\n    }\n});\n\nconst loaderActiveVariant = cva(\"wby-opacity-100\", {\n    variants: {\n        variant: {\n            accent: \"wby-text-accent-primary\",\n            subtle: \"wby-opacity-50 wby-text-neutral-primary\",\n            negative: \"wby-text-neutral-light\"\n        }\n    },\n    defaultVariants: {\n        variant: \"accent\"\n    }\n});\n\ninterface LoaderProps\n    extends React.HTMLAttributes<HTMLDivElement>,\n        VariantProps<typeof loaderVariants>,\n        VariantProps<typeof loaderBaseVariant> {\n    max?: number;\n    value?: number;\n    min?: number;\n    className?: string;\n    indeterminate?: boolean;\n    text?: React.ReactNode;\n}\n\nconst DecoratableLoader = ({\n    max = 100,\n    min = 0,\n    value = 66,\n    indeterminate = true,\n    className,\n    size,\n    variant,\n    text,\n    ...props\n}: LoaderProps) => {\n    const circumference = 2 * Math.PI * 45;\n    const percentPx = circumference / 100;\n    const currentPercent = Math.round(((value - min) / (max - min)) * 100);\n\n    const [rotation, setRotation] = useState(0);\n    useEffect(() => {\n        let interval: ReturnType<typeof setInterval>;\n        if (indeterminate) {\n            // Rotate the loader by 10 degrees every 30ms when indeterminate\n            interval = setInterval(() => {\n                setRotation(prev => (prev + 10) % 360);\n            }, 30);\n        } else {\n            setRotation(0);\n        }\n        return () => clearInterval(interval);\n    }, [indeterminate]);\n\n    return (\n        <div {...props} className={\"wby-text-center wby-flex wby-flex-col wby-items-center\"}>\n            <div className={cn(loaderVariants({ size }), className)}>\n                <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    fill=\"none\"\n                    className=\"wby-size-full wby-stroke-current\"\n                    strokeWidth=\"12\"\n                    viewBox=\"0 0 100 100\"\n                >\n                    <circle\n                        cx=\"50\"\n                        cy=\"50\"\n                        r=\"44\"\n                        strokeDashoffset=\"0\"\n                        className={cn(loaderBaseVariant({ variant }))}\n                        style={{\n                            strokeDasharray: `${circumference}px ${circumference}px`,\n                            transition: \"all 1s ease 0s\",\n                            transformOrigin: \"50px 50px\"\n                        }}\n                    />\n                    <circle\n                        cx=\"50\"\n                        cy=\"50\"\n                        r=\"44\"\n                        strokeDashoffset=\"0\"\n                        className={cn(loaderActiveVariant({ variant }))}\n                        style={{\n                            strokeDasharray: `${currentPercent * percentPx}px ${circumference}px`,\n                            transition: indeterminate ? \"none\" : \"500ms ease 0s\",\n                            transitionProperty: indeterminate\n                                ? \"transform\"\n                                : \"stroke-dasharray, transform\",\n                            transform: indeterminate\n                                ? `rotate(${rotation}deg)` // Rotate when indeterminate\n                                : \"rotate(-90deg)\",\n                            transformOrigin: \"50px 50px\"\n                        }}\n                    />\n                </svg>\n            </div>\n            {text && (\n                <Text as={\"div\"} className={\"wby-text-neutral-strong wby-w-full wby-pt-sm-plus\"}>\n                    {text}\n                </Text>\n            )}\n        </div>\n    );\n};\n\nconst Loader = makeDecoratable(\"Loader\", DecoratableLoader);\n\nexport { Loader, type LoaderProps };\n"],"mappings":"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","ignoreList":[]}