@koine/react 1.0.9 → 1.0.12

package/node/Pagination/PaginationNav.js

@@ -1,46 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.KoinePaginationNav = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const cg_1 = require("react-icons/cg");
-const utils_1 = require("@koine/utils");
-const Root = styled_components_1.default.nav `
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 20px 0 40px;
-  font-weight: 600;
-
-  & a {
-    text-decoration: none;
-  }
-`;
-const item = `
-  display: block;
-  padding: 5px 10px;
-`;
-const ItemCurrent = styled_components_1.default.span `
-  ${item}
-  background: var(--accent400);
-  border-radius: 2px;
-`;
-const ItemLink = styled_components_1.default.a `
-  ${item}
-
-  ${(props) => (props.prev ? "color: var(--grey100);" : "")}
-`;
-const DotsSeparator = styled_components_1.default.span `
-  color: var(--grey100);
-`;
-const arrow = `display: flex; font-size: 20px;`;
-const ItemPrev = styled_components_1.default.a `
-  ${arrow}
-`;
-const ItemNext = styled_components_1.default.a `
-  ${arrow}
-`;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var cg_1 = require("react-icons/cg");
+var utils_1 = require("@koine/utils");
+var Root = styled_components_1.default.nav(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 20px 0 40px;\n  font-weight: 600;\n\n  & a {\n    text-decoration: none;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 20px 0 40px;\n  font-weight: 600;\n\n  & a {\n    text-decoration: none;\n  }\n"])));
+var item = "\n  display: block;\n  padding: 5px 10px;\n";
+var ItemCurrent = styled_components_1.default.span(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  ", "\n  background: var(--accent400);\n  border-radius: 2px;\n"], ["\n  ", "\n  background: var(--accent400);\n  border-radius: 2px;\n"])), item);
+var ItemLink = styled_components_1.default.a(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  ", "\n\n  ", "\n"], ["\n  ", "\n\n  ", "\n"])), item, function (props) { return (props.prev ? "color: var(--grey100);" : ""); });
+var DotsSeparator = styled_components_1.default.span(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  color: var(--grey100);\n"], ["\n  color: var(--grey100);\n"])));
+var arrow = "display: flex; font-size: 20px;";
+var ItemPrev = styled_components_1.default.a(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), arrow);
+var ItemNext = styled_components_1.default.a(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), arrow);
 /*
  * Possible outcomes:
  * [1] 2 3 ... 78 >
@@ -49,7 +22,8 @@ const ItemNext = styled_components_1.default.a `
  * < 1 ... 75 76 [77] 78 >
  * < 1 ... 76 77 [78]
  */
-const KoinePaginationNav = ({ total, perPage, currentPage, baseUrl, showOffset = 2, currentUrl = "/", Link = "a", }) => {
+var KoinePaginationNav = function (_a) {
+    var total = _a.total, perPage = _a.perPage, currentPage = _a.currentPage, baseUrl = _a.baseUrl, _b = _a.showOffset, showOffset = _b === void 0 ? 2 : _b, _c = _a.currentUrl, currentUrl = _c === void 0 ? "/" : _c, _d = _a.Link, Link = _d === void 0 ? "a" : _d;
     total = (0, utils_1.ensureInt)(total);
     currentPage = (0, utils_1.ensureInt)(currentPage);
     perPage = (0, utils_1.ensureInt)(perPage);
@@ -60,15 +34,15 @@ const KoinePaginationNav = ({ total, perPage, currentPage, baseUrl, showOffset =
     if (total < perPage) {
         return null;
     }
-    const firstPage = 1;
-    const lastPage = Math.ceil(total / perPage);
-    const prevPage = currentPage - 1 > firstPage ? currentPage - 1 : "";
-    const nextPage = currentPage + 1 < lastPage ? currentPage + 1 : lastPage;
-    const prevArrow = currentPage > firstPage;
-    const nextArrow = currentPage < lastPage;
-    const pages = [];
+    var firstPage = 1;
+    var lastPage = Math.ceil(total / perPage);
+    var prevPage = currentPage - 1 > firstPage ? currentPage - 1 : "";
+    var nextPage = currentPage + 1 < lastPage ? currentPage + 1 : lastPage;
+    var prevArrow = currentPage > firstPage;
+    var nextArrow = currentPage < lastPage;
+    var pages = [];
     // fill the pages before the current
-    for (let i = currentPage - showOffset; i < currentPage; i++) {
+    for (var i = currentPage - showOffset; i < currentPage; i++) {
         if (i > 1) {
             pages.push(i);
         }
@@ -76,13 +50,16 @@ const KoinePaginationNav = ({ total, perPage, currentPage, baseUrl, showOffset =
     // add the current
     pages.push(currentPage);
     // fill the pages after the current
-    for (let i = currentPage + 1; i < currentPage + 1 + showOffset; i++) {
+    for (var i = currentPage + 1; i < currentPage + 1 + showOffset; i++) {
         if (i < lastPage) {
             pages.push(i);
         }
     }
-    const prevDots = pages[0] > firstPage + 1;
-    const nextDots = pages[pages.length - 1] < lastPage - 1;
-    return ((0, jsx_runtime_1.jsxs)(Root, { children: [prevArrow && ((0, jsx_runtime_1.jsx)(ItemPrev, { as: Link, href: `${baseUrl}/${prevPage}`, children: (0, jsx_runtime_1.jsx)(cg_1.CgArrowLeftR, {}) })), firstPage !== currentPage && ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: `${baseUrl}`, prev: true, children: firstPage })), prevDots && (0, jsx_runtime_1.jsx)(DotsSeparator, { children: "..." }), pages.map((page) => page === currentPage ? ((0, jsx_runtime_1.jsx)(ItemCurrent, { children: page }, page)) : ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: `${baseUrl}/${page}`, prev: page < currentPage, next: page > currentPage, children: page }, `pagination-${page}`))), nextDots && (0, jsx_runtime_1.jsx)(DotsSeparator, { children: "..." }), lastPage !== currentPage && ((0, jsx_runtime_1.jsx)(ItemLink, { as: Link, href: `${baseUrl}/${lastPage}`, next: true, children: lastPage })), nextArrow && ((0, jsx_runtime_1.jsx)(ItemNext, { as: Link, href: `${baseUrl}/${nextPage}`, children: (0, jsx_runtime_1.jsx)(cg_1.CgArrowRightR, {}) }))] }));
+    var prevDots = pages[0] > firstPage + 1;
+    var nextDots = pages[pages.length - 1] < lastPage - 1;
+    return ((0, jsx_runtime_1.jsxs)(Root, { children: [prevArrow && ((0, jsx_runtime_1.jsx)(ItemPrev, tslib_1.__assign({ as: Link, href: "".concat(baseUrl, "/").concat(prevPage) }, { children: (0, jsx_runtime_1.jsx)(cg_1.CgArrowLeftR, {}) }))), firstPage !== currentPage && ((0, jsx_runtime_1.jsx)(ItemLink, tslib_1.__assign({ as: Link, href: "".concat(baseUrl), prev: true }, { children: firstPage }))), prevDots && (0, jsx_runtime_1.jsx)(DotsSeparator, { children: "..." }), pages.map(function (page) {
+                return page === currentPage ? ((0, jsx_runtime_1.jsx)(ItemCurrent, { children: page }, page)) : ((0, jsx_runtime_1.jsx)(ItemLink, tslib_1.__assign({ as: Link, href: "".concat(baseUrl, "/").concat(page), prev: page < currentPage, next: page > currentPage }, { children: page }), "pagination-".concat(page)));
+            }), nextDots && (0, jsx_runtime_1.jsx)(DotsSeparator, { children: "..." }), lastPage !== currentPage && ((0, jsx_runtime_1.jsx)(ItemLink, tslib_1.__assign({ as: Link, href: "".concat(baseUrl, "/").concat(lastPage), next: true }, { children: lastPage }))), nextArrow && ((0, jsx_runtime_1.jsx)(ItemNext, tslib_1.__assign({ as: Link, href: "".concat(baseUrl, "/").concat(nextPage) }, { children: (0, jsx_runtime_1.jsx)(cg_1.CgArrowRightR, {}) })))] }));
 };
 exports.KoinePaginationNav = KoinePaginationNav;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/node/Pagination/PaginationResults.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PaginationResults = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const Root = styled_components_1.default.div `
-  // overflow: hidden;
-`;
-const Inner = (0, styled_components_1.default)(framer_motion_1.m.div) ``;
-const PaginationResults = ({ children }) => {
-    return ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { exitBeforeEnter: true, initial: true, children: (0, jsx_runtime_1.jsx)(Root, { children: (0, jsx_runtime_1.jsx)(Inner, { initial: { opacity: 0, x: -100 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: 100 }, transition: { type: "linear", staggerChildren: 0.3 }, children: children }) }) }));
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var framer_motion_1 = require("framer-motion");
+var Root = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  // overflow: hidden;\n"], ["\n  // overflow: hidden;\n"])));
+var Inner = (0, styled_components_1.default)(framer_motion_1.m.div)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject([""], [""])));
+var PaginationResults = function (_a) {
+    var children = _a.children;
+    return ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, tslib_1.__assign({ exitBeforeEnter: true, initial: true }, { children: (0, jsx_runtime_1.jsx)(Root, { children: (0, jsx_runtime_1.jsx)(Inner, tslib_1.__assign({ initial: { opacity: 0, x: -100 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: 100 }, transition: { type: "linear", staggerChildren: 0.3 } }, { children: children })) }) })));
 };
 exports.PaginationResults = PaginationResults;
