@onepercentio/one-ui 1.3.3 → 1.3.5

package/dist/components/LavaLamp/v2/LavaLamp.js

@@ -0,0 +1,161 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const useMergeRefs_1 = __importDefault(require("../../../hooks/useMergeRefs"));
+const LavaLamp_data_1 = __importStar(require("../LavaLamp.data"));
+const LavaLamp_module_scss_1 = __importDefault(require("./LavaLamp.module.scss"));
+const Orbs_1 = require("../../../models/Orbs");
+function LavaLamp({ className, children, }) {
+    const guideConfig = (0, react_1.useRef)({
+        size: 0,
+        sizeTimestamp: Date.now(),
+        sizeIncrement: 0,
+        x: 0,
+        y: 0,
+        posTimestamp: Date.now(),
+        posIncrement: [0, 0],
+    });
+    const { relativeTo, circlesConfig, d } = (0, LavaLamp_data_1.default)((x, y) => {
+        guideConfig.current.posIncrement = [
+            x - guideConfig.current.x,
+            y - guideConfig.current.y,
+        ];
+        guideConfig.current.x = x;
+        guideConfig.current.y = y;
+        guideConfig.current.posTimestamp = Date.now();
+    }, (_size) => {
+        const size = _size * 1.2;
+        guideConfig.current.sizeIncrement =
+            guideConfig.current.size === 0 ? 0 : size - guideConfig.current.size;
+        guideConfig.current.size = size;
+        guideConfig.current.sizeTimestamp = Date.now();
+    });
+    const _canvasRef = (0, react_1.useRef)(null);
+    const canvasRef = (0, useMergeRefs_1.default)(_canvasRef, relativeTo);
+    (0, react_1.useEffect)(() => {
+        if (!d)
+            return;
+        const fc = canvasRef.current;
+        const baseColor = getComputedStyle(relativeTo.current).getPropertyValue("--digital-blue") || "#000000";
+        var c = document.createElement("canvas"), w = (c.width = fc.width = d.width), h = (c.height = fc.height = d.height), ctx = c.getContext("2d"), fctx = fc.getContext("2d"), // f means final
+        opts = {
+            orbCount: circlesConfig.length,
+            baseVel: Math.max(d.width * 0.001, 1),
+            addedVel: Math.max(d.width * 0.001, 1),
+            alphaThreshold: 200,
+        }, orbs = [];
+        class CanvasOrbDrawer {
+            newGradient(color, radius) {
+                const gradient = ctx.createRadialGradient(0, 0, 0, 0, 0, radius);
+                gradient.addColorStop(0, `${color}ff`);
+                gradient.addColorStop(0.8, `${color}cc`);
+                gradient.addColorStop(1, `${color}00`);
+                return gradient;
+            }
+            oldDrawCircle(x, y, radius) {
+                var _a;
+                ctx.fillStyle = (_a = this.gradient) !== null && _a !== void 0 ? _a : this.newGradient(baseColor, radius);
+                ctx.translate(x | 0, y | 0);
+                ctx.beginPath();
+                ctx.arc(0, 0, radius, 0, Math.PI * 2);
+                ctx.fill();
+                ctx.translate(-x | 0, -y | 0);
+            }
+            drawOrb(x, y, radius) {
+                this.oldDrawCircle(x, y, radius);
+            }
+            constructor(gradientRadius) {
+                if (gradientRadius)
+                    this.gradient = this.newGradient(baseColor, gradientRadius);
+            }
+        }
+        let animFrame;
+        function anim() {
+            animFrame = window.requestAnimationFrame(anim);
+            ctx.clearRect(0, 0, w, h);
+            fctx.fillStyle = "#0000";
+            fctx.fillRect(0, 0, w, h);
+            for (var i = 0; i < orbs.length; i++) {
+                const thisOrb = orbs[i];
+                if (thisOrb instanceof Orbs_1.Orb) {
+                    thisOrb.step();
+                }
+                else {
+                    thisOrb.step(guideConfig.current.size, guideConfig.current.sizeIncrement, guideConfig.current.sizeTimestamp, guideConfig.current.posTimestamp, guideConfig.current, {
+                        x: guideConfig.current.posIncrement[0],
+                        y: guideConfig.current.posIncrement[1],
+                    });
+                }
+            }
+            var image = ctx.getImageData(0, 0, w, h), data = new Uint8Array(image.data.buffer);
+            for (var i = 3; i < data.length; i += 4)
+                data[i] /= data[i] < opts.alphaThreshold ? 6 : 1;
+            fctx.putImageData(image, 0, 0);
+        }
+        function randomVelocity() {
+            return (opts.baseVel + opts.addedVel * Math.random()) | 0;
+        }
+        const orbBounds = { width: w, height: h };
+        for (let circleConfig of circlesConfig) {
+            const radius = circleConfig.baseSize * 1.5;
+            const randomRadius = (radius + (radius / 2) * Math.random()) | 0;
+            const drawerInstance = new CanvasOrbDrawer(randomRadius);
+            orbs.push(new Orbs_1.Orb(drawerInstance, randomVelocity(), orbBounds, randomRadius));
+        }
+        const guideOrbInstance = new Orbs_1.GuideOrb(new CanvasOrbDrawer(), LavaLamp_data_1.transitionPositionMs);
+        let guideOrbAutoInstance;
+        orbs.push(guideOrbInstance);
+        canvasRef.current.parentElement.onmouseleave = () => {
+            const indexOfGuide = orbs.indexOf(guideOrbInstance);
+            if (indexOfGuide !== -1) {
+                const drawerInstance = new CanvasOrbDrawer(guideOrbInstance.lastRadius);
+                guideOrbAutoInstance = new Orbs_1.Orb(drawerInstance, randomVelocity(), orbBounds, guideOrbInstance.lastRadius);
+                guideOrbAutoInstance.radius = guideOrbInstance.lastRadius;
+                guideOrbAutoInstance.x = guideOrbInstance.lastX;
+                guideOrbAutoInstance.y = guideOrbInstance.lastY;
+                orbs.splice(indexOfGuide, 1);
+                orbs.push(guideOrbAutoInstance);
+            }
+        };
+        canvasRef.current.parentElement.onmouseenter = () => {
+            if (orbs.indexOf(guideOrbInstance) === -1) {
+                orbs.push(guideOrbInstance);
+                orbs.splice(orbs.indexOf(guideOrbAutoInstance), 1);
+            }
+        };
+        anim();
+        return () => {
+            window.cancelAnimationFrame(animFrame);
+        };
+    }, [circlesConfig]);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: `${className} ${LavaLamp_module_scss_1.default.root}`, children: [(0, jsx_runtime_1.jsx)("canvas", { ref: canvasRef }), (0, jsx_runtime_1.jsx)("div", { children: children })] }));
+}
+exports.default = LavaLamp;
+//# sourceMappingURL=LavaLamp.js.map

