@xfers/design-system 3.1.35-dev.900fabe9cb → 3.1.35-dev.a37909549d

package/dist/components/CopyBox/index.js

@@ -1,6 +1,62 @@
 "use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 });
-exports.default = void 0;
-var CopyBox_1 = require("./CopyBox");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return CopyBox_1.default; } });
+var react_1 = require("react");
+var styled_1 = require("@emotion/styled");
+var copy_to_clipboard_1 = require("copy-to-clipboard");
+var Button_1 = require("src/components/Button");
+require("antd/es/button/style/css");
+var src_1 = require("src");
+var CopyBox = function (_a) {
+    var value = _a.value, prefix = _a.prefix, _b = _a.withCopy, withCopy = _b === void 0 ? true : _b, _c = _a.valueToCopy, valueToCopy = _c === void 0 ? value : _c, onButtonClick = _a.onButtonClick, props = __rest(_a, ["value", "prefix", "withCopy", "valueToCopy", "onButtonClick"]);
+    var brand = src_1.useTheme().brand;
+    return (react_1.default.createElement(Container, __assign({}, props),
+        prefix && react_1.default.createElement(Prefix, null, prefix),
+        react_1.default.createElement(InputValue, { withPrefix: !!prefix, withCopy: withCopy }, value),
+        withCopy && (react_1.default.createElement(Button_1.default, { type: "secondary", style: {
+                borderTopLeftRadius: '0px',
+                borderBottomLeftRadius: '0px',
+                color: brand.primary.default
+            }, onClick: function () {
+                if (onButtonClick !== undefined)
+                    onButtonClick();
+                copy_to_clipboard_1.default(valueToCopy);
+            } }, "Copy"))));
+};
+exports.default = CopyBox;
+var Container = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
+var Prefix = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 48px;\n  border: 1px solid #e8e8e8;\n  border-top-left-radius: 5px;\n  border-bottom-left-radius: 5px;\n  box-sizing: border-box;\n  background: #f6f7f9;\n  color: #1b2736;\n  font-family: 'Hanken Grotesk', Inter;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 22px;\n  padding-top: 10px;\n  padding-bottom: 10px;\n  padding-left: 15px;\n  padding-right: 12px;\n  word-break: break-all;\n"], ["\n  width: 48px;\n  border: 1px solid #e8e8e8;\n  border-top-left-radius: 5px;\n  border-bottom-left-radius: 5px;\n  box-sizing: border-box;\n  background: #f6f7f9;\n  color: #1b2736;\n  font-family: 'Hanken Grotesk', Inter;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 22px;\n  padding-top: 10px;\n  padding-bottom: 10px;\n  padding-left: 15px;\n  padding-right: 12px;\n  word-break: break-all;\n"])));
+var InputValue = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  border: 1px solid #e8e8e8;\n  border-left: 0px;\n  border-right: 0px;\n  box-sizing: border-box;\n  background: #f6f7f9;\n  color: #1b2736;\n  font-family: \"Hanken Grotesk\", Inter;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 22px;\n  padding-top: 10px;\n  padding-bottom: 10px;\n  padding-left: 15px;\n  padding-right: 12px;\n  flex-basis: 0px;\n  flex-grow: 1;\n  flex-shrink: 1;\n  word-break: break-all;\n  border-radius: 0px;\n\n  // if withPrefix is false then:\n  ", "\n\n  // if withCopy is false then:\n  ", "\n"], ["\n  border: 1px solid #e8e8e8;\n  border-left: 0px;\n  border-right: 0px;\n  box-sizing: border-box;\n  background: #f6f7f9;\n  color: #1b2736;\n  font-family: \"Hanken Grotesk\", Inter;\n  font-style: normal;\n  font-weight: normal;\n  font-size: 14px;\n  line-height: 22px;\n  padding-top: 10px;\n  padding-bottom: 10px;\n  padding-left: 15px;\n  padding-right: 12px;\n  flex-basis: 0px;\n  flex-grow: 1;\n  flex-shrink: 1;\n  word-break: break-all;\n  border-radius: 0px;\n\n  // if withPrefix is false then:\n  ", "\n\n  // if withCopy is false then:\n  ", "\n"])), function (props) {
+    return props.withPrefix ||
+        "\n      border-top-left-radius: 5px !important;\n      border-bottom-left-radius: 5px !important;\n      border-left: 1px solid #e8e8e8 !important;\n  ";
+}, function (props) {
+    return props.withCopy ||
+        "\n      border-top-right-radius: 5px !important;\n      border-bottom-right-radius: 5px !important;\n      border-right: 1px solid #e8e8e8 !important;\n  ";
+});
+var templateObject_1, templateObject_2, templateObject_3;
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/CopyBox/index.tsx"],"names":[],"mappings":";;;AAAA,qCAAmC;AAA1B,kGAAA,OAAO,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/CopyBox/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAyB;AACzB,0CAAoC;AACpC,uDAAoC;AACpC,gDAA0C;AAC1C,oCAAiC;AACjC,2BAA8B;AAU9B,IAAM,OAAO,GAAG,UAAC,EAOH;IANZ,IAAA,KAAK,WAAA,EACL,MAAM,YAAA,EACN,gBAAe,EAAf,QAAQ,mBAAG,IAAI,KAAA,EACf,mBAAmB,EAAnB,WAAW,mBAAG,KAAK,KAAA,EACnB,aAAa,mBAAA,EACV,KAAK,cANO,+DAOhB,CADS;IAEA,IAAA,KAAK,GAAK,cAAQ,EAAE,MAAf,CAAe;IAC5B,OAAO,CACL,8BAAC,SAAS,eAAK,KAAK;QACjB,MAAM,IAAI,8BAAC,MAAM,QAAE,MAAM,CAAU;QACpC,8BAAC,UAAU,IAAC,UAAU,EAAE,CAAC,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,IACjD,KAAK,CACK;QACZ,QAAQ,IAAI,CACX,8BAAC,gBAAM,IACL,IAAI,EAAC,WAAW,EAChB,KAAK,EAAE;gBACL,mBAAmB,EAAE,KAAK;gBAC1B,sBAAsB,EAAE,KAAK;gBAC7B,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO;aAC7B,EACD,OAAO,EAAE;gBACP,IAAI,aAAa,KAAK,SAAS;oBAAE,aAAa,EAAE,CAAA;gBAChD,2BAAI,CAAC,WAAW,CAAC,CAAA;YACnB,CAAC,WAGM,CACV,CACS,CACb,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,OAAO,CAAA;AAEtB,IAAM,SAAS,GAAG,gBAAM,CAAC,GAAG,yFAAA,sBAE3B,IAAA,CAAA;AAED,IAAM,MAAM,GAAG,gBAAM,CAAC,GAAG,wfAAA,qbAkBxB,IAAA,CAAA;AAED,IAAM,UAAU,GAAG,gBAAM,CAAC,GAAG,ynBAA4C,qgBAuBrE,EAMD,yCAGC,EAMD,IACF,KAhBG,UAAA,KAAK;IACL,OAAA,KAAK,CAAC,UAAU;QAChB,yJAID;AALC,CAKD,EAGC,UAAA,KAAK;IACL,OAAA,KAAK,CAAC,QAAQ;QACd,4JAID;AALC,CAKD,CACF,CAAA"}

