@onepercentio/one-ui 0.29.0 → 0.29.1

package/dist/utils/e2e.js

@@ -29,7 +29,7 @@ function combineTestIds() {
  * @returns A function to set the IDs that this created instance will provide
  */
 function testIDFactory(moduleOrId) {
-  const moduleId = typeof module === "string" ? module : module.id;
+  const moduleId = typeof moduleOrId === "string" ? moduleOrId : moduleOrId.id;
   return function () {
     for (var _len2 = arguments.length, idsArr = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
       idsArr[_key2] = arguments[_key2];
@@ -39,4 +39,4 @@ function testIDFactory(moduleOrId) {
     }), {})), {});
   };
 }
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJ0b1NyY1BhdGgiLCJzdHIiLCJpbmRleE9mU3JjIiwiaW5kZXhPZiIsIm1vZE5hbWUiLCJzbGljZSIsInJlcGxhY2UiLCJjb21iaW5lVGVzdElkcyIsIl9sZW4iLCJhcmd1bWVudHMiLCJsZW5ndGgiLCJ0IiwiQXJyYXkiLCJfa2V5IiwicmVkdWNlIiwiYWNjIiwiaSIsIl9vYmplY3RTcHJlYWQiLCJ0ZXN0SURGYWN0b3J5IiwibW9kdWxlT3JJZCIsIm1vZHVsZUlkIiwibW9kdWxlIiwiaWQiLCJfbGVuMiIsImlkc0FyciIsIl9rZXkyIiwiaWRzIiwibWFwIiwiY29uY2F0IiwidG9Mb3dlckNhc2UiXSwic291cmNlcyI6WyIuLi8uLi9zcmMvdXRpbHMvZTJlLnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBNb2R1bGUgZnJvbSBcIm1vZHVsZVwiO1xuXG5mdW5jdGlvbiB0b1NyY1BhdGgoc3RyOiBzdHJpbmcpIHtcbiAgY29uc3QgaW5kZXhPZlNyYyA9IHN0ci5pbmRleE9mKFwic3JjXCIpO1xuICBjb25zdCBtb2ROYW1lID0gaW5kZXhPZlNyYyA9PT0gLTEgPyBzdHIgOiBzdHIuc2xpY2UoaW5kZXhPZlNyYyk7XG4gIHJldHVybiBtb2ROYW1lLnJlcGxhY2UoXCJhcHBjbGllbnRlY21hc2NyaXB0XCIsIFwiXCIpO1xufVxuXG50eXBlIFBvc3NpYmxlVCA9IChcbiAgfCBzdHJpbmdcbiAgfCByZWFkb25seSBbaWQ6IHN0cmluZywgZnVuYzogKG46IG51bWJlcikgPT4gYCR7c3RyaW5nfS0ke251bWJlcn1gXVxuKVtdO1xuXG50eXBlIFQ8SURTIGV4dGVuZHMgUG9zc2libGVUPiA9IHtcbiAgW0kgaW4gSURTW251bWJlcl0gZXh0ZW5kcyBzdHJpbmdcbiAgICA/IElEU1tudW1iZXJdXG4gICAgOiBJRFNbbnVtYmVyXVswXV06IEkgZXh0ZW5kcyBJRFNbbnVtYmVyXSA/IHN0cmluZyA6IChpZDogYW55KSA9PiBzdHJpbmc7XG59O1xuXG5leHBvcnQgZnVuY3Rpb24gY29tYmluZVRlc3RJZHMoLi4udDogUmV0dXJuVHlwZTx0eXBlb2YgdGVzdElERmFjdG9yeT5bXSkge1xuICByZXR1cm4gdC5yZWR1Y2UoKGFjYywgaSkgPT4gKHsgLi4uYWNjLCBpIH0pLCB7fSk7XG59XG5cbi8qKlxuICogQ3JlYXRlcyBhbiBkYXRhLXRlc3RpZCBtYXAgZ2VuZXJhdG9yIGluc3RhbmNlIGJhc2VkIG9uIHRoZSBtb2R1bGUgbmFtZSBvciBhcmJpdHJhcnkgaWRcbiAqIEByZXR1cm5zIEEgZnVuY3Rpb24gdG8gc2V0IHRoZSBJRHMgdGhhdCB0aGlzIGNyZWF0ZWQgaW5zdGFuY2Ugd2lsbCBwcm92aWRlXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiB0ZXN0SURGYWN0b3J5KG1vZHVsZU9ySWQ6IFBpY2s8TW9kdWxlLCBcImlkXCI+IHwgc3RyaW5nKSB7XG4gIGNvbnN0IG1vZHVsZUlkID0gdHlwZW9mIG1vZHVsZSA9PT0gXCJzdHJpbmdcIiA/IG1vZHVsZSA6IG1vZHVsZS5pZDtcbiAgcmV0dXJuIDxjb25zdCBJRFMgZXh0ZW5kcyBQb3NzaWJsZVQ+KC4uLmlkc0FycjogSURTW10pID0+XG4gICAgaWRzQXJyLnJlZHVjZShcbiAgICAgIChhY2MsIGlkcykgPT4gKHtcbiAgICAgICAgLi4uYWNjLFxuICAgICAgICAuLi5pZHMucmVkdWNlKFxuICAgICAgICAgIChtYXAsIGlkKSA9PiAoe1xuICAgICAgICAgICAgLi4ubWFwLFxuICAgICAgICAgICAgW3R5cGVvZiBpZCA9PT0gXCJzdHJpbmdcIiA/IGlkIDogaWRbMF1dOlxuICAgICAgICAgICAgICB0eXBlb2YgaWQgPT09IFwic3RyaW5nXCJcbiAgICAgICAgICAgICAgICA/IGAke3RvU3JjUGF0aChcbiAgICAgICAgICAgICAgICAgICAgbW9kdWxlSWQudG9Mb3dlckNhc2UoKS5yZXBsYWNlKC9bXmEtel0vZywgXCJcIilcbiAgICAgICAgICAgICAgICAgICl9LSR7aWR9YFxuICAgICAgICAgICAgICAgIDogKGk6IGFueSkgPT5cbiAgICAgICAgICAgICAgICAgICAgYCR7dG9TcmNQYXRoKFxuICAgICAgICAgICAgICAgICAgICAgIG1vZHVsZUlkLnRvTG93ZXJDYXNlKCkucmVwbGFjZSgvW15hLXpdL2csIFwiXCIpXG4gICAgICAgICAgICAgICAgICAgICl9LSR7aWRbMV0oaSl9YCxcbiAgICAgICAgICB9KSxcbiAgICAgICAgICB7fSBhcyBUPElEUz5cbiAgICAgICAgKSxcbiAgICAgIH0pLFxuICAgICAge30gYXMgVDxJRFM+XG4gICAgKTtcbn1cbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7O0FBRUEsU0FBU0EsU0FBU0EsQ0FBQ0MsR0FBVyxFQUFFO0VBQzlCLE1BQU1DLFVBQVUsR0FBR0QsR0FBRyxDQUFDRSxPQUFPLENBQUMsS0FBSyxDQUFDO0VBQ3JDLE1BQU1DLE9BQU8sR0FBR0YsVUFBVSxLQUFLLENBQUMsQ0FBQyxHQUFHRCxHQUFHLEdBQUdBLEdBQUcsQ0FBQ0ksS0FBSyxDQUFDSCxVQUFVLENBQUM7RUFDL0QsT0FBT0UsT0FBTyxDQUFDRSxPQUFPLENBQUMscUJBQXFCLEVBQUUsRUFBRSxDQUFDO0FBQ25EO0FBYU8sU0FBU0MsY0FBY0EsQ0FBQSxFQUEyQztFQUFBLFNBQUFDLElBQUEsR0FBQUMsU0FBQSxDQUFBQyxNQUFBLEVBQXZDQyxDQUFDLE9BQUFDLEtBQUEsQ0FBQUosSUFBQSxHQUFBSyxJQUFBLE1BQUFBLElBQUEsR0FBQUwsSUFBQSxFQUFBSyxJQUFBO0lBQURGLENBQUMsQ0FBQUUsSUFBQSxJQUFBSixTQUFBLENBQUFJLElBQUE7RUFBQTtFQUNqQyxPQUFPRixDQUFDLENBQUNHLE1BQU0sQ0FBQyxDQUFDQyxHQUFHLEVBQUVDLENBQUMsS0FBQUMsYUFBQSxDQUFBQSxhQUFBLEtBQVdGLEdBQUc7SUFBRUM7RUFBQyxFQUFHLEVBQUUsQ0FBQyxDQUFDLENBQUM7QUFDbEQ7O0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDTyxTQUFTRSxhQUFhQSxDQUFDQyxVQUF1QyxFQUFFO0VBQ3JFLE1BQU1DLFFBQVEsR0FBRyxPQUFPQyxNQUFNLEtBQUssUUFBUSxHQUFHQSxNQUFNLEdBQUdBLE1BQU0sQ0FBQ0MsRUFBRTtFQUNoRSxPQUFPO0lBQUEsU0FBQUMsS0FBQSxHQUFBZCxTQUFBLENBQUFDLE1BQUEsRUFBaUNjLE1BQU0sT0FBQVosS0FBQSxDQUFBVyxLQUFBLEdBQUFFLEtBQUEsTUFBQUEsS0FBQSxHQUFBRixLQUFBLEVBQUFFLEtBQUE7TUFBTkQsTUFBTSxDQUFBQyxLQUFBLElBQUFoQixTQUFBLENBQUFnQixLQUFBO0lBQUE7SUFBQSxPQUM1Q0QsTUFBTSxDQUFDVixNQUFNLENBQ1gsQ0FBQ0MsR0FBRyxFQUFFVyxHQUFHLEtBQUFULGFBQUEsQ0FBQUEsYUFBQSxLQUNKRixHQUFHLEdBQ0hXLEdBQUcsQ0FBQ1osTUFBTSxDQUNYLENBQUNhLEdBQUcsRUFBRUwsRUFBRSxLQUFBTCxhQUFBLENBQUFBLGFBQUEsS0FDSFUsR0FBRztNQUNOLENBQUMsT0FBT0wsRUFBRSxLQUFLLFFBQVEsR0FBR0EsRUFBRSxHQUFHQSxFQUFFLENBQUMsQ0FBQyxDQUFDLEdBQ2xDLE9BQU9BLEVBQUUsS0FBSyxRQUFRLE1BQUFNLE1BQUEsQ0FDZjVCLFNBQVMsQ0FDVm9CLFFBQVEsQ0FBQ1MsV0FBVyxDQUFDLENBQUMsQ0FBQ3ZCLE9BQU8sQ0FBQyxTQUFTLEVBQUUsRUFBRSxDQUM5QyxDQUFDLE9BQUFzQixNQUFBLENBQUlOLEVBQUUsSUFDTk4sQ0FBTSxPQUFBWSxNQUFBLENBQ0Y1QixTQUFTLENBQ1ZvQixRQUFRLENBQUNTLFdBQVcsQ0FBQyxDQUFDLENBQUN2QixPQUFPLENBQUMsU0FBUyxFQUFFLEVBQUUsQ0FDOUMsQ0FBQyxPQUFBc0IsTUFBQSxDQUFJTixFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUNOLENBQUMsQ0FBQztJQUFFLEVBQ3ZCLEVBQ0YsQ0FBQyxDQUNILENBQUMsQ0FDRCxFQUNGLENBQUMsQ0FDSCxDQUFDO0VBQUE7QUFDTCIsImlnbm9yZUxpc3QiOltdfQ==
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJ0b1NyY1BhdGgiLCJzdHIiLCJpbmRleE9mU3JjIiwiaW5kZXhPZiIsIm1vZE5hbWUiLCJzbGljZSIsInJlcGxhY2UiLCJjb21iaW5lVGVzdElkcyIsIl9sZW4iLCJhcmd1bWVudHMiLCJsZW5ndGgiLCJ0IiwiQXJyYXkiLCJfa2V5IiwicmVkdWNlIiwiYWNjIiwiaSIsIl9vYmplY3RTcHJlYWQiLCJ0ZXN0SURGYWN0b3J5IiwibW9kdWxlT3JJZCIsIm1vZHVsZUlkIiwiaWQiLCJfbGVuMiIsImlkc0FyciIsIl9rZXkyIiwiaWRzIiwibWFwIiwiY29uY2F0IiwidG9Mb3dlckNhc2UiXSwic291cmNlcyI6WyIuLi8uLi9zcmMvdXRpbHMvZTJlLnRzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBNb2R1bGUgZnJvbSBcIm1vZHVsZVwiO1xuXG5mdW5jdGlvbiB0b1NyY1BhdGgoc3RyOiBzdHJpbmcpIHtcbiAgY29uc3QgaW5kZXhPZlNyYyA9IHN0ci5pbmRleE9mKFwic3JjXCIpO1xuICBjb25zdCBtb2ROYW1lID0gaW5kZXhPZlNyYyA9PT0gLTEgPyBzdHIgOiBzdHIuc2xpY2UoaW5kZXhPZlNyYyk7XG4gIHJldHVybiBtb2ROYW1lLnJlcGxhY2UoXCJhcHBjbGllbnRlY21hc2NyaXB0XCIsIFwiXCIpO1xufVxuXG50eXBlIFBvc3NpYmxlVCA9IChcbiAgfCBzdHJpbmdcbiAgfCByZWFkb25seSBbaWQ6IHN0cmluZywgZnVuYzogKG46IG51bWJlcikgPT4gYCR7c3RyaW5nfS0ke251bWJlcn1gXVxuKVtdO1xuXG50eXBlIFQ8SURTIGV4dGVuZHMgUG9zc2libGVUPiA9IHtcbiAgW0kgaW4gSURTW251bWJlcl0gZXh0ZW5kcyBzdHJpbmdcbiAgICA/IElEU1tudW1iZXJdXG4gICAgOiBJRFNbbnVtYmVyXVswXV06IEkgZXh0ZW5kcyBJRFNbbnVtYmVyXSA/IHN0cmluZyA6IChpZDogYW55KSA9PiBzdHJpbmc7XG59O1xuXG5leHBvcnQgZnVuY3Rpb24gY29tYmluZVRlc3RJZHMoLi4udDogUmV0dXJuVHlwZTx0eXBlb2YgdGVzdElERmFjdG9yeT5bXSkge1xuICByZXR1cm4gdC5yZWR1Y2UoKGFjYywgaSkgPT4gKHsgLi4uYWNjLCBpIH0pLCB7fSk7XG59XG5cbi8qKlxuICogQ3JlYXRlcyBhbiBkYXRhLXRlc3RpZCBtYXAgZ2VuZXJhdG9yIGluc3RhbmNlIGJhc2VkIG9uIHRoZSBtb2R1bGUgbmFtZSBvciBhcmJpdHJhcnkgaWRcbiAqIEByZXR1cm5zIEEgZnVuY3Rpb24gdG8gc2V0IHRoZSBJRHMgdGhhdCB0aGlzIGNyZWF0ZWQgaW5zdGFuY2Ugd2lsbCBwcm92aWRlXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiB0ZXN0SURGYWN0b3J5KG1vZHVsZU9ySWQ6IFBpY2s8TW9kdWxlLCBcImlkXCI+IHwgc3RyaW5nKSB7XG4gIGNvbnN0IG1vZHVsZUlkID0gdHlwZW9mIG1vZHVsZU9ySWQgPT09IFwic3RyaW5nXCIgPyBtb2R1bGVPcklkIDogbW9kdWxlT3JJZC5pZDtcbiAgcmV0dXJuIDxjb25zdCBJRFMgZXh0ZW5kcyBQb3NzaWJsZVQ+KC4uLmlkc0FycjogSURTW10pID0+XG4gICAgaWRzQXJyLnJlZHVjZShcbiAgICAgIChhY2MsIGlkcykgPT4gKHtcbiAgICAgICAgLi4uYWNjLFxuICAgICAgICAuLi5pZHMucmVkdWNlKFxuICAgICAgICAgIChtYXAsIGlkKSA9PiAoe1xuICAgICAgICAgICAgLi4ubWFwLFxuICAgICAgICAgICAgW3R5cGVvZiBpZCA9PT0gXCJzdHJpbmdcIiA/IGlkIDogaWRbMF1dOlxuICAgICAgICAgICAgICB0eXBlb2YgaWQgPT09IFwic3RyaW5nXCJcbiAgICAgICAgICAgICAgICA/IGAke3RvU3JjUGF0aChcbiAgICAgICAgICAgICAgICAgICAgbW9kdWxlSWQudG9Mb3dlckNhc2UoKS5yZXBsYWNlKC9bXmEtel0vZywgXCJcIilcbiAgICAgICAgICAgICAgICAgICl9LSR7aWR9YFxuICAgICAgICAgICAgICAgIDogKGk6IGFueSkgPT5cbiAgICAgICAgICAgICAgICAgICAgYCR7dG9TcmNQYXRoKFxuICAgICAgICAgICAgICAgICAgICAgIG1vZHVsZUlkLnRvTG93ZXJDYXNlKCkucmVwbGFjZSgvW15hLXpdL2csIFwiXCIpXG4gICAgICAgICAgICAgICAgICAgICl9LSR7aWRbMV0oaSl9YCxcbiAgICAgICAgICB9KSxcbiAgICAgICAgICB7fSBhcyBUPElEUz5cbiAgICAgICAgKSxcbiAgICAgIH0pLFxuICAgICAge30gYXMgVDxJRFM+XG4gICAgKTtcbn1cbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7O0FBRUEsU0FBU0EsU0FBU0EsQ0FBQ0MsR0FBVyxFQUFFO0VBQzlCLE1BQU1DLFVBQVUsR0FBR0QsR0FBRyxDQUFDRSxPQUFPLENBQUMsS0FBSyxDQUFDO0VBQ3JDLE1BQU1DLE9BQU8sR0FBR0YsVUFBVSxLQUFLLENBQUMsQ0FBQyxHQUFHRCxHQUFHLEdBQUdBLEdBQUcsQ0FBQ0ksS0FBSyxDQUFDSCxVQUFVLENBQUM7RUFDL0QsT0FBT0UsT0FBTyxDQUFDRSxPQUFPLENBQUMscUJBQXFCLEVBQUUsRUFBRSxDQUFDO0FBQ25EO0FBYU8sU0FBU0MsY0FBY0EsQ0FBQSxFQUEyQztFQUFBLFNBQUFDLElBQUEsR0FBQUMsU0FBQSxDQUFBQyxNQUFBLEVBQXZDQyxDQUFDLE9BQUFDLEtBQUEsQ0FBQUosSUFBQSxHQUFBSyxJQUFBLE1BQUFBLElBQUEsR0FBQUwsSUFBQSxFQUFBSyxJQUFBO0lBQURGLENBQUMsQ0FBQUUsSUFBQSxJQUFBSixTQUFBLENBQUFJLElBQUE7RUFBQTtFQUNqQyxPQUFPRixDQUFDLENBQUNHLE1BQU0sQ0FBQyxDQUFDQyxHQUFHLEVBQUVDLENBQUMsS0FBQUMsYUFBQSxDQUFBQSxhQUFBLEtBQVdGLEdBQUc7SUFBRUM7RUFBQyxFQUFHLEVBQUUsQ0FBQyxDQUFDLENBQUM7QUFDbEQ7O0FBRUE7QUFDQTtBQUNBO0FBQ0E7QUFDTyxTQUFTRSxhQUFhQSxDQUFDQyxVQUF1QyxFQUFFO0VBQ3JFLE1BQU1DLFFBQVEsR0FBRyxPQUFPRCxVQUFVLEtBQUssUUFBUSxHQUFHQSxVQUFVLEdBQUdBLFVBQVUsQ0FBQ0UsRUFBRTtFQUM1RSxPQUFPO0lBQUEsU0FBQUMsS0FBQSxHQUFBYixTQUFBLENBQUFDLE1BQUEsRUFBaUNhLE1BQU0sT0FBQVgsS0FBQSxDQUFBVSxLQUFBLEdBQUFFLEtBQUEsTUFBQUEsS0FBQSxHQUFBRixLQUFBLEVBQUFFLEtBQUE7TUFBTkQsTUFBTSxDQUFBQyxLQUFBLElBQUFmLFNBQUEsQ0FBQWUsS0FBQTtJQUFBO0lBQUEsT0FDNUNELE1BQU0sQ0FBQ1QsTUFBTSxDQUNYLENBQUNDLEdBQUcsRUFBRVUsR0FBRyxLQUFBUixhQUFBLENBQUFBLGFBQUEsS0FDSkYsR0FBRyxHQUNIVSxHQUFHLENBQUNYLE1BQU0sQ0FDWCxDQUFDWSxHQUFHLEVBQUVMLEVBQUUsS0FBQUosYUFBQSxDQUFBQSxhQUFBLEtBQ0hTLEdBQUc7TUFDTixDQUFDLE9BQU9MLEVBQUUsS0FBSyxRQUFRLEdBQUdBLEVBQUUsR0FBR0EsRUFBRSxDQUFDLENBQUMsQ0FBQyxHQUNsQyxPQUFPQSxFQUFFLEtBQUssUUFBUSxNQUFBTSxNQUFBLENBQ2YzQixTQUFTLENBQ1ZvQixRQUFRLENBQUNRLFdBQVcsQ0FBQyxDQUFDLENBQUN0QixPQUFPLENBQUMsU0FBUyxFQUFFLEVBQUUsQ0FDOUMsQ0FBQyxPQUFBcUIsTUFBQSxDQUFJTixFQUFFLElBQ05MLENBQU0sT0FBQVcsTUFBQSxDQUNGM0IsU0FBUyxDQUNWb0IsUUFBUSxDQUFDUSxXQUFXLENBQUMsQ0FBQyxDQUFDdEIsT0FBTyxDQUFDLFNBQVMsRUFBRSxFQUFFLENBQzlDLENBQUMsT0FBQXFCLE1BQUEsQ0FBSU4sRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDTCxDQUFDLENBQUM7SUFBRSxFQUN2QixFQUNGLENBQUMsQ0FDSCxDQUFDLENBQ0QsRUFDRixDQUFDLENBQ0gsQ0FBQztFQUFBO0FBQ0wiLCJpZ25vcmVMaXN0IjpbXX0=