package/dist/components/LavaLamp/v2/LavaLamp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LavaLamp.js","sourceRoot":"","sources":["../../../../src/components/LavaLamp/v2/LavaLamp.tsx"],"names":[],"mappings":"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"}

package/dist/components/LavaLamp/v2/LavaLamp.module.scss

@@ -0,0 +1,23 @@
+@use 'sass:math';
+
+$transitionMs: math.div(1000, 5);
+$transitionPositionMs: math.div($transitionMs, 2);
+@value transitionMs #{$transitionMs};
+@value transitionPositionMs #{$transitionPositionMs};
+
+.root {
+  position: relative;
+  > canvas {
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    width: 100%;
+    height: 100%;
+  }
+  > div {
+    position: relative;
+    z-index: 1;
+  }
+}

package/dist/components/LinkToId/LinkToId.d.ts

@@ -0,0 +1,11 @@
+import { PropsWithChildren } from "react";
+import { FromOnePercentUtility } from "../../type-utils";
+export declare function scrollToId(id: FromOnePercentUtility<'PageSections'>, shouldScrollToCenter?: boolean): void;
+/**
+ * This component creates an interactive element that, when clicked, either scrolls to a section on the page or opens a link in a new tab.
+ **/
+export default function LinkToId({ children, id, link, scrollToCenter, }: PropsWithChildren<{
+    id?: FromOnePercentUtility<'PageSections'>;
+    link?: string;
+    scrollToCenter?: boolean;
+}>): import("react/jsx-runtime").JSX.Element;

