@proprioo/salatim 18.5.0 → 19.1.0

package/lib/ui/src/toggle/Toggle.styles.js

@@ -1,8 +1,4 @@
 "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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -24,13 +20,91 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Wrapper = exports.Label = void 0;
-var styled_components_1 = __importStar(require("styled-components"));
-var utils_1 = require("../../../utils");
-exports.Label = styled_components_1.default.label(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n  margin: 0;\n  cursor: pointer;\n  color: ", ";\n\n  ", "\n"], ["\n  ", ";\n  margin: 0;\n  cursor: pointer;\n  color: ", ";\n\n  ",
-    "\n"])), utils_1.paragraphs.body2, utils_1.colors.dark.base, function (_a) {
-    var disabled = _a.disabled;
-    return disabled && styled_components_1.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      color: ", ";\n    "], ["\n      color: ", ";\n    "])), utils_1.colors.grey.base60);
-});
-exports.Wrapper = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n\n  & + & {\n    margin-top: ", ";\n  }\n\n  .react-toggle {\n    margin-right: ", ";\n  }\n\n  .react-toggle-track {\n    width: ", ";\n    height: ", ";\n    background: ", ";\n  }\n\n  .react-toggle-thumb {\n    background: white;\n    border: none;\n    position: absolute;\n    top: 50%;\n    left: ", ";\n    width: ", ";\n    height: ", ";\n    transform: translateY(-50%);\n    border-radius: ", ";\n  }\n\n  .react-toggle--checked {\n    .react-toggle-track {\n      background: ", ";\n    }\n    .react-toggle-thumb\u00A0 {\n      left: ", ";\n    }\n  }\n\n  .react-toggle--focus {\n    .react-toggle-thumb {\n      box-shadow: unset;\n    }\n\n    &.react-toggle-track {\n      background: ", ";\n    }\n  }\n\n  .react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {\n    background: ", ";\n  }\n\n  .react-toggle.react-toggle--checked:hover:not(.react-toggle--disabled)\n    .react-toggle-track {\n    background: ", ";\n  }\n\n  .react-toggle:active:not(.react-toggle--disabled) .react-toggle-thumb {\n    box-shadow: unset;\n  }\n\n  .react-toggle--disabled {\n    opacity: 1;\n\n    .react-toggle-thumb {\n      background: ", ";\n    }\n\n    .react-toggle-track {\n      background: ", ";\n    }\n  }\n"], ["\n  display: flex;\n  align-items: center;\n\n  & + & {\n    margin-top: ", ";\n  }\n\n  .react-toggle {\n    margin-right: ", ";\n  }\n\n  .react-toggle-track {\n    width: ", ";\n    height: ", ";\n    background: ", ";\n  }\n\n  .react-toggle-thumb {\n    background: white;\n    border: none;\n    position: absolute;\n    top: 50%;\n    left: ", ";\n    width: ", ";\n    height: ", ";\n    transform: translateY(-50%);\n    border-radius: ", ";\n  }\n\n  .react-toggle--checked {\n    .react-toggle-track {\n      background: ", ";\n    }\n    .react-toggle-thumb\u00A0 {\n      left: ", ";\n    }\n  }\n\n  .react-toggle--focus {\n    .react-toggle-thumb {\n      box-shadow: unset;\n    }\n\n    &.react-toggle-track {\n      background: ", ";\n    }\n  }\n\n  .react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {\n    background: ", ";\n  }\n\n  .react-toggle.react-toggle--checked:hover:not(.react-toggle--disabled)\n    .react-toggle-track {\n    background: ", ";\n  }\n\n  .react-toggle:active:not(.react-toggle--disabled) .react-toggle-thumb {\n    box-shadow: unset;\n  }\n\n  .react-toggle--disabled {\n    opacity: 1;\n\n    .react-toggle-thumb {\n      background: ", ";\n    }\n\n    .react-toggle-track {\n      background: ", ";\n    }\n  }\n"])), utils_1.convertPxToRem(12), utils_1.convertPxToRem(8), utils_1.convertPxToRem(40), utils_1.convertPxToRem(24), utils_1.colors.grey.base20, utils_1.convertPxToRem(4), utils_1.convertPxToRem(18), utils_1.convertPxToRem(18), utils_1.radius.rounded, utils_1.colors.orange.base, utils_1.convertPxToRem(18), utils_1.colors.orange.base, utils_1.colors.grey.base20, utils_1.colors.orange.base, utils_1.colors.dark.base20, utils_1.colors.dark.base10);
-var templateObject_1, templateObject_2, templateObject_3;
+const styled_components_1 = __importStar(require("styled-components"));
+const utils_1 = require("../../../utils");
+exports.Label = styled_components_1.default.label `
+  ${utils_1.paragraphs.body2};
+  margin: 0;
+  cursor: pointer;
+  color: ${utils_1.colors.dark.base};
+
+  ${({ disabled }) => disabled &&
+    (0, styled_components_1.css) `
+      color: ${utils_1.colors.grey.base60};
+    `}
+`;
+exports.Wrapper = styled_components_1.default.div `
+  display: flex;
+  align-items: center;
+
+  & + & {
+    margin-top: ${(0, utils_1.convertPxToRem)(12)};
+  }
+
+  .react-toggle {
+    margin-right: ${(0, utils_1.convertPxToRem)(8)};
+  }
+
+  .react-toggle-track {
+    width: ${(0, utils_1.convertPxToRem)(40)};
+    height: ${(0, utils_1.convertPxToRem)(24)};
+    background: ${utils_1.colors.grey.base20};
+  }
+
+  .react-toggle-thumb {
+    background: white;
+    border: none;
+    position: absolute;
+    top: 50%;
+    left: ${(0, utils_1.convertPxToRem)(4)};
+    width: ${(0, utils_1.convertPxToRem)(18)};
+    height: ${(0, utils_1.convertPxToRem)(18)};
+    transform: translateY(-50%);
+    border-radius: ${utils_1.radius.rounded};
+  }
+
+  .react-toggle--checked {
+    .react-toggle-track {
+      background: ${utils_1.colors.orange.base};
+    }
+    .react-toggle-thumb  {
+      left: ${(0, utils_1.convertPxToRem)(18)};
+    }
+  }
+
+  .react-toggle--focus {
+    .react-toggle-thumb {
+      box-shadow: unset;
+    }
+
+    &.react-toggle-track {
+      background: ${utils_1.colors.orange.base};
+    }
+  }
+
+  .react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
+    background: ${utils_1.colors.grey.base20};
+  }
+
+  .react-toggle.react-toggle--checked:hover:not(.react-toggle--disabled)
+    .react-toggle-track {
+    background: ${utils_1.colors.orange.base};
+  }
+
+  .react-toggle:active:not(.react-toggle--disabled) .react-toggle-thumb {
+    box-shadow: unset;
+  }
+
+  .react-toggle--disabled {
+    opacity: 1;
+
+    .react-toggle-thumb {
+      background: ${utils_1.colors.dark.base20};
+    }
+
+    .react-toggle-track {
+      background: ${utils_1.colors.dark.base10};
+    }
+  }
+`;
 //# sourceMappingURL=Toggle.styles.js.map