package/dist-ts/assets/img/svg/checkbox.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-7 -7 38 38">
+    <path style="stroke: #EDEDED" stroke-linecap="round" stroke-miterlimit="10" stroke-width="3px" fill="none" d="M22.9 3.7l-15.2 16.6-6.6-7.1" />
+</svg>

package/dist-ts/assets/styles/index.scss

@@ -0,0 +1,2 @@
+@import "./variables.scss";
+@import "./mixins.scss";

package/dist-ts/assets/styles/mixins.scss

@@ -0,0 +1,12 @@
+@mixin iteractibleElement() {
+  & {
+    cursor: pointer;
+    transition: transform $fast;
+  }
+  &:hover {
+    transform: scale(1.2);
+  }
+  &:active {
+    transform: scale(1.1);
+  }
+}

package/dist-ts/assets/styles/variables.scss

@@ -0,0 +1,49 @@
+$digitalBlue: var(--digital-blue, #558eff);
+$mediumGray: var(--medium-gray, #bababa);
+$lightGray: var(--light-gray, #d6d6d6);
+$spaceBlue: var(--space-blue, #0f113a);
+$warningRed: var(--warning-red, #e84b4b);
+$sunsetPink: var(--sunset-pink, #ff3e7d);
+$darkestGray: var(--darkest-gray, #727272);
+$gray: var(--gray, #0f113a);
+$success: var(--success, lightgreen);
+$successDark: var(--success-dark, green);
+$mainBackgroundColor: var(--bg-color, white);
+$primaryColor: var(--primary-color, var(--digital-blue));
+$elevation: var(--card-elevation, 0px 4px 10px rgba(0, 0, 0, 0.1));
+
+$mainFontFamily: var(--main-font, Roboto);
+$secondaryFontFamily: var(--second-font, Manrope);
+
+$headerFillBackgroundColor: var(--header-background-color, $digitalBlue);
+$headerBackgroundColor: var(--header-divider-bg-color, #467eea);
+$headerTextColor: var(--header-text-color, #94b8ff);
+$headerBrightColor: var(--header-bright-color, white);
+
+$tableRowBgColor: var(--table-row-bg-color, white);
+$tableRowBorderColor: var(--table-row-border-color, #bec1ca);
+
+$buttonBorderRadius: var(--button-border-radius, 8px);
+$buttonTextColor: var(--button-text-color, white);
+
+$tooltipBackgroudColor: var(--tooltip-background-color, $digitalBlue);
+
+$checkboxBaseColor: var(--checkbox-base-color, $digitalBlue);
+
+$textDefaultColor: var(--text-default-color, $digitalBlue);
+
+$buttonPrimaryBackgroundColor: var(--button-primary-bg-color, #1e22aa);
+
+$fileInputBackgroundColor: var(--file-input-bg-color, #f2f6f7);
+$fileInputBorderColor: var(--file-input-border-color, #dce1e8);
+
+$avatarBackgroundColor: var(--avatar-bg-color, $lightGray);
+
+$pixelatedGuideBackground: var(--pixelated-scan-bg, var(--digital-blue));
+
+$almostInstant: var(--animation--speed-almostInstant, 50ms);
+$veryFast: var(--animation--speed-veryfast, 125ms);
+$fast: var(--animation--speed-fast, 250ms);
+$normal: var(--animation--speed-normal, 500ms);
+$slow: var(--animation--speed-slow, 1s);
+$verySlow: var(--animation--speed-veryslow, 2s);

package/dist-ts/components/AdaptiveButton/AdaptiveButton.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps, ReactElement } from "react";
+import Button from "../Button";
+/**
+ * A button that adapts it's width according to the content size
+ **/
+export default function AdaptiveButton({ children, className, ...buttonProps }: {
+    children: ReactElement;
+} & ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;

package/dist-ts/components/AdaptiveButton/AdaptiveButton.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import AdaptiveContainer from "../AdaptiveContainer";
+import Button from "../Button";
+import Styles from "./AdaptiveButton.module.scss";
+/**
+ * A button that adapts it's width according to the content size
+ **/
+export default function AdaptiveButton({ children, className = "", ...buttonProps }) {
+    return (_jsx(AdaptiveContainer, { containerElement: Button, className: `${Styles.resetButton} ${className}`, direction: "both", ...buttonProps, children: children }));
+}
+//# sourceMappingURL=AdaptiveButton.js.map

package/dist-ts/components/AdaptiveButton/AdaptiveButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdaptiveButton.js","sourceRoot":"","sources":["../../../src/components/AdaptiveButton/AdaptiveButton.tsx"],"names":[],"mappings":";AACA,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AACrD,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,MAAM,MAAM,8BAA8B,CAAC;AAElD;;IAEI;AACJ,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,GAAG,WAAW,EAGiB;IAC/B,OAAO,CACL,KAAC,iBAAiB,IAChB,gBAAgB,EAAE,MAAM,EACxB,SAAS,EAAE,GAAG,MAAM,CAAC,WAAW,IAAI,SAAS,EAAE,EAC/C,SAAS,EAAC,MAAM,KACZ,WAAW,YAEd,QAAQ,GACS,CACrB,CAAC;AACJ,CAAC"}

package/dist-ts/components/AdaptiveButton/AdaptiveButton.module.scss

@@ -0,0 +1,7 @@
+.resetButton {
+  min-width: 0px !important;
+  white-space: nowrap;
+  display: flex;
+  align-items: center;
+  text-align: center;
+}

package/dist-ts/components/AdaptiveButton/index.d.ts

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

package/dist-ts/components/AdaptiveButton/index.js

@@ -0,0 +1,2 @@
+export { default } from './AdaptiveButton';
+//# sourceMappingURL=index.js.map

package/dist-ts/components/AdaptiveButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AdaptiveButton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC"}

package/dist-ts/components/AdaptiveContainer/AdaptiveContainer.d.ts

@@ -0,0 +1,21 @@
+import { ComponentProps, FunctionComponent, JSX, ReactElement } from "react";
+/**
+ * A container that animates width changes across content updates
+ **/
+export default function AdaptiveContainer<E extends keyof JSX.IntrinsicElements | FunctionComponent>({ children, className, containerElement: _Wrapper, direction, strict, ...otherProps }: {
+    containerElement?: E;
+    children: ReactElement;
+    /**
+     * The direction in which the content will be resized
+     *
+     *     "h" // When the content will change in width
+     *     "v" // When the content will change in height
+     */
+    direction?: "h" | "v" | "both";
+    className?: string;
+    contentClassName?: string;
+    /**
+     * true: It will animate restricting to the height when it was rendered
+     * false: It will animate trying to reach the height when it was rendered, growing in size if the content inside it changes */
+    strict?: boolean;
+} & ComponentProps<E>): import("react/jsx-runtime").JSX.Element;

package/dist-ts/components/AdaptiveContainer/AdaptiveContainer.js

@@ -0,0 +1,125 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, } from "react";
+import { TransitionAnimationTypes } from "../Transition";
+import UncontrolledTransition from "../UncontrolledTransition";
+import Styles from "./AdaptiveContainer.module.scss";
+/**
+ * A container that animates width changes across content updates
+ **/
+export default function AdaptiveContainer({ children, className = "", containerElement: _Wrapper = "div", direction = "h", strict = true, ...otherProps }) {
+    const animatedProperty = useMemo(() => {
+        if (!strict && direction !== "v")
+            throw new Error(`Strict false only works with direction "v" at the moment`);
+        switch (direction) {
+            case "both":
+                return ["width", "height"];
+            case "h":
+                return "width";
+            case "v":
+                return strict ? "height" : "minHeight";
+        }
+    }, [direction, strict]);
+    const uncontrolledRef = useRef(null);
+    const buttonRef = useRef(null);
+    useEffect(() => {
+        const transitionContainer = uncontrolledRef.current.sectionRef.current;
+        if (transitionContainer)
+            if (direction === "both") {
+                transitionContainer.style.width = `${transitionContainer.clientWidth}px`;
+                transitionContainer.style.height = `${transitionContainer.clientHeight}px`;
+            }
+            else if (direction === "h") {
+                transitionContainer.style.width = `${transitionContainer.clientWidth}px`;
+                transitionContainer.style[animatedProperty] = ``;
+            }
+            else {
+                transitionContainer.style[animatedProperty] = `${transitionContainer.clientHeight}px`;
+                transitionContainer.style.width = ``;
+            }
+        const t = setTimeout(() => {
+            if (uncontrolledRef.current) {
+                const transitionContainer = uncontrolledRef.current.sectionRef.current;
+                if (transitionContainer) {
+                    const screenThatWillEnter = transitionContainer.lastChild;
+                    if (screenThatWillEnter) {
+                        function resetFactory(param, target) {
+                            const resetPropertyInstance = (e) => {
+                                if (e.propertyName !== param)
+                                    return;
+                                setTimeout(() => {
+                                    if (transitionContainer?.style[param] === `${target}px`) {
+                                        transitionContainer.style[param] = "";
+                                    }
+                                }, 100);
+                                if (transitionContainer)
+                                    transitionContainer.removeEventListener("transitionend", resetPropertyInstance);
+                            };
+                            return resetPropertyInstance;
+                        }
+                        if (direction === "both") {
+                            const contentSize = {
+                                width: screenThatWillEnter.clientWidth,
+                                height: screenThatWillEnter.scrollHeight
+                            };
+                            const targetSize = {
+                                width: `${contentSize.width}px`,
+                                height: `${contentSize.height}px`
+                            };
+                            const prevSize = {
+                                width: transitionContainer.style.width,
+                                height: transitionContainer.style.height
+                            };
+                            transitionContainer.style.width = targetSize.width;
+                            transitionContainer.style.height = targetSize.height;
+                            if (Array.isArray(animatedProperty))
+                                for (let prop of animatedProperty) {
+                                    const resetProperty = resetFactory(prop, contentSize[prop]);
+                                    if (targetSize[prop] === prevSize[prop])
+                                        resetProperty({ propertyName: prop });
+                                    else
+                                        transitionContainer.addEventListener("transitionend", resetProperty);
+                                }
+                        }
+                        else if (direction === "h") {
+                            const contentWidth = screenThatWillEnter.clientWidth;
+                            const targetWidth = `${contentWidth}px`;
+                            const prevWidth = transitionContainer.style.width;
+                            transitionContainer.style.width = targetWidth;
+                            const func = resetFactory("width", contentWidth);
+                            if (targetWidth === prevWidth)
+                                func({ propertyName: "width" });
+                            else
+                                transitionContainer.addEventListener("transitionend", func);
+                        }
+                        else {
+                            const _animatedProperty = animatedProperty;
+                            const contentHeight = screenThatWillEnter.scrollHeight;
+                            const targetHeight = `${contentHeight}px`;
+                            const prevHeight = transitionContainer.style[_animatedProperty];
+                            transitionContainer.style[_animatedProperty] = targetHeight;
+                            const resetProperty = resetFactory(_animatedProperty, contentHeight);
+                            if (targetHeight === prevHeight)
+                                resetProperty({ propertyName: _animatedProperty });
+                            else
+                                transitionContainer.addEventListener("transitionend", resetProperty);
+                        }
+                    }
+                }
+            }
+        }, 100);
+        return () => clearTimeout(t);
+    }, [children.key, direction]);
+    const Wrapper = _Wrapper;
+    const directionClass = direction in Styles ? Styles[direction] : "";
+    return (_jsx(_Fragment, { children: _jsx(Wrapper, { className: `${className}`, ref: buttonRef, ...otherProps, children: _jsx(UncontrolledTransition, { ref: uncontrolledRef, transitionType: TransitionAnimationTypes.CUSTOM, lockTransitionWidth: false, config: {
+                    backward: {
+                        elementExiting: Styles.fadeOutAbsolute,
+                        elementEntering: Styles.fadeInDelayed,
+                    },
+                    forward: {
+                        elementExiting: Styles.fadeOutAbsolute,
+                        elementEntering: Styles.fadeInDelayed,
+                    },
+                }, className: `${Styles.resetSection} ${directionClass}`, contentClassName: otherProps.contentClassName, children: children }) }) }));
+}
+//# sourceMappingURL=AdaptiveContainer.js.map

package/dist-ts/components/AdaptiveContainer/AdaptiveContainer.js.map

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

package/dist-ts/components/AdaptiveContainer/AdaptiveContainer.module.scss

@@ -0,0 +1,53 @@
+.resetSection {
+  min-height: 0px;
+  transition: width var(--adaptive-container-transition-time, 400ms) linear,
+    height var(--adaptive-container-transition-time, 400ms) linear,
+    min-height var(--adaptive-container-transition-time, 400ms) linear;
+  transition-timing-function: linear;
+  overflow: hidden;
+  align-items: flex-start;
+  &.h,&.both {
+    > * {
+      min-width: auto !important;
+    }
+  }
+  &.v,&.both {
+    > * {
+      min-height: initial;
+    }
+  }
+}
+
+@keyframes fadeInDelayed {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 0.1;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes fadeOutDelayed {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+
+.fadeInDelayed {
+  animation-name: fadeInDelayed;
+  animation-duration: 500ms !important;
+}
+
+.fadeOutAbsolute {
+  position: absolute;
+  animation-name: fadeOutDelayed;
+  animation-duration: 500ms !important;
+}

package/dist-ts/components/AdaptiveContainer/index.d.ts

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

package/dist-ts/components/AdaptiveContainer/index.js

@@ -0,0 +1,2 @@
+export { default } from './AdaptiveContainer';
+//# sourceMappingURL=index.js.map

package/dist-ts/components/AdaptiveContainer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AdaptiveContainer/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC"}

package/dist-ts/components/AdaptiveDialog/AdaptiveDialog.d.ts

@@ -0,0 +1,16 @@
+import { PropsWithChildren } from "react";
+/**
+ * This component implements a generic drawer that displays it as a drawer on mobile and as a modal on desktop
+ **/
+export default function AdaptiveDialog({ variant, onClose, open, className, onClickOut, children, onClosed, inline, }: PropsWithChildren<{
+    variant?: OnepercentUtility.UIElements.AdaptiveDialogVariants;
+    className?: string;
+    open: boolean;
+    onClose?: () => void;
+    onClickOut?: () => void;
+    onClosed?: () => void;
+    /**
+     * Indicates this rendering will write the html inside the current position on dom.
+     * If omitted or false, it will render on the document body, to prevent style bleeding */
+    inline?: boolean;
+}>): import("react/jsx-runtime").JSX.Element | null;

package/dist-ts/components/AdaptiveDialog/AdaptiveDialog.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import ReactDOM from "react-dom";
+import Styles from "./AdaptiveDialog.module.scss";
+import MutableHamburgerButton from "../MutableHamburgerButton";
+import ScrollAndFocusLock from "../utilitary/ScrollAndFocusLock";
+import { useOneUIConfig } from "../../context/OneUIProvider";
+/**
+ * This component implements a generic drawer that displays it as a drawer on mobile and as a modal on desktop
+ **/
+export default function AdaptiveDialog({ variant = "default", onClose, open = false, className = "", onClickOut, children, onClosed, inline = false, }) {
+    const rootDivRef = useRef(null);
+    const [isVisible, setIsVisible] = useState(open);
+    const [expanded, setExpanded] = useState(false);
+    const variantClass = useOneUIConfig(`component.adaptiveDialog.variant.${variant}`, "");
+    useEffect(() => {
+        if (open) {
+            setIsVisible(true);
+            const toggleVisbility = (e) => {
+                if (e.animationName === Styles.backdropDismiss) {
+                    onClosed?.();
+                    setIsVisible(false);
+                    e.target.removeEventListener("animationend", toggleVisbility);
+                }
+            };
+            rootDivRef.current.addEventListener("animationend", toggleVisbility);
+        }
+    }, [open]);
+    const globalClassName = {
+        backdrop: useOneUIConfig("component.adaptiveDialog.backdropClassName", ""),
+        dialog: useOneUIConfig("component.adaptiveDialog.dialogClassName", ""),
+    };
+    const content = (_jsx("div", { ref: rootDivRef, className: `${Styles.backdrop} ${open ? Styles.open : Styles.close} ${expanded ? Styles.expanded : ""} ${globalClassName.backdrop} ${variantClass}`, onClick: onClickOut, onAnimationEnd: ({ target, currentTarget }) => {
+            if (target === currentTarget)
+                target.style.pointerEvents = "initial";
+        }, children: _jsx("div", { className: `${Styles.container} ${className} ${globalClassName.dialog}`, onClick: (e) => e.stopPropagation(), children: _jsxs(ScrollAndFocusLock, { open: open, children: [onClose && (_jsx("button", { className: Styles.closeBtn, onClick: onClose, children: _jsx(MutableHamburgerButton, { state: "closed", size: 24 }) })), _jsx("div", { onClick: () => setExpanded((p) => !p) }), children] }) }) }));
+    return isVisible || open ? (inline ? (content) : (_jsx(_Fragment, { children: ReactDOM.createPortal(content, document.body) }))) : null;
+}
+//# sourceMappingURL=AdaptiveDialog.js.map

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

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

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

@@ -0,0 +1,147 @@
+@import "../../assets/styles/index.scss";
+
+.backdrop {
+  position: fixed;
+  top: 0px;
+  left: 0px;
+  right: 0px;
+  bottom: 0px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+  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;
+  }
+}
+.backdrop,
+.container {
+  animation-duration: $fast;
+  animation-fill-mode: forwards;
+}
+
+.open {
+  &.backdrop {
+    animation-name: backdropAppear;
+  }
+  .container {
+    animation-name: reveal;
+  }
+  @media screen and (orientation: "portrait") {
+    .container {
+      animation-timing-function: ease-in-out;
+      animation-name: slideUp;
+      transform: translateY(100%);
+    }
+  }
+}
+
+.close {
+  &.backdrop {
+    animation-name: backdropDismiss;
+  }
+
+  .container {
+    animation-name: dismiss;
+  }
+
+  @media screen and (orientation: "portrait") {
+    .container {
+      animation-name: slideDown;
+    }
+  }
+}
+
+.container {
+  > .closeBtn {
+    position: absolute;
+    right: 16px;
+    top: 16px;
+    background: none;
+    border: none;
+    width: auto;
+    height: auto;
+    padding: 0px !important;
+  }
+  padding: 16px 32px;
+  position: relative;
+  width: 100%;
+  max-width: 640px;
+  background: $mainBackgroundColor;
+  backdrop-filter: var(--adaptive-dialog-backdrop, initial);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  max-height: 90% !important;
+  overscroll-behavior: contain;
+  @media screen and (orientation: "portrait") {
+    min-height: initial;
+    align-items: flex-start;
+  }
+}
+
+@keyframes backdropAppear {
+  0% {
+    background-color: #0000;
+  }
+
+  100% {
+    background-color: #0005;
+  }
+}
+
+@keyframes backdropDismiss {
+  0% {
+    background-color: #0005;
+  }
+
+  100% {
+    background-color: #0000;
+  }
+}
+
+@keyframes reveal {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@keyframes dismiss {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+
+@keyframes slideUp {
+  0% {
+    min-height: 0px;
+    transform: translateY(100%);
+  }
+
+  100% {
+    min-height: 0px;
+    transform: translateY(0%);
+  }
+}
+
+@keyframes slideDown {
+  0% {
+    transform: translateY(0%);
+  }
+
+  100% {
+    min-height: 0px;
+    transform: translateY(100%);
+  }
+}

package/dist-ts/components/AdaptiveDialog/index.d.ts

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

package/dist-ts/components/AdaptiveDialog/index.js

@@ -0,0 +1,2 @@
+export { default } from './AdaptiveDialog';
+//# sourceMappingURL=index.js.map

package/dist-ts/components/AdaptiveDialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AdaptiveDialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC"}

package/dist-ts/components/AdaptiveSidebar/AdaptiveSidebar.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+type AdaptiveSidebarControls = {
+    dismiss: () => void;
+};
+/**
+ * A component that you can put anywhere but hides when small enough and shows the control via a fixed floating button
+ **/
+declare const AdaptiveSidebar: React.ForwardRefExoticComponent<{
+    /** To control AdaptiveSidebar externally
+     * (created for flows that requires floating views when on mobile)
+     **/
+    open?: boolean | undefined;
+    /**
+     * The screen width to turn into responsive mode
+     */
+    breakInto?: number | undefined;
+    className?: string | undefined;
+    visibilityControlComponent?: ((props: {
+        open: boolean;
+    }) => React.ReactElement) | undefined;
+} & Omit<React.HTMLProps<HTMLDivElement>, "ref"> & {
+    children?: React.ReactNode;
+} & React.RefAttributes<AdaptiveSidebarControls>>;
+export default AdaptiveSidebar;