package/dist/components/LinkToId/LinkToId.js

@@ -0,0 +1,33 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.scrollToId = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const LinkToId_module_scss_1 = __importDefault(require("./LinkToId.module.scss"));
+function scrollToId(id, shouldScrollToCenter = false) {
+    const el = document.getElementById(id);
+    if (el) {
+        const elStyles = window.getComputedStyle(el);
+        const padding = Number(elStyles.paddingTop.replace(/[^0-9]+/g, ""));
+        const elementPosition = el.offsetTop;
+        const elementHeight = el.clientHeight;
+        window.scrollTo({
+            behavior: "smooth",
+            //Go to element, scroll half the screen height scrollback half the element height
+            top: shouldScrollToCenter
+                ? elementPosition + elementHeight / 2 - window.innerHeight / 2
+                : elementPosition + padding,
+        });
+    }
+}
+exports.scrollToId = scrollToId;
+/**
+ * This component creates an interactive element that, when clicked, either scrolls to a section on the page or opens a link in a new tab.
+ **/
+function LinkToId({ children, id, link, scrollToCenter = false, }) {
+    return link ? ((0, jsx_runtime_1.jsx)("span", { className: LinkToId_module_scss_1.default.root, onClick: () => window.open(link, "_blank"), children: children })) : ((0, jsx_runtime_1.jsx)("span", { className: LinkToId_module_scss_1.default.root, onClick: () => scrollToId(id, scrollToCenter), children: children }));
+}
+exports.default = LinkToId;
+//# sourceMappingURL=LinkToId.js.map

package/dist/components/LinkToId/LinkToId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinkToId.js","sourceRoot":"","sources":["../../../src/components/LinkToId/LinkToId.tsx"],"names":[],"mappings":";;;;;;;AACA,kFAA4C;AAG5C,SAAgB,UAAU,CACxB,EAAyC,EACzC,uBAAgC,KAAK;IAErC,MAAM,EAAE,GAAG,QAAQ,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC;IAEvC,IAAI,EAAE,EAAE,CAAC;QACP,MAAM,QAAQ,GAAG,MAAM,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;QAC7C,MAAM,OAAO,GAAG,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,OAAO,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC;QACpE,MAAM,eAAe,GAAG,EAAE,CAAC,SAAS,CAAC;QACrC,MAAM,aAAa,GAAG,EAAE,CAAC,YAAY,CAAC;QAEtC,MAAM,CAAC,QAAQ,CAAC;YACd,QAAQ,EAAE,QAAQ;YAClB,iFAAiF;YACjF,GAAG,EAAE,oBAAoB;gBACvB,CAAC,CAAC,eAAe,GAAG,aAAa,GAAG,CAAC,GAAG,MAAM,CAAC,WAAW,GAAG,CAAC;gBAC9D,CAAC,CAAC,eAAe,GAAG,OAAO;SAC9B,CAAC,CAAC;IACL,CAAC;AACH,CAAC;AApBD,gCAoBC;AAED;;IAEI;AACJ,SAAwB,QAAQ,CAAC,EAC/B,QAAQ,EACR,EAAE,EACF,IAAI,EACJ,cAAc,GAAG,KAAK,GAKtB;IACA,OAAO,IAAI,CAAC,CAAC,CAAC,CACZ,iCAAM,SAAS,EAAE,8BAAM,CAAC,IAAI,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,EAAE,QAAQ,CAAC,YACrE,QAAQ,GACJ,CACR,CAAC,CAAC,CAAC,CACF,iCACE,SAAS,EAAE,8BAAM,CAAC,IAAI,EACtB,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,EAAG,EAAE,cAAc,CAAC,YAE7C,QAAQ,GACJ,CACR,CAAC;AACJ,CAAC;AAtBD,2BAsBC"}

