@onepercentio/one-ui 0.16.4 → 0.17.1

package/dist/components/AdaptiveDialog/AdaptiveDialog.js

@@ -62,8 +62,8 @@ function AdaptiveDialog({ onClose, open = false, className = "", onClickOut, chi
         } },
         react_1.default.createElement("div", { className: `${AdaptiveDialog_module_scss_1.default.container} ${className} ${globalClassName.dialog}`, onClick: (e) => e.stopPropagation() },
             react_1.default.createElement(ScrollAndFocusLock_1.default, { open: open },
-                onClose && (react_1.default.createElement("button", { className: AdaptiveDialog_module_scss_1.default.closeBtn },
-                    react_1.default.createElement(MutableHamburgerButton_1.default, { onClick: onClose, state: "closed", size: 24 }))),
+                onClose && (react_1.default.createElement("button", { className: AdaptiveDialog_module_scss_1.default.closeBtn, onClick: onClose },
+                    react_1.default.createElement(MutableHamburgerButton_1.default, { state: "closed", size: 24 }))),
                 react_1.default.createElement("div", { className: AdaptiveDialog_module_scss_1.default.indicator, onClick: () => setExpanded((p) => !p) }),
                 children))), document.body))) : null;
 }

package/dist/components/AdaptiveDialog/AdaptiveDialog.js.map

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

package/dist/components/AdaptiveDialog/AdaptiveDialog.module.scss

@@ -13,7 +13,7 @@
   transition: backdrop-filter $veryFast linear;
   backdrop-filter: var(--adaptive-dialog-backdrop-backdrop, initial);
   pointer-events: none;
-  
+
   @media screen and (orientation: "portrait") {
     align-items: flex-end;
   }
@@ -35,6 +35,7 @@
     .container {
       animation-timing-function: ease-in-out;
       animation-name: slideUp;
+      transform: translateY(100%);
     }
   }
 }

package/dist/components/StaticScroller/StaticScroller.d.ts

@@ -0,0 +1,5 @@
+import { DetailedHTMLProps, HTMLAttributes, PropsWithChildren } from "react";
+/**
+ * Mantains a static content at the start of the container and when scrolled animates it's concealment
+ **/
+export default function StaticScroller({ children, ...props }: PropsWithChildren<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>>): JSX.Element;

package/dist/components/StaticScroller/StaticScroller.js

@@ -0,0 +1,84 @@
+"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 __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 react_1 = __importStar(require("react"));
+const StaticScroller_module_scss_1 = __importDefault(require("./StaticScroller.module.scss"));
+const lodash_1 = require("lodash");
+/**
+ * Mantains a static content at the start of the container and when scrolled animates it's concealment
+ **/
+function StaticScroller(_a) {
+    var { children } = _a, props = __rest(_a, ["children"]);
+    const rootRef = (0, react_1.useRef)(null);
+    (0, react_1.useLayoutEffect)(() => {
+        const el = rootRef.current;
+        let latestScroll;
+        const child = el.children[0];
+        const checkIfNeedsToHide = (0, lodash_1.debounce)(() => {
+            const direction = el.scrollLeft > latestScroll ? "in" : "out";
+            if (el.scrollLeft < child.clientWidth) {
+                el.scrollTo({
+                    left: direction === "in" ? child.clientWidth : 0,
+                    behavior: "smooth",
+                });
+            }
+            latestScroll = undefined;
+        }, 500);
+        const throtleSetLast = (0, lodash_1.throttle)((last) => {
+            latestScroll = last;
+        }, 1000 / 5, {
+            leading: true,
+            trailing: false,
+        });
+        const onScroll = () => {
+            const min = Math.min(el.scrollLeft, child.clientWidth);
+            const opacity = String(1 - min / child.clientWidth);
+            child.style.opacity = opacity;
+            checkIfNeedsToHide();
+            throtleSetLast(el.scrollLeft);
+        };
+        el.addEventListener("scroll", onScroll);
+        return () => {
+            el.removeEventListener("scroll", onScroll);
+        };
+    }, []);
+    return (react_1.default.createElement("div", Object.assign({ className: StaticScroller_module_scss_1.default.root }, props, { ref: rootRef }), children));
+}
+exports.default = StaticScroller;
+//# sourceMappingURL=StaticScroller.js.map

