@webiny/admin-ui 6.3.0-beta.4 → 6.4.0-beta.0

package/Loader/Loader.js

@@ -1,115 +1,103 @@
-import React, { useState, useEffect } from "react";
+import react, { useEffect, useState } from "react";
 import { Text } from "../Text/index.js";
 import { cn, cva, makeDecoratable } from "../utils.js";
 const loaderVariants = cva("relative translate", {
-  variants: {
-    size: {
-      xs: "size-md",
-      sm: "size-md-plus",
-      md: "size-lg",
-      lg: "size-[40px]"
+    variants: {
+        size: {
+            xs: "size-md",
+            sm: "size-md-plus",
+            md: "size-lg",
+            lg: "size-[40px]"
+        }
+    },
+    defaultVariants: {
+        size: "md"
     }
-  },
-  defaultVariants: {
-    size: "md"
-  }
 });
 const loaderBaseVariant = cva("stroke ", {
-  variants: {
-    variant: {
-      accent: "opacity-10 text-neutral-primary",
-      subtle: "opacity-10 text-neutral-primary",
-      negative: "opacity-20 text-neutral-light"
+    variants: {
+        variant: {
+            accent: "opacity-10 text-neutral-primary",
+            subtle: "opacity-10 text-neutral-primary",
+            negative: "opacity-20 text-neutral-light"
+        }
+    },
+    defaultVariants: {
+        variant: "accent"
     }
-  },
-  defaultVariants: {
-    variant: "accent"
-  }
 });
 const loaderActiveVariant = cva("opacity-100", {
-  variants: {
-    variant: {
-      accent: "text-accent-primary",
-      subtle: "opacity-50 text-neutral-primary",
-      negative: "text-neutral-light"
+    variants: {
+        variant: {
+            accent: "text-accent-primary",
+            subtle: "opacity-50 text-neutral-primary",
+            negative: "text-neutral-light"
+        }
+    },
+    defaultVariants: {
+        variant: "accent"
     }
-  },
-  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: "text-center flex flex-col 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: "size-full 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: "text-neutral-strong w-full pt-sm-plus"
-  }, text));
+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) interval = setInterval(()=>{
+            setRotation((prev)=>(prev + 10) % 360);
+        }, 30);
+        else setRotation(0);
+        return ()=>clearInterval(interval);
+    }, [
+        indeterminate
+    ]);
+    return /*#__PURE__*/ react.createElement("div", {
+        ...props,
+        className: "text-center flex flex-col 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: "size-full 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(-90deg)",
+            transformOrigin: "50px 50px"
+        }
+    }))), text && /*#__PURE__*/ react.createElement(Text, {
+        as: "div",
+        className: "text-neutral-strong w-full pt-sm-plus"
+    }, text));
 };
 const Loader = makeDecoratable("Loader", DecoratableLoader);
 export { Loader };

package/Loader/Loader.js.map