package/dist/components/LinkToId/LinkToId.module.scss

@@ -0,0 +1,4 @@
+.root:hover {
+    text-decoration: underline;
+    cursor: pointer;
+}

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

@@ -0,0 +1,2 @@
+export { default } from "./LinkToId";
+export * from "./LinkToId";

package/dist/components/LinkToId/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var LinkToId_1 = require("./LinkToId");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(LinkToId_1).default; } });
+__exportStar(require("./LinkToId"), exports);
+//# sourceMappingURL=index.js.map

package/dist/components/LinkToId/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LinkToId/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,uCAAqC;AAA5B,oHAAA,OAAO,OAAA;AAChB,6CAA2B"}

package/dist/components/Loader/Loader.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+/**
+ * A simple loader component that displays a loading indicator.
+ * Used to show users that content is being loaded.
+ **/
+export default function Loader({ className, ...props }: {
+    className?: string;
+} & React.HTMLProps<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;

package/dist/components/Loader/Loader.js

@@ -0,0 +1,28 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Loader_module_scss_1 = __importDefault(require("./Loader.module.scss"));
+/**
+ * A simple loader component that displays a loading indicator.
+ * Used to show users that content is being loaded.
+ **/
+function Loader(_a) {
+    var { className = "" } = _a, props = __rest(_a, ["className"]);
+    return ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: `${Loader_module_scss_1.default.indicator} ${className}` }, props, { children: [(0, jsx_runtime_1.jsx)("span", {}), (0, jsx_runtime_1.jsx)("span", {}), (0, jsx_runtime_1.jsx)("span", {})] })));
+}
+exports.default = Loader;
+//# sourceMappingURL=Loader.js.map

package/dist/components/Loader/Loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loader.js","sourceRoot":"","sources":["../../../src/components/Loader/Loader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AACA,8EAA0C;AAE1C;;;IAGI;AACJ,SAAwB,MAAM,CAAC,EAG4B;QAH5B,EAC7B,SAAS,GAAG,EAAE,OAE2C,EADtD,KAAK,cAFqB,aAG9B,CADS;IAER,OAAO,CACL,gDAAM,SAAS,EAAE,GAAG,4BAAM,CAAC,SAAS,IAAI,SAAS,EAAE,IAAM,KAAK,eAC5D,kCAAQ,EACR,kCAAQ,EACR,kCAAQ,KACH,CACR,CAAC;AACJ,CAAC;AAXD,yBAWC"}

package/dist/components/Loader/Loader.module.scss

@@ -0,0 +1,40 @@
+@use "../../assets/styles/variables.scss" as *;
+
+.indicator {
+  white-space: nowrap;
+  font-size: 14px;
+  & span {
+    display: inline-block;
+    width: 0.75em;
+    height: 0.75em;
+    border-radius: 0.375em;
+    margin-left: 4px;
+    background-color: var(--loader--indicator-bg, $digitalBlue);
+    animation-name: transparentToOpaque;
+    animation-duration: $normal;
+    animation-iteration-count: infinite;
+    animation-timing-function: ease-out;
+    &:nth-child(1) {
+      margin-left: initial;
+      animation-delay: 0;
+    }
+    &:nth-child(2) {
+      animation-delay: $veryFast;
+    }
+    &:nth-child(3) {
+      animation-delay: $fast;
+    }
+  }
+}
+
+@keyframes transparentToOpaque {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}

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

@@ -0,0 +1,2 @@
+export { default } from "./Loader";
+export * from "./Loader";

package/dist/components/Loader/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var Loader_1 = require("./Loader");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Loader_1).default; } });
+__exportStar(require("./Loader"), exports);
+//# sourceMappingURL=index.js.map

package/dist/components/Loader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Loader/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,mCAAmC;AAA1B,kHAAA,OAAO,OAAA;AAChB,2CAAyB"}