+var templateObject_1, templateObject_2;

package/node/Pagination/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
+var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./PaginationNav"), exports);
 tslib_1.__exportStar(require("./PaginationResults"), exports);

package/node/Pill/Pill.js

@@ -1,41 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PillAccentLightOutlined = exports.PillAccentLight = exports.PillGreyLight = exports.Pill = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.Pill = styled_components_1.default.div `
-  display: inline-block;
-  padding: 5px 10px;
-  margin: 0 0.5em 0.5em 0;
-  border-radius: 2px;
-  text-decoration: none;
-  font-size: 13px;
-  font-weight: 600;
-`;
-exports.PillGreyLight = (0, styled_components_1.default)(exports.Pill) `
-  background: var(--grey800);
-  color: var(--grey100);
-
-  &:hover {
-    color: white;
-    background: var(--grey300);
-  }
-`;
-exports.PillAccentLight = (0, styled_components_1.default)(exports.Pill) `
-  background: var(--accent400);
-  color: var(--grey100);
-
-  &:hover {
-    color: #fff;
-    background: var(--accent300);
-  }
-`;
-exports.PillAccentLightOutlined = (0, styled_components_1.default)(exports.Pill) `
-  border: 1px solid var(--accent300);
-  color: var(--accent200);
-
-  &:hover {
-    color: #fff;
-    background: var(--accent300);
-  }
-`;
+var tslib_1 = require("tslib");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+exports.Pill = styled_components_1.default.div(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: inline-block;\n  padding: 5px 10px;\n  margin: 0 0.5em 0.5em 0;\n  border-radius: 2px;\n  text-decoration: none;\n  font-size: 13px;\n  font-weight: 600;\n"], ["\n  display: inline-block;\n  padding: 5px 10px;\n  margin: 0 0.5em 0.5em 0;\n  border-radius: 2px;\n  text-decoration: none;\n  font-size: 13px;\n  font-weight: 600;\n"])));
+exports.PillGreyLight = (0, styled_components_1.default)(exports.Pill)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  background: var(--grey800);\n  color: var(--grey100);\n\n  &:hover {\n    color: white;\n    background: var(--grey300);\n  }\n"], ["\n  background: var(--grey800);\n  color: var(--grey100);\n\n  &:hover {\n    color: white;\n    background: var(--grey300);\n  }\n"])));
+exports.PillAccentLight = (0, styled_components_1.default)(exports.Pill)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  background: var(--accent400);\n  color: var(--grey100);\n\n  &:hover {\n    color: #fff;\n    background: var(--accent300);\n  }\n"], ["\n  background: var(--accent400);\n  color: var(--grey100);\n\n  &:hover {\n    color: #fff;\n    background: var(--accent300);\n  }\n"])));
+exports.PillAccentLightOutlined = (0, styled_components_1.default)(exports.Pill)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  border: 1px solid var(--accent300);\n  color: var(--accent200);\n\n  &:hover {\n    color: #fff;\n    background: var(--accent300);\n  }\n"], ["\n  border: 1px solid var(--accent300);\n  color: var(--accent200);\n\n  &:hover {\n    color: #fff;\n    background: var(--accent300);\n  }\n"])));
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/node/Pill/index.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
+var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./Pill"), exports);

package/node/Progress/ProgressCircular.js

@@ -1,41 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ProgressCircular = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importStar(require("styled-components"));
-const animationRotation = (0, styled_components_1.keyframes) `
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-`;
-const animationCircle = (0, styled_components_1.keyframes) `
-  0% {
-    stroke-dasharray: 1px, 200px;
-    stroke-dashoffset: 0;
-  }
-  50% {
-    stroke-dasharray: 100px, 200px;
-    stroke-dashoffset: -15px;
-  }
-  100% {
-    stroke-dasharray: 100px, 200px;
-    stroke-dashoffset: -125px;
-  }
-`;
-const ProgressCircularSvg = styled_components_1.default.svg `
-  animation: ${animationRotation} 1.5s linear infinite;
-`;
-const ProgressCircularCircle = styled_components_1.default.circle `
-  animation: ${animationCircle} 1.5s linear infinite;
-`;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_components_1 = tslib_1.__importStar(require("styled-components"));
+var animationRotation = (0, styled_components_1.keyframes)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n"], ["\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n"])));
+var animationCircle = (0, styled_components_1.keyframes)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  0% {\n    stroke-dasharray: 1px, 200px;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -15px;\n  }\n  100% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -125px;\n  }\n"], ["\n  0% {\n    stroke-dasharray: 1px, 200px;\n    stroke-dashoffset: 0;\n  }\n  50% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -15px;\n  }\n  100% {\n    stroke-dasharray: 100px, 200px;\n    stroke-dashoffset: -125px;\n  }\n"])));
+var ProgressCircularSvg = styled_components_1.default.svg(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  animation: ", " 1.5s linear infinite;\n"], ["\n  animation: ", " 1.5s linear infinite;\n"])), animationRotation);
+var ProgressCircularCircle = styled_components_1.default.circle(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  animation: ", " 1.5s linear infinite;\n"], ["\n  animation: ", " 1.5s linear infinite;\n"])), animationCircle);
 /**
  * @see https://mui.com/components/progress/
  */
-const ProgressCircular = ({ size = "1em", thickness = 1, color = "currentColor", ...props }) => {
-    return ((0, jsx_runtime_1.jsx)(ProgressCircularSvg, { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 44 44", style: { width: size, height: size }, ...props, children: (0, jsx_runtime_1.jsx)(ProgressCircularCircle, { cx: "22", cy: "22", r: "20", fill: "none", strokeWidth: thickness, style: { stroke: color } }) }));
+var ProgressCircular = function (_a) {
+    var _b = _a.size, size = _b === void 0 ? "1em" : _b, _c = _a.thickness, thickness = _c === void 0 ? 1 : _c, _d = _a.color, color = _d === void 0 ? "currentColor" : _d, props = tslib_1.__rest(_a, ["size", "thickness", "color"]);
+    return ((0, jsx_runtime_1.jsx)(ProgressCircularSvg, tslib_1.__assign({ xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 44 44", style: { width: size, height: size } }, props, { children: (0, jsx_runtime_1.jsx)(ProgressCircularCircle, { cx: "22", cy: "22", r: "20", fill: "none", strokeWidth: thickness, style: { stroke: color } }) })));
 };
 exports.ProgressCircular = ProgressCircular;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/node/Progress/ProgressLinear.js

@@ -1,28 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ProgressLinear = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const ProgressLinearBg = styled_components_1.default.span `
-  position: relative;
-  overflow: hidden;
-  display: block;
-  height: 4px;
-`;
-const ProgressLinearFg = (0, styled_components_1.default)(framer_motion_1.m.span) `
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  width: 100%;
-`;
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var framer_motion_1 = require("framer-motion");
+var ProgressLinearBg = styled_components_1.default.span(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  position: relative;\n  overflow: hidden;\n  display: block;\n  height: 4px;\n"], ["\n  position: relative;\n  overflow: hidden;\n  display: block;\n  height: 4px;\n"])));
+var ProgressLinearFg = (0, styled_components_1.default)(framer_motion_1.m.span)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n"], ["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  width: 100%;\n"])));
 /**
  * @see https://mui.com/components/progress/#linear
  */
-const ProgressLinear = ({ done = false, height = "2px", bg = "transparent", fg = "currentColor", ...props }) => {
-    return ((0, jsx_runtime_1.jsx)(ProgressLinearBg, { style: { height, background: bg }, ...props, children: (0, jsx_runtime_1.jsx)(ProgressLinearFg, { style: { height, background: fg }, initial: {
+var ProgressLinear = function (_a) {
+    var _b = _a.done, done = _b === void 0 ? false : _b, _c = _a.height, height = _c === void 0 ? "2px" : _c, _d = _a.bg, bg = _d === void 0 ? "transparent" : _d, _e = _a.fg, fg = _e === void 0 ? "currentColor" : _e, props = tslib_1.__rest(_a, ["done", "height", "bg", "fg"]);
+    return ((0, jsx_runtime_1.jsx)(ProgressLinearBg, tslib_1.__assign({ style: { height: height, background: bg } }, props, { children: (0, jsx_runtime_1.jsx)(ProgressLinearFg, { style: { height: height, background: fg }, initial: {
                 x: "-100%",
             }, animate: {
                 x: done ? "-100%" : "0%",
@@ -32,6 +22,7 @@ const ProgressLinear = ({ done = false, height = "2px", bg = "transparent", fg =
                     repeat: Infinity,
                     repeatType: "reverse",
                     duration: 2,
-                } }) }));
+                } }) })));
 };
 exports.ProgressLinear = ProgressLinear;
+var templateObject_1, templateObject_2;

package/node/Progress/ProgressOverlay.js

@@ -1,45 +1,28 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ProgressOverlay = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const ProgressCircular_1 = require("./ProgressCircular");
-const ProgressLinear_1 = require("./ProgressLinear");
-const Header_1 = require("../Header");
-const ProgressOverlayWrap = (0, styled_components_1.default)(framer_motion_1.m.div) `
-  z-index: 10000;
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  pointer-events: none;
-  cursor: wait;
-`;
-const ProgressOverlayCenterer = styled_components_1.default.div `
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--progress-overlay-bg);
-`;
-const ProgressOverlay = ({ running }) => {
-    const [, , headerHeight] = (0, Header_1.useHeader)();
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var framer_motion_1 = require("framer-motion");
+var ProgressCircular_1 = require("./ProgressCircular");
+var ProgressLinear_1 = require("./ProgressLinear");
+var Header_1 = require("../Header");
+var ProgressOverlayWrap = (0, styled_components_1.default)(framer_motion_1.m.div)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  z-index: 10000;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  pointer-events: none;\n  cursor: wait;\n"], ["\n  z-index: 10000;\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  pointer-events: none;\n  cursor: wait;\n"])));
+var ProgressOverlayCenterer = styled_components_1.default.div(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--progress-overlay-bg);\n"], ["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--progress-overlay-bg);\n"])));
+var ProgressOverlay = function (_a) {
+    var running = _a.running;
+    var _b = (0, Header_1.useHeader)(), headerHeight = _b[2];
     // const [progress, setProgress] = useState(0);
-    (0, react_1.useEffect)(() => {
+    (0, react_1.useEffect)(function () {
         document.body.style.cursor = running ? "wait" : "";
     }, [running]);
-    return ((0, jsx_runtime_1.jsxs)(ProgressOverlayWrap, { animate: {
+    return ((0, jsx_runtime_1.jsxs)(ProgressOverlayWrap, tslib_1.__assign({ animate: {
             opacity: running ? 1 : 0,
-        }, initial: { opacity: 0 }, transition: { type: "easeInOut" }, children: [(0, jsx_runtime_1.jsx)(ProgressLinear_1.ProgressLinear, { bg: "var(--accent400)", fg: "var(--accent300)", done: !running }), (0, jsx_runtime_1.jsx)(ProgressOverlayCenterer, { style: {
+        }, initial: { opacity: 0 }, transition: { type: "easeInOut" } }, { children: [(0, jsx_runtime_1.jsx)(ProgressLinear_1.ProgressLinear, { bg: "var(--accent400)", fg: "var(--accent300)", done: !running }), (0, jsx_runtime_1.jsx)(ProgressOverlayCenterer, tslib_1.__assign({ style: {
                     top: headerHeight + "px",
-                }, children: (0, jsx_runtime_1.jsx)(ProgressCircular_1.ProgressCircular, { size: "50px", color: "var(--accent300)" }) })] }));
+                } }, { children: (0, jsx_runtime_1.jsx)(ProgressCircular_1.ProgressCircular, { size: "50px", color: "var(--accent300)" }) }))] })));
 };
 exports.ProgressOverlay = ProgressOverlay;
+var templateObject_1, templateObject_2;

package/node/Progress/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
+var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./ProgressCircular"), exports);
 tslib_1.__exportStar(require("./ProgressLinear"), exports);
 tslib_1.__exportStar(require("./ProgressOverlay"), exports);

package/node/Rating/Rating.js

@@ -1,53 +1,32 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Rating = exports.RatingRoot = exports.RatingValue = exports.RatingCount = exports.RatingDetails = exports.RatingStar = exports.RatingStarRoot = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.RatingStarRoot = styled_components_1.default.svg `
-  display: inline-block;
-  vertical-align: middle;
-  margin-right: 1px;
-`;
-const RatingStar = ({ value, colorBg = "#FFD84C", colorStroke = "#947813", size, ...props }) => {
-    const id = (0, react_1.useId)();
-    return ((0, jsx_runtime_1.jsxs)(exports.RatingStarRoot, { viewBox: "0 0 16 16", "data-value": value, width: size + "px", height: size + "px", ...props, children: [(0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("linearGradient", { id: id, x1: "0", y1: "0", x2: "1", y2: "0", children: [(0, jsx_runtime_1.jsx)("stop", { offset: "0", stopColor: colorBg }), (0, jsx_runtime_1.jsx)("stop", { offset: value, stopColor: colorBg }), (0, jsx_runtime_1.jsx)("stop", { offset: value, stopColor: "rgba(255, 255, 255, 0)" })] }) }), (0, jsx_runtime_1.jsx)("path", { stroke: colorStroke, strokeWidth: "0.5", fill: `url(#${id})`, d: "M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.283.95l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" })] }));
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var useId_1 = require("../hooks/useId");
+exports.RatingStarRoot = styled_components_1.default.svg(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: inline-block;\n  vertical-align: middle;\n  margin-right: 1px;\n"], ["\n  display: inline-block;\n  vertical-align: middle;\n  margin-right: 1px;\n"])));
+var RatingStar = function (_a) {
+    var value = _a.value, _b = _a.colorBg, colorBg = _b === void 0 ? "#FFD84C" : _b, _c = _a.colorStroke, colorStroke = _c === void 0 ? "#947813" : _c, size = _a.size, props = tslib_1.__rest(_a, ["value", "colorBg", "colorStroke", "size"]);
+    var id = (0, useId_1.useId)();
+    return ((0, jsx_runtime_1.jsxs)(exports.RatingStarRoot, tslib_1.__assign({ viewBox: "0 0 16 16", "data-value": value, width: size + "px", height: size + "px" }, props, { children: [(0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("linearGradient", tslib_1.__assign({ id: id, x1: "0", y1: "0", x2: "1", y2: "0" }, { children: [(0, jsx_runtime_1.jsx)("stop", { offset: "0", stopColor: colorBg }), (0, jsx_runtime_1.jsx)("stop", { offset: value, stopColor: colorBg }), (0, jsx_runtime_1.jsx)("stop", { offset: value, stopColor: "rgba(255, 255, 255, 0)" })] })) }), (0, jsx_runtime_1.jsx)("path", { stroke: colorStroke, strokeWidth: "0.5", fill: "url(#".concat(id, ")"), d: "M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.283.95l-3.523 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" })] })));
 };
 exports.RatingStar = RatingStar;
-exports.RatingDetails = styled_components_1.default.span `
-  padding-left: 0.5em;
-  font-size: 12px;
-  color: var(--grey100);
-
-  &:before {
-    content: "(";
-  }
-  &:after {
-    content: ")";
-  }
-`;
-exports.RatingCount = styled_components_1.default.span ``;
-exports.RatingValue = styled_components_1.default.span `
-  display: none;
-`;
-exports.RatingRoot = styled_components_1.default.div `
-  display: flex;
-  align-items: center;
-
-  &:hover ${exports.RatingValue} {
-    display: inline-block;
-  }
-`;
-const Rating = ({ value = 0, count, min = 0, max = 5, showDetails = true, colorBg, colorStroke, starSize = 16, }) => {
-    const id = (0, react_1.useId)();
-    const [currentValue /* , _setCurrentValue */] = (0, react_1.useState)(value);
-    const [stars, setStars] = (0, react_1.useState)([]);
-    const getStars = (0, react_1.useCallback)((activeCount) => {
-        const stars = [];
-        for (let currentStar = min + 1; currentStar < max + 1; currentStar++) {
-            let starValue;
-            const roundedActiveCount = Math.floor(activeCount);
+exports.RatingDetails = styled_components_1.default.span(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  padding-left: 0.5em;\n  font-size: 12px;\n  color: var(--grey100);\n\n  &:before {\n    content: \"(\";\n  }\n  &:after {\n    content: \")\";\n  }\n"], ["\n  padding-left: 0.5em;\n  font-size: 12px;\n  color: var(--grey100);\n\n  &:before {\n    content: \"(\";\n  }\n  &:after {\n    content: \")\";\n  }\n"])));
+exports.RatingCount = styled_components_1.default.span(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
+exports.RatingValue = styled_components_1.default.span(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  display: none;\n"], ["\n  display: none;\n"])));
+exports.RatingRoot = styled_components_1.default.div(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n\n  &:hover ", " {\n    display: inline-block;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n\n  &:hover ", " {\n    display: inline-block;\n  }\n"])), exports.RatingValue);
+var Rating = function (_a) {
+    var _b = _a.value, value = _b === void 0 ? 0 : _b, count = _a.count, _c = _a.min, min = _c === void 0 ? 0 : _c, _d = _a.max, max = _d === void 0 ? 5 : _d, _e = _a.showDetails, showDetails = _e === void 0 ? true : _e, colorBg = _a.colorBg, colorStroke = _a.colorStroke, _f = _a.starSize, starSize = _f === void 0 ? 16 : _f;
+    var id = (0, useId_1.useId)();
+    var currentValue = (0, react_1.useState)(value)[0] /* , _setCurrentValue */;
+    var _g = (0, react_1.useState)([]), stars = _g[0], setStars = _g[1];
+    var getStars = (0, react_1.useCallback)(function (activeCount) {
+        var stars = [];
+        for (var currentStar = min + 1; currentStar < max + 1; currentStar++) {
+            var starValue = void 0;
+            var roundedActiveCount = Math.floor(activeCount);
             // we have a rating of 3.4, when we get to the 4th star:
             if (roundedActiveCount === currentStar - 1) {
                 starValue = 1 - (currentStar - activeCount);
@@ -62,7 +41,7 @@ const Rating = ({ value = 0, count, min = 0, max = 5, showDetails = true, colorB
         }
         return stars;
     }, [min, max]);
-    (0, react_1.useEffect)(() => {
+    (0, react_1.useEffect)(function () {
         setStars(getStars(currentValue));
     }, [currentValue, getStars]);
     // function updateStars(index) {
@@ -87,10 +66,11 @@ const Rating = ({ value = 0, count, min = 0, max = 5, showDetails = true, colorB
     //     onChange(value);
     //   }
     // }, [onChange];
-    return ((0, jsx_runtime_1.jsxs)(exports.RatingRoot, { children: [stars.map((star, idx) => ((0, jsx_runtime_1.jsx)(exports.RatingStar, { idx: idx, dataIdx: idx, size: starSize, 
+    return ((0, jsx_runtime_1.jsxs)(exports.RatingRoot, { children: [stars.map(function (star, idx) { return ((0, jsx_runtime_1.jsx)(exports.RatingStar, { idx: idx, dataIdx: idx, size: starSize, 
                 // onMouseOver={handleMouseOver}
                 // onMouseLeave={handleMouseLeave}
                 // onClick={handleClick}
-                value: star.value, colorBg: colorBg, colorStroke: colorStroke }, id + idx))), " ", showDetails && count && ((0, jsx_runtime_1.jsxs)(exports.RatingDetails, { children: [(0, jsx_runtime_1.jsx)(exports.RatingCount, { children: count }), (0, jsx_runtime_1.jsx)(exports.RatingValue, { children: ` - ${value}` })] }))] }));
+                value: star.value, colorBg: colorBg, colorStroke: colorStroke }, id + idx)); }), " ", showDetails && count && ((0, jsx_runtime_1.jsxs)(exports.RatingDetails, { children: [(0, jsx_runtime_1.jsx)(exports.RatingCount, { children: count }), (0, jsx_runtime_1.jsx)(exports.RatingValue, { children: " - ".concat(value) })] }))] }));
 };
 exports.Rating = Rating;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;

package/node/Rating/index.js

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.deriveRating = exports.convertRange = exports.getRatingValue = exports.getRatingWord = void 0;
-const tslib_1 = require("tslib");
+var tslib_1 = require("tslib");
 tslib_1.__exportStar(require("./Rating"), exports);
-const RATING_WORDS = {
+var RATING_WORDS = {
     0: "Worst",
     1: "Bad",
     2: "Mediocre",
@@ -12,9 +12,10 @@ const RATING_WORDS = {
     4.5: "Excellent",
     5: "Best",
 };
-const getRatingWord = (value, precision = 0.5) => {
-    let buffer = 0;
-    let word;
+var getRatingWord = function (value, precision) {
+    if (precision === void 0) { precision = 0.5; }
+    var buffer = 0;
+    var word;
     while (buffer < value) {
         // @ts-expect-error can't remember
         word = RATING_WORDS[buffer];
@@ -23,8 +24,8 @@ const getRatingWord = (value, precision = 0.5) => {
     return word;
 };
 exports.getRatingWord = getRatingWord;
-const getRatingValue = (value) => {
-    const converted = convertRange(value, [0, 5], [0, 10]);
+var getRatingValue = function (value) {
+    var converted = convertRange(value, [0, 5], [0, 10]);
     if (converted % 1 === 0) {
         return converted;
     }
@@ -38,16 +39,19 @@ function convertRange(value, r1, r2) {
     return ((value - r1[0]) * (r2[1] - r2[0])) / (r1[1] - r1[0]) + r2[0];
 }
 exports.convertRange = convertRange;
-const deriveRating = (title, date, minValue = 3.8, maxValue = 5, minQuantity = 9) => {
-    const entityTime = date.getTime();
-    const nowTime = new Date().getTime();
-    const length = title.length;
-    const value = Number(convertRange(length, [0, 90], [minValue, maxValue]).toFixed(2));
-    const timeDifference = convertRange(nowTime - entityTime, [0, 10000000000000], [minQuantity, 999999]);
-    const count = Math.round(timeDifference / length);
+var deriveRating = function (title, date, minValue, maxValue, minQuantity) {
+    if (minValue === void 0) { minValue = 3.8; }
+    if (maxValue === void 0) { maxValue = 5; }
+    if (minQuantity === void 0) { minQuantity = 9; }
+    var entityTime = date.getTime();
+    var nowTime = new Date().getTime();
+    var length = title.length;
+    var value = Number(convertRange(length, [0, 90], [minValue, maxValue]).toFixed(2));
+    var timeDifference = convertRange(nowTime - entityTime, [0, 10000000000000], [minQuantity, 999999]);
+    var count = Math.round(timeDifference / length);
     return {
-        value,
-        count,
+        value: value,
+        count: count,
     };
 };
 exports.deriveRating = deriveRating;

package/node/Select/components.js

@@ -1,22 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SelectArrow = exports.SelectArrowStyled = void 0;
-const tslib_1 = require("tslib");
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-const framer_motion_1 = require("framer-motion");
-const bs_1 = require("react-icons/bs");
-exports.SelectArrowStyled = (0, styled_components_1.default)(framer_motion_1.m.span) `
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 2em;
-
-  &:not([disabled]) {
-    cursor: pointer;
-  }
-`;
-exports.SelectArrow = (0, react_1.forwardRef)(function SelectArrow({ isOpen, ...props }, ref) {
-    return ((0, jsx_runtime_1.jsx)(exports.SelectArrowStyled, { animate: { rotate: isOpen ? 180 : 0 }, ref: ref, ...props, children: (0, jsx_runtime_1.jsx)(bs_1.BsBoxArrowInDown, {}) }));
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+var framer_motion_1 = require("framer-motion");
+var bs_1 = require("react-icons/bs");
+exports.SelectArrowStyled = (0, styled_components_1.default)(framer_motion_1.m.span)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 2em;\n\n  &:not([disabled]) {\n    cursor: pointer;\n  }\n"], ["\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 2em;\n\n  &:not([disabled]) {\n    cursor: pointer;\n  }\n"])));
+exports.SelectArrow = (0, react_1.forwardRef)(function SelectArrow(_a, ref) {
+    var isOpen = _a.isOpen, props = tslib_1.__rest(_a, ["isOpen"]);
+    return ((0, jsx_runtime_1.jsx)(exports.SelectArrowStyled, tslib_1.__assign({ animate: { rotate: isOpen ? 180 : 0 }, ref: ref }, props, { children: (0, jsx_runtime_1.jsx)(bs_1.BsBoxArrowInDown, {}) })));
 });
+var templateObject_1;