package/lib/ui/src/toggle/Toggle.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.styles.js","sourceRoot":"","sources":["../../../../packages/ui/src/toggle/Toggle.styles.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,qEAAgD;AAEhD,wCAA4E;AAE/D,QAAA,KAAK,GAAG,2BAAM,CAAC,KAAK,4IAAuB,MACpD,EAAgB,gDAGT,EAAgB,SAEvB;IAIC,IACJ,KAVG,kBAAU,CAAC,KAAK,EAGT,cAAM,CAAC,IAAI,CAAC,IAAI,EAEvB,UAAC,EAAY;QAAV,QAAQ,cAAA;IACX,OAAA,QAAQ,IACR,uBAAG,+FAAA,iBACQ,EAAkB,SAC5B,KADU,cAAM,CAAC,IAAI,CAAC,MAAM,CAC5B;AAHD,CAGC,EACH;AAEW,QAAA,OAAO,GAAG,2BAAM,CAAC,GAAG,s0CAAA,2EAKf,EAAkB,iDAIhB,EAAiB,gDAIxB,EAAkB,iBACjB,EAAkB,qBACd,EAAkB,kIAQxB,EAAiB,gBAChB,EAAkB,iBACjB,EAAkB,0DAEX,EAAc,qFAKf,EAAkB,yDAGxB,EAAkB,yJAUZ,EAAkB,6GAKpB,EAAkB,iIAKlB,EAAkB,mNAWhB,EAAkB,2DAIlB,EAAkB,iBAGrC,KApEiB,sBAAc,CAAC,EAAE,CAAC,EAIhB,sBAAc,CAAC,CAAC,CAAC,EAIxB,sBAAc,CAAC,EAAE,CAAC,EACjB,sBAAc,CAAC,EAAE,CAAC,EACd,cAAM,CAAC,IAAI,CAAC,MAAM,EAQxB,sBAAc,CAAC,CAAC,CAAC,EAChB,sBAAc,CAAC,EAAE,CAAC,EACjB,sBAAc,CAAC,EAAE,CAAC,EAEX,cAAM,CAAC,OAAO,EAKf,cAAM,CAAC,MAAM,CAAC,IAAI,EAGxB,sBAAc,CAAC,EAAE,CAAC,EAUZ,cAAM,CAAC,MAAM,CAAC,IAAI,EAKpB,cAAM,CAAC,IAAI,CAAC,MAAM,EAKlB,cAAM,CAAC,MAAM,CAAC,IAAI,EAWhB,cAAM,CAAC,IAAI,CAAC,MAAM,EAIlB,cAAM,CAAC,IAAI,CAAC,MAAM,EAGpC"}
+{"version":3,"file":"Toggle.styles.js","sourceRoot":"","sources":["../../../../packages/ui/src/toggle/Toggle.styles.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,uEAAgD;AAEhD,0CAA4E;AAE/D,QAAA,KAAK,GAAG,2BAAM,CAAC,KAAK,CAAuB;IACpD,kBAAU,CAAC,KAAK;;;WAGT,cAAM,CAAC,IAAI,CAAC,IAAI;;IAEvB,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CACjB,QAAQ;IACR,IAAA,uBAAG,EAAA;eACQ,cAAM,CAAC,IAAI,CAAC,MAAM;KAC5B;CACJ,CAAC;AAEW,QAAA,OAAO,GAAG,2BAAM,CAAC,GAAG,CAAA;;;;;kBAKf,IAAA,sBAAc,EAAC,EAAE,CAAC;;;;oBAIhB,IAAA,sBAAc,EAAC,CAAC,CAAC;;;;aAIxB,IAAA,sBAAc,EAAC,EAAE,CAAC;cACjB,IAAA,sBAAc,EAAC,EAAE,CAAC;kBACd,cAAM,CAAC,IAAI,CAAC,MAAM;;;;;;;;YAQxB,IAAA,sBAAc,EAAC,CAAC,CAAC;aAChB,IAAA,sBAAc,EAAC,EAAE,CAAC;cACjB,IAAA,sBAAc,EAAC,EAAE,CAAC;;qBAEX,cAAM,CAAC,OAAO;;;;;oBAKf,cAAM,CAAC,MAAM,CAAC,IAAI;;;cAGxB,IAAA,sBAAc,EAAC,EAAE,CAAC;;;;;;;;;;oBAUZ,cAAM,CAAC,MAAM,CAAC,IAAI;;;;;kBAKpB,cAAM,CAAC,IAAI,CAAC,MAAM;;;;;kBAKlB,cAAM,CAAC,MAAM,CAAC,IAAI;;;;;;;;;;;oBAWhB,cAAM,CAAC,IAAI,CAAC,MAAM;;;;oBAIlB,cAAM,CAAC,IAAI,CAAC,MAAM;;;CAGrC,CAAC"}

package/lib/ui/src/toggle/Toggle.test.js

@@ -8,84 +8,39 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var react_2 = require("@testing-library/react");
-var user_event_1 = __importDefault(require("@testing-library/user-event"));
-var Toggle_1 = __importDefault(require("./Toggle"));
-describe('Toggle component', function () {
-    it('Should render a component', function () {
-        react_2.render(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: function () { return ({}); }, id: "test" }));
+const react_1 = __importDefault(require("react"));
+const react_2 = require("@testing-library/react");
+const user_event_1 = __importDefault(require("@testing-library/user-event"));
+const Toggle_1 = __importDefault(require("./Toggle"));
+describe('Toggle component', () => {
+    it('Should render a component', () => {
+        (0, react_2.render)(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: () => ({}), id: "test" }));
         expect(react_2.screen.getByRole('checkbox', { name: 'test' })).toBeInTheDocument();
         expect(react_2.screen.getByTestId('toggle-label')).toHaveTextContent('test');
     });
-    it('Should render a disabled component', function () {
-        react_2.render(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: function () { return ({}); }, id: "test", disabled: true }));
+    it('Should render a disabled component', () => {
+        (0, react_2.render)(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: () => ({}), id: "test", disabled: true }));
         expect(react_2.screen.getByRole('checkbox')).toHaveAttribute('disabled');
         expect(react_2.screen.getByTestId('toggle-label')).toHaveAttribute('disabled');
     });
-    it('Should call onChange on toggle ', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var mockOnChange;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    mockOnChange = jest.fn();
-                    react_2.render(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: mockOnChange, id: "test", checked: false }));
-                    user_event_1.default.click(react_2.screen.getByRole('checkbox'));
-                    return [4 /*yield*/, react_2.waitFor(function () { return expect(mockOnChange).toHaveBeenCalledWith(true); })];
-                case 1:
-                    _a.sent();
-                    return [2 /*return*/];
-            }
-        });
-    }); });
-    it('Should call onChange on toggle ', function () { return __awaiter(void 0, void 0, void 0, function () {
-        var mockOnChange;
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    mockOnChange = jest.fn();
-                    react_2.render(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: mockOnChange, id: "test", checked: false }));
-                    user_event_1.default.click(react_2.screen.getByRole('checkbox'));
-                    user_event_1.default.click(react_2.screen.getByRole('checkbox'));
-                    return [4 /*yield*/, react_2.waitFor(function () {
-                            expect(mockOnChange).toHaveBeenCalledTimes(2);
-                        })];
-                case 1:
-                    _a.sent();
-                    return [2 /*return*/];
-            }
+    it('Should call onChange on toggle ', () => __awaiter(void 0, void 0, void 0, function* () {
+        const mockOnChange = jest.fn();
+        (0, react_2.render)(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: mockOnChange, id: "test", checked: false }));
+        user_event_1.default.click(react_2.screen.getByRole('checkbox'));
+        yield (0, react_2.waitFor)(() => expect(mockOnChange).toHaveBeenCalledWith(true));
+    }));
+    it('Should call onChange on toggle ', () => __awaiter(void 0, void 0, void 0, function* () {
+        const mockOnChange = jest.fn();
+        (0, react_2.render)(react_1.default.createElement(Toggle_1.default, { label: "test", name: "test", onChange: mockOnChange, id: "test", checked: false }));
+        user_event_1.default.click(react_2.screen.getByRole('checkbox'));
+        user_event_1.default.click(react_2.screen.getByRole('checkbox'));
+        yield (0, react_2.waitFor)(() => {
+            expect(mockOnChange).toHaveBeenCalledTimes(2);
         });
-    }); });
+    }));
 });
 //# sourceMappingURL=Toggle.test.js.map