package/dist/components/LoaderDotsIndicator/LoaderDotsIndicator.d.ts

@@ -0,0 +1,12 @@
+/**
+ * . .. ... . .. ...
+ **/
+/**
+ * A simple loading indicator that shows animated dots.
+ * It displays a rotating sequence of dots to indicate that something is loading.
+ */
+export default function LoaderDotsIndicator({ dotsCount, lockSize, }: {
+    dotsCount?: number;
+    /** Makes the dots so that they do not affect layout size */
+    lockSize?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/components/LoaderDotsIndicator/LoaderDotsIndicator.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+/**
+ * . .. ... . .. ...
+ **/
+/**
+ * A simple loading indicator that shows animated dots.
+ * It displays a rotating sequence of dots to indicate that something is loading.
+ */
+function LoaderDotsIndicator({ dotsCount = 3, lockSize = false, }) {
+    const [text, setText] = (0, react_1.useState)(".");
+    (0, react_1.useEffect)(() => {
+        const fullText = new Array(dotsCount).fill(".").join("");
+        const intervalId = setInterval(() => {
+            setText((a) => (a === fullText ? "." : a + "."));
+        }, 250);
+        return () => clearInterval(intervalId);
+    }, [dotsCount]);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [text, lockSize && ((0, jsx_runtime_1.jsx)("span", { style: { color: "#0000" }, children: new Array(dotsCount - text.length).fill(".") }))] }));
+}
+exports.default = LoaderDotsIndicator;
+//# sourceMappingURL=LoaderDotsIndicator.js.map

package/dist/components/LoaderDotsIndicator/LoaderDotsIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoaderDotsIndicator.js","sourceRoot":"","sources":["../../../src/components/LoaderDotsIndicator/LoaderDotsIndicator.tsx"],"names":[],"mappings":";;;AAAA,iCAAmD;AAEnD;;IAEI;AACJ;;;GAGG;AACH,SAAwB,mBAAmB,CAAC,EAC1C,SAAS,GAAG,CAAC,EACb,QAAQ,GAAG,KAAK,GAKjB;IACC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,IAAA,gBAAQ,EAAC,GAAG,CAAC,CAAC;IACtC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,IAAI,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACzD,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;YAClC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;QACnD,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;IACzC,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,CACL,6DACG,IAAI,EACJ,QAAQ,IAAI,CACX,iCAAM,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,YAC5B,IAAI,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GACxC,CACR,IACA,CACJ,CAAC;AACJ,CAAC;AA5BD,sCA4BC"}

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

@@ -0,0 +1,2 @@
+export { default } from "./LoaderDotsIndicator";
+export * from "./LoaderDotsIndicator";

package/dist/components/LoaderDotsIndicator/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var LoaderDotsIndicator_1 = require("./LoaderDotsIndicator");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(LoaderDotsIndicator_1).default; } });
+__exportStar(require("./LoaderDotsIndicator"), exports);
+//# sourceMappingURL=index.js.map

package/dist/components/LoaderDotsIndicator/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LoaderDotsIndicator/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,6DAAgD;AAAvC,+HAAA,OAAO,OAAA;AAChB,wDAAsC"}

package/dist/components/LoopableVideo/LoopableVideo.d.ts

@@ -0,0 +1,12 @@
+import { DetailedHTMLProps, HTMLAttributes } from "react";
+/**
+ * Plays a video and loops between the end and the timestamp you set
+ */
+/**
+ * This component displays a video that automatically restarts from a specific point when it reaches the end, creating a seamless loop effect.
+ */
+export default function LoopableVideo({ videoSrc, percentToBackTo, ...props }: {
+    videoSrc: string;
+    /** A value between 0-1 indicating the timestamp to go back to */
+    percentToBackTo: number;
+} & DetailedHTMLProps<HTMLAttributes<HTMLVideoElement>, HTMLVideoElement>): import("react/jsx-runtime").JSX.Element;