package/dist/components/StaticScroller/StaticScroller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StaticScroller.js","sourceRoot":"","sources":["../../../src/components/StaticScroller/StaticScroller.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAMe;AACf,8FAAkD;AAClD,mCAA4C;AAE5C;;IAEI;AACJ,SAAwB,cAAc,CAAC,EAKtC;QALsC,EACrC,QAAQ,OAIT,EAHI,KAAK,cAF6B,YAGtC,CADS;IAIR,MAAM,OAAO,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAE7C,IAAA,uBAAe,EAAC,GAAG,EAAE;QACnB,MAAM,EAAE,GAAG,OAAO,CAAC,OAAQ,CAAC;QAC5B,IAAI,YAAgC,CAAC;QACrC,MAAM,KAAK,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAmB,CAAC;QAE/C,MAAM,kBAAkB,GAAG,IAAA,iBAAQ,EAAC,GAAG,EAAE;YACvC,MAAM,SAAS,GAAG,EAAE,CAAC,UAAU,GAAG,YAAa,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;YAC/D,IAAI,EAAE,CAAC,UAAU,GAAG,KAAK,CAAC,WAAW,EAAE;gBACrC,EAAE,CAAC,QAAQ,CAAC;oBACV,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;oBAChD,QAAQ,EAAE,QAAQ;iBACnB,CAAC,CAAC;aACJ;YACD,YAAY,GAAG,SAAS,CAAC;QAC3B,CAAC,EAAE,GAAG,CAAC,CAAC;QACR,MAAM,cAAc,GAAG,IAAA,iBAAQ,EAC7B,CAAC,IAAY,EAAE,EAAE;YACf,YAAY,GAAG,IAAI,CAAC;QACtB,CAAC,EACD,IAAI,GAAG,CAAC,EACR;YACE,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,KAAK;SAChB,CACF,CAAC;QACF,MAAM,QAAQ,GAAG,GAAG,EAAE;YACpB,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,UAAU,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;YACvD,MAAM,OAAO,GAAG,MAAM,CAAC,CAAC,GAAG,GAAG,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC;YACpD,KAAK,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;YAC9B,kBAAkB,EAAE,CAAC;YACrB,cAAc,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;QAChC,CAAC,CAAC;QACF,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAExC,OAAO,GAAG,EAAE;YACV,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;QAC7C,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,qDAAK,SAAS,EAAE,oCAAM,CAAC,IAAI,IAAM,KAAK,IAAE,GAAG,EAAE,OAAO,KACjD,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AApDD,iCAoDC"}

package/dist/components/StaticScroller/StaticScroller.module.scss

@@ -0,0 +1,14 @@
+.root {
+  display: flex;
+  overflow: auto;
+  > * {
+    flex-shrink: 0;
+  }
+  > :first-child {
+    position: sticky;
+    left: 0;
+  }
+  > :not(:first-child) {
+    z-index: 1;
+  }
+}

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

@@ -0,0 +1 @@
+export { default } from './StaticScroller';

package/dist/components/StaticScroller/index.js

@@ -0,0 +1,9 @@
+"use strict";
+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 StaticScroller_1 = require("./StaticScroller");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(StaticScroller_1).default; } });
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/StaticScroller/index.tsx"],"names":[],"mappings":";;;;;;AAAA,mDAA2C;AAAlC,0HAAA,OAAO,OAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onepercentio/one-ui",
-  "version": "0.16.4",
+  "version": "0.17.1",
   "description": "A set of reusable components created through the development of Onepercent projects",
   "repository": "git@github.com:onepercentio/one-ui.git",
   "author": "Murilo Oliveira de Araujo <murilo.araujo@onepercent.io>",