package/dist/icons/CopyToClipboard.js

@@ -13,9 +13,9 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = require("react");
 function SvgCopyToClipboard(props) {
-    return (React.createElement("svg", __assign({ width: "24", height: "24", viewBox: "0 0 24 25", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
-        React.createElement("path", { d: "M15.3098 21.3125C14.6619 21.8289 13.8583 22.1109 13.0298 22.1125H8.25977C6.80189 22.1099 5.40448 21.5296 4.3736 20.4987C3.34272 19.4678 2.76241 18.0704 2.75977 16.6125V10.4225C2.76091 9.8508 2.89419 9.28706 3.14919 8.77533C3.40418 8.26361 3.774 7.81774 4.22977 7.47254V7.27254C4.23136 6.70875 4.3053 6.1475 4.44977 5.60254C3.50474 6.00568 2.69877 6.67724 2.13174 7.53402C1.5647 8.3908 1.26152 9.39512 1.25977 10.4225V16.6125C1.25977 18.4691 1.99726 20.2495 3.31002 21.5623C4.62277 22.875 6.40325 23.6125 8.25977 23.6125H12.9998C13.8547 23.613 14.6966 23.4036 15.4516 23.0025C16.2066 22.6015 16.8515 22.0212 17.3298 21.3125H15.3098Z", fill: "#054948" }),
-        React.createElement("path", { d: "M17.5 3.53275C18.4911 3.53539 19.4408 3.93027 20.1417 4.63109C20.8425 5.3319 21.2374 6.28165 21.24 7.27275V14.5728C21.24 15.5647 20.846 16.5159 20.1446 17.2173C19.4432 17.9187 18.4919 18.3128 17.5 18.3128H11C10.0081 18.3128 9.0568 17.9187 8.35541 17.2173C7.65403 16.5159 7.25999 15.5647 7.25999 14.5728V7.27275C7.26263 6.28165 7.65751 5.3319 8.35833 4.63109C9.05914 3.93027 10.0089 3.53539 11 3.53275H17.5ZM17.5 2.03275H11C10.3097 2.03012 9.62569 2.16364 8.98707 2.42568C8.34845 2.68771 7.76778 3.07311 7.27828 3.55982C6.78878 4.04653 6.40008 4.625 6.1344 5.26211C5.86873 5.89922 5.7313 6.58247 5.72999 7.27275V14.5728C5.72866 15.2643 5.86421 15.9492 6.12883 16.588C6.39345 17.2269 6.7819 17.8071 7.27179 18.2951C7.76168 18.7831 8.34333 19.1694 8.9832 19.4316C9.62307 19.6938 10.3085 19.8267 11 19.8228H17.5C18.8897 19.8228 20.2225 19.2707 21.2052 18.288C22.1879 17.3053 22.74 15.9725 22.74 14.5828V7.27275C22.7373 5.88383 22.1844 4.55255 21.2023 3.57043C20.2202 2.58831 18.8889 2.0354 17.5 2.03275Z", fill: "#054948" })));
+    return (React.createElement("svg", __assign({ width: "1em", height: "1em", viewBox: "0 0 30 30", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+        React.createElement("path", { d: "M25 11.25H13.75a2.5 2.5 0 00-2.5 2.5V25a2.5 2.5 0 002.5 2.5H25a2.5 2.5 0 002.5-2.5V13.75a2.5 2.5 0 00-2.5-2.5z", stroke: props.color || 'currentColor', strokeWidth: 3, strokeLinecap: "round", strokeLinejoin: "round" }),
+        React.createElement("path", { d: "M6.25 18.75H5a2.5 2.5 0 01-2.5-2.5V5A2.5 2.5 0 015 2.5h11.25a2.5 2.5 0 012.5 2.5v1.25", stroke: props.color || 'currentColor', strokeWidth: 3, strokeLinecap: "round", strokeLinejoin: "round" })));
 }
 exports.default = SvgCopyToClipboard;
 //# sourceMappingURL=CopyToClipboard.js.map

package/dist/icons/CopyToClipboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyToClipboard.js","sourceRoot":"","sources":["../../src/icons/CopyToClipboard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,6BAA8B;AAE9B,SAAS,kBAAkB,CAAC,KAAoC;IAC9D,OAAO,CACL,sCACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAC9B,KAAK;QAET,8BACE,CAAC,EAAC,ynBAAynB,EAC3nB,IAAI,EAAC,SAAS,GACd;QACF,8BACE,CAAC,EAAC,y+BAAy+B,EAC3+B,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAA;AACH,CAAC;AAED,kBAAe,kBAAkB,CAAA"}
+{"version":3,"file":"CopyToClipboard.js","sourceRoot":"","sources":["../../src/icons/CopyToClipboard.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,6BAA8B;AAE9B,SAAS,kBAAkB,CAAC,KAAoC;IAC9D,OAAO,CACL,sCACE,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK,EACZ,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAC9B,KAAK;QAET,8BACE,CAAC,EAAC,gHAAgH,EAClH,MAAM,EAAE,KAAK,CAAC,KAAK,IAAI,cAAc,EACrC,WAAW,EAAE,CAAC,EACd,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB;QACF,8BACE,CAAC,EAAC,uFAAuF,EACzF,MAAM,EAAE,KAAK,CAAC,KAAK,IAAI,cAAc,EACrC,WAAW,EAAE,CAAC,EACd,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,CACE,CACP,CAAA;AACH,CAAC;AAED,kBAAe,kBAAkB,CAAA"}

package/dist/icons/Info.js

@@ -13,8 +13,8 @@ var __assign = (this && this.__assign) || function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 var React = require("react");
 function SvgInfo(props) {
-    return (React.createElement("svg", __assign({ width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
-        React.createElement("path", { d: "M7.99992 11.3334C8.18881 11.3334 8.34714 11.2695 8.47492 11.1417C8.6027 11.0139 8.66659 10.8556 8.66659 10.6667V8.00004C8.66659 7.81115 8.6027 7.65282 8.47492 7.52504C8.34714 7.39726 8.18881 7.33337 7.99992 7.33337C7.81103 7.33337 7.6527 7.39726 7.52492 7.52504C7.39714 7.65282 7.33325 7.81115 7.33325 8.00004V10.6667C7.33325 10.8556 7.39714 11.0139 7.52492 11.1417C7.6527 11.2695 7.81103 11.3334 7.99992 11.3334ZM7.99992 6.00004C8.18881 6.00004 8.34714 5.93615 8.47492 5.80837C8.6027 5.6806 8.66659 5.52226 8.66659 5.33337C8.66659 5.14449 8.6027 4.98615 8.47492 4.85837C8.34714 4.7306 8.18881 4.66671 7.99992 4.66671C7.81103 4.66671 7.6527 4.7306 7.52492 4.85837C7.39714 4.98615 7.33325 5.14449 7.33325 5.33337C7.33325 5.52226 7.39714 5.6806 7.52492 5.80837C7.6527 5.93615 7.81103 6.00004 7.99992 6.00004ZM7.99992 14.6667C7.0777 14.6667 6.21103 14.4917 5.39992 14.1417C4.58881 13.7917 3.88325 13.3167 3.28325 12.7167C2.68325 12.1167 2.20825 11.4112 1.85825 10.6C1.50825 9.78893 1.33325 8.92226 1.33325 8.00004C1.33325 7.07782 1.50825 6.21115 1.85825 5.40004C2.20825 4.58893 2.68325 3.88337 3.28325 3.28337C3.88325 2.68337 4.58881 2.20837 5.39992 1.85837C6.21103 1.50837 7.0777 1.33337 7.99992 1.33337C8.92214 1.33337 9.78881 1.50837 10.5999 1.85837C11.411 2.20837 12.1166 2.68337 12.7166 3.28337C13.3166 3.88337 13.7916 4.58893 14.1416 5.40004C14.4916 6.21115 14.6666 7.07782 14.6666 8.00004C14.6666 8.92226 14.4916 9.78893 14.1416 10.6C13.7916 11.4112 13.3166 12.1167 12.7166 12.7167C12.1166 13.3167 11.411 13.7917 10.5999 14.1417C9.78881 14.4917 8.92214 14.6667 7.99992 14.6667ZM7.99992 13.3334C9.48881 13.3334 10.7499 12.8167 11.7833 11.7834C12.8166 10.75 13.3333 9.48893 13.3333 8.00004C13.3333 6.51115 12.8166 5.25004 11.7833 4.21671C10.7499 3.18337 9.48881 2.66671 7.99992 2.66671C6.51103 2.66671 5.24992 3.18337 4.21659 4.21671C3.18325 5.25004 2.66659 6.51115 2.66659 8.00004C2.66659 9.48893 3.18325 10.75 4.21659 11.7834C5.24992 12.8167 6.51103 13.3334 7.99992 13.3334Z", fill: "#002B2A" })));
+    return (React.createElement("svg", __assign({ width: "1em", height: "1em", viewBox: "0 0 30 30", fill: "none" }, props),
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M15 25c5.523 0 10-4.477 10-10S20.523 5 15 5 5 9.477 5 15s4.477 10 10 10zm0 3c7.18 0 13-5.82 13-13S22.18 2 15 2 2 7.82 2 15s5.82 13 13 13zm2-18a2 2 0 11-4 0 2 2 0 014 0zm-4 6v5a2 2 0 104 0v-5a2 2 0 10-4 0z", fill: "currentColor" })));
 }
 exports.default = SvgInfo;
 //# sourceMappingURL=Info.js.map

package/dist/icons/Info.js.map

@@ -1 +1 @@
-{"version":3,"file":"Info.js","sourceRoot":"","sources":["../../src/icons/Info.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,6BAA8B;AAE9B,SAAS,OAAO,CAAC,KAAoC;IACnD,OAAO,CACL,sCACE,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,IAC9B,KAAK;QAET,8BACE,CAAC,EAAC,47DAA47D,EAC97D,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAA;AACH,CAAC;AAED,kBAAe,OAAO,CAAA"}
+{"version":3,"file":"Info.js","sourceRoot":"","sources":["../../src/icons/Info.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,6BAA8B;AAE9B,SAAS,OAAO,CAAC,KAAoC;IACnD,OAAO,CACL,sCAAK,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,IAAK,KAAK;QACrE,8BACE,QAAQ,EAAC,SAAS,EAClB,QAAQ,EAAC,SAAS,EAClB,CAAC,EAAC,8MAA8M,EAChN,IAAI,EAAC,cAAc,GACnB,CACE,CACP,CAAA;AACH,CAAC;AAED,kBAAe,OAAO,CAAA"}

package/dist/types/components/CopyBox/index.d.ts

@@ -1 +1,11 @@
-export { default } from './CopyBox';
+/// <reference types="react" />
+import 'antd/es/button/style/css';
+declare type CopyBoxType = {
+    value: string;
+    prefix?: string;
+    withCopy?: boolean;
+    valueToCopy?: string;
+    onButtonClick?: () => void;
+};
+declare const CopyBox: ({ value, prefix, withCopy, valueToCopy, onButtonClick, ...props }: CopyBoxType) => JSX.Element;
+export default CopyBox;