package/dist/components/LoopableVideo/LoopableVideo.js

@@ -0,0 +1,33 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ * Plays a video and loops between the end and the timestamp you set
+ */
+/**
+ * This component displays a video that automatically restarts from a specific point when it reaches the end, creating a seamless loop effect.
+ */
+function LoopableVideo(_a) {
+    var { videoSrc, percentToBackTo } = _a, props = __rest(_a, ["videoSrc", "percentToBackTo"]);
+    if (process.env.NODE_ENV === "development")
+        if (percentToBackTo < 0 || percentToBackTo > 1)
+            throw new Error(`percentToBackTo should be a value between 0-1`);
+    return ((0, jsx_runtime_1.jsx)("video", Object.assign({ autoPlay: true, muted: true, onEnded: ({ currentTarget }) => {
+            const el = currentTarget;
+            el.currentTime = el.duration * percentToBackTo;
+            el.play();
+        } }, props, { children: (0, jsx_runtime_1.jsx)("source", { src: videoSrc }) })));
+}
+exports.default = LoopableVideo;
+//# sourceMappingURL=LoopableVideo.js.map

package/dist/components/LoopableVideo/LoopableVideo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoopableVideo.js","sourceRoot":"","sources":["../../../src/components/LoopableVideo/LoopableVideo.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAOA;;GAEG;AACH;;GAEG;AACH,SAAwB,aAAa,CAAC,EAQmC;QARnC,EACpC,QAAQ,EACR,eAAe,OAMwD,EALpE,KAAK,cAH4B,+BAIrC,CADS;IAMR,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,aAAa;QACxC,IAAI,eAAe,GAAG,CAAC,IAAI,eAAe,GAAG,CAAC;YAC5C,MAAM,IAAI,KAAK,CAAC,+CAA+C,CAAC,CAAC;IACrE,OAAO,CACL,gDACE,QAAQ,QACR,KAAK,QACL,OAAO,EAAE,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE;YAC7B,MAAM,EAAE,GAAG,aAA0D,CAAC;YACtE,EAAE,CAAC,WAAW,GAAG,EAAE,CAAC,QAAQ,GAAG,eAAe,CAAC;YAC/C,EAAE,CAAC,IAAI,EAAE,CAAC;QACZ,CAAC,IACG,KAAK,cAET,mCAAQ,GAAG,EAAE,QAAQ,GAAI,IACnB,CACT,CAAC;AACJ,CAAC;AA1BD,gCA0BC"}

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

@@ -0,0 +1,2 @@
+export { default } from "./LoopableVideo";
+export * from "./LoopableVideo";

package/dist/components/LoopableVideo/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+var LoopableVideo_1 = require("./LoopableVideo");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(LoopableVideo_1).default; } });
+__exportStar(require("./LoopableVideo"), exports);
+//# sourceMappingURL=index.js.map

package/dist/components/LoopableVideo/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LoopableVideo/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,iDAA0C;AAAjC,yHAAA,OAAO,OAAA;AAChB,kDAAgC"}

package/dist/components/MainGrid/MainGrid.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+/**
+ * This layout divides the screen in 3 fragments and provides a responsive adaptation when on mobile
+ **/
+/**
+ * A layout component that arranges content in three sections (left, center, right)
+ * and automatically adjusts for mobile devices
+ */
+declare const MainGrid: React.ForwardRefExoticComponent<{
+    leftContent?: React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | undefined;
+    rightContent?: React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | undefined;
+    children: React.ReactElement;
+} & React.RefAttributes<Pick<{
+    setOrientation: (orientation: "forward" | "backward") => void;
+    sectionRef: React.RefObject<HTMLDivElement | null>;
+}, "setOrientation">>>;
+export default MainGrid;

package/dist/components/MainGrid/MainGrid.js