@@ -1 +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/index.js\";\nimport { cn, cva, makeDecoratable, type VariantProps } from \"~/utils.js\";\n\nconst loaderVariants = cva(\"relative translate\", {\n    variants: {\n        size: {\n            xs: \"size-md\",\n            sm: \"size-md-plus\",\n            md: \"size-lg\",\n            lg: \"size-[40px]\"\n        }\n    },\n    defaultVariants: {\n        size: \"md\"\n    }\n});\n\nconst loaderBaseVariant = cva(\"stroke \", {\n    variants: {\n        variant: {\n            accent: \"opacity-10 text-neutral-primary\",\n            subtle: \"opacity-10 text-neutral-primary\",\n            negative: \"opacity-20 text-neutral-light\"\n        }\n    },\n    defaultVariants: {\n        variant: \"accent\"\n    }\n});\n\nconst loaderActiveVariant = cva(\"opacity-100\", {\n    variants: {\n        variant: {\n            accent: \"text-accent-primary\",\n            subtle: \"opacity-50 text-neutral-primary\",\n            negative: \"text-neutral-light\"\n        }\n    },\n    defaultVariants: {\n        variant: \"accent\"\n    }\n});\n\ninterface LoaderProps\n    extends\n        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={\"text-center flex flex-col items-center\"}>\n            <div className={cn(loaderVariants({ size }), className)}>\n                <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    fill=\"none\"\n                    className=\"size-full 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={\"text-neutral-strong w-full 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":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAClD,SAASC,IAAI;AACb,SAASC,EAAE,EAAEC,GAAG,EAAEC,eAAe;AAEjC,MAAMC,cAAc,GAAGF,GAAG,CAAC,oBAAoB,EAAE;EAC7CG,QAAQ,EAAE;IACNC,IAAI,EAAE;MACFC,EAAE,EAAE,SAAS;MACbC,EAAE,EAAE,cAAc;MAClBC,EAAE,EAAE,SAAS;MACbC,EAAE,EAAE;IACR;EACJ,CAAC;EACDC,eAAe,EAAE;IACbL,IAAI,EAAE;EACV;AACJ,CAAC,CAAC;AAEF,MAAMM,iBAAiB,GAAGV,GAAG,CAAC,SAAS,EAAE;EACrCG,QAAQ,EAAE;IACNQ,OAAO,EAAE;MACLC,MAAM,EAAE,iCAAiC;MACzCC,MAAM,EAAE,iCAAiC;MACzCC,QAAQ,EAAE;IACd;EACJ,CAAC;EACDL,eAAe,EAAE;IACbE,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAEF,MAAMI,mBAAmB,GAAGf,GAAG,CAAC,aAAa,EAAE;EAC3CG,QAAQ,EAAE;IACNQ,OAAO,EAAE;MACLC,MAAM,EAAE,qBAAqB;MAC7BC,MAAM,EAAE,iCAAiC;MACzCC,QAAQ,EAAE;IACd;EACJ,CAAC;EACDL,eAAe,EAAE;IACbE,OAAO,EAAE;EACb;AACJ,CAAC,CAAC;AAeF,MAAMK,iBAAiB,GAAGA,CAAC;EACvBC,GAAG,GAAG,GAAG;EACTC,GAAG,GAAG,CAAC;EACPC,KAAK,GAAG,EAAE;EACVC,aAAa,GAAG,IAAI;EACpBC,SAAS;EACTjB,IAAI;EACJO,OAAO;EACPW,IAAI;EACJ,GAAGC;AACM,CAAC,KAAK;EACf,MAAMC,aAAa,GAAG,CAAC,GAAGC,IAAI,CAACC,EAAE,GAAG,EAAE;EACtC,MAAMC,SAAS,GAAGH,aAAa,GAAG,GAAG;EACrC,MAAMI,cAAc,GAAGH,IAAI,CAACI,KAAK,CAAE,CAACV,KAAK,GAAGD,GAAG,KAAKD,GAAG,GAAGC,GAAG,CAAC,GAAI,GAAG,CAAC;EAEtE,MAAM,CAACY,QAAQ,EAAEC,WAAW,CAAC,GAAGnC,QAAQ,CAAC,CAAC,CAAC;EAC3CC,SAAS,CAAC,MAAM;IACZ,IAAImC,QAAwC;IAC5C,IAAIZ,aAAa,EAAE;MACf;MACAY,QAAQ,GAAGC,WAAW,CAAC,MAAM;QACzBF,WAAW,CAACG,IAAI,IAAI,CAACA,IAAI,GAAG,EAAE,IAAI,GAAG,CAAC;MAC1C,CAAC,EAAE,EAAE,CAAC;IACV,CAAC,MAAM;MACHH,WAAW,CAAC,CAAC,CAAC;IAClB;IACA,OAAO,MAAMI,aAAa,CAACH,QAAQ,CAAC;EACxC,CAAC,EAAE,CAACZ,aAAa,CAAC,CAAC;EAEnB,oBACIzB,KAAA,CAAAyC,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASf,KAAK;IAAEF,SAAS,EAAE;EAAyC,iBAChE1B,KAAA,CAAAyC,aAAA;IAAKf,SAAS,EAAEtB,EAAE,CAACG,cAAc,CAAC;MAAEE;IAAK,CAAC,CAAC,EAAEiB,SAAS;EAAE,gBACpD1B,KAAA,CAAAyC,aAAA;IACIG,KAAK,EAAC,4BAA4B;IAClCC,IAAI,EAAC,MAAM;IACXnB,SAAS,EAAC,0BAA0B;IACpCoB,WAAW,EAAC,IAAI;IAChBC,OAAO,EAAC;EAAa,gBAErB/C,KAAA,CAAAyC,aAAA;IACIO,EAAE,EAAC,IAAI;IACPC,EAAE,EAAC,IAAI;IACPC,CAAC,EAAC,IAAI;IACNC,gBAAgB,EAAC,GAAG;IACpBzB,SAAS,EAAEtB,EAAE,CAACW,iBAAiB,CAAC;MAAEC;IAAQ,CAAC,CAAC,CAAE;IAC9CoC,KAAK,EAAE;MACHC,eAAe,EAAE,GAAGxB,aAAa,MAAMA,aAAa,IAAI;MACxDyB,UAAU,EAAE,gBAAgB;MAC5BC,eAAe,EAAE;IACrB;EAAE,CACL,CAAC,eACFvD,KAAA,CAAAyC,aAAA;IACIO,EAAE,EAAC,IAAI;IACPC,EAAE,EAAC,IAAI;IACPC,CAAC,EAAC,IAAI;IACNC,gBAAgB,EAAC,GAAG;IACpBzB,SAAS,EAAEtB,EAAE,CAACgB,mBAAmB,CAAC;MAAEJ;IAAQ,CAAC,CAAC,CAAE;IAChDoC,KAAK,EAAE;MACHC,eAAe,EAAE,GAAGpB,cAAc,GAAGD,SAAS,MAAMH,aAAa,IAAI;MACrEyB,UAAU,EAAE7B,aAAa,GAAG,MAAM,GAAG,eAAe;MACpD+B,kBAAkB,EAAE/B,aAAa,GAC3B,WAAW,GACX,6BAA6B;MACnCgC,SAAS,EAAEhC,aAAa,GAClB,UAAUU,QAAQ,MAAM,CAAC;MAAA,EACzB,gBAAgB;MACtBoB,eAAe,EAAE;IACrB;EAAE,CACL,CACA,CACJ,CAAC,EACL5B,IAAI,iBACD3B,KAAA,CAAAyC,aAAA,CAACtC,IAAI;IAACuD,EAAE,EAAE,KAAM;IAAChC,SAAS,EAAE;EAAwC,GAC/DC,IACC,CAET,CAAC;AAEd,CAAC;AAED,MAAMgC,MAAM,GAAGrD,eAAe,CAAC,QAAQ,EAAEe,iBAAiB,CAAC;AAE3D,SAASsC,MAAM","ignoreList":[]}
+{"version":3,"file":"Loader/Loader.js","sources":["../../src/Loader/Loader.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport { Text } from \"~/Text/index.js\";\nimport { cn, cva, makeDecoratable, type VariantProps } from \"~/utils.js\";\n\nconst loaderVariants = cva(\"relative translate\", {\n    variants: {\n        size: {\n            xs: \"size-md\",\n            sm: \"size-md-plus\",\n            md: \"size-lg\",\n            lg: \"size-[40px]\"\n        }\n    },\n    defaultVariants: {\n        size: \"md\"\n    }\n});\n\nconst loaderBaseVariant = cva(\"stroke \", {\n    variants: {\n        variant: {\n            accent: \"opacity-10 text-neutral-primary\",\n            subtle: \"opacity-10 text-neutral-primary\",\n            negative: \"opacity-20 text-neutral-light\"\n        }\n    },\n    defaultVariants: {\n        variant: \"accent\"\n    }\n});\n\nconst loaderActiveVariant = cva(\"opacity-100\", {\n    variants: {\n        variant: {\n            accent: \"text-accent-primary\",\n            subtle: \"opacity-50 text-neutral-primary\",\n            negative: \"text-neutral-light\"\n        }\n    },\n    defaultVariants: {\n        variant: \"accent\"\n    }\n});\n\ninterface LoaderProps\n    extends\n        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={\"text-center flex flex-col items-center\"}>\n            <div className={cn(loaderVariants({ size }), className)}>\n                <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    fill=\"none\"\n                    className=\"size-full 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={\"text-neutral-strong w-full pt-sm-plus\"}>\n                    {text}\n                </Text>\n            )}\n        </div>\n    );\n};\n\nconst Loader = makeDecoratable(\"Loader\", DecoratableLoader);\n\nexport { Loader, type LoaderProps };\n"],"names":["loaderVariants","cva","loaderBaseVariant","loaderActiveVariant","DecoratableLoader","max","min","value","indeterminate","className","size","variant","text","props","circumference","Math","percentPx","currentPercent","rotation","setRotation","useState","useEffect","interval","setInterval","prev","clearInterval","cn","Text","Loader","makeDecoratable"],"mappings":";;;AAIA,MAAMA,iBAAiBC,IAAI,sBAAsB;IAC7C,UAAU;QACN,MAAM;YACF,IAAI;YACJ,IAAI;YACJ,IAAI;YACJ,IAAI;QACR;IACJ;IACA,iBAAiB;QACb,MAAM;IACV;AACJ;AAEA,MAAMC,oBAAoBD,IAAI,WAAW;IACrC,UAAU;QACN,SAAS;YACL,QAAQ;YACR,QAAQ;YACR,UAAU;QACd;IACJ;IACA,iBAAiB;QACb,SAAS;IACb;AACJ;AAEA,MAAME,sBAAsBF,IAAI,eAAe;IAC3C,UAAU;QACN,SAAS;YACL,QAAQ;YACR,QAAQ;YACR,UAAU;QACd;IACJ;IACA,iBAAiB;QACb,SAAS;IACb;AACJ;AAeA,MAAMG,oBAAoB,CAAC,EACvBC,MAAM,GAAG,EACTC,MAAM,CAAC,EACPC,QAAQ,EAAE,EACVC,gBAAgB,IAAI,EACpBC,SAAS,EACTC,IAAI,EACJC,OAAO,EACPC,IAAI,EACJ,GAAGC,OACO;IACV,MAAMC,gBAAgB,IAAIC,KAAK,EAAE,GAAG;IACpC,MAAMC,YAAYF,gBAAgB;IAClC,MAAMG,iBAAiBF,KAAK,KAAK,CAAGR,AAAAA,CAAAA,QAAQD,GAAE,IAAMD,CAAAA,MAAMC,GAAE,IAAM;IAElE,MAAM,CAACY,UAAUC,YAAY,GAAGC,SAAS;IACzCC,UAAU;QACN,IAAIC;QACJ,IAAId,eAEAc,WAAWC,YAAY;YACnBJ,YAAYK,CAAAA,OAASA,AAAAA,CAAAA,OAAO,EAAC,IAAK;QACtC,GAAG;aAEHL,YAAY;QAEhB,OAAO,IAAMM,cAAcH;IAC/B,GAAG;QAACd;KAAc;IAElB,OAAO,WAAP,GACI,oBAAC;QAAK,GAAGK,KAAK;QAAE,WAAW;qBACvB,oBAAC;QAAI,WAAWa,GAAG1B,eAAe;YAAEU;QAAK,IAAID;qBACzC,oBAAC;QACG,OAAM;QACN,MAAK;QACL,WAAU;QACV,aAAY;QACZ,SAAQ;qBAER,oBAAC;QACG,IAAG;QACH,IAAG;QACH,GAAE;QACF,kBAAiB;QACjB,WAAWiB,GAAGxB,kBAAkB;YAAES;QAAQ;QAC1C,OAAO;YACH,iBAAiB,GAAGG,cAAc,GAAG,EAAEA,cAAc,EAAE,CAAC;YACxD,YAAY;YACZ,iBAAiB;QACrB;sBAEJ,oBAAC;QACG,IAAG;QACH,IAAG;QACH,GAAE;QACF,kBAAiB;QACjB,WAAWY,GAAGvB,oBAAoB;YAAEQ;QAAQ;QAC5C,OAAO;YACH,iBAAiB,GAAGM,iBAAiBD,UAAU,GAAG,EAAEF,cAAc,EAAE,CAAC;YACrE,YAAYN,gBAAgB,SAAS;YACrC,oBAAoBA,gBACd,cACA;YACN,WAAWA,gBACL,CAAC,OAAO,EAAEU,SAAS,IAAI,CAAC,GACxB;YACN,iBAAiB;QACrB;UAIXN,QAAQ,WAARA,GACG,oBAACe,MAAIA;QAAC,IAAI;QAAO,WAAW;OACvBf;AAKrB;AAEA,MAAMgB,SAASC,gBAAgB,UAAUzB"}

