@typeolymp/ui-components 1.7.1 → 1.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/build/components/atoms/Tag/index.d.ts +6 -0
  2. package/build/components/atoms/Tag/stories.d.ts +7 -0
  3. package/build/components/atoms/Tag/styles.d.ts +1 -0
  4. package/build/index.d.ts +2 -1
  5. package/build/index.es.js +40 -33
  6. package/build/index.es.js.map +1 -1
  7. package/build/index.js +40 -32
  8. package/build/index.js.map +1 -1
  9. package/package.json +1 -1
package/build/index.js CHANGED
@@ -198,7 +198,7 @@ function __makeTemplateObject(cooked, raw) {
198
198
  return cooked;
199
199
  }
200
200
 
201
- var StyledButton = styled__default["default"].button(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"])), function (_a) {
201
+ var StyledButton = styled__default["default"].button(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"])), function (_a) {
202
202
  var fluid = _a.fluid;
203
203
  return (fluid ? "100%" : "fit-content");
204
204
  }, function (_a) {
@@ -220,11 +220,11 @@ var StyledButton = styled__default["default"].button(templateObject_1$I || (temp
220
220
  switch (color) {
221
221
  default:
222
222
  case "blue":
223
- return "inset 0px -3px 0px ".concat(theme.colors.blue.dark);
223
+ return "inset 0 -3px 0 ".concat(theme.colors.blue.dark);
224
224
  case "green":
225
- return "inset 0px -3px 0px ".concat(theme.colors.green.dark);
225
+ return "inset 0 -3px 0 ".concat(theme.colors.green.dark);
226
226
  case "white":
227
- return " 0px 3px 0px ".concat(theme.colors.darkGray.light);
227
+ return "0 3px 0 ".concat(theme.colors.darkGray.light);
228
228
  }
229
229
  }, function (_a) {
230
230
  var color = _a.color;
@@ -268,7 +268,7 @@ var GhostButton = styled__default["default"](StyledButton)(templateObject_3$8 ||
268
268
  ? theme.button.medium.marginTopActive
269
269
  : theme.button[size].marginTopActive;
270
270
  });
271
- var templateObject_1$I, templateObject_2$q, templateObject_3$8;
271
+ var templateObject_1$J, templateObject_2$q, templateObject_3$8;
272
272
 
273
273
  var Button = React.forwardRef(function (props, ref) {
274
274
  var as = props.href || props.asAnchor ? "a" : "button";
@@ -286,7 +286,7 @@ var Button = React.forwardRef(function (props, ref) {
286
286
  return (jsxRuntime.jsx(StyledButton, __assign({}, props, { as: as, ref: ref, onClick: onClick }, { children: jsxRuntime.jsx("span", { children: props.label }, void 0) }), void 0));
287
287
  });
288
288
 
289
- var StyledCheckbox = styled__default["default"].div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
289
+ var StyledCheckbox = styled__default["default"].div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
290
290
  var checked = _a.checked, disabled = _a.disabled;
291
291
  if (disabled)
292
292
  return theme.colors.lightGray.darker;
@@ -307,7 +307,7 @@ var StyledCheckbox = styled__default["default"].div(templateObject_1$H || (templ
307
307
  return theme.colors.green.base;
308
308
  return theme.colors.lightGray.darker;
309
309
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
310
- var templateObject_1$H;
310
+ var templateObject_1$I;
311
311
 
312
312
  var Checkbox = function (props) {
313
313
  var _a;
@@ -340,7 +340,7 @@ var Checkbox = function (props) {
340
340
  return (jsxRuntime.jsxs(StyledCheckbox, __assign({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: wrapperRef }, { children: [checked && (jsxRuntime.jsx("svg", __assign({ width: 16, height: 12, viewBox: "0 0 16 12", fill: "none" }, { children: jsxRuntime.jsx("path", { d: "M12.61.563l-6.585 6.6L3.439 4.57a1.997 1.997 0 00-3.374.885c-.183.7.026 1.446.546 1.949l4 4.008a1.997 1.997 0 002.828 0l8-8.017a2.007 2.007 0 00-.025-2.809 1.997 1.997 0 00-2.803-.024z" }, void 0) }), void 0)), jsxRuntime.jsx("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef }, void 0)] }), void 0));
341
341
  };
342
342
 
343
- var Wrapper$9 = styled__default["default"].div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
343
+ var Wrapper$9 = styled__default["default"].div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
344
344
  var size = _a.size;
345
345
  switch (size) {
346
346
  case "small":
@@ -363,7 +363,7 @@ var Wrapper$9 = styled__default["default"].div(templateObject_1$G || (templateOb
363
363
  return "27px";
364
364
  }
365
365
  });
366
- var templateObject_1$G;
366
+ var templateObject_1$H;
367
367
 
368
368
  var parsers = {};
369
369
 
@@ -411,7 +411,7 @@ var flags = {
411
411
  };
412
412
  var Flag = function (props) { return (jsxRuntime.jsx(Wrapper$9, __assign({}, props, { children: flags[getCountryCodeByLocale_1(props.locale)] }), void 0)); };
413
413
 
414
- var StyledHeading = styled__default["default"].span(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"])), theme.fonts.heading, function (_a) {
414
+ var StyledHeading = styled__default["default"].span(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"])), theme.fonts.heading, function (_a) {
415
415
  var type = _a.type;
416
416
  return theme.heading[type].fontSize;
417
417
  }, function (_a) {
@@ -435,14 +435,14 @@ var StyledHeading = styled__default["default"].span(templateObject_1$F || (templ
435
435
  var align = _a.align;
436
436
  return align;
437
437
  });
438
- var templateObject_1$F;
438
+ var templateObject_1$G;
439
439
 
440
440
  var Heading = function (props) {
441
441
  var element = !!props.as ? props.as : props.type;
442
442
  return (jsxRuntime.jsx(StyledHeading, __assign({}, props, { as: element }, { children: props.children }), void 0));
443
443
  };
444
444
 
445
- var Wrapper$8 = styled__default["default"].div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
445
+ var Wrapper$8 = styled__default["default"].div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
446
446
  var size = _a.size;
447
447
  return theme.icon[size] || theme.icon.medium;
448
448
  }, function (_a) {
@@ -472,7 +472,7 @@ var Wrapper$8 = styled__default["default"].div(templateObject_1$E || (templateOb
472
472
  return theme.colors.lightGray.light;
473
473
  }
474
474
  });
475
- var templateObject_1$E;
475
+ var templateObject_1$F;
476
476
 
477
477
  var icons = {
478
478
  check: (jsxRuntime.jsx("path", { d: "M16.6107 6.5626L10.0247 13.1623L7.43866 10.5709C6.9365 10.0499 6.19289 9.841 5.49363 10.0244C4.79436 10.2078 4.24826 10.7551 4.06523 11.4558C3.8822 12.1565 4.09071 12.9017 4.61063 13.4049L8.61067 17.4132C9.39168 18.1956 10.6577 18.1956 11.4387 17.4132L19.4388 9.3965C20.1967 8.6101 20.1859 7.36009 19.4144 6.58701C18.6429 5.81393 17.3955 5.80307 16.6107 6.5626Z" }, void 0)),
@@ -497,7 +497,7 @@ var icons = {
497
497
  };
498
498
  var Icon = function (props) { return (jsxRuntime.jsx(Wrapper$8, __assign({}, props, { children: jsxRuntime.jsx("svg", __assign({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] }), void 0) }), void 0)); };
499
499
 
500
- var Wrapper$7 = styled__default["default"].div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
500
+ var Wrapper$7 = styled__default["default"].div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
501
501
  var size = _a.size;
502
502
  switch (size) {
503
503
  default:
@@ -509,7 +509,7 @@ var Wrapper$7 = styled__default["default"].div(templateObject_1$D || (templateOb
509
509
  return "118px";
510
510
  }
511
511
  });
512
- var templateObject_1$D;
512
+ var templateObject_1$E;
513
513
 
514
514
  var illustrations = {
515
515
  keyboard: (jsxRuntime.jsxs("svg", __assign({ viewBox: "0 0 32.9 20.8" }, { children: [jsxRuntime.jsx("path", { d: "M31.5 1H1.4C.6 1 0 1.6 0 2.4v17.1c0 .8.6 1.4 1.4 1.4h30.1c.8 0 1.4-.6 1.4-1.4V2.4c0-.8-.6-1.4-1.4-1.4z", fill: "#829190" }, void 0), jsxRuntime.jsx("path", { d: "M31.5 0H1.4C.6 0 0 .6 0 1.4v17.1c0 .8.6 1.4 1.4 1.4h30.1c.8 0 1.4-.6 1.4-1.4V1.4c0-.8-.6-1.4-1.4-1.4z", fill: "#99adac" }, void 0), jsxRuntime.jsx("path", { d: "M27.1 14.2H5.7c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h21.4c.3 0 .5-.2.5-.5v-3.4c-.1-.3-.3-.5-.5-.5zM8.4 8.6H2.1c-.3 0-.5.2-.5.4v3.4c0 .3.2.5.5.5h6.3c.3 0 .5-.2.5-.5V9c0-.2-.2-.4-.5-.4zM13.8 8.6h-3.3c-.3 0-.5.2-.5.4v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9c-.1-.2-.3-.4-.5-.4zM5.4 3.3H2.1c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c-.1-.3-.3-.5-.5-.5zM10.5 3.3H7.2c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c-.1-.3-.3-.5-.5-.5zM15.5 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM20.6 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM25.7 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM30.8 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM18.9 8.6h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9c-.1-.2-.3-.4-.5-.4zM23.9 8.6h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9.1c0-.3-.2-.5-.5-.5zM30.7 8.6h-4.9c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h4.9c.3 0 .5-.2.5-.5V9.1c0-.3-.2-.5-.5-.5z", fill: "#899a99" }, void 0), jsxRuntime.jsx("path", { d: "M27.1 13.7H5.7c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h21.4c.3 0 .5-.2.5-.5v-3.4c-.1-.3-.3-.5-.5-.5zM8.4 8.1H2.1c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h6.3c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5zM13.8 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c-.1-.3-.3-.5-.5-.5z", fill: "#eeeded" }, void 0), jsxRuntime.jsx("path", { d: "M5.4 2.8H2.1c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.5-.5z", fill: "#e62944" }, void 0), jsxRuntime.jsx("path", { d: "M10.5 2.8H7.2c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.5-.5zM15.5 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM20.6 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM25.7 2.8h-3.3c-.2 0-.4.2-.4.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.6-.5zM30.8 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM18.9 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c-.1-.3-.3-.5-.5-.5zM23.9 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5zM30.7 8.1h-4.9c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h4.9c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5z", fill: "#eeeded" }, void 0)] }), void 0)),
@@ -524,7 +524,7 @@ var illustrations = {
524
524
  };
525
525
  var Illustration = function (props) { return (jsxRuntime.jsx(Wrapper$7, __assign({}, props, { children: illustrations[props.type] }), void 0)); };
526
526
 
527
- var InputIconWrapper = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
527
+ var InputIconWrapper = styled__default["default"].div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
528
528
  var isChanged = _a.isChanged;
529
529
  return !isChanged ? theme.colors.lightGray.darker : "";
530
530
  }, function (_a) {
@@ -544,7 +544,7 @@ var StyledInput = styled__default["default"].input(templateObject_2$p || (templa
544
544
  var disabled = _a.disabled;
545
545
  return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
546
546
  }, theme.fonts.paragraph, theme.paragraph.medium.fontSize, theme.paragraph.medium.lineHeight, theme.colors.lightGray.darker, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
547
- var templateObject_1$C, templateObject_2$p;
547
+ var templateObject_1$D, templateObject_2$p;
548
548
 
549
549
  var PasswordInput = function (props) {
550
550
  var _a = React.useState(false), isVisible = _a[0], setIsVisible = _a[1];
@@ -731,7 +731,7 @@ Input.Date = DateInput;
731
731
 
732
732
  var Logo = function (props) { return (jsxRuntime.jsxs("svg", __assign({ width: 396, height: 66, viewBox: "0 0 196 33", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { d: "M17.238 6.583a4.46 4.46 0 00-.372-.433L15.5 4.809l-3.745-3.684c-.36-.357-.79-.64-1.262-.833a3.94 3.94 0 00-4.242.833L1.14 6.15A3.802 3.802 0 00.001 8.857c0 1.016.41 1.99 1.138 2.708l5.11 5.028c.731.718 1.72 1.121 2.753 1.121a3.927 3.927 0 002.752-1.12l3.745-3.685-1.363-1.344a3.465 3.465 0 01-.372-.43l-3.778 3.718a1.39 1.39 0 01-.984.402 1.407 1.407 0 01-.983-.402L2.909 9.825a1.357 1.357 0 01-.406-.966c0-.362.146-.71.406-.966l5.11-5.028a1.39 1.39 0 01.984-.402 1.407 1.407 0 01.984.402l3.778 3.718 1.332 1.31a1.35 1.35 0 01.403.957v.018c.001.36.147.704.406.957l1.332 1.31A3.79 3.79 0 0018 8.86a3.79 3.79 0 00-.762-2.276z", fill: "#F21C40" }, void 0), jsxRuntime.jsx("path", { d: "M42.86 6.15L37.76 1.125c-.361-.357-.79-.64-1.263-.833a3.94 3.94 0 00-2.98 0 3.889 3.889 0 00-1.262.833l-3.748 3.684-1.363 1.34c-.135.136-.26.28-.374.434a3.798 3.798 0 00-.76 2.276c0 .82.266 1.617.76 2.276l1.332-1.31c.258-.255.404-.6.405-.96a1.332 1.332 0 01.406-.96l1.329-1.31 3.782-3.718a1.385 1.385 0 01.982-.402 1.404 1.404 0 01.982.402l5.11 5.028a1.362 1.362 0 01.41.966 1.343 1.343 0 01-.41.966l-5.11 5.028a1.387 1.387 0 01-.982.402 1.406 1.406 0 01-.982-.402l-3.782-3.717a3.467 3.467 0 01-.372.43l-1.363 1.343 3.748 3.684c.361.356.79.638 1.262.83a3.943 3.943 0 004.24-.83l5.11-5.028c.363-.356.65-.78.846-1.245a3.78 3.78 0 00-.004-2.938 3.828 3.828 0 00-.848-1.244z", fill: "#3DC478" }, void 0), jsxRuntime.jsx("path", { d: "M17.309 6.512l-.071.07a4.456 4.456 0 00-.375-.432l-1.366-1.341 3.748-3.684c.36-.357.79-.64 1.262-.833a3.94 3.94 0 012.98 0c.472.193.901.476 1.262.833l3.76 3.675-1.363 1.34c-.134.136-.26.28-.374.433l-3.78-3.717a1.39 1.39 0 00-.983-.402 1.407 1.407 0 00-.983.402l-3.717 3.656zm11.597 1.38l1.329-1.31a3.79 3.79 0 01.764 2.28c0 .82-.268 1.62-.764 2.28a3.467 3.467 0 01-.372.43L28.5 12.914l-3.748 3.684A3.926 3.926 0 0122 17.72a3.926 3.926 0 01-2.752-1.12L15.5 12.896l-1.363-1.344a3.474 3.474 0 01-.372-.43 3.79 3.79 0 01-.762-2.276c0-.82.267-1.618.762-2.277l1.332 1.31a1.348 1.348 0 01.403.958v.018c.001.36.147.703.406.957l1.332 1.31 3.779 3.718a1.389 1.389 0 00.983.402 1.407 1.407 0 00.983-.402l3.78-3.718 1.331-1.31c.259-.255.405-.6.406-.96a1.33 1.33 0 01.406-.96z", fill: "#FFD801" }, void 0), jsxRuntime.jsx("path", { d: "M36.365 21.435l-5.111-5.028a3.926 3.926 0 00-2.753-1.12 3.926 3.926 0 00-2.752 1.12l-3.748 3.687-1.363 1.341c-.134.135-.259.28-.371.433a3.786 3.786 0 00-.762 2.275c0 .819.267 1.616.762 2.275l1.329-1.308c.258-.254.404-.6.405-.96.002-.36.148-.705.406-.96l1.329-1.307 3.782-3.72a1.406 1.406 0 011.967 0l5.11 5.027c.261.258.407.605.407.968s-.146.71-.406.968l-5.111 5.028a1.406 1.406 0 01-1.967 0l-3.782-3.721a3.486 3.486 0 01-.372.433l-1.363 1.34 3.748 3.688c.73.718 1.72 1.12 2.753 1.12a3.926 3.926 0 002.752-1.12l5.11-5.028c.364-.357.652-.78.849-1.246a3.78 3.78 0 00-.848-4.185z", fill: "#A059C1" }, void 0), jsxRuntime.jsx("path", { d: "M23.736 21.868l-1.329 1.307c-.258.255-.404.6-.405.96-.002.36-.148.705-.406.96l-1.33 1.307-3.781 3.721c-.261.256-.615.4-.984.4-.368 0-.722-.144-.983-.4l-5.111-5.028a1.363 1.363 0 01-.405-.967c0-.363.146-.71.405-.968l5.11-5.028c.262-.256.616-.4.984-.4.369 0 .723.144.984.4l3.782 3.72c.112-.153.237-.297.372-.432l1.363-1.34-3.758-3.673a3.926 3.926 0 00-2.752-1.12 3.926 3.926 0 00-2.752 1.12l-5.11 5.028a3.802 3.802 0 00-1.139 2.708c0 1.015.41 1.989 1.138 2.707l5.11 5.029c.731.717 1.72 1.12 2.753 1.12a3.926 3.926 0 002.752-1.12l3.748-3.688 1.363-1.34c.136-.135.26-.28.372-.433a3.786 3.786 0 00.766-2.274 3.786 3.786 0 00-.757-2.276z", fill: "#1AAFF6" }, void 0)] }, void 0), jsxRuntime.jsx("path", { d: "M137.46 22.78c0 .48-.166.886-.499 1.218-.314.313-.712.47-1.193.47-.462 0-.85-.157-1.165-.47a1.705 1.705 0 01-.471-1.217V5.687c0-.48.157-.876.471-1.19.333-.331.74-.497 1.221-.497.481 0 .869.166 1.165.498.314.313.471.71.471 1.19V22.78zm-6.356-4.12c.462-1.199.693-2.49.693-3.873s-.231-2.674-.693-3.872a9.58 9.58 0 00-1.969-3.153 8.772 8.772 0 00-2.996-2.158c-1.146-.516-2.403-.774-3.772-.774-1.368 0-2.625.258-3.772.774a9.138 9.138 0 00-2.995 2.158 9.835 9.835 0 00-1.942 3.153c-.462 1.199-.693 2.49-.693 3.872 0 1.383.231 2.674.693 3.873a10.17 10.17 0 001.942 3.18 9.332 9.332 0 002.995 2.13c1.147.517 2.404.775 3.772.775 1.369 0 2.626-.259 3.772-.775a8.95 8.95 0 002.996-2.13 9.9 9.9 0 001.969-3.18zm-3.661-7.22c.499.996.749 2.112.749 3.347 0 1.236-.25 2.36-.749 3.375-.499.995-1.184 1.788-2.053 2.378-.869.59-1.876.886-3.023.886-1.146 0-2.154-.295-3.023-.886-.869-.59-1.553-1.383-2.052-2.378-.481-1.014-.721-2.14-.721-3.375 0-1.254.24-2.379.721-3.374.499-.996 1.183-1.789 2.052-2.379.869-.59 1.877-.885 3.023-.885 1.147 0 2.154.295 3.023.885.869.59 1.554 1.392 2.053 2.406zM58.545 23.998c.333.313.759.47 1.276.47.537 0 .971-.157 1.304-.47a1.61 1.61 0 00.527-1.217V8.287h4.354c.481 0 .879-.138 1.193-.415.333-.295.5-.682.5-1.161 0-.48-.167-.867-.5-1.162-.314-.295-.712-.443-1.193-.443H53.692c-.48 0-.888.148-1.22.443-.315.277-.472.655-.472 1.134 0 .48.157.867.471 1.162.333.295.74.442 1.22.442h4.355v14.494c0 .48.167.885.5 1.217zm34.186-13.609c-1.017-.663-2.173-.995-3.467-.995-.647 0-1.267.11-1.858.332a5.83 5.83 0 00-1.526.857 5.266 5.266 0 00-.97.915v-.14c0-.48-.158-.876-.472-1.19-.314-.332-.712-.498-1.193-.498-.48 0-.878.166-1.192.498-.315.314-.472.71-.472 1.19v16.955c0 .498.157.903.472 1.217.314.313.712.47 1.192.47.481 0 .879-.166 1.193-.498.314-.313.471-.71.471-1.19V22.9c.195.191.417.382.666.573.5.37 1.072.673 1.72.913.647.24 1.34.36 2.08.36 1.257 0 2.385-.323 3.383-.968 1.017-.664 1.822-1.568 2.413-2.711.61-1.162.916-2.499.916-4.01 0-1.513-.305-2.84-.916-3.984-.591-1.143-1.405-2.037-2.44-2.683zm-6.019 2.656c.61-.406 1.322-.609 2.136-.609.813 0 1.516.203 2.108.609.61.405 1.081.959 1.414 1.66.352.681.527 1.465.527 2.35 0 .867-.175 1.66-.527 2.379a4.014 4.014 0 01-1.414 1.66c-.592.405-1.295.608-2.108.608-.814 0-1.526-.203-2.136-.608a4.215 4.215 0 01-1.442-1.66c-.333-.72-.5-1.512-.5-2.379 0-.885.167-1.668.5-2.35.351-.701.832-1.255 1.442-1.66zm18.425 11.7c-1.571 0-2.94-.323-4.105-.968a7.012 7.012 0 01-2.662-2.683c-.61-1.125-.916-2.398-.916-3.817 0-1.66.333-3.07.999-4.232.684-1.18 1.572-2.084 2.663-2.711a6.85 6.85 0 013.467-.94c.943 0 1.83.193 2.662.58.851.388 1.6.922 2.247 1.605a7.36 7.36 0 011.525 2.323 6.95 6.95 0 01.583 2.821 1.423 1.423 0 01-.527 1.08 1.77 1.77 0 01-1.165.414h-9.159a4.4 4.4 0 00.505 1.383c.426.682.962 1.208 1.609 1.577.666.35 1.368.525 2.108.525.684 0 1.229-.055 1.636-.166.407-.11.731-.24.971-.387.259-.166.49-.304.693-.415.333-.166.647-.249.943-.249.407 0 .74.138.999.415.277.277.416.6.416.968 0 .498-.259.95-.777 1.355-.481.406-1.155.766-2.024 1.08a8.312 8.312 0 01-2.691.442zm-4.188-9.93a4.807 4.807 0 00-.168.636h7.268v-.194a2.476 2.476 0 00-.582-1.438 3.417 3.417 0 00-1.276-.996 3.448 3.448 0 00-1.608-.387c-.555 0-1.073.074-1.554.221-.48.148-.896.397-1.248.747-.351.35-.628.82-.832 1.41zm65.892-4.343c-.702-.719-1.793-1.078-3.272-1.078-.611 0-1.175.101-1.692.304-.518.184-.99.433-1.415.747a5.722 5.722 0 00-1.081 1.023 7.27 7.27 0 00-.278.348v-.459c0-.479-.157-.875-.471-1.189-.315-.332-.712-.498-1.193-.498-.481 0-.878.166-1.193.498-.314.314-.471.71-.471 1.19V22.78c0 .48.157.885.471 1.217.315.313.712.47 1.193.47.481 0 .878-.157 1.193-.47.314-.332.471-.738.471-1.217V15.7c0-.608.12-1.152.361-1.632a2.936 2.936 0 011.137-1.19c.499-.294 1.1-.442 1.803-.442.721 0 1.276.148 1.664.443.388.295.656.691.804 1.19.148.478.222 1.022.222 1.631v7.08c0 .48.157.886.472 1.218.314.313.711.47 1.192.47s.878-.157 1.193-.47c.314-.332.471-.738.471-1.217V15.7c0-.608.12-1.152.361-1.632a2.936 2.936 0 011.137-1.19c.499-.294 1.1-.442 1.803-.442.721 0 1.276.148 1.664.443.388.295.656.691.804 1.19.148.478.222 1.022.222 1.631v7.08c0 .48.157.886.472 1.218.314.313.711.47 1.192.47s.878-.157 1.193-.47c.314-.332.471-.738.471-1.217V15.7c0-1.162-.129-2.213-.388-3.153-.259-.96-.74-1.724-1.442-2.296-.684-.572-1.692-.857-3.023-.857-.814 0-1.554.175-2.219.525a5.952 5.952 0 00-1.664 1.245c-.431.447-.758.87-.98 1.269a4.88 4.88 0 00-1.184-1.96zm21.336-1.078c1.294 0 2.45.332 3.467.995 1.035.646 1.849 1.54 2.441 2.683.61 1.144.915 2.471.915 3.983s-.305 2.85-.915 4.011c-.592 1.143-1.396 2.047-2.413 2.71-.999.646-2.127.969-3.384.969-.74 0-1.433-.12-2.08-.36a6.938 6.938 0 01-1.72-.913 7.139 7.139 0 01-.665-.573v5.414c0 .48-.158.876-.472 1.19-.314.331-.712.497-1.192.497-.481 0-.879-.157-1.193-.47-.314-.314-.472-.72-.472-1.217V11.357c0-.479.158-.875.472-1.189.314-.332.712-.498 1.193-.498.48 0 .878.166 1.192.498.314.314.472.71.472 1.19v.14c.249-.312.572-.617.97-.915.444-.35.953-.636 1.526-.857a5.262 5.262 0 011.858-.332zm-.416 3.042c-.813 0-1.525.203-2.136.609-.61.405-1.09.959-1.442 1.66-.333.681-.499 1.465-.499 2.35 0 .867.166 1.66.499 2.379.352.7.832 1.254 1.442 1.66.611.405 1.323.608 2.136.608.814 0 1.516-.203 2.108-.608a4.007 4.007 0 001.414-1.66c.352-.72.527-1.512.527-2.379 0-.885-.175-1.668-.527-2.35a4.007 4.007 0 00-1.414-1.66c-.592-.406-1.294-.609-2.108-.609zM151.357 9.67c.48 0 .878.166 1.192.498.315.314.472.71.472 1.19v7.025c0 1.955-.546 3.504-1.637 4.647-.793.831-1.841 1.36-3.142 1.587v3.798a1.557 1.557 0 01-3.113 0v-3.793c-1.317-.223-2.375-.754-3.175-1.592-1.072-1.143-1.608-2.692-1.608-4.647v-7.026c0-.479.157-.875.471-1.189.315-.332.712-.498 1.193-.498.481 0 .878.166 1.192.498.315.314.472.71.472 1.19v7.025c0 1.125.25 1.964.749 2.517.499.535 1.248.802 2.246.802 1.017 0 1.775-.267 2.275-.802.499-.553.749-1.392.749-2.517v-7.026c0-.479.157-.875.471-1.189.314-.332.712-.498 1.193-.498zM70.979 24.63c-1.337-.22-2.41-.753-3.218-1.6-1.073-1.143-1.61-2.692-1.61-4.647v-7.026c0-.479.158-.875.472-1.189.315-.332.712-.498 1.193-.498.48 0 .878.166 1.193.498.314.314.471.71.471 1.19v7.025c0 1.125.25 1.964.749 2.517.5.535 1.248.802 2.247.802 1.017 0 1.775-.267 2.274-.802.5-.553.749-1.392.749-2.517v-7.026c0-.479.157-.875.471-1.189.315-.332.712-.498 1.193-.498.48 0 .878.166 1.193.498.314.314.471.71.471 1.19v7.025c0 1.955-.546 3.504-1.636 4.647-.785.822-1.818 1.348-3.099 1.58v3.805a1.557 1.557 0 11-3.113 0V24.63z", fill: "#000" }, void 0), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", { children: jsxRuntime.jsx("path", { fill: "#fff", d: "M0 0H44V33H0z" }, void 0) }, void 0) }, void 0)] }), void 0)); };
733
733
 
734
- var Wrapper$6 = styled__default["default"].div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
734
+ var Wrapper$6 = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
735
735
  var size = _a.size;
736
736
  switch (size) {
737
737
  default:
@@ -741,7 +741,7 @@ var Wrapper$6 = styled__default["default"].div(templateObject_1$B || (templateOb
741
741
  return "116px";
742
742
  }
743
743
  });
744
- var templateObject_1$B;
744
+ var templateObject_1$C;
745
745
 
746
746
  var medals = {
747
747
  small: {
@@ -757,7 +757,7 @@ var medals = {
757
757
  };
758
758
  var Medal = function (props) { return (jsxRuntime.jsx(Wrapper$6, __assign({}, props, { children: medals[props.size || "small"][props.type] }), void 0)); };
759
759
 
760
- var Wrapper$5 = styled__default["default"].div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"])), function (_a) {
760
+ var Wrapper$5 = styled__default["default"].div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"])), function (_a) {
761
761
  var disabled = _a.disabled;
762
762
  return (disabled ? "49.5px" : "");
763
763
  });
@@ -774,7 +774,7 @@ var StyledInputNumber = styled__default["default"].input(templateObject_2$o || (
774
774
  var disabled = _a.disabled;
775
775
  return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
776
776
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
777
- var templateObject_1$A, templateObject_2$o;
777
+ var templateObject_1$B, templateObject_2$o;
778
778
 
779
779
  var Number = function (props) {
780
780
  var inputRef = React.useRef(null);
@@ -811,7 +811,7 @@ var Number = function (props) {
811
811
  return (jsxRuntime.jsxs(Wrapper$5, __assign({ disabled: props.disabled }, { children: [jsxRuntime.jsx(Button, { label: "-", disabled: props.disabled, onClick: decrease, tabIndex: -1, type: "button" }, void 0), jsxRuntime.jsx(StyledInputNumber, __assign({ type: "number" }, props, { defaultValue: props.defaultValue || props.min || 0, onChange: onChange, onBlur: props.onBlur, ref: inputRef }), void 0), jsxRuntime.jsx(Button, { label: "+", disabled: props.disabled, onClick: increase, tabIndex: -1, type: "button" }, void 0)] }), void 0));
812
812
  };
813
813
 
814
- var StyledParagraph = styled__default["default"].p(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n"])), theme.fonts.paragraph, function (_a) {
814
+ var StyledParagraph = styled__default["default"].p(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n"])), theme.fonts.paragraph, function (_a) {
815
815
  var size = _a.size;
816
816
  return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
817
817
  }, function (_a) {
@@ -843,11 +843,11 @@ var StyledParagraph = styled__default["default"].p(templateObject_1$z || (templa
843
843
  var align = _a.align;
844
844
  return align;
845
845
  });
846
- var templateObject_1$z;
846
+ var templateObject_1$A;
847
847
 
848
848
  var Paragraph = function (props) { return (jsxRuntime.jsx(StyledParagraph, __assign({}, props, { children: props.children }), void 0)); };
849
849
 
850
- var StyledRadio = styled__default["default"].div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
850
+ var StyledRadio = styled__default["default"].div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
851
851
  var checked = _a.checked, disabled = _a.disabled;
852
852
  if (disabled)
853
853
  return theme.colors.lightGray.darker;
@@ -875,7 +875,7 @@ var StyledRadio = styled__default["default"].div(templateObject_1$y || (template
875
875
  return theme.colors.green.base;
876
876
  return "";
877
877
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
878
- var templateObject_1$y;
878
+ var templateObject_1$z;
879
879
 
880
880
  var Radio = function (props) {
881
881
  var _a, _b;
@@ -907,7 +907,7 @@ var Radio = function (props) {
907
907
  return (jsxRuntime.jsx(StyledRadio, __assign({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: wrapperRef }, { children: jsxRuntime.jsx("input", { type: "radio", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef }, void 0) }), void 0));
908
908
  };
909
909
 
910
- var Wrapper$4 = styled__default["default"].div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
910
+ var Wrapper$4 = styled__default["default"].div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
911
911
  var disabled = _a.disabled;
912
912
  return (disabled ? "not-allowed" : "pointer");
913
913
  });
@@ -924,7 +924,7 @@ var StyledSelect = styled__default["default"].select(templateObject_2$n || (temp
924
924
  var isChanged = _a.isChanged;
925
925
  return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
926
926
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
927
- var templateObject_1$x, templateObject_2$n;
927
+ var templateObject_1$y, templateObject_2$n;
928
928
 
929
929
  var Select = function (props) {
930
930
  var _a;
@@ -946,18 +946,18 @@ var Select = function (props) {
946
946
  return (jsxRuntime.jsxs(Wrapper$4, { children: [jsxRuntime.jsx(Icon, { type: "chevronDown", color: "gray", size: "small" }, void 0), jsxRuntime.jsxs(StyledSelect, __assign({}, props, { onChange: onChange, isChanged: isChanged || props.defaultValue, ref: inputRef }, { children: [props.placeholder && jsxRuntime.jsx("option", __assign({ hidden: true }, { children: props.placeholder }), void 0), props.children] }), void 0)] }, void 0));
947
947
  };
948
948
 
949
- var StyledSpacer = styled__default["default"].div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
949
+ var StyledSpacer = styled__default["default"].div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
950
950
  var horizontal = _a.horizontal;
951
951
  return (horizontal ? "".concat(horizontal, "px") : "");
952
952
  }, function (_a) {
953
953
  var vertical = _a.vertical;
954
954
  return (vertical ? "".concat(vertical, "px") : "");
955
955
  });
956
- var templateObject_1$w;
956
+ var templateObject_1$x;
957
957
 
958
958
  var Spacer = function (props) { return (jsxRuntime.jsx(StyledSpacer, __assign({}, props), void 0)); };
959
959
 
960
- var StyledSubheading = styled__default["default"].p(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"], ["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"])), theme.fonts.paragraph, function (_a) {
960
+ var StyledSubheading = styled__default["default"].p(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"], ["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"])), theme.fonts.paragraph, function (_a) {
961
961
  var size = _a.size;
962
962
  return size ? theme.subheading[size].fontSize : theme.subheading.medium.fontSize;
963
963
  }, function (_a) {
@@ -985,10 +985,17 @@ var StyledSubheading = styled__default["default"].p(templateObject_1$v || (templ
985
985
  return theme.colors.darkGray.dark;
986
986
  }
987
987
  });
988
- var templateObject_1$v;
988
+ var templateObject_1$w;
989
989
 
990
990
  var Subheading = function (props) { return (jsxRuntime.jsx(StyledSubheading, __assign({}, props, { children: props.children }), void 0)); };
991
991
 
992
+ var Container$g = styled__default["default"].div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n"], ["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n"])), theme.colors.lightGray.base, theme.colors.lightGray.darker, theme.colors.lightGray.darker);
993
+ var templateObject_1$v;
994
+
995
+ var Tag = function (props) {
996
+ return jsxRuntime.jsx(Container$g, { children: props.children }, void 0);
997
+ };
998
+
992
999
  var Container$f = styled__default["default"].div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n width: 46px;\n height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 46px;\n height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
993
1000
  var disabled = _a.disabled;
994
1001
  return (disabled ? "not-allowed" : "pointer");
@@ -2028,7 +2035,7 @@ var Keyboard = function (props) {
2028
2035
  keys[68].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[58].character], color: keys[13].color, active: keys[13].character === props.activeKey ||
2029
2036
  keys[58].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[60].character], color: keys[15].color, active: keys[15].character === props.activeKey ||
2030
2037
  keys[60].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[62].character], color: keys[17].color, active: keys[17].character === props.activeKey ||
2031
- keys[62].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[64].character], color: keys[19].color, active: keys[9].character === props.activeKey ||
2038
+ keys[62].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[64].character], color: keys[19].color, active: keys[19].character === props.activeKey ||
2032
2039
  keys[64].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[22].character, keys[67].character], color: keys[22].color, active: keys[22].character === props.activeKey ||
2033
2040
  keys[67].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, { characters: [keys[21].character, keys[66].character], color: keys[21].color, active: keys[21].character === props.activeKey ||
2034
2041
  keys[66].character === props.activeKey }, void 0), jsxRuntime.jsx(Key, {}, void 0)] }, void 0), jsxRuntime.jsxs(StartRow, { children: [jsxRuntime.jsx(Key, {}, void 0), jsxRuntime.jsx(Key, { characters: [keys[54].character], color: keys[9].color, active: keys[9].character === props.activeKey ||
@@ -2115,6 +2122,7 @@ exports.SelectField = SelectField;
2115
2122
  exports.Spacer = Spacer;
2116
2123
  exports.Steps = Steps;
2117
2124
  exports.Subheading = Subheading;
2125
+ exports.Tag = Tag;
2118
2126
  exports.Toggle = Toggle;
2119
2127
  exports.ToggleField = ToggleField;
2120
2128
  exports.Tooltip = Tooltip;