@@ -0,0 +1,32 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const UncontrolledTransition_1 = __importDefault(require("../UncontrolledTransition"));
+const MainGrid_module_scss_1 = __importDefault(require("./MainGrid.module.scss"));
+function _MainGrid({ children, leftContent, rightContent, }, ref) {
+    const refs = [
+        (0, react_1.useRef)(null),
+        (0, react_1.useRef)(null),
+        (0, react_1.useRef)(null),
+    ];
+    (0, react_1.useImperativeHandle)(ref, () => ({
+        setOrientation: (orientation) => {
+            refs.forEach((r) => { var _a; return (_a = r.current) === null || _a === void 0 ? void 0 : _a.setOrientation(orientation); });
+        },
+    }), []);
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", { className: MainGrid_module_scss_1.default.container, children: [(0, jsx_runtime_1.jsx)("div", { className: leftContent ? MainGrid_module_scss_1.default.content : "", children: (0, jsx_runtime_1.jsx)(UncontrolledTransition_1.default, { className: MainGrid_module_scss_1.default.section, ref: refs[0], children: leftContent }) }), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(UncontrolledTransition_1.default, { className: MainGrid_module_scss_1.default.section, ref: refs[1], children: children }) }), (0, jsx_runtime_1.jsx)("div", { className: rightContent ? MainGrid_module_scss_1.default.content : "", children: (0, jsx_runtime_1.jsx)(UncontrolledTransition_1.default, { className: MainGrid_module_scss_1.default.section, ref: refs[2], children: rightContent }) })] }) }));
+}
+/**
+ * This layout divides the screen in 3 fragments and provides a responsive adaptation when on mobile
+ **/
+/**
+ * A layout component that arranges content in three sections (left, center, right)
+ * and automatically adjusts for mobile devices
+ */
+const MainGrid = (0, react_1.forwardRef)(_MainGrid);
+exports.default = MainGrid;
+//# sourceMappingURL=MainGrid.js.map

package/dist/components/MainGrid/MainGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MainGrid.js","sourceRoot":"","sources":["../../../src/components/MainGrid/MainGrid.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAMe;AACf,uFAA+D;AAC/D,kFAA4C;AAE5C,SAAS,SAAS,CAChB,EACE,QAAQ,EACR,WAAW,EACX,YAAY,GAKb,EACD,GAEC;IAED,MAAM,IAAI,GAAG;QACX,IAAA,cAAM,EAA4C,IAAI,CAAC;QACvD,IAAA,cAAM,EAA4C,IAAI,CAAC;QACvD,IAAA,cAAM,EAA4C,IAAI,CAAC;KACxD,CAAC;IAEF,IAAA,2BAAmB,EACjB,GAAG,EACH,GAAG,EAAE,CAAC,CAAC;QACL,cAAc,EAAE,CAAC,WAAW,EAAE,EAAE;YAC9B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,WAAC,OAAA,MAAA,CAAC,CAAC,OAAO,0CAAE,cAAc,CAAC,WAAW,CAAC,CAAA,EAAA,CAAC,CAAC;QAC9D,CAAC;KACF,CAAC,EACF,EAAE,CACH,CAAC;IAEF,OAAO,CACL,2DACE,iCAAK,SAAS,EAAE,8BAAM,CAAC,SAAS,aAC9B,gCAAK,SAAS,EAAE,WAAW,CAAC,CAAC,CAAC,8BAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,YAC/C,uBAAC,gCAAsB,IAAC,SAAS,EAAE,8BAAM,CAAC,OAAO,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,YAC5D,WAAW,GACW,GACrB,EACN,0CACE,uBAAC,gCAAsB,IAAC,SAAS,EAAE,8BAAM,CAAC,OAAO,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,YAC5D,QAAQ,GACc,GACrB,EACN,gCAAK,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,8BAAM,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,YAChD,uBAAC,gCAAsB,IAAC,SAAS,EAAE,8BAAM,CAAC,OAAO,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC,CAAC,YAC5D,YAAY,GACU,GACrB,IACF,GACL,CACJ,CAAC;AACJ,CAAC;AAED;;IAEI;AACJ;;;GAGG;AACH,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAAC,SAAS,CAAC,CAAC;AACvC,kBAAe,QAAQ,CAAC"}