package/lib/ui/src/toggle/Toggle.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.test.js","sourceRoot":"","sources":["../../../../packages/ui/src/toggle/Toggle.test.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAE1B,gDAAiE;AACjE,2EAAoD;AAEpD,oDAA8B;AAE9B,QAAQ,CAAC,kBAAkB,EAAE;IAC3B,EAAE,CAAC,2BAA2B,EAAE;QAC9B,cAAM,CAAC,8BAAC,gBAAM,IAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,cAAM,OAAA,CAAC,EAAE,CAAC,EAAJ,CAAI,EAAE,EAAE,EAAC,MAAM,GAAG,CAAC,CAAC;QAE5E,MAAM,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QAC3E,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oCAAoC,EAAE;QACvC,cAAM,CACJ,8BAAC,gBAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,cAAM,OAAA,CAAC,EAAE,CAAC,EAAJ,CAAI,EACpB,EAAE,EAAC,MAAM,EACT,QAAQ,EAAE,IAAI,GACd,CACH,CAAC;QAEF,MAAM,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;QACjE,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;IACzE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE;;;;;oBAC9B,YAAY,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;oBAE/B,cAAM,CACJ,8BAAC,gBAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,YAAY,EACtB,EAAE,EAAC,MAAM,EACT,OAAO,EAAE,KAAK,GACd,CACH,CAAC;oBAEF,oBAAS,CAAC,KAAK,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;oBAC9C,qBAAM,eAAO,CAAC,cAAM,OAAA,MAAM,CAAC,YAAY,CAAC,CAAC,oBAAoB,CAAC,IAAI,CAAC,EAA/C,CAA+C,CAAC,EAAA;;oBAApE,SAAoE,CAAC;;;;SACtE,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE;;;;;oBAC9B,YAAY,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;oBAE/B,cAAM,CACJ,8BAAC,gBAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,YAAY,EACtB,EAAE,EAAC,MAAM,EACT,OAAO,EAAE,KAAK,GACd,CACH,CAAC;oBAEF,oBAAS,CAAC,KAAK,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;oBAC9C,oBAAS,CAAC,KAAK,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;oBAC9C,qBAAM,eAAO,CAAC;4BACZ,MAAM,CAAC,YAAY,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;wBAChD,CAAC,CAAC,EAAA;;oBAFF,SAEE,CAAC;;;;SACJ,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
+{"version":3,"file":"Toggle.test.js","sourceRoot":"","sources":["../../../../packages/ui/src/toggle/Toggle.test.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA,kDAA0B;AAE1B,kDAAiE;AACjE,6EAAoD;AAEpD,sDAA8B;AAE9B,QAAQ,CAAC,kBAAkB,EAAE,GAAG,EAAE;IAChC,EAAE,CAAC,2BAA2B,EAAE,GAAG,EAAE;QACnC,IAAA,cAAM,EAAC,8BAAC,gBAAM,IAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,MAAM,EAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAC,MAAM,GAAG,CAAC,CAAC;QAE5E,MAAM,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,iBAAiB,EAAE,CAAC;QAC3E,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACvE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oCAAoC,EAAE,GAAG,EAAE;QAC5C,IAAA,cAAM,EACJ,8BAAC,gBAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EACpB,EAAE,EAAC,MAAM,EACT,QAAQ,EAAE,IAAI,GACd,CACH,CAAC;QAEF,MAAM,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;QACjE,MAAM,CAAC,cAAM,CAAC,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;IACzE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,GAAS,EAAE;QAC/C,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAE/B,IAAA,cAAM,EACJ,8BAAC,gBAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,YAAY,EACtB,EAAE,EAAC,MAAM,EACT,OAAO,EAAE,KAAK,GACd,CACH,CAAC;QAEF,oBAAS,CAAC,KAAK,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;QAC9C,MAAM,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC;IACvE,CAAC,CAAA,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,GAAS,EAAE;QAC/C,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAE/B,IAAA,cAAM,EACJ,8BAAC,gBAAM,IACL,KAAK,EAAC,MAAM,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,YAAY,EACtB,EAAE,EAAC,MAAM,EACT,OAAO,EAAE,KAAK,GACd,CACH,CAAC;QAEF,oBAAS,CAAC,KAAK,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;QAC9C,oBAAS,CAAC,KAAK,CAAC,cAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC;QAC9C,MAAM,IAAA,eAAO,EAAC,GAAG,EAAE;YACjB,MAAM,CAAC,YAAY,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;QAChD,CAAC,CAAC,CAAC;IACL,CAAC,CAAA,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/lib/ui/src/tooltip/Tooltip.js

@@ -1,15 +1,4 @@
 "use strict";
-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 __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
@@ -31,39 +20,38 @@ var __importStar = (this && this.__importStar) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 require("react-popper-tooltip/dist/styles.css");
-var react_1 = __importStar(require("react"));
-var react_dom_1 = require("react-dom");
-var react_popper_tooltip_1 = require("react-popper-tooltip");
-var utils_1 = require("../../../utils");
-var Tooltip_styles_1 = require("./Tooltip.styles");
-var canUseDOM = Boolean(typeof window !== 'undefined' &&
+const react_1 = __importStar(require("react"));
+const react_dom_1 = require("react-dom");
+const react_popper_tooltip_1 = require("react-popper-tooltip");
+const utils_1 = require("../../../utils");
+const Tooltip_styles_1 = require("./Tooltip.styles");
+const canUseDOM = Boolean(typeof window !== 'undefined' &&
     window.document &&
     window.document.createElement);
-var Tooltip = function (_a) {
-    var isArrowHidden = _a.isArrowHidden, isFollowingCursor = _a.isFollowingCursor, _b = _a.usePortal, usePortal = _b === void 0 ? canUseDOM : _b, children = _a.children, tooltip = _a.tooltip, _c = _a.trigger, trigger = _c === void 0 ? utils_1.isTouchDevice() ? 'click' : 'hover' : _c, _d = _a.maxWidth, maxWidth = _d === void 0 ? '300px' : _d, delayHide = _a.delayHide, delayShow = _a.delayShow, _e = _a.placement, placement = _e === void 0 ? 'auto' : _e, _f = _a.interactive, interactive = _f === void 0 ? false : _f, _g = _a.isVisible, isDisplayed = _g === void 0 ? true : _g;
-    var _h = react_popper_tooltip_1.usePopperTooltip({
-        trigger: trigger,
+const Tooltip = ({ isArrowHidden, isFollowingCursor, usePortal = canUseDOM, children, tooltip, trigger = (0, utils_1.isTouchDevice)() ? 'click' : 'hover', maxWidth = '300px', delayHide, delayShow, placement = 'auto', interactive = false, isVisible: isDisplayed = true }) => {
+    const { getTooltipProps, getArrowProps, setTooltipRef, setTriggerRef, visible } = (0, react_popper_tooltip_1.usePopperTooltip)({
+        trigger,
         followCursor: isFollowingCursor,
-        delayHide: delayHide,
-        delayShow: delayShow,
-        placement: placement,
+        delayHide,
+        delayShow,
+        placement,
         offset: [0, 0],
-        interactive: interactive
-    }), getTooltipProps = _h.getTooltipProps, getArrowProps = _h.getArrowProps, setTooltipRef = _h.setTooltipRef, setTriggerRef = _h.setTriggerRef, visible = _h.visible;
-    var wrapperTooltip = (react_1.default.createElement(Tooltip_styles_1.Layout, null,
-        react_1.default.createElement("div", __assign({}, getTooltipProps({
+        interactive
+    });
+    const wrapperTooltip = (react_1.default.createElement(Tooltip_styles_1.Layout, null,
+        react_1.default.createElement("div", Object.assign({}, getTooltipProps({
             className: 'tooltip-container',
-            style: { maxWidth: maxWidth }
+            style: { maxWidth }
         }), { ref: setTooltipRef }),
-            !isArrowHidden && (react_1.default.createElement("div", __assign({}, getArrowProps({
+            !isArrowHidden && (react_1.default.createElement("div", Object.assign({}, getArrowProps({
                 className: 'tooltip-arrow'
             }), { "data-popper-arrow": true }))),
             tooltip)));
-    var portalContainer = canUseDOM ? document.body : null;
+    const portalContainer = canUseDOM ? document.body : null;
     return (react_1.default.createElement(Tooltip_styles_1.WrappedComponent, { ref: setTriggerRef, "data-test": "tooltip-wrapped-component" },
         children,
         isDisplayed && visible && (react_1.default.createElement(react_1.Fragment, null, usePortal && portalContainer
-            ? react_dom_1.createPortal(wrapperTooltip, portalContainer)
+            ? (0, react_dom_1.createPortal)(wrapperTooltip, portalContainer)
             : wrapperTooltip))));
 };
 exports.default = Tooltip;

package/lib/ui/src/tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../packages/ui/src/tooltip/Tooltip.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA8C;AAE9C,6CAA0D;AAC1D,uCAAyC;AACzC,6DAAqE;AAIrE,wCAA+C;AAC/C,mDAA4D;AAgB5D,IAAM,SAAS,GAAG,OAAO,CACvB,OAAO,MAAM,KAAK,WAAW;IAC3B,MAAM,CAAC,QAAQ;IACf,MAAM,CAAC,QAAQ,CAAC,aAAa,CAChC,CAAC;AAEF,IAAM,OAAO,GAAqB,UAAC,EAalC;QAZC,aAAa,mBAAA,EACb,iBAAiB,uBAAA,EACjB,iBAAqB,EAArB,SAAS,mBAAG,SAAS,KAAA,EACrB,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,eAA6C,EAA7C,OAAO,mBAAG,qBAAa,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,KAAA,EAC7C,gBAAkB,EAAlB,QAAQ,mBAAG,OAAO,KAAA,EAClB,SAAS,eAAA,EACT,SAAS,eAAA,EACT,iBAAkB,EAAlB,SAAS,mBAAG,MAAM,KAAA,EAClB,mBAAmB,EAAnB,WAAW,mBAAG,KAAK,KAAA,EACnB,iBAA6B,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEvB,IAAA,KAMF,uCAAgB,CAAC;QACnB,OAAO,SAAA;QACP,YAAY,EAAE,iBAAiB;QAC/B,SAAS,WAAA;QACT,SAAS,WAAA;QACT,SAAS,WAAA;QACT,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QACd,WAAW,aAAA;KACZ,CAAC,EAbA,eAAe,qBAAA,EACf,aAAa,mBAAA,EACb,aAAa,mBAAA,EACb,aAAa,mBAAA,EACb,OAAO,aASP,CAAC;IAEH,IAAM,cAAc,GAAG,CACrB,8BAAC,uBAAM;QACL,kDACM,eAAe,CAAC;YAClB,SAAS,EAAE,mBAAmB;YAC9B,KAAK,EAAE,EAAE,QAAQ,UAAA,EAAE;SACpB,CAAC,IACF,GAAG,EAAE,aAAa;YAEjB,CAAC,aAAa,IAAI,CACjB,kDACM,aAAa,CAAC;gBAChB,SAAS,EAAE,eAAe;aAC3B,CAAC,iCAEF,CACH;YACA,OAAO,CACJ,CACC,CACV,CAAC;IAEF,IAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAEzD,OAAO,CACL,8BAAC,iCAAgB,IAAC,GAAG,EAAE,aAAa,eAAY,2BAA2B;QACxE,QAAQ;QACR,WAAW,IAAI,OAAO,IAAI,CACzB,8BAAC,gBAAQ,QACN,SAAS,IAAI,eAAe;YAC3B,CAAC,CAAC,wBAAY,CAAC,cAAc,EAAE,eAAe,CAAC;YAC/C,CAAC,CAAC,cAAc,CACT,CACZ,CACgB,CACpB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,OAAO,CAAC"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../../packages/ui/src/tooltip/Tooltip.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,gDAA8C;AAE9C,+CAA0D;AAC1D,yCAAyC;AACzC,+DAAqE;AAIrE,0CAA+C;AAC/C,qDAA4D;AAgB5D,MAAM,SAAS,GAAG,OAAO,CACvB,OAAO,MAAM,KAAK,WAAW;IAC3B,MAAM,CAAC,QAAQ;IACf,MAAM,CAAC,QAAQ,CAAC,aAAa,CAChC,CAAC;AAEF,MAAM,OAAO,GAAqB,CAAC,EACjC,aAAa,EACb,iBAAiB,EACjB,SAAS,GAAG,SAAS,EACrB,QAAQ,EACR,OAAO,EACP,OAAO,GAAG,IAAA,qBAAa,GAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EAC7C,QAAQ,GAAG,OAAO,EAClB,SAAS,EACT,SAAS,EACT,SAAS,GAAG,MAAM,EAClB,WAAW,GAAG,KAAK,EACnB,SAAS,EAAE,WAAW,GAAG,IAAI,EAC9B,EAAE,EAAE;IACH,MAAM,EACJ,eAAe,EACf,aAAa,EACb,aAAa,EACb,aAAa,EACb,OAAO,EACR,GAAG,IAAA,uCAAgB,EAAC;QACnB,OAAO;QACP,YAAY,EAAE,iBAAiB;QAC/B,SAAS;QACT,SAAS;QACT,SAAS;QACT,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;QACd,WAAW;KACZ,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,CACrB,8BAAC,uBAAM;QACL,uDACM,eAAe,CAAC;YAClB,SAAS,EAAE,mBAAmB;YAC9B,KAAK,EAAE,EAAE,QAAQ,EAAE;SACpB,CAAC,IACF,GAAG,EAAE,aAAa;YAEjB,CAAC,aAAa,IAAI,CACjB,uDACM,aAAa,CAAC;gBAChB,SAAS,EAAE,eAAe;aAC3B,CAAC,iCAEF,CACH;YACA,OAAO,CACJ,CACC,CACV,CAAC;IAEF,MAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAEzD,OAAO,CACL,8BAAC,iCAAgB,IAAC,GAAG,EAAE,aAAa,eAAY,2BAA2B;QACxE,QAAQ;QACR,WAAW,IAAI,OAAO,IAAI,CACzB,8BAAC,gBAAQ,QACN,SAAS,IAAI,eAAe;YAC3B,CAAC,CAAC,IAAA,wBAAY,EAAC,cAAc,EAAE,eAAe,CAAC;YAC/C,CAAC,CAAC,cAAc,CACT,CACZ,CACgB,CACpB,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,OAAO,CAAC"}

package/lib/ui/src/tooltip/Tooltip.stories.js

@@ -1,32 +1,21 @@
 "use strict";
-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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-var addon_knobs_1 = require("@storybook/addon-knobs");
-var react_2 = require("@storybook/react");
-var utils_1 = require("../../../utils");
-var Button_1 = __importDefault(require("../button/Button"));
-var icons_1 = __importDefault(require("../icons"));
-var Help_1 = __importDefault(require("../icons/Help"));
-var Tooltip_1 = __importDefault(require("./Tooltip"));
-var EmoticonCool = icons_1.default.EmoticonCool;
-var defaultProps = {
+const react_1 = __importDefault(require("react"));
+const addon_knobs_1 = require("@storybook/addon-knobs");
+const react_2 = require("@storybook/react");
+const utils_1 = require("../../../utils");
+const Button_1 = __importDefault(require("../button/Button"));
+const icons_1 = __importDefault(require("../icons"));
+const Help_1 = __importDefault(require("../icons/Help"));
+const Tooltip_1 = __importDefault(require("./Tooltip"));
+const { EmoticonCool } = icons_1.default;
+const defaultProps = {
     tooltip: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum'
 };
-var placementSelect = addon_knobs_1.select('Placement', [
+const placementSelect = (0, addon_knobs_1.select)('Placement', [
     'auto',
     'top',
     'right',
@@ -41,47 +30,47 @@ var placementSelect = addon_knobs_1.select('Placement', [
     'left-start',
     'left-end'
 ], 'auto');
-var hideArrow = addon_knobs_1.boolean('Hide arrow', false);
-var followCursor = addon_knobs_1.boolean('Follow cursor', false);
-var delayShow = addon_knobs_1.number('Delay before showing tooltip (in ms)', 0);
-var delayHide = addon_knobs_1.number('Delay before hidding tooltip (in ms)', 0);
-var trigger = addon_knobs_1.select('Trigger mode', ['click', 'right-click', 'hover', 'focus'], 'hover');
-react_2.storiesOf('Tooltip', module)
-    .add('with string', function () {
+const hideArrow = (0, addon_knobs_1.boolean)('Hide arrow', false);
+const followCursor = (0, addon_knobs_1.boolean)('Follow cursor', false);
+const delayShow = (0, addon_knobs_1.number)('Delay before showing tooltip (in ms)', 0);
+const delayHide = (0, addon_knobs_1.number)('Delay before hidding tooltip (in ms)', 0);
+const trigger = (0, addon_knobs_1.select)('Trigger mode', ['click', 'right-click', 'hover', 'focus'], 'hover');
+(0, react_2.storiesOf)('Tooltip', module)
+    .add('with string', () => {
     return (react_1.default.createElement("div", { style: {
             width: '100%',
             textAlign: 'center',
             margin: '300px 0'
         } },
-        react_1.default.createElement(Tooltip_1.default, __assign({}, defaultProps, { placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: trigger }),
+        react_1.default.createElement(Tooltip_1.default, Object.assign({}, defaultProps, { placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: trigger }),
             react_1.default.createElement(Help_1.default, { "data-test": "help-icon", fill: utils_1.colors.grey.base }))));
 })
-    .add('with ReactElement', function () {
-    var FakeComponent = function () { return react_1.default.createElement("div", null, "Fake component"); };
+    .add('with ReactElement', () => {
+    const FakeComponent = () => react_1.default.createElement("div", null, "Fake component");
     return (react_1.default.createElement("div", { style: {
             width: '100%',
             textAlign: 'center',
             margin: '300px 0'
         } },
-        react_1.default.createElement(Tooltip_1.default, __assign({}, defaultProps, { tooltip: react_1.default.createElement(FakeComponent, null), placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: trigger }),
+        react_1.default.createElement(Tooltip_1.default, Object.assign({}, defaultProps, { tooltip: react_1.default.createElement(FakeComponent, null), placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: trigger }),
             react_1.default.createElement(Help_1.default, { "data-test": "help-icon", fill: utils_1.colors.grey.base }))));
 })
-    .add('with button interaction', function () {
+    .add('with button interaction', () => {
     return (react_1.default.createElement("div", { style: {
             width: '100%',
             textAlign: 'center',
             margin: '300px 0'
         } },
-        react_1.default.createElement(Tooltip_1.default, __assign({}, defaultProps, { tooltip: react_1.default.createElement(Button_1.default, { label: "click me", icon: react_1.default.createElement(EmoticonCool, null) }), placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: 'click', interactive: true }),
+        react_1.default.createElement(Tooltip_1.default, Object.assign({}, defaultProps, { tooltip: react_1.default.createElement(Button_1.default, { label: "click me", icon: react_1.default.createElement(EmoticonCool, null) }), placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: 'click', interactive: true }),
             react_1.default.createElement(Help_1.default, { "data-test": "help-icon", fill: utils_1.colors.grey.base }))));
 })
-    .add('is not visible', function () {
+    .add('is not visible', () => {
     return (react_1.default.createElement("div", { style: {
             width: '100%',
             textAlign: 'center',
             margin: '300px 0'
         } },
-        react_1.default.createElement(Tooltip_1.default, __assign({}, defaultProps, { tooltip: react_1.default.createElement(Button_1.default, { label: "click me", icon: react_1.default.createElement(EmoticonCool, null) }), placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: 'click', interactive: true, isVisible: false }),
+        react_1.default.createElement(Tooltip_1.default, Object.assign({}, defaultProps, { tooltip: react_1.default.createElement(Button_1.default, { label: "click me", icon: react_1.default.createElement(EmoticonCool, null) }), placement: placementSelect, isArrowHidden: hideArrow, isFollowingCursor: followCursor, delayShow: delayShow, delayHide: delayHide, trigger: 'click', interactive: true, isVisible: false }),
             react_1.default.createElement(Help_1.default, { "data-test": "help-icon", fill: utils_1.colors.grey.base }))));
 });
 //# sourceMappingURL=Tooltip.stories.js.map

package/lib/ui/src/tooltip/Tooltip.stories.js.map

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

package/lib/ui/src/tooltip/Tooltip.styles.js

@@ -1,16 +1,63 @@
 "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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.WrappedComponent = exports.Layout = void 0;
-var styled_components_1 = __importDefault(require("styled-components"));
-var utils_1 = require("../../../utils");
-exports.Layout = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  .tooltip-container {\n    ", "\n    color: ", ";\n    font-size: ", ";\n    text-align: left;\n    background-color: white;\n    border: 0;\n    border-radius: ", ";\n    padding: ", " ", ";\n    box-shadow: ", ";\n    transition: unset;\n    z-index: 500;\n  }\n\n  .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {\n    margin-top: -0.35rem;\n  }\n\n  .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {\n    margin-bottom: -0.95rem;\n  }\n\n  .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: transparent transparent white transparent;\n    }\n  }\n\n  .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: white transparent transparent transparent;\n    }\n  }\n\n  .tooltip-container[data-popper-placement*='right'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: transparent white transparent transparent;\n    }\n  }\n\n  .tooltip-container[data-popper-placement*='left'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: transparent transparent transparent white;\n    }\n  }\n"], ["\n  .tooltip-container {\n    ", "\n    color: ", ";\n    font-size: ", ";\n    text-align: left;\n    background-color: white;\n    border: 0;\n    border-radius: ", ";\n    padding: ", " ", ";\n    box-shadow: ", ";\n    transition: unset;\n    z-index: 500;\n  }\n\n  .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {\n    margin-top: -0.35rem;\n  }\n\n  .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {\n    margin-bottom: -0.95rem;\n  }\n\n  .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: transparent transparent white transparent;\n    }\n  }\n\n  .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: white transparent transparent transparent;\n    }\n  }\n\n  .tooltip-container[data-popper-placement*='right'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: transparent white transparent transparent;\n    }\n  }\n\n  .tooltip-container[data-popper-placement*='left'] .tooltip-arrow {\n    ::before,\n    ::after {\n      border-color: transparent transparent transparent white;\n    }\n  }\n"])), utils_1.ArchivoFont, utils_1.colors.dark.base, utils_1.fonts.small, utils_1.radius.normal, utils_1.convertPxToRem(16), utils_1.convertPxToRem(18), utils_1.shadows.level5);
-exports.WrappedComponent = styled_components_1.default.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: inline-block;\n"], ["\n  display: inline-block;\n"])));
-var templateObject_1, templateObject_2;
+const styled_components_1 = __importDefault(require("styled-components"));
+const utils_1 = require("../../../utils");
+exports.Layout = styled_components_1.default.div `
+  .tooltip-container {
+    ${utils_1.ArchivoFont}
+    color: ${utils_1.colors.dark.base};
+    font-size: ${utils_1.fonts.small};
+    text-align: left;
+    background-color: white;
+    border: 0;
+    border-radius: ${utils_1.radius.normal};
+    padding: ${(0, utils_1.convertPxToRem)(16)} ${(0, utils_1.convertPxToRem)(18)};
+    box-shadow: ${utils_1.shadows.level5};
+    transition: unset;
+    z-index: 500;
+  }
+
+  .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {
+    margin-top: -0.35rem;
+  }
+
+  .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {
+    margin-bottom: -0.95rem;
+  }
+
+  .tooltip-container[data-popper-placement*='bottom'] .tooltip-arrow {
+    ::before,
+    ::after {
+      border-color: transparent transparent white transparent;
+    }
+  }
+
+  .tooltip-container[data-popper-placement*='top'] .tooltip-arrow {
+    ::before,
+    ::after {
+      border-color: white transparent transparent transparent;
+    }
+  }
+
+  .tooltip-container[data-popper-placement*='right'] .tooltip-arrow {
+    ::before,
+    ::after {
+      border-color: transparent white transparent transparent;
+    }
+  }
+
+  .tooltip-container[data-popper-placement*='left'] .tooltip-arrow {
+    ::before,
+    ::after {
+      border-color: transparent transparent transparent white;
+    }
+  }
+`;
+exports.WrappedComponent = styled_components_1.default.span `
+  display: inline-block;
+`;
 //# sourceMappingURL=Tooltip.styles.js.map

package/lib/ui/src/tooltip/Tooltip.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.styles.js","sourceRoot":"","sources":["../../../../packages/ui/src/tooltip/Tooltip.styles.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,wEAAuC;AAEvC,wCAOwB;AAEX,QAAA,MAAM,GAAG,2BAAM,CAAC,GAAG,8uCAAA,gCAE1B,EAAW,eACJ,EAAgB,oBACZ,EAAW,6FAIP,EAAa,kBACnB,EAAkB,GAAI,EAAkB,qBACrC,EAAc,m9BAwC/B,KAhDK,mBAAW,EACJ,cAAM,CAAC,IAAI,CAAC,IAAI,EACZ,aAAK,CAAC,KAAK,EAIP,cAAM,CAAC,MAAM,EACnB,sBAAc,CAAC,EAAE,CAAC,EAAI,sBAAc,CAAC,EAAE,CAAC,EACrC,eAAO,CAAC,MAAM,EAwC9B;AAEW,QAAA,gBAAgB,GAAG,2BAAM,CAAC,IAAI,iGAAA,8BAE1C,KAAC"}
+{"version":3,"file":"Tooltip.styles.js","sourceRoot":"","sources":["../../../../packages/ui/src/tooltip/Tooltip.styles.ts"],"names":[],"mappings":";;;;;;AAAA,0EAAuC;AAEvC,0CAOwB;AAEX,QAAA,MAAM,GAAG,2BAAM,CAAC,GAAG,CAAA;;MAE1B,mBAAW;aACJ,cAAM,CAAC,IAAI,CAAC,IAAI;iBACZ,aAAK,CAAC,KAAK;;;;qBAIP,cAAM,CAAC,MAAM;eACnB,IAAA,sBAAc,EAAC,EAAE,CAAC,IAAI,IAAA,sBAAc,EAAC,EAAE,CAAC;kBACrC,eAAO,CAAC,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwC/B,CAAC;AAEW,QAAA,gBAAgB,GAAG,2BAAM,CAAC,IAAI,CAAA;;CAE1C,CAAC"}