package/Loader/Loader.stories.js

@@ -1,131 +1,143 @@
-import React, { useState, useEffect } from "react";
+import react, { useEffect, useState } from "react";
 import { Loader } from "./Loader.js";
 const meta = {
-  title: "Components/Loader",
-  component: Loader,
-  parameters: {
-    layout: "padded"
-  }
+    title: "Components/Loader",
+    component: Loader,
+    parameters: {
+        layout: "padded"
+    }
 };
-export default meta;
-export const Documentation = {
-  args: {
-    size: "md",
-    variant: "accent",
-    indeterminate: true,
-    value: 66,
-    min: 0,
-    max: 100,
-    text: "Loading...",
-    className: undefined
-  },
-  argTypes: {
-    size: {
-      description: "Size of the loader",
-      control: "select",
-      options: ["xs", "sm", "md", "lg"]
-    },
-    variant: {
-      description: "Visual style variant of the loader",
-      control: "select",
-      options: ["accent", "subtle", "negative"]
-    },
-    indeterminate: {
-      description: "Whether the loader should show indeterminate progress",
-      control: "boolean"
-    },
-    value: {
-      description: "Current progress value (when not indeterminate)",
-      control: {
-        type: "number",
+const Loader_stories = meta;
+const Documentation = {
+    args: {
+        size: "md",
+        variant: "accent",
+        indeterminate: true,
+        value: 66,
         min: 0,
-        max: 100
-      }
-    },
-    min: {
-      description: "Minimum value for progress calculation",
-      control: "number"
+        max: 100,
+        text: "Loading...",
+        className: void 0
     },
-    max: {
-      description: "Maximum value for progress calculation",
-      control: "number"
-    },
-    text: {
-      description: "Optional text to display below the loader",
-      control: "text"
-    },
-    className: {
-      description: "Additional CSS class names. You can pass multiple class names, separated by commas or spaces."
+    argTypes: {
+        size: {
+            description: "Size of the loader",
+            control: "select",
+            options: [
+                "xs",
+                "sm",
+                "md",
+                "lg"
+            ]
+        },
+        variant: {
+            description: "Visual style variant of the loader",
+            control: "select",
+            options: [
+                "accent",
+                "subtle",
+                "negative"
+            ]
+        },
+        indeterminate: {
+            description: "Whether the loader should show indeterminate progress",
+            control: "boolean"
+        },
+        value: {
+            description: "Current progress value (when not indeterminate)",
+            control: {
+                type: "number",
+                min: 0,
+                max: 100
+            }
+        },
+        min: {
+            description: "Minimum value for progress calculation",
+            control: "number"
+        },
+        max: {
+            description: "Maximum value for progress calculation",
+            control: "number"
+        },
+        text: {
+            description: "Optional text to display below the loader",
+            control: "text"
+        },
+        className: {
+            description: "Additional CSS class names. You can pass multiple class names, separated by commas or spaces."
+        }
     }
-  }
 };
-export const Default = {};
-export const ExtraSmall = {
-  args: {
-    size: "xs"
-  }
+const Default = {};
+const ExtraSmall = {
+    args: {
+        size: "xs"
+    }
 };
-export const Small = {
-  args: {
-    size: "sm"
-  }
+const Small = {
+    args: {
+        size: "sm"
+    }
 };
-export const Medium = {
-  args: {
-    size: "md"
-  }
+const Medium = {
+    args: {
+        size: "md"
+    }
 };
-export const Large = {
-  args: {
-    size: "lg"
-  }
+const Large = {
+    args: {
+        size: "lg"
+    }
 };
-export const Accent = {
-  args: {
-    variant: "accent"
-  }
+const Accent = {
+    args: {
+        variant: "accent"
+    }
 };
-export const Subtle = {
-  args: {
-    variant: "subtle"
-  }
+const Subtle = {
+    args: {
+        variant: "subtle"
+    }
 };
-export const Negative = {
-  args: {
-    variant: "negative"
-  },
-  decorators: [Story => /*#__PURE__*/React.createElement("div", {
-    className: "bg-primary p-md rounded-md"
-  }, /*#__PURE__*/React.createElement(Story, null))]
+const Negative = {
+    args: {
+        variant: "negative"
+    },
+    decorators: [
+        (Story)=>/*#__PURE__*/ react.createElement("div", {
+                className: "bg-primary p-md rounded-md"
+            }, /*#__PURE__*/ react.createElement(Story, null))
+    ]
 };
-export const WithControlledValue = {
-  args: {
-    value: 0,
-    indeterminate: false
-  },
-  render: args => {
-    const [value, setValue] = useState(args.value);
-    useEffect(() => {
-      const interval = setInterval(() => {
-        setValue((prevValue = 0) => {
-          if (prevValue === 100) {
-            return prevValue;
-          }
-          return prevValue + 5;
+const WithControlledValue = {
+    args: {
+        value: 0,
+        indeterminate: false
+    },
+    render: (args)=>{
+        const [value, setValue] = useState(args.value);
+        useEffect(()=>{
+            const interval = setInterval(()=>{
+                setValue((prevValue = 0)=>{
+                    if (100 === prevValue) return prevValue;
+                    return prevValue + 5;
+                });
+            }, 50);
+            return ()=>clearInterval(interval);
+        }, []);
+        return /*#__PURE__*/ react.createElement(Loader, {
+            ...args,
+            value: value,
+            text: `Loading ${value}%`
         });
-      }, 50);
-      return () => clearInterval(interval);
-    }, []);
-    return /*#__PURE__*/React.createElement(Loader, Object.assign({}, args, {
-      value: value,
-      text: `Loading ${value}%`
-    }));
-  }
+    }
 };
-export const WithText = {
-  args: {
-    text: "Loading..."
-  }
+const WithText = {
+    args: {
+        text: "Loading..."
+    }
 };
+export default Loader_stories;
+export { Accent, Default, Documentation, ExtraSmall, Large, Medium, Negative, Small, Subtle, WithControlledValue, WithText };
 
 //# sourceMappingURL=Loader.stories.js.map

package/Loader/Loader.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","useEffect","Loader","meta","title","component","parameters","layout","Documentation","args","size","variant","indeterminate","value","min","max","text","className","undefined","argTypes","description","control","options","type","Default","ExtraSmall","Small","Medium","Large","Accent","Subtle","Negative","decorators","Story","createElement","WithControlledValue","render","setValue","interval","setInterval","prevValue","clearInterval","Object","assign","WithText"],"sources":["Loader.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Loader } from \"./Loader.js\";\n\nconst meta: Meta<typeof Loader> = {\n    title: \"Components/Loader\",\n    component: Loader,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Loader>;\n\nexport const Documentation: Story = {\n    args: {\n        size: \"md\",\n        variant: \"accent\",\n        indeterminate: true,\n        value: 66,\n        min: 0,\n        max: 100,\n        text: \"Loading...\",\n        className: undefined\n    },\n    argTypes: {\n        size: {\n            description: \"Size of the loader\",\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\"]\n        },\n        variant: {\n            description: \"Visual style variant of the loader\",\n            control: \"select\",\n            options: [\"accent\", \"subtle\", \"negative\"]\n        },\n        indeterminate: {\n            description: \"Whether the loader should show indeterminate progress\",\n            control: \"boolean\"\n        },\n        value: {\n            description: \"Current progress value (when not indeterminate)\",\n            control: { type: \"number\", min: 0, max: 100 }\n        },\n        min: {\n            description: \"Minimum value for progress calculation\",\n            control: \"number\"\n        },\n        max: {\n            description: \"Maximum value for progress calculation\",\n            control: \"number\"\n        },\n        text: {\n            description: \"Optional text to display below the loader\",\n            control: \"text\"\n        },\n        className: {\n            description:\n                \"Additional CSS class names. You can pass multiple class names, separated by commas or spaces.\"\n        }\n    }\n};\n\nexport const Default: Story = {};\n\nexport const ExtraSmall: Story = {\n    args: {\n        size: \"xs\"\n    }\n};\n\nexport const Small: Story = {\n    args: {\n        size: \"sm\"\n    }\n};\n\nexport const Medium: Story = {\n    args: {\n        size: \"md\"\n    }\n};\n\nexport const Large: Story = {\n    args: {\n        size: \"lg\"\n    }\n};\n\nexport const Accent: Story = {\n    args: {\n        variant: \"accent\"\n    }\n};\n\nexport const Subtle: Story = {\n    args: {\n        variant: \"subtle\"\n    }\n};\n\nexport const Negative: Story = {\n    args: {\n        variant: \"negative\"\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-primary p-md rounded-md\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const WithControlledValue: Story = {\n    args: {\n        value: 0,\n        indeterminate: false\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n\n        useEffect(() => {\n            const interval = setInterval(() => {\n                setValue((prevValue = 0) => {\n                    if (prevValue === 100) {\n                        return prevValue;\n                    }\n                    return prevValue + 5;\n                });\n            }, 50);\n\n            return () => clearInterval(interval);\n        }, []);\n\n        return <Loader {...args} value={value} text={`Loading ${value}%`} />;\n    }\n};\n\nexport const WithText: Story = {\n    args: {\n        text: \"Loading...\"\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Loader/Loader.stories.js","sources":["../../src/Loader/Loader.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Loader } from \"./Loader.js\";\n\nconst meta: Meta<typeof Loader> = {\n    title: \"Components/Loader\",\n    component: Loader,\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Loader>;\n\nexport const Documentation: Story = {\n    args: {\n        size: \"md\",\n        variant: \"accent\",\n        indeterminate: true,\n        value: 66,\n        min: 0,\n        max: 100,\n        text: \"Loading...\",\n        className: undefined\n    },\n    argTypes: {\n        size: {\n            description: \"Size of the loader\",\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\"]\n        },\n        variant: {\n            description: \"Visual style variant of the loader\",\n            control: \"select\",\n            options: [\"accent\", \"subtle\", \"negative\"]\n        },\n        indeterminate: {\n            description: \"Whether the loader should show indeterminate progress\",\n            control: \"boolean\"\n        },\n        value: {\n            description: \"Current progress value (when not indeterminate)\",\n            control: { type: \"number\", min: 0, max: 100 }\n        },\n        min: {\n            description: \"Minimum value for progress calculation\",\n            control: \"number\"\n        },\n        max: {\n            description: \"Maximum value for progress calculation\",\n            control: \"number\"\n        },\n        text: {\n            description: \"Optional text to display below the loader\",\n            control: \"text\"\n        },\n        className: {\n            description:\n                \"Additional CSS class names. You can pass multiple class names, separated by commas or spaces.\"\n        }\n    }\n};\n\nexport const Default: Story = {};\n\nexport const ExtraSmall: Story = {\n    args: {\n        size: \"xs\"\n    }\n};\n\nexport const Small: Story = {\n    args: {\n        size: \"sm\"\n    }\n};\n\nexport const Medium: Story = {\n    args: {\n        size: \"md\"\n    }\n};\n\nexport const Large: Story = {\n    args: {\n        size: \"lg\"\n    }\n};\n\nexport const Accent: Story = {\n    args: {\n        variant: \"accent\"\n    }\n};\n\nexport const Subtle: Story = {\n    args: {\n        variant: \"subtle\"\n    }\n};\n\nexport const Negative: Story = {\n    args: {\n        variant: \"negative\"\n    },\n    decorators: [\n        Story => (\n            <div className=\"bg-primary p-md rounded-md\">\n                <Story />\n            </div>\n        )\n    ]\n};\n\nexport const WithControlledValue: Story = {\n    args: {\n        value: 0,\n        indeterminate: false\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n\n        useEffect(() => {\n            const interval = setInterval(() => {\n                setValue((prevValue = 0) => {\n                    if (prevValue === 100) {\n                        return prevValue;\n                    }\n                    return prevValue + 5;\n                });\n            }, 50);\n\n            return () => clearInterval(interval);\n        }, []);\n\n        return <Loader {...args} value={value} text={`Loading ${value}%`} />;\n    }\n};\n\nexport const WithText: Story = {\n    args: {\n        text: \"Loading...\"\n    }\n};\n"],"names":["meta","Loader","Documentation","undefined","Default","ExtraSmall","Small","Medium","Large","Accent","Subtle","Negative","Story","WithControlledValue","args","value","setValue","useState","useEffect","interval","setInterval","prevValue","clearInterval","WithText"],"mappings":";;AAIA,MAAMA,OAA4B;IAC9B,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;AACJ;AAEA,uBAAeD;AAGR,MAAME,gBAAuB;IAChC,MAAM;QACF,MAAM;QACN,SAAS;QACT,eAAe;QACf,OAAO;QACP,KAAK;QACL,KAAK;QACL,MAAM;QACN,WAAWC;IACf;IACA,UAAU;QACN,MAAM;YACF,aAAa;YACb,SAAS;YACT,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;aAAK;QACrC;QACA,SAAS;YACL,aAAa;YACb,SAAS;YACT,SAAS;gBAAC;gBAAU;gBAAU;aAAW;QAC7C;QACA,eAAe;YACX,aAAa;YACb,SAAS;QACb;QACA,OAAO;YACH,aAAa;YACb,SAAS;gBAAE,MAAM;gBAAU,KAAK;gBAAG,KAAK;YAAI;QAChD;QACA,KAAK;YACD,aAAa;YACb,SAAS;QACb;QACA,KAAK;YACD,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,WAAW;YACP,aACI;QACR;IACJ;AACJ;AAEO,MAAMC,UAAiB,CAAC;AAExB,MAAMC,aAAoB;IAC7B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,QAAe;IACxB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,QAAe;IACxB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,SAAS;IACb;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,SAAS;IACb;AACJ;AAEO,MAAMC,WAAkB;IAC3B,MAAM;QACF,SAAS;IACb;IACA,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBAAI,WAAU;6BACX,oBAACA,OAAAA;KAGZ;AACL;AAEO,MAAMC,sBAA6B;IACtC,MAAM;QACF,OAAO;QACP,eAAe;IACnB;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK;QAE7CI,UAAU;YACN,MAAMC,WAAWC,YAAY;gBACzBJ,SAAS,CAACK,YAAY,CAAC;oBACnB,IAAIA,AAAc,QAAdA,WACA,OAAOA;oBAEX,OAAOA,YAAY;gBACvB;YACJ,GAAG;YAEH,OAAO,IAAMC,cAAcH;QAC/B,GAAG,EAAE;QAEL,OAAO,WAAP,GAAO,oBAAClB,QAAMA;YAAE,GAAGa,IAAI;YAAE,OAAOC;YAAO,MAAM,CAAC,QAAQ,EAAEA,MAAM,CAAC,CAAC;;IACpE;AACJ;AAEO,MAAMQ,WAAkB;IAC3B,MAAM;QACF,MAAM;IACV;AACJ"}

package/Loader/OverlayLoader.js

@@ -1,17 +1,12 @@
-import React from "react";
+import react from "react";
 import { Loader } from "./Loader.js";
 import { cn, makeDecoratable } from "../utils.js";
-const DecoratableOverlayLoader = ({
-  className,
-  size = "lg",
-  ...props
-}) => {
-  return /*#__PURE__*/React.createElement("div", {
-    className: cn("w-full h-full absolute inset-0 bg-neutral-base/80 flex items-center justify-center z-30", className)
-  }, /*#__PURE__*/React.createElement(Loader, Object.assign({}, props, {
-    size: size
-  })));
-};
+const DecoratableOverlayLoader = ({ className, size = "lg", ...props })=>/*#__PURE__*/ react.createElement("div", {
+        className: cn("w-full h-full absolute inset-0 bg-neutral-base/80 flex items-center justify-center z-30", className)
+    }, /*#__PURE__*/ react.createElement(Loader, {
+        ...props,
+        size: size
+    }));
 const OverlayLoader = makeDecoratable("OverlayLoader", DecoratableOverlayLoader);
 export { OverlayLoader };
 

package/Loader/OverlayLoader.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Loader","cn","makeDecoratable","DecoratableOverlayLoader","className","size","props","createElement","Object","assign","OverlayLoader"],"sources":["OverlayLoader.tsx"],"sourcesContent":["import React from \"react\";\nimport type { LoaderProps } from \"./Loader.js\";\nimport { Loader } from \"./Loader.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\ntype OverlayLoaderProps = LoaderProps;\n\nconst DecoratableOverlayLoader = ({ className, size = \"lg\", ...props }: OverlayLoaderProps) => {\n    return (\n        <div\n            className={cn(\n                \"w-full h-full absolute inset-0 bg-neutral-base/80 flex items-center justify-center z-30\",\n                className\n            )}\n        >\n            <Loader {...props} size={size} />\n        </div>\n    );\n};\n\nconst OverlayLoader = makeDecoratable(\"OverlayLoader\", DecoratableOverlayLoader);\n\nexport { OverlayLoader, type OverlayLoaderProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,MAAM;AACf,SAASC,EAAE,EAAEC,eAAe;AAI5B,MAAMC,wBAAwB,GAAGA,CAAC;EAAEC,SAAS;EAAEC,IAAI,GAAG,IAAI;EAAE,GAAGC;AAA0B,CAAC,KAAK;EAC3F,oBACIP,KAAA,CAAAQ,aAAA;IACIH,SAAS,EAAEH,EAAE,CACT,yFAAyF,EACzFG,SACJ;EAAE,gBAEFL,KAAA,CAAAQ,aAAA,CAACP,MAAM,EAAAQ,MAAA,CAAAC,MAAA,KAAKH,KAAK;IAAED,IAAI,EAAEA;EAAK,EAAE,CAC/B,CAAC;AAEd,CAAC;AAED,MAAMK,aAAa,GAAGR,eAAe,CAAC,eAAe,EAAEC,wBAAwB,CAAC;AAEhF,SAASO,aAAa","ignoreList":[]}
+{"version":3,"file":"Loader/OverlayLoader.js","sources":["../../src/Loader/OverlayLoader.tsx"],"sourcesContent":["import React from \"react\";\nimport type { LoaderProps } from \"./Loader.js\";\nimport { Loader } from \"./Loader.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\ntype OverlayLoaderProps = LoaderProps;\n\nconst DecoratableOverlayLoader = ({ className, size = \"lg\", ...props }: OverlayLoaderProps) => {\n    return (\n        <div\n            className={cn(\n                \"w-full h-full absolute inset-0 bg-neutral-base/80 flex items-center justify-center z-30\",\n                className\n            )}\n        >\n            <Loader {...props} size={size} />\n        </div>\n    );\n};\n\nconst OverlayLoader = makeDecoratable(\"OverlayLoader\", DecoratableOverlayLoader);\n\nexport { OverlayLoader, type OverlayLoaderProps };\n"],"names":["DecoratableOverlayLoader","className","size","props","cn","Loader","OverlayLoader","makeDecoratable"],"mappings":";;;AAOA,MAAMA,2BAA2B,CAAC,EAAEC,SAAS,EAAEC,OAAO,IAAI,EAAE,GAAGC,OAA2B,GAC/E,WAAP,GACI,oBAAC;QACG,WAAWC,GACP,2FACAH;qBAGJ,oBAACI,QAAMA;QAAE,GAAGF,KAAK;QAAE,MAAMD;;AAKrC,MAAMI,gBAAgBC,gBAAgB,iBAAiBP"}