scorer-ui-kit 2.1.1 → 2.2.0

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.
package/dist/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
2
2
 
3
- var React = require('react');
4
- var React__default = _interopDefault(React);
5
3
  var styled = require('styled-components');
6
4
  var styled__default = _interopDefault(styled);
5
+ var React = require('react');
6
+ var React__default = _interopDefault(React);
7
7
  var icons = require('@future-standard/icons');
8
8
  var ReactDom = _interopDefault(require('react-dom'));
9
9
  var reactRouterDom = require('react-router-dom');
@@ -104,7 +104,7 @@ var deviceSize = {
104
104
  medium: 768,
105
105
  large: 1024,
106
106
  xlarge: 1280,
107
- xxlarge: 1400
107
+ xxlarge: 1536
108
108
  };
109
109
  var deviceMediaQuery = {
110
110
  small: "(min-width: " + deviceSize.small + "px)",
@@ -1642,7 +1642,7 @@ var custom = {
1642
1642
  }
1643
1643
  };
1644
1644
 
1645
- var light = {
1645
+ var index = {
1646
1646
  fontFamily: fontFamily,
1647
1647
  dimensions: dimensions,
1648
1648
  typography: typography,
@@ -1695,8 +1695,14 @@ function _taggedTemplateLiteralLoose(strings, raw) {
1695
1695
  return strings;
1696
1696
  }
1697
1697
 
1698
- var _templateObject, _templateObject2, _templateObject3;
1699
- var wrapperCss = styled.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n svg {\n overflow: visible;\n vector-effect: non-scaling-stroke;\n\n line, path, circle, ellipse, foreignObject, polygon, polyline, rect, text, textPath, tspan {\n vector-effect: non-scaling-stroke;\n }\n }\n"])));
1698
+ var _templateObject;
1699
+ var layoutVariables = styled.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n /** Layouts */\n :root {\n --max-content-width: 1840px;\n }\n\n .content-layout {\n \n &-default {\n --content-layout-padding-top: 32px;\n --content-layout-padding-right: 48px;\n --content-layout-padding-bottom: 64px;\n --content-layout-padding-left: 64px;\n --utility-header-padding-top: 48px;\n\n @media ", "{\n --content-layout-padding-top: 32px;\n --content-layout-padding-right: 96px;\n --content-layout-padding-bottom: 64px;\n --content-layout-padding-left: 96px;\n --utility-header-padding-top: 48px;\n }\n\n @media ", "{\n --content-layout-padding-top: 30px;\n --content-layout-padding-right: 120px;\n --content-layout-padding-bottom: 64px;\n --content-layout-padding-left: 120px;\n --utility-header-padding-top: 48px;\n }\n }\n\n &-fullscreen {\n --content-layout-padding-top: 0px;\n --content-layout-padding-right: 0px;\n --content-layout-padding-bottom: 0px;\n --content-layout-padding-left: 0px;\n --utility-header-padding-top: 0px;\n }\n\n &-dashboard {\n --content-layout-padding-top: 32px;\n --content-layout-padding-right: 32px;\n --content-layout-padding-bottom: 32px;\n --content-layout-padding-left: 32px;\n --utility-header-padding-top: 32px;\n }\n }\n"])), deviceMediaQuery.xlarge, deviceMediaQuery.xxlarge);
1700
+
1701
+ var _templateObject$1;
1702
+ var GlobalStyle = styled.createGlobalStyle(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n\n ", ";\n\n :root {\n --font-ui: Monorale, Hiragino Sans, \"\u30D2\u30E9\u30AE\u30CE\u89D2\u30B4\u30B7\u30C3\u30AF\", Hiragino Kaku Gothic ProN, \"\u30D2\u30E9\u30AE\u30CE\u89D2\u30B4 ProN W3\", Roboto, YuGothic, \"\u6E38\u30B4\u30B7\u30C3\u30AF\", Meiryo, \"\u30E1\u30A4\u30EA\u30AA\", sans-serif;\n --font-data: Lato, Hiragino Sans, \"\u30D2\u30E9\u30AE\u30CE\u89D2\u30B4\u30B7\u30C3\u30AF\", Hiragino Kaku Gothic ProN, \"\u30D2\u30E9\u30AE\u30CE\u89D2\u30B4 ProN W3\", Roboto, YuGothic, \"\u6E38\u30B4\u30B7\u30C3\u30AF\", Meiryo, \"\u30E1\u30A4\u30EA\u30AA\", sans-serif;\n\n --font-size: 14px;\n\n --button-font-size: 14px;\n --button-height: 32px;\n --button-h-padding: 8px;\n --button-lift-default-x: 0px;\n --button-lift-default-y: 2px;\n --button-lift-default-blur: 4px;\n --button-lift-default-spread: 2px;\n\n --button-icon-size: 14px;\n --button-icon-h-padding: 8px;\n\n --input-height: 40px;\n }\n\n .button-small {\n --button-font-size: 12px;\n --button-height: 24px;\n --button-h-padding: 4px;\n --button-icon-size: 12px;\n --button-icon-h-padding: 8px;\n }\n\n .button-large {\n --button-font-size: 16px;\n --button-height: 40px;\n --button-h-padding: 8px;\n --button-icon-size: 16px;\n --button-icon-h-padding: 8px;\n }\n\n .split-button-primary {\n --border-color: var(--primary-9);\n --border-active-color: var(--primary-11);\n --toggle-icon-border: var(--primary-9);\n --gradient-1: #72C3EE;\n --gradient-2: #5CACEE;\n --button-lift-default-color: rgba(221, 234, 248, 0.08);\n --text-color: var(--white-a12);\n --text-disabled-color: var(--white-a11);\n --button-hover-bg: var(--primary-a3);\n --button-active-bg: var(--primary-10);\n --toggle-icon-hover-bg: var(--white-a7);\n --toggle-icon-active-bg: var(--black-a6);\n --toggle-icon: var(--white-a12);\n --toggle-icon-active: var(--white-a11);\n --toggle-icon-disabled: var(--white-a10);\n }\n\n .split-button-secondary {\n --border-color: var(--grey-7);\n --border-active-color: var(--grey-7);\n --toggle-icon-border: var(--grey-6);\n --gradient-1: #2E3135;\n --gradient-2: #363A3F;\n --button-lift-default-color: rgba(221, 234, 248, 0.08);\n --text-color: var(--grey-12);\n --text-disabled-color: var(--grey-a11);\n --button-hover-bg: var(--grey-a6);\n --button-active-bg: var(--grey-a3);\n --toggle-icon-hover-bg: var(--grey-a6);\n --toggle-icon-active-bg: var(--grey-a3);\n --toggle-icon: var(--grey-12);\n --toggle-icon-active: var(--grey-a11);\n --toggle-icon-disabled: var(--grey-10);\n }\n\n .split-button-danger {\n --border-color: var(--warning-10);\n --border-active-color: var(--warning-10);\n --toggle-icon-border: var(--warning-9);\n --gradient-1: #D16565;\n --gradient-2: #E76F6F;\n --button-lift-default-color: rgba(255, 113, 113, 0.47);\n --text-color: var(--white-a12);\n --text-disabled-color: var(--white-a11);\n --button-hover-bg: var(--warning-a7);\n --button-active-bg: var(--warning-8);\n --toggle-icon-hover-bg: var(--warning-a7);\n --toggle-icon-active-bg: var(--warning-a5);\n --toggle-icon: var(--white-a12);\n --toggle-icon-active: var(--white-a11);\n --toggle-icon-disabled: var(--white-a10);\n }\n\n .split-button-custom {\n --border-color: var(--info-10);\n --border-active-color: var(--info-10);\n --toggle-icon-border: var(--info-9);\n --gradient-1: var(--info-10);\n --gradient-2: var(--info-9);\n --button-lift-default-color: var(--info-a3);\n --text-color: var(--white-a12);\n --text-disabled-color: var(--white-a11);\n --button-hover-bg: var(--info-a7);\n --button-active-bg: var(--info-8);\n --toggle-icon-hover-bg: var(--info-a7);\n --toggle-icon-active-bg: var(--info-a5);\n --toggle-icon: var(--white-a12);\n --toggle-icon-active: var(--white-a11);\n --toggle-icon-disabled: var(--white-a10);\n }\n\n .light-theme {\n /* Light Mode */\n --grey-1: #fcfcfd;\n --primary-1: #fcfdff;\n --primary-2: #f5f9ff;\n --primary-3: #eaf3ff;\n --primary-4: #dbecff;\n --primary-5: #c9e2ff;\n --primary-6: #b5d5ff;\n --primary-7: #9bc3fa;\n --primary-8: #76aaf4;\n --primary-9: #80b5ff;\n --primary-10: #75aaf3;\n --primary-11: #3c6eb3;\n --primary-12: #0b3162;\n --primary-a12: #00285bf4;\n --primary-a11: #00429cc3;\n --primary-a10: #0062e98a;\n --primary-a9: #006bff7f;\n --primary-a8: #0061eb89;\n --primary-a7: #0066f364;\n --primary-a6: #016fff4a;\n --primary-a5: #0077ff36;\n --primary-a4: #0079ff24;\n --primary-a3: #006eff15;\n --primary-a2: #0066ff0a;\n --primary-a1: #0055ff03;\n --info-1: #fafefd;\n --info-2: #f1fcfa;\n --info-3: #e7f9f5;\n --info-4: #d9f3ee;\n --info-5: #c7ebe5;\n --info-6: #afdfd7;\n --info-7: #8dcec3;\n --info-8: #53b9ab;\n --info-9: #12a594;\n --info-10: #0e9888;\n --info-11: #067a6f;\n --info-12: #10302b;\n --info-a12: #00221def;\n --info-a11: #00776bf9;\n --info-a10: #009281f1;\n --info-a9: #009e8ced;\n --info-a8: #009783ac;\n --info-a7: #01927a72;\n --info-a6: #00998050;\n --info-a5: #00a48938;\n --info-a4: #02af8c26;\n --info-a3: #02c09718;\n --info-a2: #01c8a40e;\n --info-a1: #05cd9b05;\n --success-1: #0d1912;\n --success-2: #0c1f17;\n --success-3: #0f291e;\n --success-4: #113123;\n --success-5: #133929;\n --success-6: #164430;\n --success-7: #1b543a;\n --success-8: #236e4a;\n --success-9: #30a46c;\n --success-10: #3cb179;\n --success-11: #4cc38a;\n --success-12: #e5fbeb;\n --success-a12: #eafff0fa;\n --success-a11: #62ffb3bd;\n --success-a10: #54ffafa9;\n --success-a9: #47ffa69a;\n --success-a8: #49ffaa5e;\n --success-a7: #43ffad42;\n --success-a6: #3dffb130;\n --success-a5: #38feb524;\n --success-a4: #33feb31b;\n --success-a3: #2afebe12;\n --success-a2: #00f7ca07;\n --success-a1: #0000;\n --caution-1: #1f1206;\n --caution-2: #2b1400;\n --caution-3: #391a03;\n --caution-4: #441f04;\n --caution-5: #4f2305;\n --caution-6: #5f2a06;\n --caution-7: #763205;\n --caution-8: #943e00;\n --caution-9: #f76808;\n --caution-10: #ff802b;\n --caution-11: #ff8b3e;\n --caution-12: #feeadd;\n --caution-a12: #ffeee1fa;\n --caution-a11: #ff8c3ffa;\n --caution-a10: #ff842cfa;\n --caution-a9: #ff6b08f6;\n --caution-a8: #fe660085;\n --caution-a7: #ff640363;\n --caution-a6: #ff650649;\n --caution-a5: #fe620137;\n --caution-a4: #fe61002a;\n --caution-a3: #fd54001e;\n --caution-a2: #fd37000e;\n --caution-a1: #0000;\n --warning-1: #150f0f;\n --warning-2: #1e1413;\n --warning-3: #361717;\n --warning-4: #49191a;\n --warning-5: #582122;\n --warning-6: #692e2e;\n --warning-7: #813e3e;\n --warning-8: #a75252;\n --warning-9: #d16565;\n --warning-10: #c35959;\n --warning-11: #ff9795;\n --warning-12: #f9d5d3;\n --warning-a12: #ffdad8f9;\n --warning-a11: #ff9795ef;\n --warning-a10: #ff7272bf;\n --warning-a9: #ff7979ce;\n --warning-a8: #ff7878a1;\n --warning-a7: #ff717178;\n --warning-a6: #fd5f5f5f;\n --warning-a5: #fd464a4d;\n --warning-a4: #ff33383c;\n --warning-a3: #fd383828;\n --warning-a2: #fe48360e;\n --warning-a1: #de000005;\n --green-1: #fbfefc;\n --green-2: #f2fcf5;\n --green-3: #e9f9ee;\n --green-4: #ddf3e4;\n --green-5: #ccebd7;\n --green-6: #b4dfc4;\n --green-7: #92ceac;\n --green-8: #5bb98c;\n --green-9: #30a46c;\n --green-10: #299764;\n --green-11: #18794e;\n --green-12: #153226;\n --green-a12: #002012ea;\n --green-a11: #006b3be7;\n --green-a10: #008346d6;\n --green-a9: #008f4acf;\n --green-a8: #00934ca4;\n --green-a7: #008c3d6d;\n --green-a6: #0193364b;\n --green-a5: #009b3633;\n --green-a4: #01a63522;\n --green-a3: #02ba3c16;\n --green-a2: #00c43b0d;\n --green-a1: #05c04304;\n --orange-1: #fefcfb;\n --red-1: #fefcfc;\n --red-2: #fdf8f8;\n --red-3: #faedec;\n --red-4: #fddfdd;\n --red-5: #f8d2d0;\n --red-6: #f1c3c1;\n --red-7: #e6b1ae;\n --red-8: #da9996;\n --red-9: #d16565;\n --red-10: #c45859;\n --red-11: #b64d4e;\n --red-12: #592525;\n --red-a12: #3d0000da;\n --red-a11: #970002b2;\n --red-a10: #a50002a7;\n --red-a9: #b300009a;\n --red-a8: #a6080069;\n --red-a7: #b10a0051;\n --red-a6: #c609003e;\n --red-a5: #da0b002f;\n --red-a4: #f00f0022;\n --red-a3: #bc0e0013;\n --red-a2: #b7000007;\n --red-a1: #aa000003;\n --black-1: #000000;\n --black-a12: #000000e8;\n --black-a11: #00000090;\n --black-a10: #0000007a;\n --black-a9: #00000070;\n --black-a8: #00000038;\n --black-a7: #00000024;\n --black-a6: #0000001d;\n --black-a5: #00000017;\n --black-a4: #00000012;\n --black-a3: #0000000c;\n --black-a2: #00000007;\n --black-a1: #00000003;\n --orange-2: #fef8f4;\n --orange-3: #fff1e7;\n --orange-4: #ffe8d7;\n --orange-5: #ffdcc3;\n --orange-6: #ffcca7;\n --orange-7: #ffb381;\n --orange-8: #fa934e;\n --orange-9: #f76808;\n --orange-10: #ed5f00;\n --orange-11: #bd4b00;\n --orange-12: #451e11;\n --orange-a12: #380e00ee;\n --orange-a11: #bc4800fa;\n --orange-a10: #ed5b00fa;\n --orange-a9: #f76300f7;\n --orange-a8: #f86300b1;\n --orange-a7: #ff66017e;\n --orange-a6: #ff6b0158;\n --orange-a5: #ff6b013c;\n --orange-a4: #ff6e0028;\n --orange-a3: #ff6c0318;\n --orange-a2: #e860050b;\n --orange-a1: #c0430504;\n --grey-2: #f9f9fb;\n --grey-3: #f0f0f3;\n --grey-4: #e8e8ec;\n --grey-5: #e0e1e6;\n --grey-6: #d9d9e0e0;\n --grey-7: #cdced6;\n --grey-8: #b9bbc6;\n --grey-9: #8b8d98;\n --grey-10: #80838d;\n --grey-11: #717989;\n --grey-12: #5a6671;\n --grey-a12: #020b1de3;\n --grey-a11: #020b1d9f;\n --grey-a10: #00071b7f;\n --grey-a9: #00051d74;\n --grey-a8: #00083046;\n --grey-a7: #00062e32;\n --grey-a6: #00002f26;\n --grey-a5: #0009321f;\n --grey-a4: #00002d17;\n --grey-a3: #00003310;\n --grey-a2: #00005506;\n --grey-a1: #00005503;\n --white-1: #FFFFFF;\n --white-a12: #ffffffeb;\n --white-a11: #ffffff97;\n --white-a10: #ffffff72;\n --white-a9: #ffffff62;\n --white-a8: #ffffff3f;\n --white-a7: #ffffff2d;\n --white-a6: #ffffff20;\n --white-a5: #ffffff16;\n --white-a4: #ffffff0e;\n --white-a3: #ffffff09;\n --white-a2: #ffffff03;\n --white-a1: #fff0;\n\n /* feedback */\n --error: var(--warning-8);\n --info: var(--primary-7);\n --neutral: var(--grey-9);\n --success: var(--success-8);\n --warning: var(--caution-8);\n\n /* icons */\n --inverse: var(--grey-1);\n --mono: var(--grey-12);\n --dimmed: var(--grey-11);\n --subtle: var(--grey-10);\n --primary: var(--primary-9);\n --danger: var(--warning-9);\n --white: var(--white-1);\n\n --spinner-danger: var(--warning-8);\n --spinner-secondary: var(--grey-8);\n --spinner-primary: var(--primary-6);\n --spinner-simple: var(--grey-a8);\n }\n\n .dark-theme {\n /* Dark mode */\n\n --grey-1: #111113;\n --primary-1: #000;\n --primary-2: #09121e;\n --primary-3: #0e2341;\n --primary-4: #0c2f5d;\n --primary-5: #153c70;\n --primary-6: #214a81;\n --primary-7: #2d5a97;\n --primary-8: #366bb5;\n --primary-9: #80b5ff;\n --primary-10: #75aaf3;\n --primary-11: #81b7ff;\n --primary-12: #cee3ff;\n --primary-a12: #cee3ff;\n --primary-a11: #81b7ff;\n --primary-a10: #7bb2fff3;\n --primary-a9: #80b5ff;\n --primary-a8: #4c97ffb5;\n --primary-a7: #4c98ff97;\n --primary-a6: #4293ff81;\n --primary-a5: #3089ff70;\n --primary-a4: #2181ff5d;\n --primary-a3: #378aff41;\n --primary-a2: #4d99ff1e;\n --primary-a1: #0000;\n --info-1: #091915;\n --info-2: #04201b;\n --info-3: #062923;\n --info-4: #07312b;\n --info-5: #083932;\n --info-6: #09443c;\n --info-7: #0b544a;\n --info-8: #0c6d62;\n --info-9: #12a594;\n --info-10: #10b3a3;\n --info-11: #0ac5b3;\n --info-12: #e1faf4;\n --info-a12: #e6fff9fa;\n --info-a11: #0affe7bf;\n --info-a10: #13ffe7ab;\n --info-a9: #18ffe49b;\n --info-a8: #11ffe75d;\n --info-a7: #11ffe342;\n --info-a6: #09ffe630;\n --info-a5: #02fee424;\n --info-a4: #00fde81b;\n --info-a3: #00fddc12;\n --info-a2: #00fbd508;\n --info-a1: #0000;\n --success-1: #0d1912;\n --success-2: #0c1f17;\n --success-3: #0f291e;\n --success-4: #113123;\n --success-5: #133929;\n --success-6: #164430;\n --success-7: #1b543a;\n --success-8: #236e4a;\n --success-9: #30a46c;\n --success-10: #3cb179;\n --success-11: #4cc38a;\n --success-12: #e5fbeb;\n --success-a12: #eafff0fa;\n --success-a11: #62ffb3bd;\n --success-a10: #54ffafa9;\n --success-a9: #47ffa69a;\n --success-a8: #49ffaa5e;\n --success-a7: #43ffad42;\n --success-a6: #3dffb130;\n --success-a5: #38feb524;\n --success-a4: #33feb31b;\n --success-a3: #2afebe12;\n --success-a2: #00f7ca07;\n --success-a1: #0000;\n --caution-1: #1f1206;\n --caution-2: #2b1400;\n --caution-3: #391a03;\n --caution-4: #441f04;\n --caution-5: #4f2305;\n --caution-6: #5f2a06;\n --caution-7: #763205;\n --caution-8: #943e00;\n --caution-9: #f76808;\n --caution-10: #ff802b;\n --caution-11: #ff8b3e;\n --caution-12: #feeadd;\n --caution-a12: #ffeee1fa;\n --caution-a11: #ff8c3ffa;\n --caution-a10: #ff842cfa;\n --caution-a9: #ff6b08f6;\n --caution-a8: #fe660085;\n --caution-a7: #ff640363;\n --caution-a6: #ff650649;\n --caution-a5: #fe620137;\n --caution-a4: #fe61002a;\n --caution-a3: #fd54001e;\n --caution-a2: #fd37000e;\n --caution-a1: #0000;\n --warning-1: #150f0f;\n --warning-2: #1e1413;\n --warning-3: #361717;\n --warning-4: #49191a;\n --warning-5: #582122;\n --warning-6: #692e2e;\n --warning-7: #813e3e;\n --warning-8: #a75252;\n --warning-9: #d16565;\n --warning-10: #c35959;\n --warning-11: #ff9795;\n --warning-12: #f9d5d3;\n --warning-a12: #ffdad8f9;\n --warning-a11: #ff9795ef;\n --warning-a10: #ff7272bf;\n --warning-a9: #ff7979ce;\n --warning-a8: #ff7878a1;\n --warning-a7: #ff717178;\n --warning-a6: #fd5f5f5f;\n --warning-a5: #fd464a4d;\n --warning-a4: #ff33383c;\n --warning-a3: #fd383828;\n --warning-a2: #fe48360e;\n --warning-a1: #de000005;\n --green-1: #0d1912;\n --green-2: #0c1f17;\n --green-3: #0f291e;\n --green-4: #113123;\n --green-5: #133929;\n --green-6: #164430;\n --green-7: #1b543a;\n --green-8: #236e4a;\n --green-9: #30a46c;\n --green-10: #3cb179;\n --green-11: #4cc38a;\n --green-12: #e5fbeb;\n --green-a12: #eafff0fa;\n --green-a11: #62ffb3bd;\n --green-a10: #54ffafa9;\n --green-a9: #47ffa69a;\n --green-a8: #49ffaa5e;\n --green-a7: #43ffad42;\n --green-a6: #3dffb130;\n --green-a5: #38feb524;\n --green-a4: #33feb31b;\n --green-a3: #2afebe12;\n --green-a2: #00f7ca07;\n --green-a1: #0000;\n --orange-1: #1f1206;\n --red-1: #150f0f;\n --red-2: #1e1413;\n --red-3: #361717;\n --red-4: #49191a;\n --red-5: #582122;\n --red-6: #692e2e;\n --red-7: #813e3e;\n --red-8: #a75252;\n --red-9: #d16565;\n --red-10: #c35959;\n --red-11: #ff9795;\n --red-12: #f9d5d3;\n --red-a12: #ffdad8f9;\n --red-a11: #ff9795ef;\n --red-a10: #ff7272bf;\n --red-a9: #ff7979ce;\n --red-a8: #ff7878a1;\n --red-a7: #ff717178;\n --red-a6: #fd5f5f5f;\n --red-a5: #fd464a4d;\n --red-a4: #ff33383c;\n --red-a3: #fd383828;\n --red-a2: #fe48360e;\n --red-a1: #de000005;\n --black-1: #000;\n --black-a12: #000000e8;\n --black-a11: #00000090;\n --black-a10: #0000007a;\n --black-a9: #00000070;\n --black-a8: #00000038;\n --black-a7: #00000024;\n --black-a6: #0000001d;\n --black-a5: #00000017;\n --black-a4: #00000012;\n --black-a3: #0000000c;\n --black-a2: #00000007;\n --black-a1: #00000003;\n --orange-2: #2b1400;\n --orange-3: #391a03;\n --orange-4: #441f04;\n --orange-5: #4f2305;\n --orange-6: #5f2a06;\n --orange-7: #763205;\n --orange-8: #943e00;\n --orange-9: #f76808;\n --orange-10: #ff802b;\n --orange-11: #ff8b3e;\n --orange-12: #feeadd;\n --orange-a12: #ffeee1fa;\n --orange-a11: #ff8c3ffa;\n --orange-a10: #ff842cfa;\n --orange-a9: #ff6b08f6;\n --orange-a8: #fe660085;\n --orange-a7: #ff640363;\n --orange-a6: #ff650649;\n --orange-a5: #fe620137;\n --orange-a4: #fe61002a;\n --orange-a3: #fd54001e;\n --orange-a2: #fd37000e;\n --orange-a1: #0000;\n --grey-2: #18191b;\n --grey-3: #212225;\n --grey-4: #272a2d;\n --grey-5: #2e3135;\n --grey-6: #363a3f;\n --grey-7: #43484e;\n --grey-8: #5a6169;\n --grey-9: #696e77;\n --grey-10: #777b84;\n --grey-11: #9a9fa7;\n --grey-12: #d5d8dc;\n --grey-a12: #fcfdffef;\n --grey-a11: #f1f7feb5;\n --grey-a10: #e5edfd7b;\n --grey-a9: #dfebfd;\n --grey-a8: #d9edff5d;\n --grey-a7: #d9edff40;\n --grey-a6: #d6ebfd30;\n --grey-a5: #d9edfe25;\n --grey-a4: #d3edf81d;\n --grey-a3: #ddeaf814;\n --grey-a2: #d8f4f609;\n --grey-a1: #0000;\n --white-1: #fff;\n --white-a12: #ffffffeb;\n --white-a11: #ffffff97;\n --white-a10: #ffffff72;\n --white-a9: #ffffff62;\n --white-a8: #ffffff3f;\n --white-a7: #ffffff2d;\n --white-a6: #ffffff20;\n --white-a5: #ffffff16;\n --white-a4: #ffffff0e;\n --white-a3: #ffffff09;\n --white-a2: #ffffff03;\n --white-a1: #fff0;\n\n /* feedback */\n --error: var(--warning-8);\n --info: var(--primary-7);\n --neutral: var(--grey-9);\n --success: var(--success-8);\n --warning: var(--caution-8);\n\n /* icons */\n --inverse: var(--white-1);\n --mono: var(--grey-12);\n --dimmed: var(--grey-11);\n --subtle: var(--grey-10);\n --primary: var(--primary-9);\n --danger: var(--warning-9);\n --white: var(--white-1);\n\n --spinner-danger: var(--warning-8);\n --spinner-secondary: var(--grey-8);\n --spinner-primary: var(--primary-6);\n --spinner-simple: var(--grey-a8);\n }\n \n"])), layoutVariables);
1703
+
1704
+ var _templateObject$2, _templateObject2, _templateObject3;
1705
+ var wrapperCss = styled.css(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n svg {\n overflow: visible;\n vector-effect: non-scaling-stroke;\n\n line, path, circle, ellipse, foreignObject, polygon, polyline, rect, text, textPath, tspan {\n vector-effect: non-scaling-stroke;\n }\n }\n"])));
1700
1706
  var IconWrapper = styled__default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), wrapperCss);
1701
1707
  var IconWrapperForSVG = styled__default.g(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), wrapperCss);
1702
1708
 
@@ -1707,7 +1713,7 @@ var Icon = function Icon(_ref) {
1707
1713
  _ref$weight = _ref.weight,
1708
1714
  weight = _ref$weight === void 0 ? 'regular' : _ref$weight,
1709
1715
  _ref$color = _ref.color,
1710
- color = _ref$color === void 0 ? 'mono' : _ref$color,
1716
+ color = _ref$color === void 0 ? 'grey-12' : _ref$color,
1711
1717
  _ref$forSvgUsage = _ref.forSvgUsage,
1712
1718
  forSvgUsage = _ref$forSvgUsage === void 0 ? false : _ref$forSvgUsage;
1713
1719
  var iconWeight = dimensions.icons.weights[weight];
@@ -1715,23 +1721,23 @@ var Icon = function Icon(_ref) {
1715
1721
  return IconSVG != null ? forSvgUsage ? React__default.createElement(IconWrapperForSVG, null, IconSVG({
1716
1722
  size: size,
1717
1723
  weight: iconWeight,
1718
- color: "var(--" + color + ")"
1724
+ color: "var(--" + color + ", var(--grey-12))"
1719
1725
  })) : React__default.createElement(IconWrapper, null, IconSVG({
1720
1726
  size: size,
1721
1727
  weight: iconWeight,
1722
- color: "var(--" + color + ")"
1728
+ color: "var(--" + color + ", var(--grey-12))"
1723
1729
  })) : null;
1724
1730
  };
1725
1731
 
1726
- var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4, _templateObject5;
1727
- var RowCss = styled.css(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n position:relative;\n display: flex;\n flex-direction: row;\n align-items:center;\n"])));
1732
+ var _templateObject$3, _templateObject2$1, _templateObject3$1, _templateObject4, _templateObject5;
1733
+ var RowCss = styled.css(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n position:relative;\n display: flex;\n flex-direction: row;\n align-items:center;\n"])));
1728
1734
  var ColumnCss = styled.css(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
1729
1735
  var resetButtonStyles = styled.css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n -webkit-tap-highlight-color: transparent;\n background-color: transparent;\n background: transparent;\n border: none;\n cursor: pointer;\n outline: none;\n padding: 0;\n appearance: none;\n user-select: none;\n"])));
1730
1736
  var removeAutoFillStyle = styled.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n &:-webkit-autofill,\n &:-webkit-autofill:hover,\n &:-webkit-autofill:focus,\n &:-webkit-autofill:active{\n transition: background-color 600000s 0s, color 600000s 0s;\n }\n"])));
1731
1737
  var EllipsisStyles = styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
1732
1738
 
1733
- var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$1;
1734
- var IconButton = styled__default.button(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n ", ";\n ", "\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n opacity: .8;\n }\n &:active:enabled {\n opacity: .9;\n }\n &:disabled {\n opacity: 0.1;\n }\n"])), resetButtonStyles, function (_ref) {
1739
+ var _templateObject$4, _templateObject2$2, _templateObject3$2, _templateObject4$1;
1740
+ var IconButton = styled__default.button(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n ", ";\n ", "\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n opacity: .8;\n }\n &:active:enabled {\n opacity: .9;\n }\n &:disabled {\n opacity: 0.1;\n }\n"])), resetButtonStyles, function (_ref) {
1735
1741
  var _ref$selected = _ref.selected,
1736
1742
  selected = _ref$selected === void 0 ? false : _ref$selected;
1737
1743
  return selected && styled.css(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n border-bottom: 5px solid var(--primary-7);\n "])));
@@ -1778,8 +1784,8 @@ var AlertBar = function AlertBar(_ref3) {
1778
1784
  }))) : null;
1779
1785
  };
1780
1786
 
1781
- var _templateObject$3, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$1, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
1782
- var initAnimation = styled.keyframes(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translate(-50%, -100%);\n }\n 100% {\n transform: translate(-50%, 0%);\n }\n"])));
1787
+ var _templateObject$5, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$1, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
1788
+ var initAnimation = styled.keyframes(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translate(-50%, -100%);\n }\n 100% {\n transform: translate(-50%, 0%);\n }\n"])));
1783
1789
  var closeAnimation = styled.keyframes(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translate(-50%, 0);\n }\n 100% {\n transform: translate(-50%, -100%);\n }\n"])));
1784
1790
  var Container = styled__default.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose(["\n min-height: 50px;\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: 0 14px;\n width: 900px;\n position: fixed;\n top: 0;\n left: 50%;\n transform: translateX(-50%);\n z-index: 999;\n\n font-family: ", ";\n background-color: ", ";\n text-align: left;\n font-size: 14px;\n font-weight: 400;\n line-height: 15px;\n letter-spacing: -0.2px;\n text-decoration: none;\n color: var(--white-1);\n\n ", ";\n\n ", ";\n\n ", " {\n [stroke]{\n stroke: var(--white-1);\n }\n }\n"])), fontFamily.ui, function (_ref) {
1785
1791
  var type = _ref.type;
@@ -1910,8 +1916,8 @@ var Notification = function Notification(_ref6) {
1910
1916
 
1911
1917
  var _excluded = ["design", "size", "children"];
1912
1918
 
1913
- var _templateObject$4, _templateObject2$4;
1914
- var StyledButton = styled__default.button(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n ", ";\n\n overflow: hidden;\n border: none;\n cursor: pointer;\n border-radius: 3px;\n outline: none;\n\n button + button {\n margin-left: 20px;\n }\n\n"])), function (_ref) {
1919
+ var _templateObject$6, _templateObject2$4;
1920
+ var StyledButton = styled__default.button(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n ", ";\n\n overflow: hidden;\n border: none;\n cursor: pointer;\n border-radius: 3px;\n outline: none;\n\n button + button {\n margin-left: 20px;\n }\n\n"])), function (_ref) {
1915
1921
  var theme = _ref.theme,
1916
1922
  design = _ref.design,
1917
1923
  size = _ref.size;
@@ -1936,8 +1942,8 @@ var Button = function Button(_ref2) {
1936
1942
 
1937
1943
  var _excluded$1 = ["design", "size", "onClick", "disabled", "position", "icon", "children"];
1938
1944
 
1939
- var _templateObject$5, _templateObject2$5, _templateObject3$4, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1;
1940
- var TextContainer = styled__default.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n height: inherit;\n flex: 1;\n order: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n white-space: nowrap;\n\n ", "\n\n ", "\n"])), function (_ref) {
1945
+ var _templateObject$7, _templateObject2$5, _templateObject3$4, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1;
1946
+ var TextContainer = styled__default.div(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n height: inherit;\n flex: 1;\n order: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n white-space: nowrap;\n\n ", "\n\n ", "\n"])), function (_ref) {
1941
1947
  var position = _ref.position,
1942
1948
  size = _ref.size;
1943
1949
  return position && position === 'left' ? styled.css(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n padding-left: ", ";\n "])), size === 'xsmall' ? "10px" : "20px") : styled.css(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n padding-right: ", ";\n "])), size === 'xsmall' ? "10px" : "20px");
@@ -1982,7 +1988,7 @@ var ButtonWithIcon = function ButtonWithIcon(_ref4) {
1982
1988
  }))));
1983
1989
  };
1984
1990
 
1985
- var _templateObject$6, _templateObject2$6, _templateObject3$5, _templateObject4$4;
1991
+ var _templateObject$8, _templateObject2$6, _templateObject3$5, _templateObject4$4;
1986
1992
 
1987
1993
  var circumference = function circumference(radius) {
1988
1994
  return 2 * 3.1416 * radius;
@@ -1990,7 +1996,7 @@ var circumference = function circumference(radius) {
1990
1996
 
1991
1997
  var animation$1 = function animation(radius) {
1992
1998
  var c = circumference(radius);
1993
- return styled.keyframes(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n 0% {\n stroke-dashoffset: -", ";\n }\n 50% {\n stroke-dashoffset: -", ";\n }\n 100% {\n stroke-dashoffset: -", ";\n }\n "])), c * 0.85, c * 0.5, c * 0.85);
1999
+ return styled.keyframes(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n 0% {\n stroke-dashoffset: -", ";\n }\n 50% {\n stroke-dashoffset: -", ";\n }\n 100% {\n stroke-dashoffset: -", ";\n }\n "])), c * 0.85, c * 0.5, c * 0.85);
1994
2000
  };
1995
2001
 
1996
2002
  var rotate = styled.keyframes(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"])));
@@ -2069,8 +2075,8 @@ var Spinner = function Spinner(_ref5) {
2069
2075
 
2070
2076
  var _excluded$2 = ["design", "size", "onClick", "disabled", "position", "loading", "children"];
2071
2077
 
2072
- var _templateObject$7, _templateObject2$7, _templateObject3$6, _templateObject4$5, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11;
2073
- var LoadingButton = styled__default(Button)(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
2078
+ var _templateObject$9, _templateObject2$7, _templateObject3$6, _templateObject4$5, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11;
2079
+ var LoadingButton = styled__default(Button)(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
2074
2080
  var $loading = _ref.$loading,
2075
2081
  theme = _ref.theme;
2076
2082
  return $loading && styled.css(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteralLoose(["\n cursor: wait;\n background: ", ";\n padding: 0 20px;\n &:disabled {\n opacity: 1;\n }\n "])), theme.styles.form.button['primary'].active);
@@ -2131,15 +2137,13 @@ var ButtonWithLoading = function ButtonWithLoading(_ref6) {
2131
2137
 
2132
2138
  var _excluded$3 = ["icon", "size", "weight", "color", "hoverColor"];
2133
2139
 
2134
- var _templateObject$8;
2135
- var StyledButton$1 = styled__default.button(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n ", ";\n [stroke]{\n stroke: ", ";\n }\n &:hover {\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n"])), resetButtonStyles, function (_ref) {
2136
- var theme = _ref.theme,
2137
- color = _ref.color;
2138
- return theme.colors.icons[color];
2140
+ var _templateObject$a;
2141
+ var StyledButton$1 = styled__default.button(_templateObject$a || (_templateObject$a = _taggedTemplateLiteralLoose(["\n ", ";\n [stroke]{\n stroke: ", ";\n }\n &:hover {\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n"])), resetButtonStyles, function (_ref) {
2142
+ var color = _ref.color;
2143
+ return color;
2139
2144
  }, IconWrapper, function (_ref2) {
2140
- var theme = _ref2.theme,
2141
- hoverColor = _ref2.hoverColor;
2142
- return theme.colors.icons[hoverColor];
2145
+ var hoverColor = _ref2.hoverColor;
2146
+ return hoverColor;
2143
2147
  });
2144
2148
 
2145
2149
  var IconButton$2 = function IconButton(_ref3) {
@@ -2165,8 +2169,8 @@ var IconButton$2 = function IconButton(_ref3) {
2165
2169
  }));
2166
2170
  };
2167
2171
 
2168
- var _templateObject$9, _templateObject2$8, _templateObject3$7, _templateObject4$6, _templateObject5$4;
2169
- var StyledIconButton = styled__default(IconButton$2)(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose([""])));
2172
+ var _templateObject$b, _templateObject2$8, _templateObject3$7, _templateObject4$6, _templateObject5$4;
2173
+ var StyledIconButton = styled__default(IconButton$2)(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose([""])));
2170
2174
  var Container$1 = styled__default.div(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteralLoose(["\n display: flex;\n ", " {\n margin-left: 15px;\n }\n ", ":first-child {\n margin-left: 0px;\n }\n\n ", ";\n\n ", ";\n\n ", ";\n"])), StyledIconButton, StyledIconButton, function (_ref) {
2171
2175
  var alignment = _ref.alignment;
2172
2176
  return alignment === 'left' && styled.css(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n justify-content: flex-start;\n "])));
@@ -2205,8 +2209,8 @@ var ActionButtons = function ActionButtons(_ref4) {
2205
2209
 
2206
2210
  var _excluded$4 = ["type", "placeholder", "defaultValue", "fieldState", "feedbackMessage", "actionCallback", "actionIcon", "postfix"];
2207
2211
 
2208
- var _templateObject$a, _templateObject2$9, _templateObject3$8, _templateObject4$7, _templateObject5$5, _templateObject6$3, _templateObject7$3, _templateObject8$2, _templateObject9$2, _templateObject10$2, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
2209
- var ActionContainer = styled__default.div(_templateObject$a || (_templateObject$a = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 0;\n top: 0;\n"])));
2212
+ var _templateObject$c, _templateObject2$9, _templateObject3$8, _templateObject4$7, _templateObject5$5, _templateObject6$3, _templateObject7$3, _templateObject8$2, _templateObject9$2, _templateObject10$2, _templateObject11$1, _templateObject12, _templateObject13, _templateObject14;
2213
+ var ActionContainer = styled__default.div(_templateObject$c || (_templateObject$c = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 0;\n top: 0;\n"])));
2210
2214
  var InputActionButton = styled__default.button.attrs({
2211
2215
  type: "button"
2212
2216
  })(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteralLoose(["\n width: 40px;\n height: 40px;\n background: transparent;\n border: none;\n cursor: pointer;\n outline: none;\n"])));
@@ -2327,8 +2331,8 @@ var Input = function Input(_ref13) {
2327
2331
 
2328
2332
  var _excluded$5 = ["htmlFor", "labelText", "rightAlign", "children"];
2329
2333
 
2330
- var _templateObject$b, _templateObject2$a;
2331
- var StyledLabel = styled__default.label(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-10);\n font-size: 14px;\n font-weight: 500;\n ", ";\n"])), function (_ref) {
2334
+ var _templateObject$d, _templateObject2$a;
2335
+ var StyledLabel = styled__default.label(_templateObject$d || (_templateObject$d = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-10);\n font-size: 14px;\n font-weight: 500;\n ", ";\n"])), function (_ref) {
2332
2336
  var theme = _ref.theme;
2333
2337
  return theme.fontFamily.ui;
2334
2338
  }, function (_ref2) {
@@ -2358,8 +2362,8 @@ var Label = function Label(_ref4) {
2358
2362
 
2359
2363
  var _excluded$6 = ["unit", "label", "name", "type", "placeholder", "defaultValue", "fieldState", "className"];
2360
2364
 
2361
- var _templateObject$c, _templateObject2$b, _templateObject3$9, _templateObject4$8, _templateObject5$6, _templateObject6$4, _templateObject7$4, _templateObject8$3, _templateObject9$3, _templateObject10$3;
2362
- var StyledInput$1 = styled__default.input(_templateObject$c || (_templateObject$c = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", ";\n\n height: 100%;\n width: 100%;\n border-radius: 3px;\n\n padding: 0 22px 0 10px;\n box-sizing: border-box;\n outline: none;\n\n ", ";\n\n ", "\n\n &:disabled {\n cursor: not-allowed;\n }\n"])), removeAutoFillStyle, function (_ref) {
2365
+ var _templateObject$e, _templateObject2$b, _templateObject3$9, _templateObject4$8, _templateObject5$6, _templateObject6$4, _templateObject7$4, _templateObject8$3, _templateObject9$3, _templateObject10$3;
2366
+ var StyledInput$1 = styled__default.input(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", ";\n\n height: 100%;\n width: 100%;\n border-radius: 3px;\n\n padding: 0 22px 0 10px;\n box-sizing: border-box;\n outline: none;\n\n ", ";\n\n ", "\n\n &:disabled {\n cursor: not-allowed;\n }\n"])), removeAutoFillStyle, function (_ref) {
2363
2367
  var theme = _ref.theme,
2364
2368
  fieldState = _ref.fieldState;
2365
2369
  return styled.css(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n min-height: 30px;\n font-family: ", ";\n border: 1px solid ", ";\n "])), theme.fontFamily.data, theme.styles.form.input[fieldState].normal.borderColor);
@@ -2432,7 +2436,7 @@ var SmallInput = function SmallInput(_ref8) {
2432
2436
  }, unit) : null)));
2433
2437
  };
2434
2438
 
2435
- var _templateObject$d, _templateObject2$c, _templateObject3$a, _templateObject4$9, _templateObject5$7, _templateObject6$5, _templateObject7$5, _templateObject8$4, _templateObject9$4, _templateObject10$4, _templateObject11$2;
2439
+ var _templateObject$f, _templateObject2$c, _templateObject3$a, _templateObject4$9, _templateObject5$7, _templateObject6$5, _templateObject7$5, _templateObject8$4, _templateObject9$4, _templateObject10$4, _templateObject11$2;
2436
2440
  var SwitchPosition;
2437
2441
 
2438
2442
  (function (SwitchPosition) {
@@ -2448,7 +2452,7 @@ var intentPosition = function intentPosition(left, checked) {
2448
2452
  return intentLeft + "px";
2449
2453
  };
2450
2454
 
2451
- var RealInput = styled__default.input(_templateObject$d || (_templateObject$d = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
2455
+ var RealInput = styled__default.input(_templateObject$f || (_templateObject$f = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
2452
2456
  var SwitchOuter = styled__default.div(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n border: 1px solid transparent;\n box-sizing: border-box;\n cursor: pointer;\n position: relative;\n"])));
2453
2457
 
2454
2458
  var getPositionKey = function getPositionKey(switchPos) {
@@ -2730,7 +2734,7 @@ function SvgNoImage() {
2730
2734
  }));
2731
2735
  }
2732
2736
 
2733
- var _templateObject$e, _templateObject2$d, _templateObject3$b, _templateObject4$a, _templateObject5$8, _templateObject6$6, _templateObject7$6, _templateObject8$5, _templateObject9$5, _templateObject10$5, _templateObject11$3, _templateObject12$1, _templateObject13$1;
2737
+ var _templateObject$g, _templateObject2$d, _templateObject3$b, _templateObject4$a, _templateObject5$8, _templateObject6$6, _templateObject7$6, _templateObject8$5, _templateObject9$5, _templateObject10$5, _templateObject11$3, _templateObject12$1, _templateObject13$1;
2734
2738
  var CheckboxState;
2735
2739
 
2736
2740
  (function (CheckboxState) {
@@ -2739,7 +2743,7 @@ var CheckboxState;
2739
2743
  CheckboxState["Indeterminate"] = "indeterminate";
2740
2744
  })(CheckboxState || (CheckboxState = {}));
2741
2745
 
2742
- var RealInput$1 = styled__default.input(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
2746
+ var RealInput$1 = styled__default.input(_templateObject$g || (_templateObject$g = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
2743
2747
  var CheckboxOuter = styled__default.div(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n\n box-sizing: border-box;\n position: relative;\n width: 18px;\n height: 18px;\n border-radius: 5px;\n border-width: 2px;\n border-style: solid;\n"])));
2744
2748
  var CheckboxInner = styled__default.div(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n box-sizing: border-box;\n"])));
2745
2749
  var IconWrapper$2 = styled__default.div(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n display: block;\n [stroke]{\n stroke: transparent;\n }\n [fill] {\n fill: ", ";\n }\n }\n"])), function (_ref) {
@@ -2815,8 +2819,8 @@ var Checkbox = function Checkbox(_ref5) {
2815
2819
  })), " ");
2816
2820
  };
2817
2821
 
2818
- var _templateObject$f, _templateObject2$e, _templateObject3$c, _templateObject4$b, _templateObject5$9, _templateObject6$7, _templateObject7$7, _templateObject8$6, _templateObject9$6, _templateObject10$6;
2819
- var InnerRadio = styled__default.div(_templateObject$f || (_templateObject$f = _taggedTemplateLiteralLoose(["\n width: 10px;\n height: 10px;\n border-radius: 50%;\n user-select: none;\n"])));
2822
+ var _templateObject$h, _templateObject2$e, _templateObject3$c, _templateObject4$b, _templateObject5$9, _templateObject6$7, _templateObject7$7, _templateObject8$6, _templateObject9$6, _templateObject10$6;
2823
+ var InnerRadio = styled__default.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteralLoose(["\n width: 10px;\n height: 10px;\n border-radius: 50%;\n user-select: none;\n"])));
2820
2824
  var OuterRadio = styled__default.div(_templateObject2$e || (_templateObject2$e = _taggedTemplateLiteralLoose(["\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n border-radius: 50%;\n border-width: 2px;\n border-style: solid;\n user-select: none;\n\n ", ";\n"])), function (_ref) {
2821
2825
  var styles = _ref.theme.styles,
2822
2826
  isChecked = _ref.isChecked,
@@ -2860,8 +2864,8 @@ var RadioButton = function RadioButton(_ref2) {
2860
2864
 
2861
2865
  var _excluded$7 = ["placeholder", "fieldState", "feedbackMessage", "children"];
2862
2866
 
2863
- var _templateObject$g, _templateObject2$f, _templateObject3$d, _templateObject4$c, _templateObject5$a, _templateObject6$8, _templateObject7$8, _templateObject8$7, _templateObject9$7, _templateObject10$7;
2864
- var FeedbackIcon$1 = styled__default.div(_templateObject$g || (_templateObject$g = _taggedTemplateLiteralLoose(["\n flex: 0 0 40px;\n width: 40px;\n display: flex;\n justify-content:center;\n align-items:center;\n padding-top: 2px;\n"])));
2867
+ var _templateObject$i, _templateObject2$f, _templateObject3$d, _templateObject4$c, _templateObject5$a, _templateObject6$8, _templateObject7$8, _templateObject8$7, _templateObject9$7, _templateObject10$7;
2868
+ var FeedbackIcon$1 = styled__default.div(_templateObject$i || (_templateObject$i = _taggedTemplateLiteralLoose(["\n flex: 0 0 40px;\n width: 40px;\n display: flex;\n justify-content:center;\n align-items:center;\n padding-top: 2px;\n"])));
2865
2869
  var StyledTextArea = styled__default.textarea(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n\n", ";\n\n padding: 8px 15px;\n box-sizing: border-box;\n outline: none;\n height: 100%;\n width: 100%;\n border-radius: 3px;\n\n ", ";\n"])), function (_ref) {
2866
2870
  var theme = _ref.theme,
2867
2871
  fieldState = _ref.fieldState;
@@ -2964,8 +2968,8 @@ var TextArea = function TextArea(_ref13) {
2964
2968
 
2965
2969
  var _excluded$8 = ["placeholder", "label", "isCompact", "defaultValue", "changeCallback", "children"];
2966
2970
 
2967
- var _templateObject$h, _templateObject2$g, _templateObject3$e, _templateObject4$d, _templateObject5$b, _templateObject6$9, _templateObject7$9, _templateObject8$8, _templateObject9$8, _templateObject10$8, _templateObject11$4, _templateObject12$2, _templateObject13$2;
2968
- var SelectWrapper = styled__default.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n width: 100%;\n\n ", " {\n position: absolute;\n top: calc(50% - 7px);\n right: 10px;\n pointer-events: none;\n }\n"])), IconWrapper);
2971
+ var _templateObject$j, _templateObject2$g, _templateObject3$e, _templateObject4$d, _templateObject5$b, _templateObject6$9, _templateObject7$9, _templateObject8$8, _templateObject9$8, _templateObject10$8, _templateObject11$4, _templateObject12$2, _templateObject13$2;
2972
+ var SelectWrapper = styled__default.div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n width: 100%;\n\n ", " {\n position: absolute;\n top: calc(50% - 7px);\n right: 10px;\n pointer-events: none;\n }\n"])), IconWrapper);
2969
2973
  var StyledSelect = styled__default.select(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteralLoose(["\n box-sizing: border-box;\n outline: none;\n border-radius: 3px;\n height: 40px;\n padding: 0 25px 0 15px;\n appearance: none;\n line-height: 1.56;\n width: 100%;\n cursor: pointer;\n ", "\n\n &:disabled {\n ", "\n cursor: not-allowed;\n }\n\n &::-ms-expand {\n display: none;\n }\n"])), function (_ref) {
2970
2974
  var styles = _ref.theme.styles;
2971
2975
  return styled.css(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n ", ";\n "])), styles.form.input["default"].normal);
@@ -3122,15 +3126,15 @@ var uniqueID = function uniqueID() {
3122
3126
  };
3123
3127
 
3124
3128
  var isNotNumber = function isNotNumber(value) {
3125
- var intValue = parseInt(value);
3129
+ var intValue = Number(value);
3126
3130
  return intValue !== intValue;
3127
3131
  };
3128
3132
 
3129
3133
  var _excluded$9 = ["min", "max", "marks", "defaultValue", "thumbColor", "disabled", "onlyMarkSelect", "inputCallback", "onChangeCallback", "allMarkCentered"];
3130
3134
 
3131
- var _templateObject$i, _templateObject2$h, _templateObject3$f, _templateObject4$e, _templateObject5$c, _templateObject6$a, _templateObject7$a, _templateObject8$9, _templateObject9$9, _templateObject10$9, _templateObject11$5, _templateObject12$3;
3135
+ var _templateObject$k, _templateObject2$h, _templateObject3$f, _templateObject4$e, _templateObject5$c, _templateObject6$a, _templateObject7$a, _templateObject8$9, _templateObject9$9, _templateObject10$9, _templateObject11$5, _templateObject12$3;
3132
3136
  var ThumbDiameter = 16;
3133
- var SliderWrapper = styled__default.div(_templateObject$i || (_templateObject$i = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n position: relative;\n height: 30px;\n margin-top: 20px;\n ", ";\n"])), function (_ref) {
3137
+ var SliderWrapper = styled__default.div(_templateObject$k || (_templateObject$k = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n position: relative;\n height: 30px;\n margin-top: 20px;\n ", ";\n"])), function (_ref) {
3134
3138
  var theme = _ref.theme;
3135
3139
  return theme.fontFamily.data;
3136
3140
  }, function (_ref2) {
@@ -3374,8 +3378,8 @@ var SliderInput = function SliderInput(_ref12) {
3374
3378
 
3375
3379
  var _excluded$a = ["text", "buttonDesign", "buttonSize", "inputCallback"];
3376
3380
 
3377
- var _templateObject$j, _templateObject2$i, _templateObject3$g;
3378
- var Container$9 = styled__default.div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteralLoose([""])));
3381
+ var _templateObject$l, _templateObject2$i, _templateObject3$g;
3382
+ var Container$9 = styled__default.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose([""])));
3379
3383
  var HiddenInput$2 = styled__default.input(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
3380
3384
  var StyledButton$2 = styled__default(Button)(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n text-align: center;\n"])));
3381
3385
 
@@ -3423,8 +3427,8 @@ var InputFileButton = function InputFileButton(_ref) {
3423
3427
 
3424
3428
  var _excluded$b = ["max", "min", "defaultValue", "title", "timeUnit", "controlledValue", "inputCallback"];
3425
3429
 
3426
- var _templateObject$k, _templateObject2$j, _templateObject3$h, _templateObject4$f, _templateObject5$d;
3427
- var Container$a = styled__default.div(_templateObject$k || (_templateObject$k = _taggedTemplateLiteralLoose([""])));
3430
+ var _templateObject$m, _templateObject2$j, _templateObject3$h, _templateObject4$f, _templateObject5$d;
3431
+ var Container$a = styled__default.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteralLoose([""])));
3428
3432
  var Headers = styled__default.div(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: var(--grey-10);\n display: flex;\n justify-content: space-between;\n margin-bottom: 30px;\n padding: 0 6px;\n"])));
3429
3433
  var ValueLabel = styled__default(Label)(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n margin-bottom: 0;\n"])), function (_ref) {
3430
3434
  var theme = _ref.theme;
@@ -3478,8 +3482,8 @@ var DurationSlider = function DurationSlider(_ref3) {
3478
3482
 
3479
3483
  var _excluded$c = ["defaultValue", "inputCallback", "updateThumbColor", "updateTitle", "showValue", "allMarkCentered"];
3480
3484
 
3481
- var _templateObject$l, _templateObject2$k, _templateObject3$i;
3482
- var Container$b = styled__default.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose([""])));
3485
+ var _templateObject$n, _templateObject2$k, _templateObject3$i;
3486
+ var Container$b = styled__default.div(_templateObject$n || (_templateObject$n = _taggedTemplateLiteralLoose([""])));
3483
3487
  var Headers$1 = styled__default.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n color: var(--grey-10);\n display: flex;\n justify-content: space-between;\n margin-bottom: 20px;\n ", ";\n"])), function (_ref) {
3484
3488
  var allMarkCentered = _ref.allMarkCentered;
3485
3489
  return allMarkCentered ? "padding: 0;" : "padding: 0 6px;";
@@ -3635,8 +3639,8 @@ var TextAreaField = function TextAreaField(_ref) {
3635
3639
 
3636
3640
  var _excluded$g = ["height", "text", "dropCallback"];
3637
3641
 
3638
- var _templateObject$m, _templateObject2$l;
3639
- var Container$c = styled__default.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteralLoose(["\n ", ";\n position: relative;\n"])), function (_ref) {
3642
+ var _templateObject$o, _templateObject2$l;
3643
+ var Container$c = styled__default.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n ", ";\n position: relative;\n"])), function (_ref) {
3640
3644
  var height = _ref.height;
3641
3645
  return height ? "height: " + height : null;
3642
3646
  });
@@ -3964,8 +3968,8 @@ var areDimensionsDiff = function areDimensionsDiff(oldDimensions, newValues) {
3964
3968
  return isDifferent;
3965
3969
  };
3966
3970
 
3967
- var _templateObject$n, _templateObject2$m, _templateObject3$j, _templateObject4$g, _templateObject5$e, _templateObject6$b, _templateObject7$b, _templateObject8$a, _templateObject9$a, _templateObject10$a, _templateObject11$6, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
3968
- var CropLineStyle = styled.css(_templateObject$n || (_templateObject$n = _taggedTemplateLiteralLoose(["\n position: absolute;\n display: block;\n opacity: 0.1;\n"])));
3971
+ var _templateObject$p, _templateObject2$m, _templateObject3$j, _templateObject4$g, _templateObject5$e, _templateObject6$b, _templateObject7$b, _templateObject8$a, _templateObject9$a, _templateObject10$a, _templateObject11$6, _templateObject12$4, _templateObject13$3, _templateObject14$1, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
3972
+ var CropLineStyle = styled.css(_templateObject$p || (_templateObject$p = _taggedTemplateLiteralLoose(["\n position: absolute;\n display: block;\n opacity: 0.1;\n"])));
3969
3973
  var TopLine = styled__default.div(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteralLoose(["\n ", ";\n cursor: n-resize;\n width: 100%;\n height: 5px;\n left: 0;\n top: -3px;\n"])), CropLineStyle);
3970
3974
  var RightLine = styled__default.div(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteralLoose(["\n ", ";\n cursor: e-resize;\n right: -3px;\n top: 0;\n width: 5px;\n height: 100%;\n"])), CropLineStyle);
3971
3975
  var BottomLine = styled__default.div(_templateObject4$g || (_templateObject4$g = _taggedTemplateLiteralLoose(["\n ", "\n cursor: s-resize;\n bottom: -3px;\n height: 5px;\n width: 100%;\n left: 0;\n"])), CropLineStyle);
@@ -4042,31 +4046,28 @@ var CropArea = function CropArea(_ref9) {
4042
4046
  })));
4043
4047
  };
4044
4048
 
4045
- var _templateObject$o, _templateObject2$n, _templateObject3$k, _templateObject4$h, _templateObject5$f, _templateObject6$c, _templateObject7$c, _templateObject8$b, _templateObject9$b;
4046
- var Container$d = styled__default.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--grey-3);\n -webkit-backdrop-filter: blur(5px);\n backdrop-filter: blur(5px);\n font-family: ", ";\n z-index: 999;\n"])), function (_ref) {
4049
+ var _templateObject$q, _templateObject2$n, _templateObject3$k, _templateObject4$h, _templateObject5$f, _templateObject6$c, _templateObject7$c, _templateObject8$b, _templateObject9$b;
4050
+ var Container$d = styled__default.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--grey-3);\n -webkit-backdrop-filter: blur(5px);\n backdrop-filter: blur(5px);\n font-family: ", ";\n z-index: 999;\n"])), function (_ref) {
4047
4051
  var theme = _ref.theme;
4048
4052
  return theme.fontFamily.ui;
4049
4053
  });
4050
4054
  var InnerContainer$2 = styled__default.div(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteralLoose(["\n position: relative;\n z-index: 99;\n"])));
4051
4055
  var ToolHeader = styled__default.div(_templateObject3$k || (_templateObject3$k = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 17px;\n"])));
4052
- var TextGroup = styled__default.div(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: 20px;\n font-weight: 500;\n color: ", ";\n\n ", " {\n display: flex;\n align-items: center;\n margin-right: 14px;\n }\n"])), function (_ref2) {
4053
- var theme = _ref2.theme;
4054
- return theme.colors.icons.mono;
4055
- }, IconWrapper);
4056
+ var TextGroup = styled__default.div(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: 20px;\n font-weight: 500;\n color: var(--mono);\n\n ", " {\n display: flex;\n align-items: center;\n margin-right: 14px;\n }\n"])), IconWrapper);
4056
4057
  var ButtonsGroup = styled__default.div(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n button + button {\n margin-left: 10px;\n }\n"])));
4057
- var PreviewArea = styled__default.div(_templateObject6$c || (_templateObject6$c = _taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n height: ", ";\n width: ", ";\n border-radius: 5px;\n background-color: var(--grey-3);\n background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, var(--white-a10) 35px, var(--white-a10) 70px);\n"])), function (_ref3) {
4058
- var canvasHeight = _ref3.canvasHeight;
4058
+ var PreviewArea = styled__default.div(_templateObject6$c || (_templateObject6$c = _taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n height: ", ";\n width: ", ";\n border-radius: 5px;\n background-color: var(--grey-3);\n background-image: repeating-linear-gradient(45deg, transparent, transparent 35px, var(--white-a10) 35px, var(--white-a10) 70px);\n"])), function (_ref2) {
4059
+ var canvasHeight = _ref2.canvasHeight;
4059
4060
  return canvasHeight ? canvasHeight + "px" : "462px";
4060
- }, function (_ref4) {
4061
- var canvasWidth = _ref4.canvasWidth;
4061
+ }, function (_ref3) {
4062
+ var canvasWidth = _ref3.canvasWidth;
4062
4063
  return canvasWidth ? canvasWidth + "px" : "485px";
4063
4064
  });
4064
4065
  var HiddenImage = styled__default.img(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
4065
- var SelectedArea = styled__default.div(_templateObject8$b || (_templateObject8$b = _taggedTemplateLiteralLoose(["\n position: absolute;\n border: dashed 1px var(--black-a12);\n box-shadow: 0 0 0 9999em var(--black-a11);\n ", ";\n cursor: move;\n"])), function (_ref5) {
4066
- var cropLeft = _ref5.cropLeft,
4067
- cropTop = _ref5.cropTop,
4068
- cropWidth = _ref5.cropWidth,
4069
- cropHeight = _ref5.cropHeight;
4066
+ var SelectedArea = styled__default.div(_templateObject8$b || (_templateObject8$b = _taggedTemplateLiteralLoose(["\n position: absolute;\n border: dashed 1px var(--black-a12);\n box-shadow: 0 0 0 9999em var(--black-a11);\n ", ";\n cursor: move;\n"])), function (_ref4) {
4067
+ var cropLeft = _ref4.cropLeft,
4068
+ cropTop = _ref4.cropTop,
4069
+ cropWidth = _ref4.cropWidth,
4070
+ cropHeight = _ref4.cropHeight;
4070
4071
  return styled.css(_templateObject9$b || (_templateObject9$b = _taggedTemplateLiteralLoose(["\n top: ", "px;\n left: ", "px;\n width: ", "px;\n height: ", "px;\n "])), cropTop, cropLeft, cropWidth, cropHeight);
4071
4072
  });
4072
4073
  var viewDimensions = {
@@ -4084,30 +4085,30 @@ var viewDimensions = {
4084
4085
  isResizing: false
4085
4086
  };
4086
4087
 
4087
- var CropTool = function CropTool(_ref6) {
4088
- var _ref6$title = _ref6.title,
4089
- title = _ref6$title === void 0 ? 'Crop Image' : _ref6$title,
4090
- _ref6$cancelBtnTxt = _ref6.cancelBtnTxt,
4091
- cancelBtnTxt = _ref6$cancelBtnTxt === void 0 ? 'Cancel' : _ref6$cancelBtnTxt,
4092
- _ref6$cropBtnTxt = _ref6.cropBtnTxt,
4093
- cropBtnTxt = _ref6$cropBtnTxt === void 0 ? 'Crop & Save' : _ref6$cropBtnTxt,
4094
- _ref6$isResizable = _ref6.isResizable,
4095
- isResizable = _ref6$isResizable === void 0 ? true : _ref6$isResizable,
4096
- _ref6$cropHeight = _ref6.cropHeight,
4097
- cropHeight = _ref6$cropHeight === void 0 ? 300 : _ref6$cropHeight,
4098
- _ref6$cropWidth = _ref6.cropWidth,
4099
- cropWidth = _ref6$cropWidth === void 0 ? 350 : _ref6$cropWidth,
4100
- _ref6$canvasHeight = _ref6.canvasHeight,
4101
- canvasHeight = _ref6$canvasHeight === void 0 ? 400 : _ref6$canvasHeight,
4102
- _ref6$canvasWidth = _ref6.canvasWidth,
4103
- canvasWidth = _ref6$canvasWidth === void 0 ? 450 : _ref6$canvasWidth,
4104
- aspectRatio = _ref6.aspectRatio,
4105
- imgUrl = _ref6.imgUrl,
4106
- onCrop = _ref6.onCrop,
4107
- _ref6$onClose = _ref6.onClose,
4108
- onClose = _ref6$onClose === void 0 ? function () {} : _ref6$onClose,
4109
- _ref6$onError = _ref6.onError,
4110
- onError = _ref6$onError === void 0 ? function () {} : _ref6$onError;
4088
+ var CropTool = function CropTool(_ref5) {
4089
+ var _ref5$title = _ref5.title,
4090
+ title = _ref5$title === void 0 ? 'Crop Image' : _ref5$title,
4091
+ _ref5$cancelBtnTxt = _ref5.cancelBtnTxt,
4092
+ cancelBtnTxt = _ref5$cancelBtnTxt === void 0 ? 'Cancel' : _ref5$cancelBtnTxt,
4093
+ _ref5$cropBtnTxt = _ref5.cropBtnTxt,
4094
+ cropBtnTxt = _ref5$cropBtnTxt === void 0 ? 'Crop & Save' : _ref5$cropBtnTxt,
4095
+ _ref5$isResizable = _ref5.isResizable,
4096
+ isResizable = _ref5$isResizable === void 0 ? true : _ref5$isResizable,
4097
+ _ref5$cropHeight = _ref5.cropHeight,
4098
+ cropHeight = _ref5$cropHeight === void 0 ? 300 : _ref5$cropHeight,
4099
+ _ref5$cropWidth = _ref5.cropWidth,
4100
+ cropWidth = _ref5$cropWidth === void 0 ? 350 : _ref5$cropWidth,
4101
+ _ref5$canvasHeight = _ref5.canvasHeight,
4102
+ canvasHeight = _ref5$canvasHeight === void 0 ? 400 : _ref5$canvasHeight,
4103
+ _ref5$canvasWidth = _ref5.canvasWidth,
4104
+ canvasWidth = _ref5$canvasWidth === void 0 ? 450 : _ref5$canvasWidth,
4105
+ aspectRatio = _ref5.aspectRatio,
4106
+ imgUrl = _ref5.imgUrl,
4107
+ onCrop = _ref5.onCrop,
4108
+ _ref5$onClose = _ref5.onClose,
4109
+ onClose = _ref5$onClose === void 0 ? function () {} : _ref5$onClose,
4110
+ _ref5$onError = _ref5.onError,
4111
+ onError = _ref5$onError === void 0 ? function () {} : _ref5$onError;
4111
4112
 
4112
4113
  var _useState = React.useState(false),
4113
4114
  isLoading = _useState[0],
@@ -4240,9 +4241,9 @@ var CropTool = function CropTool(_ref6) {
4240
4241
  top = rect.top,
4241
4242
  width = rect.width,
4242
4243
  height = rect.height;
4243
- var _ref7 = [e.clientX, e.clientY],
4244
- posX = _ref7[0],
4245
- posY = _ref7[1];
4244
+ var _ref6 = [e.clientX, e.clientY],
4245
+ posX = _ref6[0],
4246
+ posY = _ref6[1];
4246
4247
  var newCursorStyle;
4247
4248
 
4248
4249
  if (!isResizable) {
@@ -4296,9 +4297,9 @@ var CropTool = function CropTool(_ref6) {
4296
4297
  return;
4297
4298
  }
4298
4299
 
4299
- var _ref8 = [e.clientX, e.clientY],
4300
- posX = _ref8[0],
4301
- posY = _ref8[1];
4300
+ var _ref7 = [e.clientX, e.clientY],
4301
+ posX = _ref7[0],
4302
+ posY = _ref7[1];
4302
4303
  var newDimensions = aspectRatio ? updateCropWithAspect(viewDimensions, posX, posY, aspectRatio) : updateCropValues(viewDimensions, posX, posY);
4303
4304
 
4304
4305
  if (!newDimensions.isUpdateRequired) {
@@ -4373,7 +4374,7 @@ var CropTool = function CropTool(_ref6) {
4373
4374
  })))))), document.body);
4374
4375
  };
4375
4376
 
4376
- var _templateObject$p, _templateObject2$o, _templateObject3$l, _templateObject4$i, _templateObject5$g, _templateObject6$d, _templateObject7$d, _templateObject8$c, _templateObject9$c;
4377
+ var _templateObject$r, _templateObject2$o, _templateObject3$l, _templateObject4$i, _templateObject5$g, _templateObject6$d, _templateObject7$d, _templateObject8$c, _templateObject9$c;
4377
4378
  var CROP_HEIGHT_AREA = 500;
4378
4379
  var CROP_WIDTH_AREA = 475;
4379
4380
  var CANVAS_HEIGHT = 490;
@@ -4381,7 +4382,7 @@ var CANVAS_WIDTH = 460;
4381
4382
  var ratio = Math.round(CROP_WIDTH_AREA / CROP_HEIGHT_AREA * 100) / 100;
4382
4383
  var PHOTO_HEIGHT = "150px";
4383
4384
  var PHOTO_WIDTH = "142px";
4384
- var Container$e = styled__default.div(_templateObject$p || (_templateObject$p = _taggedTemplateLiteralLoose(["\n position: relative;\n width: ", ";\n ", "\n button {\n width: 100%;\n }\n"])), PHOTO_WIDTH, function (_ref) {
4385
+ var Container$e = styled__default.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n position: relative;\n width: ", ";\n ", "\n button {\n width: 100%;\n }\n"])), PHOTO_WIDTH, function (_ref) {
4385
4386
  var theme = _ref.theme;
4386
4387
  return styled.css(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
4387
4388
  });
@@ -4543,8 +4544,8 @@ var AvatarUploader = function AvatarUploader(_ref2) {
4543
4544
 
4544
4545
  var _excluded$h = ["icons", "color", "size", "weight"];
4545
4546
 
4546
- var _templateObject$q, _templateObject2$p, _templateObject3$m;
4547
- var Container$f = styled__default.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-bottom: 27px;\n ", " {\n display: flex;\n align-items: center;\n }\n"])), IconWrapper);
4547
+ var _templateObject$s, _templateObject2$p, _templateObject3$m;
4548
+ var Container$f = styled__default.div(_templateObject$s || (_templateObject$s = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-bottom: 27px;\n ", " {\n display: flex;\n align-items: center;\n }\n"])), IconWrapper);
4548
4549
  var PlusIcon = styled__default(Icon)(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteralLoose([""])));
4549
4550
  var PlusIconWrapper = styled__default.div(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteralLoose(["\n margin: 0 30px;\n ", "{\n transform: rotate(45deg);\n [stroke]{\n stroke: var(--primary-7);\n }\n }\n"])), IconWrapper);
4550
4551
 
@@ -4574,8 +4575,8 @@ var BigIconsSummary = function BigIconsSummary(_ref) {
4574
4575
  }));
4575
4576
  };
4576
4577
 
4577
- var _templateObject$r, _templateObject2$q, _templateObject3$n, _templateObject4$j, _templateObject5$h, _templateObject6$e;
4578
- var Container$g = styled__default.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n"])), function (_ref) {
4578
+ var _templateObject$t, _templateObject2$q, _templateObject3$n, _templateObject4$j, _templateObject5$h, _templateObject6$e;
4579
+ var Container$g = styled__default.div(_templateObject$t || (_templateObject$t = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n"])), function (_ref) {
4579
4580
  var theme = _ref.theme;
4580
4581
  return theme.fontFamily.ui;
4581
4582
  });
@@ -4706,8 +4707,8 @@ var AreaUploadManager = function AreaUploadManager(_ref3) {
4706
4707
 
4707
4708
  var _excluded$i = ["children", "spacing"];
4708
4709
 
4709
- var _templateObject$s, _templateObject2$r;
4710
- var FormContainer = styled__default.form(_templateObject$s || (_templateObject$s = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
4710
+ var _templateObject$u, _templateObject2$r;
4711
+ var FormContainer = styled__default.form(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
4711
4712
  var spacing = _ref.spacing;
4712
4713
  return spacing && styled.css(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteralLoose(["\n & > ", " {\n margin-bottom: ", ";\n }\n "])), StyledLabel, spacing);
4713
4714
  });
@@ -4725,8 +4726,8 @@ var Form = function Form(_ref2) {
4725
4726
 
4726
4727
  var _excluded$j = ["text", "icon", "design", "noBorderTop", "textMaxWidth", "size", "onClickCallback", "closeCallback", "hasOnSelectLoading"];
4727
4728
 
4728
- var _templateObject$t, _templateObject2$s, _templateObject3$o, _templateObject4$k, _templateObject5$i, _templateObject6$f, _templateObject7$e, _templateObject8$d;
4729
- var StyledButton$3 = styled__default.button(_templateObject$t || (_templateObject$t = _taggedTemplateLiteralLoose(["\n ", "\n ", ";\n\n color: var(--text-color);\n height: var(--button-height);\n display: flex;\n flex: 1 0 0;\n align-items: center;\n align-self: stretch;\n\n &:hover:enabled {\n background: var(--button-hover-bg);\n\n ", " {\n svg g, svg path {\n stroke: var(--white-a12);\n }\n }\n }\n\n &:active:enabled {\n background: var(--button-active-bg);\n\n ", ";\n\n ", " {\n svg g, svg path {\n stroke: var(--white-a12);\n }\n }\n }\n\n &:disabled {\n color: var(--text-disabled-color);\n cursor: not-allowed;\n }\n"])), resetButtonStyles, function (_ref) {
4729
+ var _templateObject$v, _templateObject2$s, _templateObject3$o, _templateObject4$k, _templateObject5$i, _templateObject6$f, _templateObject7$e, _templateObject8$d;
4730
+ var StyledButton$3 = styled__default.button(_templateObject$v || (_templateObject$v = _taggedTemplateLiteralLoose(["\n ", "\n ", ";\n\n color: var(--text-color);\n height: var(--button-height);\n display: flex;\n flex: 1 0 0;\n align-items: center;\n align-self: stretch;\n\n &:hover:enabled {\n background: var(--button-hover-bg);\n\n ", " {\n svg g, svg path {\n stroke: var(--white-a12);\n }\n }\n }\n\n &:active:enabled {\n background: var(--button-active-bg);\n\n ", ";\n\n ", " {\n svg g, svg path {\n stroke: var(--white-a12);\n }\n }\n }\n\n &:disabled {\n color: var(--text-disabled-color);\n cursor: not-allowed;\n }\n"])), resetButtonStyles, function (_ref) {
4730
4731
  var noBorderTop = _ref.noBorderTop;
4731
4732
  return noBorderTop ? "border-top: none" : styled.css(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n border-top: 1px solid var(--border-color)"])));
4732
4733
  }, IconWrapper, function (_ref2) {
@@ -4908,8 +4909,8 @@ function useClickOutside(elRef, elCallback) {
4908
4909
  }, [elCallback, elRef]);
4909
4910
  }
4910
4911
 
4911
- var _templateObject$u, _templateObject2$t, _templateObject3$p, _templateObject4$l, _templateObject5$j, _templateObject6$g, _templateObject7$f;
4912
- var Container$h = styled__default.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--grey-3);\n -webkit-backdrop-filter: blur(5px);\n backdrop-filter: blur(5px);\n z-index: 999;\n ", "\n\n font-family: ", ";\n ", ";\n"])), function (_ref) {
4912
+ var _templateObject$w, _templateObject2$t, _templateObject3$p, _templateObject4$l, _templateObject5$j, _templateObject6$g, _templateObject7$f;
4913
+ var Container$h = styled__default.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--grey-3);\n -webkit-backdrop-filter: blur(5px);\n backdrop-filter: blur(5px);\n z-index: 999;\n ", "\n\n font-family: ", ";\n ", ";\n"])), function (_ref) {
4913
4914
  var theme = _ref.theme;
4914
4915
  return theme && styled.css(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteralLoose([""])));
4915
4916
  }, function (_ref2) {
@@ -4920,42 +4921,39 @@ var Container$h = styled__default.div(_templateObject$u || (_templateObject$u =
4920
4921
  return theme.styles.modal.overlay;
4921
4922
  });
4922
4923
  var CloseIcon = styled__default(Icon)(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose([""])));
4923
- var CloseButton = styled__default.button(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n right: 0;\n top: -30px;\n color: ", ";\n font-size: 14px;\n font-weight: 500;\n\n ", " {\n display: flex;\n margin-left: 12px;\n }\n ", "\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n opacity: .9;\n }\n &:disabled {\n opacity: 0.1;\n }\n"])), resetButtonStyles, function (_ref4) {
4924
- var theme = _ref4.theme;
4925
- return theme.colors.icons.mono;
4926
- }, IconWrapper, function (_ref5) {
4927
- var _ref5$selected = _ref5.selected,
4928
- selected = _ref5$selected === void 0 ? false : _ref5$selected;
4924
+ var CloseButton = styled__default.button(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n justify-content: center;\n position: absolute;\n right: 0;\n top: -30px;\n color: var(--mono);\n font-size: 14px;\n font-weight: 500;\n\n ", " {\n display: flex;\n margin-left: 12px;\n }\n ", "\n &:focus {\n outline: none;\n }\n\n &:hover:enabled {\n ", "\n }\n\n &:active:enabled {\n opacity: .9;\n }\n &:disabled {\n opacity: 0.1;\n }\n"])), resetButtonStyles, IconWrapper, function (_ref4) {
4925
+ var _ref4$selected = _ref4.selected,
4926
+ selected = _ref4$selected === void 0 ? false : _ref4$selected;
4929
4927
  return selected && styled.css(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteralLoose(["\n border-bottom: 5px solid var(--primary-7);\n "])));
4930
- }, function (_ref6) {
4931
- var theme = _ref6.theme;
4928
+ }, function (_ref5) {
4929
+ var theme = _ref5.theme;
4932
4930
  return theme && styled.css(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteralLoose(["\n opacity: .8;\n transition: transform ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.primary.inOut);
4933
4931
  });
4934
- var LightBox = styled__default.div(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteralLoose(["\n position: relative;\n margin: 27px 0 0;\n z-index: 9999;\n width: ", ";\n padding: ", ";\n border-radius: 5px;\n ", ";\n"])), function (_ref7) {
4935
- var width = _ref7.width;
4932
+ var LightBox = styled__default.div(_templateObject7$f || (_templateObject7$f = _taggedTemplateLiteralLoose(["\n position: relative;\n margin: 27px 0 0;\n z-index: 9999;\n width: ", ";\n padding: ", ";\n border-radius: 5px;\n ", ";\n"])), function (_ref6) {
4933
+ var width = _ref6.width;
4936
4934
  return width ? width : "580px";
4937
- }, function (_ref8) {
4938
- var padding = _ref8.padding;
4935
+ }, function (_ref7) {
4936
+ var padding = _ref7.padding;
4939
4937
  return padding ? "30px 40px" : "0";
4940
- }, function (_ref9) {
4941
- var theme = _ref9.theme;
4938
+ }, function (_ref8) {
4939
+ var theme = _ref8.theme;
4942
4940
  return theme.styles.modal.container;
4943
4941
  });
4944
4942
 
4945
- var Modal = function Modal(_ref10) {
4946
- var _ref10$isOpen = _ref10.isOpen,
4947
- isOpen = _ref10$isOpen === void 0 ? false : _ref10$isOpen,
4948
- _ref10$isCloseEnable = _ref10.isCloseEnable,
4949
- isCloseEnable = _ref10$isCloseEnable === void 0 ? true : _ref10$isCloseEnable,
4950
- _ref10$closeText = _ref10.closeText,
4951
- closeText = _ref10$closeText === void 0 ? '' : _ref10$closeText,
4952
- _ref10$width = _ref10.width,
4953
- width = _ref10$width === void 0 ? '' : _ref10$width,
4954
- _ref10$padding = _ref10.padding,
4955
- padding = _ref10$padding === void 0 ? true : _ref10$padding,
4956
- customComponent = _ref10.customComponent,
4957
- onDismiss = _ref10.onDismiss,
4958
- dismissCallback = _ref10.dismissCallback;
4943
+ var Modal = function Modal(_ref9) {
4944
+ var _ref9$isOpen = _ref9.isOpen,
4945
+ isOpen = _ref9$isOpen === void 0 ? false : _ref9$isOpen,
4946
+ _ref9$isCloseEnable = _ref9.isCloseEnable,
4947
+ isCloseEnable = _ref9$isCloseEnable === void 0 ? true : _ref9$isCloseEnable,
4948
+ _ref9$closeText = _ref9.closeText,
4949
+ closeText = _ref9$closeText === void 0 ? '' : _ref9$closeText,
4950
+ _ref9$width = _ref9.width,
4951
+ width = _ref9$width === void 0 ? '' : _ref9$width,
4952
+ _ref9$padding = _ref9.padding,
4953
+ padding = _ref9$padding === void 0 ? true : _ref9$padding,
4954
+ customComponent = _ref9.customComponent,
4955
+ onDismiss = _ref9.onDismiss,
4956
+ dismissCallback = _ref9.dismissCallback;
4959
4957
  var lightBoxRef = React.useRef(null);
4960
4958
 
4961
4959
  var onClickOutside = function onClickOutside() {
@@ -5315,8 +5313,8 @@ function SvgNoImageBig(props) {
5315
5313
 
5316
5314
  var _excluded$k = ["loop", "autoPlay", "controls", "muted"];
5317
5315
 
5318
- var _templateObject$v, _templateObject2$u, _templateObject3$q, _templateObject4$m, _templateObject5$k, _templateObject6$h, _templateObject7$g, _templateObject8$e;
5319
- var MediaBoxWrapper = styled__default.div(_templateObject$v || (_templateObject$v = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n ", ";\n ", ";\n"])), function (_ref) {
5316
+ var _templateObject$x, _templateObject2$u, _templateObject3$q, _templateObject4$m, _templateObject5$k, _templateObject6$h, _templateObject7$g, _templateObject8$e;
5317
+ var MediaBoxWrapper = styled__default.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n ", ";\n ", ";\n"])), function (_ref) {
5320
5318
  var minHeight = _ref.minHeight;
5321
5319
  return minHeight && "min-height: " + minHeight;
5322
5320
  }, function (_ref2) {
@@ -5619,9 +5617,9 @@ var _excluded$l = ["mainButtonId", "buttonList", "design", "size", "textMaxWidth
5619
5617
  _excluded2 = ["id", "text", "icon", "disabled"],
5620
5618
  _excluded3 = ["id", "text", "icon", "disabled"];
5621
5619
 
5622
- var _templateObject$w, _templateObject2$v, _templateObject3$r;
5620
+ var _templateObject$y, _templateObject2$v, _templateObject3$r;
5623
5621
  var TOGGLE_ICON_WIDTH = 20;
5624
- var Container$i = styled__default.div(_templateObject$w || (_templateObject$w = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n position: relative;\n display: inline-flex;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 3px;\n border: 1px solid var(--border);\n background: linear-gradient(135deg, var(--gradient-1) 0%, var(--gradient-2) 100%);\n box-shadow: var(--button-lift-default-x, 0px) var(--button-lift-default-y, 2px) var(--button-lift-default-blur, 4px) var(--button-lift-default-spread, 2px) var(--button-lift-default-color, rgba(221, 234, 248, 0.08));\n"])));
5622
+ var Container$i = styled__default.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n position: relative;\n display: inline-flex;\n flex-direction: column;\n justify-content: center;\n align-items: flex-start;\n border-radius: 3px;\n border: 1px solid var(--border);\n background: linear-gradient(135deg, var(--gradient-1) 0%, var(--gradient-2) 100%);\n box-shadow: var(--button-lift-default-x, 0px) var(--button-lift-default-y, 2px) var(--button-lift-default-blur, 4px) var(--button-lift-default-spread, 2px) var(--button-lift-default-color, rgba(221, 234, 248, 0.08));\n"])));
5625
5623
  var MainButtonWrapper = styled__default.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n flex-shrink: 0;\n align-self: stretch;\n"])));
5626
5624
  var ToggleIcon = styled__default.button(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteralLoose(["\n ", "\n display: flex;\n height: var(--button-height);\n padding: 3px var(--button-icon-h-padding);\n justify-content: space-between;\n align-items: center;\n flex-shrink: 0;\n border-left: 1px solid var(--toggle-icon-border);\n cursor: pointer;\n\n ", " {\n svg {\n display: flex;\n justify-content: center;\n align-items: center;\n path, g {\n stroke: var(--toggle-icon);\n }\n }\n }\n\n &:hover:enabled {\n background: var(--toggle-icon-hover-bg);\n }\n\n &:active:enabled {\n background: var(--toggle-icon-active-bg);\n ", " {\n svg path, svg g {\n stroke: var(--toggle-icon-active);\n }\n }\n }\n\n &:disabled {\n cursor: not-allowed;\n\n ", " {\n svg path {\n stroke: var(--toggle-icon-disabled);\n }\n }\n }\n\n"])), resetButtonStyles, IconWrapper, IconWrapper, IconWrapper);
5627
5625
 
@@ -5715,8 +5713,8 @@ var SplitButton = function SplitButton(_ref) {
5715
5713
  })) : null);
5716
5714
  };
5717
5715
 
5718
- var _templateObject$x, _templateObject2$w, _templateObject3$s, _templateObject4$n, _templateObject5$l, _templateObject6$i, _templateObject7$h, _templateObject8$f;
5719
- var Container$j = styled__default.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n\n ", "\n"])), function (_ref) {
5716
+ var _templateObject$z, _templateObject2$w, _templateObject3$s, _templateObject4$n, _templateObject5$l, _templateObject6$i, _templateObject7$h, _templateObject8$f;
5717
+ var Container$j = styled__default.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n\n ", "\n"])), function (_ref) {
5720
5718
  var hide = _ref.hide;
5721
5719
  return hide && styled.css(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n display: none;\n "])));
5722
5720
  });
@@ -5918,7 +5916,7 @@ var DateTimeBlock = function DateTimeBlock(_ref6) {
5918
5916
  })))));
5919
5917
  };
5920
5918
 
5921
- var _templateObject$y, _templateObject2$x, _templateObject3$t, _templateObject4$o, _templateObject5$m, _templateObject6$j, _templateObject7$i, _templateObject8$g, _templateObject9$d, _templateObject10$b, _templateObject11$7, _templateObject12$5, _templateObject13$4, _templateObject14$2, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23;
5919
+ var _templateObject$A, _templateObject2$x, _templateObject3$t, _templateObject4$o, _templateObject5$m, _templateObject6$j, _templateObject7$i, _templateObject8$g, _templateObject9$d, _templateObject10$b, _templateObject11$7, _templateObject12$5, _templateObject13$4, _templateObject14$2, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23;
5922
5920
 
5923
5921
  var initializeInterval = function initializeInterval(day) {
5924
5922
  return {
@@ -5932,7 +5930,7 @@ var initializeInterval = function initializeInterval(day) {
5932
5930
 
5933
5931
  var TODAY = new Date();
5934
5932
  var TODAY_INTERVAL = initializeInterval(dateFns.startOfDay(new Date()));
5935
- var Container$k = styled__default.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
5933
+ var Container$k = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
5936
5934
  var DateTimeArea = styled__default.div(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteralLoose(["\n border-right: var(--grey-6) 1px solid;\n width: 170px;\n display: flex;\n flex-direction: column;\n"])));
5937
5935
  var TimeZoneOption = styled__default.div(_templateObject3$t || (_templateObject3$t = _taggedTemplateLiteralLoose(["\n border-top: var(--grey-6) 1px solid;\n margin-top: auto;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px;\n box-sizing: border-box;\n"])));
5938
5936
  var TimeZoneLabel = styled__default.div(_templateObject4$o || (_templateObject4$o = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n text-align: left;\n font-size: 12px;\n font-weight: 300;\n color: var(--grey-11);\n"])), fontFamily.ui);
@@ -6235,8 +6233,8 @@ var getInitialValue = function getInitialValue(hasEmptyValue, initialValue) {
6235
6233
 
6236
6234
  var _excluded$m = ["children"];
6237
6235
 
6238
- var _templateObject$z, _templateObject2$y;
6239
- var Container$l = styled__default.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n box-shadow: 0px 5px 25px 0px var(--primary-a1);\n background-color: var(--grey-1);\n border: var(--grey-6) 1px solid;\n border-radius: 3px;\n position: relative;\n display: inline-flex;\n overflow: hidden;\n padding-top: 5px;\n\n &::before {\n background-color: var(--primary-7);\n content: '';\n\n display: block;\n height: 5px;\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n }\n\n"])));
6236
+ var _templateObject$B, _templateObject2$y;
6237
+ var Container$l = styled__default.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteralLoose(["\n box-shadow: 0px 5px 25px 0px var(--primary-a1);\n background-color: var(--grey-1);\n border: var(--grey-6) 1px solid;\n border-radius: 3px;\n position: relative;\n display: inline-flex;\n overflow: hidden;\n padding-top: 5px;\n\n &::before {\n background-color: var(--primary-7);\n content: '';\n\n display: block;\n height: 5px;\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n }\n\n"])));
6240
6238
  var Inner = styled__default.div(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n"])));
6241
6239
 
6242
6240
  var FilterDropdownContainer = function FilterDropdownContainer(_ref) {
@@ -6248,8 +6246,8 @@ var FilterDropdownContainer = function FilterDropdownContainer(_ref) {
6248
6246
 
6249
6247
  var _excluded$n = ["icon", "hasFlipArrow", "isSortAscending", "isOpen", "children"];
6250
6248
 
6251
- var _templateObject$A, _templateObject2$z, _templateObject3$u, _templateObject4$p, _templateObject5$n, _templateObject6$k, _templateObject7$j;
6252
- var FlipWrapper = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
6249
+ var _templateObject$C, _templateObject2$z, _templateObject3$u, _templateObject4$p, _templateObject5$n, _templateObject6$k, _templateObject7$j;
6250
+ var FlipWrapper = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
6253
6251
  var isSortAscending = _ref.isSortAscending;
6254
6252
  return isSortAscending && styled.css(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteralLoose(["\n transform: scaleY(-1);\n "])));
6255
6253
  });
@@ -6298,37 +6296,34 @@ var FilterButton = function FilterButton(_ref5) {
6298
6296
 
6299
6297
  var _excluded$o = ["title", "value", "optionType", "selected", "disabled", "onClick"];
6300
6298
 
6301
- var _templateObject$B, _templateObject2$A, _templateObject3$v, _templateObject4$q, _templateObject5$o, _templateObject6$l, _templateObject7$k, _templateObject8$h, _templateObject9$e, _templateObject10$c;
6302
- var Title$1 = styled__default.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n display: block;\n color: var(--grey-9);\n font-size: 14px;\n font-weight: 500;\n margin-left: 12px;\n user-select: none;\n pointer-events: none;\n"])), function (_ref) {
6299
+ var _templateObject$D, _templateObject2$A, _templateObject3$v, _templateObject4$q, _templateObject5$o, _templateObject6$l, _templateObject7$k, _templateObject8$h, _templateObject9$e, _templateObject10$c;
6300
+ var Title$1 = styled__default.div(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n display: block;\n color: var(--grey-9);\n font-size: 14px;\n font-weight: 500;\n margin-left: 12px;\n user-select: none;\n pointer-events: none;\n"])), function (_ref) {
6303
6301
  var theme = _ref.theme;
6304
6302
  return theme.fontFamily.data;
6305
6303
  });
6306
6304
  var FakeCheckbox = styled__default.div(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteralLoose(["\n box-sizing: border-box;\n position: relative;\n width: 18px;\n height: 18px;\n border-radius: 5px;\n border-width: 2px;\n border-style: solid;\n"])));
6307
6305
  var FakeCheckboxInner = styled__default.div(_templateObject3$v || (_templateObject3$v = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n box-sizing: border-box;\n"])));
6308
- var CheckMarkWrapper = styled__default.div(_templateObject4$q || (_templateObject4$q = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n display: block;\n [stroke]{\n stroke: transparent;\n }\n [fill] {\n fill: ", ";\n }\n }\n"])), function (_ref2) {
6309
- var theme = _ref2.theme;
6310
- return theme.colors.icons.inverse;
6311
- });
6306
+ var CheckMarkWrapper = styled__default.div(_templateObject4$q || (_templateObject4$q = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n svg {\n display: block;\n [stroke]{\n stroke: transparent;\n }\n [fill] {\n fill: var(--inverse);\n }\n }\n"])));
6312
6307
  var FakeRadioButton = styled__default.div(_templateObject5$o || (_templateObject5$o = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-block;\n width: 18px;\n height: 18px;\n user-select: none;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n border-width: 2px;\n border-style: solid;\n"])));
6313
6308
  var FakeInnerRadio = styled__default.div(_templateObject6$l || (_templateObject6$l = _taggedTemplateLiteralLoose(["\n width: 10px;\n height: 10px;\n border-radius: 50%;\n user-select: none;\n"])));
6314
- var Container$m = styled__default.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (_ref3) {
6315
- var styles = _ref3.theme.styles,
6316
- selected = _ref3.selected,
6317
- disabled = _ref3.disabled;
6309
+ var Container$m = styled__default.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (_ref2) {
6310
+ var styles = _ref2.theme.styles,
6311
+ selected = _ref2.selected,
6312
+ disabled = _ref2.disabled;
6318
6313
  return styles && styled.css(_templateObject8$h || (_templateObject8$h = _taggedTemplateLiteralLoose(["\n ", ", ", " {\n ", ";\n }\n\n &:hover {\n cursor: pointer;\n ", " {\n color: ", ";\n }\n\n ", " {\n ", ";\n }\n\n ", " {\n border-color: ", ";\n }\n }\n\n ", ";\n\n ", ";\n "])), FakeCheckbox, FakeRadioButton, styles.form.checkbox.unchecked["default"], Title$1, styles.form.checkbox.unchecked.hover.borderColor, FakeCheckbox, styles.form.checkbox.unchecked.hover, FakeRadioButton, styles.form.checkbox.unchecked.hover.borderColor, selected && styled.css(_templateObject9$e || (_templateObject9$e = _taggedTemplateLiteralLoose(["\n ", " {\n color: ", ";\n }\n ", " {\n ", ";\n border: none;\n }\n\n ", " {\n border-color: ", ";\n ", " {\n background-color: ", ";\n }\n }\n\n &:hover {\n ", "{\n ", ";\n }\n\n ", " {\n border-color: ", ";\n ", " {\n background-color: ", ";\n }\n }\n }\n "])), Title$1, styles.form.checkbox.checked["default"].backgroundColor, FakeCheckbox, styles.form.checkbox.checked["default"], FakeRadioButton, styles.form.checkbox.checked["default"].backgroundColor, FakeInnerRadio, styles.form.checkbox.checked["default"].backgroundColor, FakeCheckbox, styles.form.checkbox.checked.hover, FakeRadioButton, styles.form.checkbox.checked.hover.backgroundColor, FakeInnerRadio, styles.form.checkbox.checked.hover.backgroundColor), disabled && styled.css(_templateObject10$c || (_templateObject10$c = _taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n "]))));
6319
6314
  });
6320
6315
 
6321
- var FilterOption = function FilterOption(_ref4) {
6322
- var title = _ref4.title,
6323
- _ref4$optionType = _ref4.optionType,
6324
- optionType = _ref4$optionType === void 0 ? "text" : _ref4$optionType,
6325
- _ref4$selected = _ref4.selected,
6326
- selected = _ref4$selected === void 0 ? false : _ref4$selected,
6327
- _ref4$disabled = _ref4.disabled,
6328
- disabled = _ref4$disabled === void 0 ? false : _ref4$disabled,
6329
- _ref4$onClick = _ref4.onClick,
6330
- onClick = _ref4$onClick === void 0 ? function () {} : _ref4$onClick,
6331
- props = _objectWithoutPropertiesLoose(_ref4, _excluded$o);
6316
+ var FilterOption = function FilterOption(_ref3) {
6317
+ var title = _ref3.title,
6318
+ _ref3$optionType = _ref3.optionType,
6319
+ optionType = _ref3$optionType === void 0 ? "text" : _ref3$optionType,
6320
+ _ref3$selected = _ref3.selected,
6321
+ selected = _ref3$selected === void 0 ? false : _ref3$selected,
6322
+ _ref3$disabled = _ref3.disabled,
6323
+ disabled = _ref3$disabled === void 0 ? false : _ref3$disabled,
6324
+ _ref3$onClick = _ref3.onClick,
6325
+ onClick = _ref3$onClick === void 0 ? function () {} : _ref3$onClick,
6326
+ props = _objectWithoutPropertiesLoose(_ref3, _excluded$o);
6332
6327
 
6333
6328
  var iconWeight = dimensions.icons.weights['regular'];
6334
6329
  return React__default.createElement(Container$m, Object.assign({}, {
@@ -6345,8 +6340,8 @@ var FilterOption = function FilterOption(_ref4) {
6345
6340
 
6346
6341
  var _excluded$p = ["color", "hasBorder", "iconSize", "disabled", "noBackground", "hasCrossButton", "onCrossClick", "width"];
6347
6342
 
6348
- var _templateObject$C, _templateObject2$B, _templateObject3$w, _templateObject4$r, _templateObject5$p, _templateObject6$m, _templateObject7$l, _templateObject8$i;
6349
- var Container$n = styled__default.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", " {\n flex-shrink: 0;\n display: flex;\n }\n\n height: 30px;\n padding: 0 0 0 8px;\n align-items: center;\n display: flex;\n border-radius: 3px;\n"])), function (_ref) {
6343
+ var _templateObject$E, _templateObject2$B, _templateObject3$w, _templateObject4$r, _templateObject5$p, _templateObject6$m, _templateObject7$l, _templateObject8$i;
6344
+ var Container$n = styled__default.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", " {\n flex-shrink: 0;\n display: flex;\n }\n\n height: 30px;\n padding: 0 0 0 8px;\n align-items: center;\n display: flex;\n border-radius: 3px;\n"])), function (_ref) {
6350
6345
  var styles = _ref.theme.styles,
6351
6346
  theme = _ref.theme,
6352
6347
  hasBorder = _ref.hasBorder,
@@ -6357,12 +6352,10 @@ var Container$n = styled__default.div(_templateObject$C || (_templateObject$C =
6357
6352
  }, IconWrapper);
6358
6353
  var CrossButton = styled__default.button(_templateObject6$m || (_templateObject6$m = _taggedTemplateLiteralLoose(["\n ", ";\n flex-shrink: 0;\n flex-grow: 0;\n flex-basis: auto;\n width: 26px;\n\n ", " {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n"])), resetButtonStyles, IconWrapper);
6359
6354
  var StyledInput$2 = styled__default.input(_templateObject7$l || (_templateObject7$l = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", ";\n\n &:disabled {\n cursor: not-allowed;\n }\n\n font-size: 12px;\n border: none;\n height: 100%;\n width: 100%;\n background-color: transparent;\n box-sizing: border-box;\n border-radius: 3px;\n outline: none;\n margin-left: 7px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n"])), removeAutoFillStyle, function (_ref2) {
6360
- var _ref2$theme = _ref2.theme,
6361
- typography = _ref2$theme.typography,
6362
- colors = _ref2$theme.colors,
6355
+ var typography = _ref2.theme.typography,
6363
6356
  theme = _ref2.theme,
6364
6357
  color = _ref2.color;
6365
- return styled.css(_templateObject8$i || (_templateObject8$i = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n\n &::placeholder {\n ", ";\n color: ", ";\n font-size: 12px;\n }\n "])), theme.fontFamily.ui, typography.filters.searchInput.value, typography.filters.searchInput.placeholder, colors.icons[color]);
6358
+ return styled.css(_templateObject8$i || (_templateObject8$i = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n\n &::placeholder {\n ", ";\n color: var(--", ");\n font-size: 12px;\n }\n "])), theme.fontFamily.ui, typography.filters.searchInput.value, typography.filters.searchInput.placeholder, color);
6366
6359
  });
6367
6360
 
6368
6361
  var BasicSearchInput = function BasicSearchInput(_ref3) {
@@ -6424,8 +6417,8 @@ var isFilterItem = function isFilterItem(item) {
6424
6417
 
6425
6418
  var _excluded$q = ["buttonIcon", "buttonText", "disabled", "minWidth", "minHeight", "isSortAscending", "children", "onToggleOpenCallback", "onCloseCallback"];
6426
6419
 
6427
- var _templateObject$D, _templateObject2$C, _templateObject3$x, _templateObject4$s;
6428
- var Container$o = styled__default.div(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
6420
+ var _templateObject$F, _templateObject2$C, _templateObject3$x, _templateObject4$s;
6421
+ var Container$o = styled__default.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
6429
6422
  var ButtonWrapper = styled__default.div(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteralLoose(["\n display: inline-block;\n"])));
6430
6423
  var ContentBox = styled__default.div(_templateObject3$x || (_templateObject3$x = _taggedTemplateLiteralLoose(["\n z-index: 100;\n min-width: ", "px;\n position: absolute;\n\n ", ";\n"])), function (_ref) {
6431
6424
  var minWidth = _ref.minWidth;
@@ -6539,8 +6532,8 @@ var FilterDropHandler = function FilterDropHandler(_ref3) {
6539
6532
  }), children));
6540
6533
  };
6541
6534
 
6542
- var _templateObject$E, _templateObject2$D;
6543
- var Container$p = styled__default.div(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 146px;\n border-top: 1px solid var(--grey-5);\n"])));
6535
+ var _templateObject$G, _templateObject2$D;
6536
+ var Container$p = styled__default.div(_templateObject$G || (_templateObject$G = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n min-height: 146px;\n border-top: 1px solid var(--grey-5);\n"])));
6544
6537
  var LoadingText = styled__default.div(_templateObject2$D || (_templateObject2$D = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-11);\n font-size: 12px;\n font-style: italic;\n padding: 15px 0;\n"])), fontFamily.data);
6545
6538
 
6546
6539
  var LoadingBox = function LoadingBox(_ref) {
@@ -6553,8 +6546,8 @@ var LoadingBox = function LoadingBox(_ref) {
6553
6546
 
6554
6547
  var _excluded$r = ["buttonIcon", "buttonText", "list", "selected", "disabled", "isLoading", "loadingText", "optionType", "hasOptionsFilter", "searchPlaceholder", "maxDisplayedItems", "searchResultText", "emptyResultText", "onSelect"];
6555
6548
 
6556
- var _templateObject$F, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$q, _templateObject6$n, _templateObject7$m, _templateObject8$j, _templateObject9$f, _templateObject10$d;
6557
- var Container$q = styled__default.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
6549
+ var _templateObject$H, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$q, _templateObject6$n, _templateObject7$m, _templateObject8$j, _templateObject9$f, _templateObject10$d;
6550
+ var Container$q = styled__default.div(_templateObject$H || (_templateObject$H = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
6558
6551
  var TopLine$1 = styled__default.div(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteralLoose(["\n background-color: var(--primary-7);\n height: 3px;\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n"])));
6559
6552
  var InnerBox = styled__default.div(_templateObject3$y || (_templateObject3$y = _taggedTemplateLiteralLoose(["\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n box-shadow: 0 4px 9px 0 var(--grey-a2);\n border-right: solid 1px var(--grey-7);\n border-bottom: solid 1px var(--grey-7);\n border-left: solid 1px var(--grey-7);\n background-color: var(--grey-2);\n"])));
6560
6553
  var StyledFilterOption = styled__default(FilterOption)(_templateObject4$t || (_templateObject4$t = _taggedTemplateLiteralLoose(["\n letter-spacing: 0.2px;\n"])));
@@ -6800,8 +6793,8 @@ var FilterDropdown = function FilterDropdown(_ref2) {
6800
6793
 
6801
6794
  var _excluded$s = ["buttonText", "disabled", "list", "isLoading", "loadingText", "isSortAscending", "selected", "descendingText", "ascendingText", "onSelect"];
6802
6795
 
6803
- var _templateObject$G, _templateObject2$F, _templateObject3$z, _templateObject4$u, _templateObject5$r, _templateObject6$o, _templateObject7$n, _templateObject8$k, _templateObject9$g;
6804
- var Container$r = styled__default.div(_templateObject$G || (_templateObject$G = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
6796
+ var _templateObject$I, _templateObject2$F, _templateObject3$z, _templateObject4$u, _templateObject5$r, _templateObject6$o, _templateObject7$n, _templateObject8$k, _templateObject9$g;
6797
+ var Container$r = styled__default.div(_templateObject$I || (_templateObject$I = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
6805
6798
  var TopLine$2 = styled__default.div(_templateObject2$F || (_templateObject2$F = _taggedTemplateLiteralLoose(["\n background-color: var(--primary-7);\n height: 3px;\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n"])));
6806
6799
  var InnerBox$1 = styled__default.div(_templateObject3$z || (_templateObject3$z = _taggedTemplateLiteralLoose(["\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n border-top: unset;\n box-shadow: 0px 5px 25px 0px var(--primary-a1);\n background-color: var(--grey-1);\n border-color: var(--grey-6);\n border: var(--grey-6) 1px solid;\n"])));
6807
6800
  var StyledFilterOption$1 = styled__default(FilterOption)(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteralLoose(["\n letter-spacing: 0.2px;\n"])));
@@ -6887,8 +6880,8 @@ var SortDropdown = function SortDropdown(_ref2) {
6887
6880
  }))))));
6888
6881
  };
6889
6882
 
6890
- var _templateObject$H, _templateObject2$G, _templateObject3$A, _templateObject4$v, _templateObject5$s, _templateObject6$p, _templateObject7$o, _templateObject8$l, _templateObject9$h, _templateObject10$e, _templateObject11$8, _templateObject12$6, _templateObject13$5, _templateObject14$3, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$2, _templateObject21$2, _templateObject22$2, _templateObject23$1;
6891
- var Container$s = styled__default.div(_templateObject$H || (_templateObject$H = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
6883
+ var _templateObject$J, _templateObject2$G, _templateObject3$A, _templateObject4$v, _templateObject5$s, _templateObject6$p, _templateObject7$o, _templateObject8$l, _templateObject9$h, _templateObject10$e, _templateObject11$8, _templateObject12$6, _templateObject13$5, _templateObject14$3, _templateObject15$2, _templateObject16$2, _templateObject17$2, _templateObject18$2, _templateObject19$2, _templateObject20$2, _templateObject21$2, _templateObject22$2, _templateObject23$1;
6884
+ var Container$s = styled__default.div(_templateObject$J || (_templateObject$J = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
6892
6885
  var ContextActionBaseCSS = styled.css(_templateObject2$G || (_templateObject2$G = _taggedTemplateLiteralLoose(["\n -webkit-tap-highlight-color: transparent;\n border: none;\n background: none;\n display: flex;\n justify-content:left;\n align-items:center;\n flex-wrap: wrap;\n cursor: pointer;\n outline: none;\n text-decoration: none;\n padding: 0;\n"])));
6893
6886
  var ContextIcon = styled__default.div(_templateObject3$A || (_templateObject3$A = _taggedTemplateLiteralLoose(["\n ", ";\n width: 30px;\n height: 30px;\n border-radius: 3px;\n display:flex;\n justify-content:center;\n align-items:center;\n svg {\n display: block;\n }\n"])), function (_ref) {
6894
6887
  var theme = _ref.theme;
@@ -7075,10 +7068,10 @@ var FilterLayout = function FilterLayout(_ref6) {
7075
7068
 
7076
7069
  var _excluded$t = ["buttonIcon", "buttonText", "disabled", "initialValue", "dateMode", "timeMode", "selected", "dateTimeTextUpper", "dateTimeTextLower", "timeZoneTitle", "timeZoneValueTitle", "lang", "onCloseCallback", "onUpdateCallback", "onToggleCallback"];
7077
7070
 
7078
- var _templateObject$I;
7071
+ var _templateObject$K;
7079
7072
  var MIN_WIDTH = 470;
7080
7073
  var MIN_HEIGHT = 360;
7081
- var Container$t = styled__default.div(_templateObject$I || (_templateObject$I = _taggedTemplateLiteralLoose([""])));
7074
+ var Container$t = styled__default.div(_templateObject$K || (_templateObject$K = _taggedTemplateLiteralLoose([""])));
7082
7075
 
7083
7076
  var DropdownDatePicker = function DropdownDatePicker(_ref) {
7084
7077
  var buttonIcon = _ref.buttonIcon,
@@ -7172,8 +7165,8 @@ var DropdownDatePicker = function DropdownDatePicker(_ref) {
7172
7165
 
7173
7166
  var _excluded$u = ["hasShowMore", "searchFilters", "datePickerFilters", "dropdownFilters", "showMoreText", "showLessText"];
7174
7167
 
7175
- var _templateObject$J, _templateObject2$H, _templateObject3$B, _templateObject4$w, _templateObject5$t, _templateObject6$q, _templateObject7$p, _templateObject8$m;
7176
- var fadeInAnimation = styled.keyframes(_templateObject$J || (_templateObject$J = _taggedTemplateLiteralLoose(["\n 0% {\n width: 50%;\n opacity: .5;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n width: 100%;\n }\n"])));
7168
+ var _templateObject$L, _templateObject2$H, _templateObject3$B, _templateObject4$w, _templateObject5$t, _templateObject6$q, _templateObject7$p, _templateObject8$m;
7169
+ var fadeInAnimation = styled.keyframes(_templateObject$L || (_templateObject$L = _taggedTemplateLiteralLoose(["\n 0% {\n width: 50%;\n opacity: .5;\n }\n 50% {\n opacity: 1;\n }\n 100% {\n width: 100%;\n }\n"])));
7177
7170
  var SearchInputWrapper = styled__default.div(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteralLoose(["\n flex: 1 1 200px;\n max-width: 320px;\n"])));
7178
7171
  var CloseSearchInputWrapper = styled__default.div(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
7179
7172
  var theme = _ref.theme;
@@ -7298,8 +7291,8 @@ var FilterInputs = function FilterInputs(_ref2) {
7298
7291
 
7299
7292
  var _excluded$v = ["labelLists", "totalResults", "resultTextTemplate", "clearText", "resultsDateFormat", "onRemoveFilter", "onClearAll"];
7300
7293
 
7301
- var _templateObject$K, _templateObject2$I, _templateObject3$C, _templateObject4$x, _templateObject5$u, _templateObject6$r, _templateObject7$q;
7302
- var Container$v = styled__default.div(_templateObject$K || (_templateObject$K = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: 12px;\n min-height: 22px;\n"])));
7294
+ var _templateObject$M, _templateObject2$I, _templateObject3$C, _templateObject4$x, _templateObject5$u, _templateObject6$r, _templateObject7$q;
7295
+ var Container$v = styled__default.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: 12px;\n min-height: 22px;\n"])));
7303
7296
  var ResultsTextWrapper = styled__default.div(_templateObject2$I || (_templateObject2$I = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-9);\n"])), fontFamily.ui);
7304
7297
  var FilterLabel = styled__default.div(_templateObject3$C || (_templateObject3$C = _taggedTemplateLiteralLoose(["\n height: 18px;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n padding: 0 11px 0 8px;\n margin-left: 3px;\n color: var(--grey-9);\n font-family: ", ";\n\n ", " {\n display: flex;\n align-items: center;\n }\n border-right: 1px solid var(--grey-8);\n"])), fontFamily.data, IconWrapper);
7305
7298
  var FilterLabelText = styled__default.div(_templateObject4$x || (_templateObject4$x = _taggedTemplateLiteralLoose(["\n padding: ", ";\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n max-width: 300px;\n"])), function (_ref) {
@@ -7408,8 +7401,8 @@ var FiltersResults = function FiltersResults(_ref2) {
7408
7401
 
7409
7402
  var _excluded$w = ["filtersTitle", "hasShowMore", "searchersConfig", "dropdownsConfig", "datePickersConfig", "showMoreText", "showLessText", "resultTextTemplate", "clearText", "totalResults", "singleFilter", "resultsDateFormat", "onChangeCallback"];
7410
7403
 
7411
- var _templateObject$L, _templateObject2$J, _templateObject3$D;
7412
- var Title$2 = styled__default.div(_templateObject$L || (_templateObject$L = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-10);\n font-size: 12px;\n font-weight: 700;\n margin-bottom: 17px;\n"])), fontFamily.ui);
7404
+ var _templateObject$N, _templateObject2$J, _templateObject3$D;
7405
+ var Title$2 = styled__default.div(_templateObject$N || (_templateObject$N = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-10);\n font-size: 12px;\n font-weight: 700;\n margin-bottom: 17px;\n"])), fontFamily.ui);
7413
7406
  var StyledFilterResults = styled__default(FiltersResults)(_templateObject2$J || (_templateObject2$J = _taggedTemplateLiteralLoose([""])));
7414
7407
  var Container$w = styled__default.div(_templateObject3$D || (_templateObject3$D = _taggedTemplateLiteralLoose(["\n ", " {\n margin-top: 29px;\n min-height: 19px;\n }\n"])), StyledFilterResults);
7415
7408
 
@@ -7839,8 +7832,8 @@ var FilterBar = function FilterBar(_ref4) {
7839
7832
  })));
7840
7833
  };
7841
7834
 
7842
- var _templateObject$M, _templateObject2$K, _templateObject3$E, _templateObject4$y, _templateObject5$v;
7843
- var Container$x = styled__default.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-block;\n"])));
7835
+ var _templateObject$O, _templateObject2$K, _templateObject3$E, _templateObject4$y, _templateObject5$v;
7836
+ var Container$x = styled__default.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-block;\n"])));
7844
7837
  var StatusCounter = styled__default.div(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 14px;;\n top: -12px;\n border-radius: 4px;\n height: 14px;\n min-width: 14px;\n padding: 2px;\n font-size: 10px;\n color: white;\n display: flex;\n align-items: center;\n justify-content: center;\n ", "\n background-color: ", ";\n"])), function (_ref) {
7845
7838
  var animation = _ref.theme.animation;
7846
7839
  return styled.css(_templateObject3$E || (_templateObject3$E = _taggedTemplateLiteralLoose(["\n transition: background-color ", " ", ";\n "])), animation.speed.slow, animation.easing.primary.easeInOut);
@@ -7875,8 +7868,8 @@ var StatusIcon = function StatusIcon(_ref5) {
7875
7868
  }));
7876
7869
  };
7877
7870
 
7878
- var _templateObject$N, _templateObject2$L, _templateObject3$F, _templateObject4$z, _templateObject5$w, _templateObject6$s, _templateObject7$r, _templateObject8$n, _templateObject9$i, _templateObject10$f, _templateObject11$9, _templateObject12$7, _templateObject13$6, _templateObject14$4, _templateObject15$3, _templateObject16$3, _templateObject17$3;
7879
- var HandleTouchReactionKeyframes = styled.keyframes(_templateObject$N || (_templateObject$N = _taggedTemplateLiteralLoose(["\n 0% {\n transform: scale(1);\n }\n\n 75% {\n transform: scale(3);\n }\n\n 100% {\n transform: scale(1.75);\n }\n"])));
7871
+ var _templateObject$P, _templateObject2$L, _templateObject3$F, _templateObject4$z, _templateObject5$w, _templateObject6$s, _templateObject7$r, _templateObject8$n, _templateObject9$i, _templateObject10$f, _templateObject11$9, _templateObject12$7, _templateObject13$6, _templateObject14$4, _templateObject15$3, _templateObject16$3, _templateObject17$3;
7872
+ var HandleTouchReactionKeyframes = styled.keyframes(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n 0% {\n transform: scale(1);\n }\n\n 75% {\n transform: scale(3);\n }\n\n 100% {\n transform: scale(1.75);\n }\n"])));
7880
7873
  var HandleMouseReactionKeyframes = styled.keyframes(_templateObject2$L || (_templateObject2$L = _taggedTemplateLiteralLoose(["\n 0% {\n transform: scale(1);\n }\n\n 75% {\n transform: scale(0);\n }\n\n 100% {\n transform: scale(0.5);\n }\n"])));
7881
7874
  var HandleBase = styled__default.svg(_templateObject3$F || (_templateObject3$F = _taggedTemplateLiteralLoose(["\n touch-action: none;\n user-select: none;\n overflow: visible;\n cursor: pointer;\n fill: ", ";\n appearance: none;\n"])), function (_ref) {
7882
7875
  var theme = _ref.theme,
@@ -8124,8 +8117,8 @@ var HandleUnit = function HandleUnit(props) {
8124
8117
  }, index + pointIndexOffset))));
8125
8118
  };
8126
8119
 
8127
- var _templateObject$O, _templateObject2$M, _templateObject3$G, _templateObject4$A, _templateObject5$x, _templateObject6$t, _templateObject7$s, _templateObject8$o, _templateObject9$j, _templateObject10$g, _templateObject11$a, _templateObject12$8, _templateObject13$7, _templateObject14$5;
8128
- var ContrastLine = styled__default.line(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n stroke: ", ";\n mix-blend-mode: multiply;\n stroke-width: ", "px;\n stroke-opacity: ", ";\n cursor: pointer;\n"])), function (_ref) {
8120
+ var _templateObject$Q, _templateObject2$M, _templateObject3$G, _templateObject4$A, _templateObject5$x, _templateObject6$t, _templateObject7$s, _templateObject8$o, _templateObject9$j, _templateObject10$g, _templateObject11$a, _templateObject12$8, _templateObject13$7, _templateObject14$5;
8121
+ var ContrastLine = styled__default.line(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n stroke: ", ";\n mix-blend-mode: multiply;\n stroke-width: ", "px;\n stroke-opacity: ", ";\n cursor: pointer;\n"])), function (_ref) {
8129
8122
  var theme = _ref.theme,
8130
8123
  styling = _ref.styling;
8131
8124
  return theme.custom.lines[styling].contrastLine.stroke;
@@ -8414,8 +8407,8 @@ var LineUnit = function LineUnit(props) {
8414
8407
 
8415
8408
  var LineSetContext = React.createContext({});
8416
8409
 
8417
- var _templateObject$P, _templateObject2$N, _templateObject3$H, _templateObject4$B;
8418
- var FilledPolygon = styled__default.polygon(_templateObject$P || (_templateObject$P = _taggedTemplateLiteralLoose(["\n fill: ", ";\n opacity: ", ";\n"])), function (_ref) {
8410
+ var _templateObject$R, _templateObject2$N, _templateObject3$H, _templateObject4$B;
8411
+ var FilledPolygon = styled__default.polygon(_templateObject$R || (_templateObject$R = _taggedTemplateLiteralLoose(["\n fill: ", ";\n opacity: ", ";\n"])), function (_ref) {
8419
8412
  var color = _ref.color;
8420
8413
  return color;
8421
8414
  }, function (_ref2) {
@@ -8698,8 +8691,8 @@ var LineSet = function LineSet(_ref8) {
8698
8691
  }));
8699
8692
  };
8700
8693
 
8701
- var _templateObject$Q, _templateObject2$O, _templateObject3$I, _templateObject4$C, _templateObject5$y;
8702
- var Container$y = styled__default.div(_templateObject$Q || (_templateObject$Q = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n user-select: none;\n touch-action: none;\n /* box-shadow: 0 10px 20px hsla(195deg, 65%, 5%, 35%); */\n /* border: 10px solid hsla(195deg, 45%, 35%, 45%); */\n /* border-radius:3px; */\n\n width: auto;\n /* transform: translateY(-70%); */\n\n"])));
8694
+ var _templateObject$S, _templateObject2$O, _templateObject3$I, _templateObject4$C, _templateObject5$y;
8695
+ var Container$y = styled__default.div(_templateObject$S || (_templateObject$S = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n user-select: none;\n touch-action: none;\n /* box-shadow: 0 10px 20px hsla(195deg, 65%, 5%, 35%); */\n /* border: 10px solid hsla(195deg, 45%, 35%, 45%); */\n /* border-radius:3px; */\n\n width: auto;\n /* transform: translateY(-70%); */\n\n"])));
8703
8696
  var LoadingOverlay$1 = styled__default.div(_templateObject2$O || (_templateObject2$O = _taggedTemplateLiteralLoose(["\n position: absolute;\n top:0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n"])));
8704
8697
  var Frame = styled__default.svg(_templateObject3$I || (_templateObject3$I = _taggedTemplateLiteralLoose(["\n touch-action: none;\n user-select: none;\n margin: 0;\n\n overflow: visible;\n\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n height: 100%;\n width: 100%;\n transition: background 250ms ease;\n background: hsla(0deg, 0%, 0%, 0%);\n\n ", "\n\n"])), function (props) {
8705
8698
  return props.transculent && styled.css(_templateObject4$C || (_templateObject4$C = _taggedTemplateLiteralLoose(["\n background: hsla(0deg, 0%, 0%, 35%);\n "])));
@@ -8907,8 +8900,8 @@ var LineUI = function LineUI(_ref) {
8907
8900
 
8908
8901
  var _excluded$x = ["loop", "autoPlay", "controls", "muted"];
8909
8902
 
8910
- var _templateObject$R, _templateObject2$P, _templateObject3$J, _templateObject4$D, _templateObject5$z;
8911
- var Container$z = styled__default.div(_templateObject$R || (_templateObject$R = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n user-select: none;\n touch-action: none;\n /* box-shadow: 0 10px 20px hsla(195deg, 65%, 5%, 35%); */\n /* border: 10px solid hsla(195deg, 45%, 35%, 45%); */\n /* border-radius:3px; */\n\n width: auto;\n /* transform: translateY(-70%); */\n"])));
8903
+ var _templateObject$T, _templateObject2$P, _templateObject3$J, _templateObject4$D, _templateObject5$z;
8904
+ var Container$z = styled__default.div(_templateObject$T || (_templateObject$T = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n user-select: none;\n touch-action: none;\n /* box-shadow: 0 10px 20px hsla(195deg, 65%, 5%, 35%); */\n /* border: 10px solid hsla(195deg, 45%, 35%, 45%); */\n /* border-radius:3px; */\n\n width: auto;\n /* transform: translateY(-70%); */\n"])));
8912
8905
  var Video$1 = styled__default.video(_templateObject2$P || (_templateObject2$P = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%;\n border-radius: 3px;\n background-color: hsla(0deg, 0%, 0%, 35%);\n"])));
8913
8906
  var LoadingOverlay$2 = styled__default.div(_templateObject3$J || (_templateObject3$J = _taggedTemplateLiteralLoose(["\n position: absolute;\n top:0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n"])));
8914
8907
  var Frame$1 = styled__default.svg(_templateObject4$D || (_templateObject4$D = _taggedTemplateLiteralLoose(["\n touch-action: none;\n user-select: none;\n margin: 0;\n\n overflow: visible;\n\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n height: 100%;\n width: 100%;\n transition: background 250ms ease;\n background: hsla(0deg, 0%, 0%, 0%);\n\n ", "\n\n"])), function (props) {
@@ -9135,8 +9128,8 @@ var LineUIVideo = function LineUIVideo(_ref) {
9135
9128
 
9136
9129
  var _excluded$y = ["id", "enabled", "peerAddress", "maxConnectionAttempts", "rtcConfiguration", "setStatus", "setError", "autoPlay", "muted"];
9137
9130
 
9138
- var _templateObject$S;
9139
- var Video$2 = styled__default.video(_templateObject$S || (_templateObject$S = _taggedTemplateLiteralLoose(["\n /* width: 800px; */\n"])));
9131
+ var _templateObject$U;
9132
+ var Video$2 = styled__default.video(_templateObject$U || (_templateObject$U = _taggedTemplateLiteralLoose(["\n /* width: 800px; */\n"])));
9140
9133
 
9141
9134
  var WebRTCPlayer = function WebRTCPlayer(_ref) {
9142
9135
  var _ref$id = _ref.id,
@@ -9460,8 +9453,8 @@ function getPeerId(id) {
9460
9453
  return 'WRP_' + id + '_' + Math.floor(Math.random() * (9000 - 10) + 10).toString();
9461
9454
  }
9462
9455
 
9463
- var _templateObject$T, _templateObject2$Q, _templateObject3$K, _templateObject4$E, _templateObject5$A;
9464
- var Container$A = styled__default.div(_templateObject$T || (_templateObject$T = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n user-select: none;\n touch-action: none;\n /* box-shadow: 0 10px 20px hsla(195deg, 65%, 5%, 35%); */\n /* border: 10px solid hsla(195deg, 45%, 35%, 45%); */\n /* border-radius:3px; */\n\n width: auto;\n /* transform: translateY(-70%); */\n"])));
9456
+ var _templateObject$V, _templateObject2$Q, _templateObject3$K, _templateObject4$E, _templateObject5$A;
9457
+ var Container$A = styled__default.div(_templateObject$V || (_templateObject$V = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n user-select: none;\n touch-action: none;\n /* box-shadow: 0 10px 20px hsla(195deg, 65%, 5%, 35%); */\n /* border: 10px solid hsla(195deg, 45%, 35%, 45%); */\n /* border-radius:3px; */\n\n width: auto;\n /* transform: translateY(-70%); */\n"])));
9465
9458
  var Video$3 = styled__default(WebRTCPlayer)(_templateObject2$Q || (_templateObject2$Q = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%;\n border-radius: 3px;\n background-color: hsla(0deg, 0%, 0%, 35%);\n"])));
9466
9459
  var LoadingOverlay$3 = styled__default.div(_templateObject3$K || (_templateObject3$K = _taggedTemplateLiteralLoose(["\n position: absolute;\n top:0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n"])));
9467
9460
  var Frame$2 = styled__default.svg(_templateObject4$E || (_templateObject4$E = _taggedTemplateLiteralLoose(["\n touch-action: none;\n user-select: none;\n margin: 0;\n\n overflow: visible;\n\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n bottom: 0;\n height: 100%;\n width: 100%;\n transition: background 250ms ease;\n background: hsla(0deg, 0%, 0%, 0%);\n\n ", "\n\n"])), function (props) {
@@ -9811,8 +9804,8 @@ var LineReducer = (function (state, action) {
9811
9804
  }
9812
9805
  });
9813
9806
 
9814
- var _templateObject$U, _templateObject2$R, _templateObject3$L, _templateObject4$F, _templateObject5$B, _templateObject6$u, _templateObject7$t, _templateObject8$p;
9815
- var Container$B = styled__default.div(_templateObject$U || (_templateObject$U = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
9807
+ var _templateObject$W, _templateObject2$R, _templateObject3$L, _templateObject4$F, _templateObject5$B, _templateObject6$u, _templateObject7$t, _templateObject8$p;
9808
+ var Container$B = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
9816
9809
  var IconContainer$1 = styled__default.div(_templateObject2$R || (_templateObject2$R = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: -45px;\n bottom: 0;\n height: 30px;\n display: flex;\n justify-content: center;\n align-items: center;\n\n svg {\n display: block;\n }\n"])));
9817
9810
  var Title$3 = styled__default.h1(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteralLoose(["\n ", "\n margin: 0 0 20px;\n"])), function (_ref) {
9818
9811
  var theme = _ref.theme;
@@ -9845,8 +9838,8 @@ var PageTitle = function PageTitle(_ref3) {
9845
9838
  }))) : null);
9846
9839
  };
9847
9840
 
9848
- var _templateObject$V, _templateObject2$S;
9849
- var Container$C = styled__default.p(_templateObject$V || (_templateObject$V = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
9841
+ var _templateObject$X, _templateObject2$S;
9842
+ var Container$C = styled__default.p(_templateObject$X || (_templateObject$X = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
9850
9843
  var theme = _ref.theme;
9851
9844
  return styled.css(_templateObject2$S || (_templateObject2$S = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.pageHeader.introduction);
9852
9845
  });
@@ -9856,8 +9849,8 @@ var IntroductionText = function IntroductionText(_ref2) {
9856
9849
  return React__default.createElement(Container$C, null, children);
9857
9850
  };
9858
9851
 
9859
- var _templateObject$W;
9860
- var Container$D = styled__default.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteralLoose([""])));
9852
+ var _templateObject$Y;
9853
+ var Container$D = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteralLoose([""])));
9861
9854
 
9862
9855
  var PageHeader = function PageHeader(_ref) {
9863
9856
  var title = _ref.title,
@@ -9878,8 +9871,8 @@ var PageHeader = function PageHeader(_ref) {
9878
9871
  })), introductionText ? React__default.createElement(IntroductionText, null, introductionText) : null);
9879
9872
  };
9880
9873
 
9881
- var _templateObject$X;
9882
- var Container$E = styled__default.div(_templateObject$X || (_templateObject$X = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
9874
+ var _templateObject$Z;
9875
+ var Container$E = styled__default.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
9883
9876
 
9884
9877
  var MultilineContent = function MultilineContent(_ref) {
9885
9878
  var contentArray = _ref.contentArray;
@@ -9890,8 +9883,8 @@ var MultilineContent = function MultilineContent(_ref) {
9890
9883
  }));
9891
9884
  };
9892
9885
 
9893
- var _templateObject$Y, _templateObject2$T, _templateObject3$M, _templateObject4$G, _templateObject5$C, _templateObject6$v, _templateObject7$u;
9894
- var Container$F = styled__default.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteralLoose(["\n position: relative;\n height: inherit;\n background: grey;\n border-radius: 3px;\n overflow: hidden;\n width: 55px;\n height: auto;\n opacity: 0.65;\n margin-right: 10px;\n\n &::after {\n content: '';\n display: block;\n padding-bottom: 75%;\n ", "\n }\n\n ", "\n\n &:hover {\n cursor: pointer;\n\n ", "\n }\n\n"])), function (_ref) {
9886
+ var _templateObject$_, _templateObject2$T, _templateObject3$M, _templateObject4$G, _templateObject5$C, _templateObject6$v, _templateObject7$u;
9887
+ var Container$F = styled__default.div(_templateObject$_ || (_templateObject$_ = _taggedTemplateLiteralLoose(["\n position: relative;\n height: inherit;\n background: grey;\n border-radius: 3px;\n overflow: hidden;\n width: 55px;\n height: auto;\n opacity: 0.65;\n margin-right: 10px;\n\n &::after {\n content: '';\n display: block;\n padding-bottom: 75%;\n ", "\n }\n\n ", "\n\n &:hover {\n cursor: pointer;\n\n ", "\n }\n\n"])), function (_ref) {
9895
9888
  var aspect = _ref.aspect;
9896
9889
  return aspect === '16:9' && styled.css(_templateObject2$T || (_templateObject2$T = _taggedTemplateLiteralLoose(["\n padding-left: 56.25%;\n "])));
9897
9890
  }, function (_ref2) {
@@ -10024,8 +10017,8 @@ var TableRowThumbnail = function TableRowThumbnail(_ref4) {
10024
10017
  })));
10025
10018
  };
10026
10019
 
10027
- var _templateObject$Z, _templateObject2$U;
10028
- var Container$G = styled__default.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n height: 42px;\n width: 4px;\n border-radius: 3px;\n display: block;\n\n ", "\n\n"])), function (_ref) {
10020
+ var _templateObject$$, _templateObject2$U;
10021
+ var Container$G = styled__default.div(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteralLoose(["\n height: 42px;\n width: 4px;\n border-radius: 3px;\n display: block;\n\n ", "\n\n"])), function (_ref) {
10029
10022
  var status = _ref.status,
10030
10023
  colors = _ref.theme.colors;
10031
10024
  return styled.css(_templateObject2$U || (_templateObject2$U = _taggedTemplateLiteralLoose(["\n background: ", ";\n content:'", "';\n "])), colors.status[status], status);
@@ -10039,8 +10032,8 @@ var TypeTableDeviceStatus = function TypeTableDeviceStatus(_ref2) {
10039
10032
  });
10040
10033
  };
10041
10034
 
10042
- var _templateObject$_, _templateObject2$V, _templateObject3$N, _templateObject4$H, _templateObject5$D, _templateObject6$w, _templateObject7$v, _templateObject8$q, _templateObject9$k, _templateObject10$h, _templateObject11$b;
10043
- var CopyToClipboard = styled__default.button(_templateObject$_ || (_templateObject$_ = _taggedTemplateLiteralLoose(["\n\n cursor: pointer;\n opacity: 0;\n\n position: absolute;\n right: 0;\n top: 14px;\n width: 20px;\n height: 20px;\n background: transparent;\n border: none;\n outline: none;\n\n ", "\n\n svg {\n display: block;\n }\n\n &:hover {\n opacity: 1 !important;\n }\n\n"])), function (_ref) {
10035
+ var _templateObject$10, _templateObject2$V, _templateObject3$N, _templateObject4$H, _templateObject5$D, _templateObject6$w, _templateObject7$v, _templateObject8$q, _templateObject9$k, _templateObject10$h, _templateObject11$b;
10036
+ var CopyToClipboard = styled__default.button(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteralLoose(["\n\n cursor: pointer;\n opacity: 0;\n\n position: absolute;\n right: 0;\n top: 14px;\n width: 20px;\n height: 20px;\n background: transparent;\n border: none;\n outline: none;\n\n ", "\n\n svg {\n display: block;\n }\n\n &:hover {\n opacity: 1 !important;\n }\n\n"])), function (_ref) {
10044
10037
  var theme = _ref.theme;
10045
10038
  return theme && styled.css(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteralLoose(["\n transition: ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.easeOut);
10046
10039
  });
@@ -10111,8 +10104,8 @@ var TypeTableCell = function TypeTableCell(_ref7) {
10111
10104
  })) : null);
10112
10105
  };
10113
10106
 
10114
- var _templateObject$$, _templateObject2$W;
10115
- var RowContainer = styled__default.div(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteralLoose(["\n display: table-row;\n ", ";\n"])), function (_ref) {
10107
+ var _templateObject$11, _templateObject2$W;
10108
+ var RowContainer = styled__default.div(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteralLoose(["\n display: table-row;\n ", ";\n"])), function (_ref) {
10116
10109
  var isEmpty = _ref.isEmpty;
10117
10110
  return isEmpty && styled.css(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteralLoose(["\n visibility: hidden;\n "])));
10118
10111
  });
@@ -10188,8 +10181,8 @@ var TypeTableRow = function TypeTableRow(_ref2) {
10188
10181
  }));
10189
10182
  };
10190
10183
 
10191
- var _templateObject$10, _templateObject2$X, _templateObject3$O, _templateObject4$I;
10192
- var HeaderTitle = styled__default.div(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteralLoose(["\n border-bottom-right-radius: 3px;\n border-top-right-radius: 3px;\n display: inline-flex;\n justify-content: center;\n align-content: center;\n position: relative;\n padding: 0 2px;\n user-select: none;\n z-index: 99;\n\n ", " {\n position: absolute;\n top: 0px;\n left: -15px;\n display: none;\n border-bottom-left-radius: 3px;\n border-top-left-radius: 3px;\n padding: 3px 1px;\n\n ", "\n }\n\n ", "\n\n ", "\n"])), IconWrapper, function (_ref) {
10184
+ var _templateObject$12, _templateObject2$X, _templateObject3$O, _templateObject4$I;
10185
+ var HeaderTitle = styled__default.div(_templateObject$12 || (_templateObject$12 = _taggedTemplateLiteralLoose(["\n border-bottom-right-radius: 3px;\n border-top-right-radius: 3px;\n display: inline-flex;\n justify-content: center;\n align-content: center;\n position: relative;\n padding: 0 2px;\n user-select: none;\n z-index: 99;\n\n ", " {\n position: absolute;\n top: 0px;\n left: -15px;\n display: none;\n border-bottom-left-radius: 3px;\n border-top-left-radius: 3px;\n padding: 3px 1px;\n\n ", "\n }\n\n ", "\n\n ", "\n"])), IconWrapper, function (_ref) {
10193
10186
  var ascending = _ref.ascending;
10194
10187
  return ascending && styled.css(_templateObject2$X || (_templateObject2$X = _taggedTemplateLiteralLoose(["\n transform: rotate(180deg);\n border-bottom-right-radius: 3px;\n border-top-right-radius: 3px;\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n top: 0;\n "])));
10195
10188
  }, function (_ref2) {
@@ -10228,8 +10221,8 @@ var TableHeaderTitle = function TableHeaderTitle(_ref4) {
10228
10221
  }), header);
10229
10222
  };
10230
10223
 
10231
- var _templateObject$11, _templateObject2$Y, _templateObject3$P, _templateObject4$J, _templateObject5$E, _templateObject6$x, _templateObject7$w, _templateObject8$r, _templateObject9$l, _templateObject10$i, _templateObject11$c, _templateObject12$9, _templateObject13$8, _templateObject14$6, _templateObject15$4, _templateObject16$4, _templateObject17$4;
10232
- var HeaderRow = styled__default.div(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteralLoose(["\n display: table-row;\n height: 50px;\n"])));
10224
+ var _templateObject$13, _templateObject2$Y, _templateObject3$P, _templateObject4$J, _templateObject5$E, _templateObject6$x, _templateObject7$w, _templateObject8$r, _templateObject9$l, _templateObject10$i, _templateObject11$c, _templateObject12$9, _templateObject13$8, _templateObject14$6, _templateObject15$4, _templateObject16$4, _templateObject17$4;
10225
+ var HeaderRow = styled__default.div(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteralLoose(["\n display: table-row;\n height: 50px;\n"])));
10233
10226
  var HeaderItem = styled__default.div(_templateObject2$Y || (_templateObject2$Y = _taggedTemplateLiteralLoose(["\n display: table-cell;\n height: inherit;\n vertical-align:top;\n line-height: 20px;\n position: relative;\n font-family: ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"])), function (p) {
10234
10227
  return p.theme.fontFamily.ui;
10235
10228
  }, function (_ref) {
@@ -10397,8 +10390,8 @@ var TypeTableHeader = function TypeTableHeader(_ref9) {
10397
10390
  }));
10398
10391
  };
10399
10392
 
10400
- var _templateObject$12, _templateObject2$Z, _templateObject3$Q, _templateObject4$K, _templateObject5$F;
10401
- var Container$H = styled__default.div(_templateObject$12 || (_templateObject$12 = _taggedTemplateLiteralLoose([""])));
10393
+ var _templateObject$14, _templateObject2$Z, _templateObject3$Q, _templateObject4$K, _templateObject5$F;
10394
+ var Container$H = styled__default.div(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteralLoose([""])));
10402
10395
  var TableContainer = styled__default.div(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteralLoose(["\n display: table;\n width: 100%;\n position: relative;\n"])));
10403
10396
  var LoadingText$1 = styled__default.div(_templateObject3$Q || (_templateObject3$Q = _taggedTemplateLiteralLoose(["\n color: var(--grey-a11);\n"])));
10404
10397
  var LoadingBox$1 = styled__default.div(_templateObject4$K || (_templateObject4$K = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n z-index: 99;\n background-color: ", ";\n height: calc(100% - 50px);\n opacity: 85%;\n width: 100%;\n min-height: 100px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 20px;\n\n ", " {\n margin-top: 10px;\n }\n"])), function (_ref) {
@@ -10495,8 +10488,8 @@ var TypeTable = function TypeTable(_ref3) {
10495
10488
 
10496
10489
  var _excluded$A = ["type", "placeholder", "defaultValue", "rowKey", "alignment", "toLink", "saveCallback"];
10497
10490
 
10498
- var _templateObject$13, _templateObject2$_, _templateObject3$R, _templateObject4$L, _templateObject5$G, _templateObject6$y, _templateObject7$x, _templateObject8$s, _templateObject9$m, _templateObject10$j;
10499
- var Container$I = styled__default.div(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteralLoose(["\n position: relative;\n ", "\n"])), function (_ref) {
10491
+ var _templateObject$15, _templateObject2$_, _templateObject3$R, _templateObject4$L, _templateObject5$G, _templateObject6$y, _templateObject7$x, _templateObject8$s, _templateObject9$m, _templateObject10$j;
10492
+ var Container$I = styled__default.div(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteralLoose(["\n position: relative;\n ", "\n"])), function (_ref) {
10500
10493
  var theme = _ref.theme;
10501
10494
  return styled.css(_templateObject2$_ || (_templateObject2$_ = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
10502
10495
  });
@@ -10963,8 +10956,8 @@ var PTZProvider = function PTZProvider(_ref) {
10963
10956
  }, children);
10964
10957
  };
10965
10958
 
10966
- var _templateObject$14, _templateObject2$$, _templateObject3$S, _templateObject4$M, _templateObject5$H;
10967
- var Active = styled__default.g(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
10959
+ var _templateObject$16, _templateObject2$$, _templateObject3$S, _templateObject4$M, _templateObject5$H;
10960
+ var Active = styled__default.g(_templateObject$16 || (_templateObject$16 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
10968
10961
  var active = _ref.active;
10969
10962
  return active && styled.css(_templateObject2$$ || (_templateObject2$$ = _taggedTemplateLiteralLoose(["opacity: 1;"])));
10970
10963
  });
@@ -11045,8 +11038,8 @@ var Up = function Up() {
11045
11038
  })));
11046
11039
  };
11047
11040
 
11048
- var _templateObject$15, _templateObject2$10, _templateObject3$T, _templateObject4$N, _templateObject5$I, _templateObject6$z;
11049
- var Active$1 = styled__default.g(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
11041
+ var _templateObject$17, _templateObject2$10, _templateObject3$T, _templateObject4$N, _templateObject5$I, _templateObject6$z;
11042
+ var Active$1 = styled__default.g(_templateObject$17 || (_templateObject$17 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
11050
11043
  var active = _ref.active;
11051
11044
  return active && styled.css(_templateObject2$10 || (_templateObject2$10 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
11052
11045
  });
@@ -11129,8 +11122,8 @@ var Down = function Down() {
11129
11122
  })));
11130
11123
  };
11131
11124
 
11132
- var _templateObject$16, _templateObject2$11, _templateObject3$U, _templateObject4$O, _templateObject5$J;
11133
- var Active$2 = styled__default.g(_templateObject$16 || (_templateObject$16 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
11125
+ var _templateObject$18, _templateObject2$11, _templateObject3$U, _templateObject4$O, _templateObject5$J;
11126
+ var Active$2 = styled__default.g(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
11134
11127
  var active = _ref.active;
11135
11128
  return active && styled.css(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
11136
11129
  });
@@ -11213,8 +11206,8 @@ var Left = function Left() {
11213
11206
  })));
11214
11207
  };
11215
11208
 
11216
- var _templateObject$17, _templateObject2$12, _templateObject3$V, _templateObject4$P, _templateObject5$K;
11217
- var Active$3 = styled__default.g(_templateObject$17 || (_templateObject$17 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
11209
+ var _templateObject$19, _templateObject2$12, _templateObject3$V, _templateObject4$P, _templateObject5$K;
11210
+ var Active$3 = styled__default.g(_templateObject$19 || (_templateObject$19 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
11218
11211
  var active = _ref.active;
11219
11212
  return active && styled.css(_templateObject2$12 || (_templateObject2$12 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
11220
11213
  });
@@ -12110,8 +12103,8 @@ var ZoomBase = function ZoomBase(_ref) {
12110
12103
  })), children));
12111
12104
  };
12112
12105
 
12113
- var _templateObject$18, _templateObject2$13, _templateObject3$W, _templateObject4$Q, _templateObject5$L;
12114
- var Active$4 = styled__default.g(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
12106
+ var _templateObject$1a, _templateObject2$13, _templateObject3$W, _templateObject4$Q, _templateObject5$L;
12107
+ var Active$4 = styled__default.g(_templateObject$1a || (_templateObject$1a = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
12115
12108
  var active = _ref.active;
12116
12109
  return active && styled.css(_templateObject2$13 || (_templateObject2$13 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
12117
12110
  });
@@ -12187,8 +12180,8 @@ var Up$1 = function Up() {
12187
12180
  })));
12188
12181
  };
12189
12182
 
12190
- var _templateObject$19, _templateObject2$14, _templateObject3$X, _templateObject4$R, _templateObject5$M;
12191
- var Active$5 = styled__default.g(_templateObject$19 || (_templateObject$19 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
12183
+ var _templateObject$1b, _templateObject2$14, _templateObject3$X, _templateObject4$R, _templateObject5$M;
12184
+ var Active$5 = styled__default.g(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
12192
12185
  var active = _ref.active;
12193
12186
  return active && styled.css(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
12194
12187
  });
@@ -12260,8 +12253,8 @@ var Up$2 = function Up() {
12260
12253
  })));
12261
12254
  };
12262
12255
 
12263
- var _templateObject$1a;
12264
- var Container$P = styled__default.div(_templateObject$1a || (_templateObject$1a = _taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n flex-direction: column;\n"])));
12256
+ var _templateObject$1c;
12257
+ var Container$P = styled__default.div(_templateObject$1c || (_templateObject$1c = _taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n flex-direction: column;\n"])));
12265
12258
 
12266
12259
  var Controls = function Controls(_ref) {
12267
12260
  var _ref$debug = _ref.debug,
@@ -12275,8 +12268,8 @@ var Controls = function Controls(_ref) {
12275
12268
 
12276
12269
  var _excluded$B = ["isEmptyWithIcon", "status", "noticeIcon", "hasNotice", "noticeMessage", "noticeTitle", "emptyIcon"];
12277
12270
 
12278
- var _templateObject$1b, _templateObject2$15, _templateObject3$Y, _templateObject4$S, _templateObject5$N, _templateObject6$A, _templateObject7$y, _templateObject8$t;
12279
- var Container$Q = styled__default.div(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 170px;\n border-radius: 3px;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n position: relative;\n\n ", " {\n height: 100%;\n width: 100%;\n text-align: center;\n img, video {\n border-radius: 3px;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n"])), MediaBoxWrapper);
12271
+ var _templateObject$1d, _templateObject2$15, _templateObject3$Y, _templateObject4$S, _templateObject5$N, _templateObject6$A, _templateObject7$y, _templateObject8$t;
12272
+ var Container$Q = styled__default.div(_templateObject$1d || (_templateObject$1d = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 170px;\n border-radius: 3px;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n position: relative;\n\n ", " {\n height: 100%;\n width: 100%;\n text-align: center;\n img, video {\n border-radius: 3px;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n height: 100%;\n width: 100%;\n object-fit: cover;\n }\n"])), MediaBoxWrapper);
12280
12273
  var EmptyWithIcon = styled__default.div(_templateObject2$15 || (_templateObject2$15 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n height: 100%;\n width: 100%;\n ", "\n;\n\n ", " {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n"])), function (_ref) {
12281
12274
  var hasPadding = _ref.hasPadding;
12282
12275
  return hasPadding && "\n padding-bottom: 43px\n ";
@@ -12324,8 +12317,8 @@ var MediaStream = function MediaStream(_ref4) {
12324
12317
  }));
12325
12318
  };
12326
12319
 
12327
- var _templateObject$1c, _templateObject2$16, _templateObject3$Z, _templateObject4$T, _templateObject5$O, _templateObject6$B, _templateObject7$z, _templateObject8$u, _templateObject9$n;
12328
- var Container$R = styled__default.div(_templateObject$1c || (_templateObject$1c = _taggedTemplateLiteralLoose(["\n display: flex;\n height: 60px;\n"])));
12320
+ var _templateObject$1e, _templateObject2$16, _templateObject3$Z, _templateObject4$T, _templateObject5$O, _templateObject6$B, _templateObject7$z, _templateObject8$u, _templateObject9$n;
12321
+ var Container$R = styled__default.div(_templateObject$1e || (_templateObject$1e = _taggedTemplateLiteralLoose(["\n display: flex;\n height: 60px;\n"])));
12329
12322
  var LeftData = styled__default.div(_templateObject2$16 || (_templateObject2$16 = _taggedTemplateLiteralLoose(["\n ", ";\n\n padding: 0 12px 0 12px;\n display: flex;\n\n ", " {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n }\n"])), function (_ref) {
12330
12323
  var hasRightData = _ref.hasRightData;
12331
12324
  return hasRightData && styled.css(_templateObject3$Z || (_templateObject3$Z = _taggedTemplateLiteralLoose(["\n border-right: var(--grey-6) 1px solid;\n width: 195px;\n "])));
@@ -12380,8 +12373,8 @@ var PanelMetaData = function PanelMetaData(_ref6) {
12380
12373
 
12381
12374
  var _excluded$C = ["streamProps", "panelMetaData", "customBottom", "panelOnClick"];
12382
12375
 
12383
- var _templateObject$1d;
12384
- var CameraPanelWrapper = styled__default.div(_templateObject$1d || (_templateObject$1d = _taggedTemplateLiteralLoose(["\n width: 300px;\n height: 230px;\n border-radius: 3px;\n box-shadow: 0 2px 10px 0 var(--grey-a5);\n background-color: linear-gradient(180.00deg, var(--grey-2) 0%, var(--grey-3) 100%);\n }\n\n ", ";\n"])), function (_ref) {
12376
+ var _templateObject$1f;
12377
+ var CameraPanelWrapper = styled__default.div(_templateObject$1f || (_templateObject$1f = _taggedTemplateLiteralLoose(["\n width: 300px;\n height: 230px;\n border-radius: 3px;\n box-shadow: 0 2px 10px 0 var(--grey-a5);\n background-color: linear-gradient(180.00deg, var(--grey-2) 0%, var(--grey-3) 100%);\n }\n\n ", ";\n"])), function (_ref) {
12385
12378
  var hasOnClick = _ref.hasOnClick;
12386
12379
  return hasOnClick && "\n cursor: pointer;\n ";
12387
12380
  });
@@ -12399,8 +12392,8 @@ var NewComponent = function NewComponent(_ref2) {
12399
12392
  }, props), React__default.createElement(MediaStream, Object.assign({}, streamProps)), customBottom ? customBottom : panelMetaData && React__default.createElement(PanelMetaData, Object.assign({}, panelMetaData)));
12400
12393
  };
12401
12394
 
12402
- var _templateObject$1e;
12403
- var CameraGrid = styled__default.div(_templateObject$1e || (_templateObject$1e = _taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(auto-fill, 300px);\n gap: 20px 20px;\n"])));
12395
+ var _templateObject$1g;
12396
+ var CameraGrid = styled__default.div(_templateObject$1g || (_templateObject$1g = _taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(auto-fill, 300px);\n gap: 20px 20px;\n"])));
12404
12397
 
12405
12398
  var CameraPanels = function CameraPanels(_ref) {
12406
12399
  var panels = _ref.panels;
@@ -12413,36 +12406,32 @@ var CameraPanels = function CameraPanels(_ref) {
12413
12406
 
12414
12407
  var _excluded$D = ["icon", "size", "weight", "label", "linkTo"];
12415
12408
 
12416
- var _templateObject$1f, _templateObject2$17, _templateObject3$_, _templateObject4$U;
12417
- var TextContainer$3 = styled__default.div(_templateObject$1f || (_templateObject$1f = _taggedTemplateLiteralLoose(["\n user-select: none;\n"])));
12409
+ var _templateObject$1h, _templateObject2$17, _templateObject3$_, _templateObject4$U;
12410
+ var TextContainer$3 = styled__default.div(_templateObject$1h || (_templateObject$1h = _taggedTemplateLiteralLoose(["\n user-select: none;\n"])));
12418
12411
  var StyledLink$1 = styled__default(reactRouterDom.Link)(_templateObject2$17 || (_templateObject2$17 = _taggedTemplateLiteralLoose(["\n text-decoration: none;\n"])));
12419
- var TagWrapper = styled__default.div(_templateObject3$_ || (_templateObject3$_ = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-size: ", "px;\n font-weight: 500;\n color: var(--grey-11);\n padding: 4px 10px;\n border: solid 1px var(--grey-8);\n display: inline-flex;\n align-items: center;\n border-radius: 3px;\n height: 26px;\n\n ", " {\n [stroke]{\n ", ";\n }\n margin-right: 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n ", ";\n"])), function (_ref) {
12412
+ var TagWrapper = styled__default.div(_templateObject3$_ || (_templateObject3$_ = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-size: ", "px;\n font-weight: 500;\n color: var(--grey-11);\n padding: 4px 10px;\n border: solid 1px var(--grey-8);\n display: inline-flex;\n align-items: center;\n border-radius: 3px;\n height: 26px;\n\n ", " {\n [stroke]{\n stroke: var(--dimmed);\n }\n margin-right: 8px;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n ", ";\n"])), function (_ref) {
12420
12413
  var theme = _ref.theme;
12421
12414
  return theme.fontFamily.ui;
12422
12415
  }, function (_ref2) {
12423
12416
  var size = _ref2.size;
12424
12417
  return size;
12425
12418
  }, IconWrapper, function (_ref3) {
12426
- var theme = _ref3.theme;
12427
- return theme.colors.icons['dimmed'];
12428
- }, function (_ref4) {
12429
- var theme = _ref4.theme,
12430
- hoverColor = _ref4.hoverColor,
12431
- enableHover = _ref4.enableHover;
12432
- return enableHover && styled.css(_templateObject4$U || (_templateObject4$U = _taggedTemplateLiteralLoose(["\n &:hover {\n cursor: pointer;\n border-color: ", ";\n color: ", ";\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n "])), theme.colors.icons[hoverColor], theme.colors.icons[hoverColor], IconWrapper, theme.colors.icons[hoverColor]);
12419
+ var hoverColor = _ref3.hoverColor,
12420
+ enableHover = _ref3.enableHover;
12421
+ return enableHover && styled.css(_templateObject4$U || (_templateObject4$U = _taggedTemplateLiteralLoose(["\n &:hover {\n cursor: pointer;\n border-color: var(--", ");\n color: var(--", ");\n ", " {\n [stroke]{\n stroke: var(--", ");\n }\n }\n }\n "])), hoverColor, hoverColor, IconWrapper, hoverColor);
12433
12422
  });
12434
12423
 
12435
- var Tag = function Tag(_ref5) {
12436
- var _ref5$icon = _ref5.icon,
12437
- icon = _ref5$icon === void 0 ? '' : _ref5$icon,
12438
- _ref5$size = _ref5.size,
12439
- size = _ref5$size === void 0 ? 14 : _ref5$size,
12440
- _ref5$weight = _ref5.weight,
12441
- weight = _ref5$weight === void 0 ? 'regular' : _ref5$weight,
12442
- _ref5$label = _ref5.label,
12443
- label = _ref5$label === void 0 ? '' : _ref5$label,
12444
- linkTo = _ref5.linkTo,
12445
- props = _objectWithoutPropertiesLoose(_ref5, _excluded$D);
12424
+ var Tag = function Tag(_ref4) {
12425
+ var _ref4$icon = _ref4.icon,
12426
+ icon = _ref4$icon === void 0 ? '' : _ref4$icon,
12427
+ _ref4$size = _ref4.size,
12428
+ size = _ref4$size === void 0 ? 14 : _ref4$size,
12429
+ _ref4$weight = _ref4.weight,
12430
+ weight = _ref4$weight === void 0 ? 'regular' : _ref4$weight,
12431
+ _ref4$label = _ref4.label,
12432
+ label = _ref4$label === void 0 ? '' : _ref4$label,
12433
+ linkTo = _ref4.linkTo,
12434
+ props = _objectWithoutPropertiesLoose(_ref4, _excluded$D);
12446
12435
 
12447
12436
  var renderTag = function renderTag() {
12448
12437
  return React__default.createElement(TagWrapper, {
@@ -12461,8 +12450,8 @@ var Tag = function Tag(_ref5) {
12461
12450
  }, renderTag()) : renderTag();
12462
12451
  };
12463
12452
 
12464
- var _templateObject$1g;
12465
- var TagListWrapper = styled__default.div(_templateObject$1g || (_templateObject$1g = _taggedTemplateLiteralLoose(["\n display: flex;\n ", " {\n margin-right: 10px;\n margin-bottom: 6px;\n flex-shrink: 0;\n }\n flex-wrap: wrap;\n"])), TagWrapper);
12453
+ var _templateObject$1i;
12454
+ var TagListWrapper = styled__default.div(_templateObject$1i || (_templateObject$1i = _taggedTemplateLiteralLoose(["\n display: flex;\n ", " {\n margin-right: 10px;\n margin-bottom: 6px;\n flex-shrink: 0;\n }\n flex-wrap: wrap;\n"])), TagWrapper);
12466
12455
 
12467
12456
  var TagList = function TagList(_ref) {
12468
12457
  var tagsConfig = _ref.tagsConfig;
@@ -12509,8 +12498,8 @@ var DebouncedSearcher = function DebouncedSearcher(_ref) {
12509
12498
 
12510
12499
  var _excluded$F = ["design", "size", "position", "text"];
12511
12500
 
12512
- var _templateObject$1h, _templateObject2$18, _templateObject3$$, _templateObject4$V, _templateObject5$P, _templateObject6$C;
12513
- var Container$S = styled__default.div(_templateObject$1h || (_templateObject$1h = _taggedTemplateLiteralLoose([""])));
12501
+ var _templateObject$1j, _templateObject2$18, _templateObject3$$, _templateObject4$V, _templateObject5$P, _templateObject6$C;
12502
+ var Container$S = styled__default.div(_templateObject$1j || (_templateObject$1j = _taggedTemplateLiteralLoose([""])));
12514
12503
  var Title$6 = styled__default.div(_templateObject2$18 || (_templateObject2$18 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-10);\n font-size: 12px;\n font-weight: 700;\n margin-bottom: 17px;\n"])), function (_ref) {
12515
12504
  var theme = _ref.theme;
12516
12505
  return theme.fontFamily.ui;
@@ -12562,18 +12551,275 @@ var ActionsBar = function ActionsBar(_ref3) {
12562
12551
  }, finishTextButton))), React__default.createElement(SelectedResults, null, renderSelected(selectedTemplate, totalSelected, totalAvailable)));
12563
12552
  };
12564
12553
 
12565
- var _templateObject$1i, _templateObject2$19, _templateObject3$10, _templateObject4$W, _templateObject5$Q;
12566
- var Container$T = styled__default.div(_templateObject$1i || (_templateObject$1i = _taggedTemplateLiteralLoose([""])));
12567
- var Title$7 = styled__default.div(_templateObject2$19 || (_templateObject2$19 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
12554
+ var _templateObject$1k, _templateObject2$19, _templateObject3$10, _templateObject4$W, _templateObject5$Q, _templateObject6$D, _templateObject7$A, _templateObject8$v, _templateObject9$o, _templateObject10$k;
12555
+ var WIDTH_PER_NUMBER = 12;
12556
+ var PaginationContainer = styled__default.div(_templateObject$1k || (_templateObject$1k = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n align-items: center;\n padding-top: 20px;\n padding-bottom: 20px;\n width: 100%;\n height: fit-content;\n margin-right: 10px;\n white-space: nowrap;\n gap: 0 8px;\n vertical-align: baseline;\n"])));
12557
+ var PageLabel = styled__default.label(_templateObject2$19 || (_templateObject2$19 = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n font-weight: 500px;\n font-size: 14px;\n color: var(--grey-10);\n text-align: left;\n"])));
12558
+ var StaticPageCount = styled__default.div(_templateObject3$10 || (_templateObject3$10 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n box-sizing: border-box;\n font-size: 14px;\n color: var(--grey-8);\n height: 100%;\n text-align: left;\n padding-top: 1px;\n padding-right: 1px;\n"])));
12559
+ var StyledInput$3 = styled__default.input(_templateObject4$W || (_templateObject4$W = _taggedTemplateLiteralLoose(["\n ", ";\n color: ", ";\n max-width: ", ";\n font-family: var(--font-data);\n height: 100%;\n box-sizing: border-box;\n outline: none;\n background: transparent;\n text-align: right;\n font-size: 14px;\n font-weight: 500;\n line-height: 25px;\n border: none;\n padding-right: ", "px;\n"])), removeAutoFillStyle, function (_ref) {
12560
+ var textColor = _ref.textColor;
12561
+ return textColor;
12562
+ }, function (_ref2) {
12563
+ var maxWidth = _ref2.maxWidth;
12564
+ return maxWidth ? maxWidth : '40px';
12565
+ }, WIDTH_PER_NUMBER / 2);
12566
+ var shakeAnimation = styled.keyframes(_templateObject5$Q || (_templateObject5$Q = _taggedTemplateLiteralLoose(["\n 0% { transform: translateX(0); }\n 10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }\n 20%, 40%, 60%, 80% { transform: translateX(5px); }\n 100% { transform: translateX(0); }\n"])));
12567
+ var InputContainer$2 = styled__default.div(_templateObject6$D || (_templateObject6$D = _taggedTemplateLiteralLoose(["\n height: var(--input-height, 40px);\n animation: ", " 150ms 2 linear;\n flex-grow: 0;\n display: flex;\n flex-direction: row;\n justify-content: flex-start;\n align-items: center;\n padding: 0 8px;\n border-radius: 3px;\n box-shadow: 0 2px 1px 0 rgba(0, 102, 255, 0.04);\n ", ";\n"])), function (_ref3) {
12568
+ var shouldShake = _ref3.shouldShake;
12569
+ return shouldShake ? shakeAnimation : 'none';
12570
+ }, function (_ref4) {
12571
+ var borderColor = _ref4.borderColor;
12572
+ return borderColor && "border: 1px solid " + borderColor;
12573
+ });
12574
+ var GoButton = styled__default(Button)(_templateObject7$A || (_templateObject7$A = _taggedTemplateLiteralLoose(["\n height: 24px;\n padding: 0 8px;\n margin-left: 8px;\n"])));
12575
+ var ArrowWrapper = styled__default.div(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 0 8px;\n"])));
12576
+ var ArrowButton = styled__default.button(_templateObject9$o || (_templateObject9$o = _taggedTemplateLiteralLoose(["\n ", ";\n width: 40px;\n height: 40px;\n padding: 12px;\n border-radius: 3px;\n box-shadow: 0 4px 9px 0 rgba(152, 174, 189, 0.07);\n border: solid 1px var(--grey-9);\n background-color: var(grey-2);\n pointer-events: ", ";\n opacity: ", ";\n\n &:focus, &:hover {\n outline: 2px solid #838383;\n }\n"])), resetButtonStyles, function (_ref5) {
12577
+ var active = _ref5.active;
12578
+ return active ? 'auto' : 'none';
12579
+ }, function (_ref6) {
12580
+ var active = _ref6.active;
12581
+ return active ? '1' : '0.5';
12582
+ });
12583
+ var ItemsSelectWrapper = styled__default.div(_templateObject10$k || (_templateObject10$k = _taggedTemplateLiteralLoose(["\n ", " {\n width: ", ";\n }\n margin-right: 35px;\n\n ", " {\n margin-bottom: 0;\n }\n"])), SelectWrapper, function (_ref7) {
12584
+ var width = _ref7.width;
12585
+ return width ? width : "60px";
12586
+ }, StyledLabel);
12587
+
12588
+ var Pagination = function Pagination(props) {
12589
+ var _props$pageText = props.pageText,
12590
+ pageText = _props$pageText === void 0 ? 'Page:' : _props$pageText,
12591
+ _props$totalPages = props.totalPages,
12592
+ totalPages = _props$totalPages === void 0 ? 199 : _props$totalPages,
12593
+ _props$activePage = props.activePage,
12594
+ activePage = _props$activePage === void 0 ? 1 : _props$activePage,
12595
+ _props$buttonText = props.buttonText,
12596
+ buttonText = _props$buttonText === void 0 ? 'GO' : _props$buttonText,
12597
+ _props$itemsText = props.itemsText,
12598
+ itemsText = _props$itemsText === void 0 ? 'Items Per Page' : _props$itemsText,
12599
+ _props$selectWidth = props.selectWidth,
12600
+ selectWidth = _props$selectWidth === void 0 ? '60px' : _props$selectWidth,
12601
+ _props$selectDisabled = props.selectDisabled,
12602
+ selectDisabled = _props$selectDisabled === void 0 ? false : _props$selectDisabled,
12603
+ _props$itemsOptions = props.itemsOptions,
12604
+ itemsOptions = _props$itemsOptions === void 0 ? [] : _props$itemsOptions,
12605
+ onPageChange = props.onPageChange,
12606
+ onItemsChange = props.onItemsChange;
12607
+
12608
+ var _useState = React.useState('default'),
12609
+ fieldState = _useState[0],
12610
+ setFieldState = _useState[1];
12611
+
12612
+ var _useState2 = React.useState(activePage.toString()),
12613
+ pageValue = _useState2[0],
12614
+ setPageValue = _useState2[1];
12615
+
12616
+ var _useState3 = React.useState(parseInt(pageValue) > totalPages && fieldState !== '' ? false : true),
12617
+ disableGo = _useState3[0],
12618
+ setDisabledGo = _useState3[1];
12619
+
12620
+ var _useState4 = React.useState(false),
12621
+ shouldShake = _useState4[0],
12622
+ setShouldShake = _useState4[1];
12623
+
12624
+ var inputRef = React.useRef(null);
12625
+ var getValidWidth = React.useCallback(function () {
12626
+ return totalPages.toString().length * WIDTH_PER_NUMBER + WIDTH_PER_NUMBER / 2 + "px";
12627
+ }, [totalPages]);
12628
+ var isValidInput = React.useCallback(function (value) {
12629
+ if (isNotNumber(value)) {
12630
+ return false;
12631
+ }
12632
+
12633
+ if (parseInt(value) > totalPages) {
12634
+ return false;
12635
+ }
12636
+
12637
+ if (parseInt(value) <= 0) {
12638
+ return false;
12639
+ }
12640
+
12641
+ if (value === '') {
12642
+ return false;
12643
+ }
12644
+
12645
+ return true;
12646
+ }, [totalPages]);
12647
+ var onInputChange = React.useCallback(function (_ref8) {
12648
+ var value = _ref8.target.value;
12649
+ setShouldShake(false);
12650
+
12651
+ if (isNotNumber(value)) {
12652
+ return;
12653
+ }
12654
+
12655
+ var validDigitValue = value === '' ? '' : Number(value.slice(-totalPages.toString().length)).toString();
12656
+ setPageValue(validDigitValue);
12657
+
12658
+ if (isValidInput(validDigitValue)) {
12659
+ setFieldState('processing');
12660
+ setDisabledGo(false);
12661
+ } else {
12662
+ setFieldState('invalid');
12663
+ setDisabledGo(true);
12664
+ setShouldShake(true);
12665
+ }
12666
+ }, [isValidInput, totalPages]);
12667
+
12668
+ var _onBlur = React.useCallback(function (_ref9) {
12669
+ var value = _ref9.target.value;
12670
+
12671
+ if (value === '') {
12672
+ setPageValue(activePage.toString());
12673
+ } else if (isValidInput(value) && parseInt(value) !== activePage) {
12674
+ setDisabledGo(false);
12675
+ setFieldState('processing');
12676
+ return;
12677
+ } else if (!isValidInput(value)) {
12678
+ setFieldState('invalid');
12679
+ setDisabledGo(true);
12680
+ return;
12681
+ }
12682
+
12683
+ setFieldState('default');
12684
+ }, [activePage, isValidInput]);
12685
+
12686
+ var handleKeyDown = function handleKeyDown(event) {
12687
+ if (event.key === 'Enter' && isValidInput(pageValue)) {
12688
+ onClickGo();
12689
+ }
12690
+ };
12691
+
12692
+ var _onFocus = function onFocus(_ref10) {
12693
+ var value = _ref10.target.value;
12694
+
12695
+ if (isValidInput(value)) {
12696
+ setFieldState('processing');
12697
+ } else {
12698
+ setFieldState('invalid');
12699
+ setDisabledGo(true);
12700
+ }
12701
+ };
12702
+
12703
+ var getStateColor = React.useCallback(function (state) {
12704
+ switch (state) {
12705
+ case 'processing':
12706
+ return 'var(--primary-7)';
12707
+
12708
+ case 'invalid':
12709
+ return 'var(--warning-8)';
12710
+
12711
+ case 'default':
12712
+ default:
12713
+ return 'var(--grey-9)';
12714
+ }
12715
+ }, []);
12716
+ var onClickGo = React.useCallback(function () {
12717
+ onPageChange(parseInt(pageValue));
12718
+ inputRef.current && inputRef.current.blur();
12719
+ setDisabledGo(true);
12720
+ setFieldState('default');
12721
+ }, [onPageChange, pageValue]);
12722
+
12723
+ var handlePageChange = function handlePageChange(value) {
12724
+ onPageChange(value);
12725
+ setPageValue(value.toString());
12726
+ };
12727
+
12728
+ var onItemsSelectChange = React.useCallback(function (value) {
12729
+ onItemsChange(Number(value));
12730
+ }, [onItemsChange]);
12731
+
12732
+ var handlePaste = function handlePaste(e) {
12733
+ var clipboardData = e.clipboardData || window.clipboardData;
12734
+ var pastedText = clipboardData.getData('text');
12735
+
12736
+ if (!/^\d+$/.test(pastedText)) {
12737
+ e.preventDefault();
12738
+ }
12739
+ };
12740
+
12741
+ return React__default.createElement(PaginationContainer, null, React__default.createElement(ItemsSelectWrapper, {
12742
+ width: selectWidth
12743
+ }, React__default.createElement(SelectField, {
12744
+ disabled: selectDisabled,
12745
+ label: {
12746
+ htmlFor: 'paginationPages',
12747
+ text: itemsText,
12748
+ isSameRow: true
12749
+ },
12750
+ defaultValue: 1,
12751
+ changeCallback: onItemsSelectChange
12752
+ }, React__default.createElement(React.Fragment, null, itemsOptions.map(function (_ref11, index) {
12753
+ var value = _ref11.value,
12754
+ textValue = _ref11.textValue;
12755
+ return React__default.createElement("option", {
12756
+ key: index,
12757
+ value: value
12758
+ }, textValue);
12759
+ })))), React__default.createElement(PageLabel, {
12760
+ htmlFor: 'goButton'
12761
+ }, pageText), React__default.createElement(InputContainer$2, {
12762
+ borderColor: getStateColor(fieldState),
12763
+ shouldShake: shouldShake
12764
+ }, React__default.createElement(StyledInput$3, {
12765
+ ref: inputRef,
12766
+ value: pageValue,
12767
+ onChange: function onChange(e) {
12768
+ return onInputChange(e);
12769
+ },
12770
+ textColor: getStateColor(fieldState),
12771
+ onFocus: function onFocus(e) {
12772
+ return _onFocus(e);
12773
+ },
12774
+ onBlur: function onBlur(e) {
12775
+ return _onBlur(e);
12776
+ },
12777
+ onPaste: function onPaste(e) {
12778
+ return handlePaste(e);
12779
+ },
12780
+ onKeyDown: handleKeyDown,
12781
+ maxWidth: getValidWidth()
12782
+ }), React__default.createElement(StaticPageCount, null, '/' + "\xA0" + totalPages.toString()), React__default.createElement(GoButton, {
12783
+ id: 'goButton',
12784
+ size: 'small',
12785
+ design: 'primary',
12786
+ disabled: disableGo,
12787
+ onClick: onClickGo
12788
+ }, buttonText)), React__default.createElement(ArrowWrapper, null, React__default.createElement(ArrowButton, {
12789
+ onClick: function onClick() {
12790
+ return handlePageChange(activePage - 1);
12791
+ },
12792
+ disabled: activePage <= 1,
12793
+ active: fieldState === 'default' && activePage > 1
12794
+ }, React__default.createElement(Icon, {
12795
+ icon: 'Left',
12796
+ color: 'dimmed',
12797
+ size: 8
12798
+ })), React__default.createElement(ArrowButton, {
12799
+ onClick: function onClick() {
12800
+ return handlePageChange(activePage + 1);
12801
+ },
12802
+ disabled: activePage >= totalPages,
12803
+ active: fieldState === 'default' && activePage < totalPages
12804
+ }, React__default.createElement(Icon, {
12805
+ icon: 'Right',
12806
+ color: 'dimmed',
12807
+ size: 8
12808
+ }))));
12809
+ };
12810
+
12811
+ var _templateObject$1l, _templateObject2$1a, _templateObject3$11, _templateObject4$X, _templateObject5$R;
12812
+ var Container$T = styled__default.div(_templateObject$1l || (_templateObject$1l = _taggedTemplateLiteralLoose([""])));
12813
+ var Title$7 = styled__default.div(_templateObject2$1a || (_templateObject2$1a = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
12568
12814
  var typography = _ref.theme.typography;
12569
12815
  return typography.modal.title;
12570
12816
  });
12571
- var MessageBox$1 = styled__default.div(_templateObject3$10 || (_templateObject3$10 = _taggedTemplateLiteralLoose(["\n ", ";\n margin: 28px 0;\n"])), function (_ref2) {
12817
+ var MessageBox$1 = styled__default.div(_templateObject3$11 || (_templateObject3$11 = _taggedTemplateLiteralLoose(["\n ", ";\n margin: 28px 0;\n"])), function (_ref2) {
12572
12818
  var typography = _ref2.theme.typography;
12573
12819
  return typography.modal.basicContent;
12574
12820
  });
12575
- var StyledButton$6 = styled__default(Button)(_templateObject4$W || (_templateObject4$W = _taggedTemplateLiteralLoose(["\n margin-left: 10px;\n"])));
12576
- var ButtonsGroup$1 = styled__default.div(_templateObject5$Q || (_templateObject5$Q = _taggedTemplateLiteralLoose(["\n text-align: right;\n"])));
12821
+ var StyledButton$6 = styled__default(Button)(_templateObject4$X || (_templateObject4$X = _taggedTemplateLiteralLoose(["\n margin-left: 10px;\n"])));
12822
+ var ButtonsGroup$1 = styled__default.div(_templateObject5$R || (_templateObject5$R = _taggedTemplateLiteralLoose(["\n text-align: right;\n"])));
12577
12823
 
12578
12824
  var ConfirmationModal = function ConfirmationModal(_ref3) {
12579
12825
  var _ref3$title = _ref3.title,
@@ -12615,123 +12861,248 @@ var ConfirmationModal = function ConfirmationModal(_ref3) {
12615
12861
  }, rightButtonText)));
12616
12862
  };
12617
12863
 
12618
- var _templateObject$1j, _templateObject2$1a, _templateObject3$11, _templateObject4$X, _templateObject5$R, _templateObject6$D;
12864
+ var _templateObject$1m, _templateObject2$1b, _templateObject3$12, _templateObject4$Y, _templateObject5$S, _templateObject6$E, _templateObject7$B, _templateObject8$w, _templateObject9$p, _templateObject10$l, _templateObject11$d, _templateObject12$a;
12865
+ var Container$U = styled__default.div(_templateObject$1m || (_templateObject$1m = _taggedTemplateLiteralLoose(["\n max-width: var(--max-content-width);\n margin-top: var(--utility-header-padding-top);\n padding: 0 var(--content-layout-padding-right) 0 var(--content-layout-padding-left);\n height: 48px;\n width: 100%;\n display: flex;\n"])));
12866
+ var LeftArea = styled__default.div(_templateObject2$1b || (_templateObject2$1b = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: var(--columnPadding, 16px);\n flex: 1 0 0;\n"])));
12867
+ var BackLinkIcon = styled__default.div(_templateObject3$12 || (_templateObject3$12 = _taggedTemplateLiteralLoose(["\n display: flex;\n width: 16px;\n height: 16px;\n justify-content: center;\n align-items: center;\n flex: 1; \n > div {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
12868
+ var BackLink = styled__default(reactRouterDom.Link)(_templateObject4$Y || (_templateObject4$Y = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n padding: 0;\n align-items: center;\n gap: 8px;\n color: var(--grey-10);\n text-align: center;\n font-family: var(--font-ui);\n font-size: 12px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n border: none;\n background: none;\n text-decoration: none;\n transition: color 0.25s ease;\n margin-left: ", ";\n\n ", "{\n svg * {\n transition: stroke 0.25s ease;\n }\n }\n \n &:hover {\n color: var(--grey-12);\n ", "{\n svg * {\n stroke: var(--grey-12);\n }\n }\n }\n\n ", "\n"])), function (props) {
12869
+ return props.$iconInGutter ? '-24px' : '0';
12870
+ }, BackLinkIcon, BackLinkIcon, function (_ref) {
12871
+ var $showDivider = _ref.$showDivider;
12872
+ return $showDivider && styled.css(_templateObject5$S || (_templateObject5$S = _taggedTemplateLiteralLoose(["\n &::after {\n content: '';\n display: inline-block;\n height: 12px;\n width: 1px;\n padding-left: 8px;\n border-right: 1px solid var(--grey-10);\n }\n "])));
12873
+ });
12874
+ var ExtraActionIcon = styled__default.div(_templateObject6$E || (_templateObject6$E = _taggedTemplateLiteralLoose(["\n display: flex;\n width: 16px;\n height: 16px;\n justify-content: center;\n align-items: center;\n"])));
12875
+ var ExtraAction = styled__default.button(_templateObject7$B || (_templateObject7$B = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n padding: 0;\n align-items: center;\n gap: 8px;\n color: var(--grey-10);\n text-align: center;\n font-family: var(--font-ui);\n font-size: 12px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n border: none;\n background: none;\n text-decoration: none;\n transition: color 0.25s ease;\n cursor: pointer;\n\n ", "{\n svg * {\n transition: stroke 0.25s ease;\n }\n }\n \n &:hover {\n color: var(--grey-12);\n ", "{\n svg * {\n stroke: var(--grey-12);\n }\n }\n }\n\n"])), ExtraActionIcon, ExtraActionIcon);
12876
+ var Breadcrumbs = styled__default.div(_templateObject8$w || (_templateObject8$w = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"])));
12877
+ var Breadcrumb = styled__default.div(_templateObject9$p || (_templateObject9$p = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n\n"])));
12878
+ var BreadcrumbIcon = styled__default.div(_templateObject10$l || (_templateObject10$l = _taggedTemplateLiteralLoose(["\n flex: 0;\n display: flex;\n align-items: center;\n\n > div {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n"])));
12879
+ var BreadcrumbLink = styled__default(reactRouterDom.Link)(_templateObject11$d || (_templateObject11$d = _taggedTemplateLiteralLoose(["\n flex: 1;\n color: var(--grey-10);\n font-family: var(--font-ui);\n text-decoration: none;\n font-size: 12px;\n font-style: normal;\n font-weight: 500;\n line-height: 12px; /* 100% */\n transition: color 0.25s ease;\n &:hover {\n color: var(--grey-12);\n }\n"])));
12880
+ var RightArea = styled__default.div(_templateObject12$a || (_templateObject12$a = _taggedTemplateLiteralLoose(["\n flex: 1;\n align-items: center;\n display: flex;\n justify-content: right;\n"])));
12881
+
12882
+ var UtilityHeader = function UtilityHeader(_ref2) {
12883
+ var _ref2$showBreadcrumbs = _ref2.showBreadcrumbs,
12884
+ showBreadcrumbs = _ref2$showBreadcrumbs === void 0 ? true : _ref2$showBreadcrumbs,
12885
+ _ref2$breadcrumbs = _ref2.breadcrumbs,
12886
+ breadcrumbs = _ref2$breadcrumbs === void 0 ? [] : _ref2$breadcrumbs,
12887
+ backLink = _ref2.backLink,
12888
+ _ref2$$iconInGutter = _ref2.$iconInGutter,
12889
+ $iconInGutter = _ref2$$iconInGutter === void 0 ? true : _ref2$$iconInGutter,
12890
+ _ref2$showShareLink = _ref2.showShareLink,
12891
+ showShareLink = _ref2$showShareLink === void 0 ? false : _ref2$showShareLink,
12892
+ shareLink = _ref2.shareLink;
12893
+
12894
+ var _useState = React.useState("Share"),
12895
+ copyActionText = _useState[0],
12896
+ setCopyActionText = _useState[1];
12897
+
12898
+ var _useCopyToClipboard = useCopyToClipboard(),
12899
+ copyToClipboard = _useCopyToClipboard.copyToClipboard;
12900
+
12901
+ var hasBreadcrumbs = showBreadcrumbs && breadcrumbs.length > 0;
12902
+ var clickHandlerShareLink = React.useCallback(function () {
12903
+ copyToClipboard(shareLink ? shareLink : window.location.href);
12904
+ setCopyActionText("Copied");
12905
+ setTimeout(function () {
12906
+ return setCopyActionText("Share");
12907
+ }, 2000);
12908
+ }, [shareLink, copyToClipboard]);
12909
+ return React__default.createElement(Container$U, null, React__default.createElement(LeftArea, null, backLink ? React__default.createElement(BackLink, Object.assign({
12910
+ to: backLink,
12911
+ "$showDivider": hasBreadcrumbs
12912
+ }, {
12913
+ $iconInGutter: $iconInGutter
12914
+ }), React__default.createElement(BackLinkIcon, null, React__default.createElement(Icon, {
12915
+ icon: "Back",
12916
+ size: 16,
12917
+ color: "grey-10"
12918
+ })), "Back") : null, hasBreadcrumbs ? React__default.createElement(Breadcrumbs, null, breadcrumbs.map(function (breadcrumb, index) {
12919
+ var text = breadcrumb.text,
12920
+ href = breadcrumb.href;
12921
+ var isLast = index === breadcrumbs.length - 1;
12922
+ return React__default.createElement(React__default.Fragment, {
12923
+ key: index
12924
+ }, React__default.createElement(Breadcrumb, null, React__default.createElement(BreadcrumbLink, {
12925
+ to: href
12926
+ }, text), !isLast ? React__default.createElement(BreadcrumbIcon, null, React__default.createElement(Icon, {
12927
+ icon: "Right",
12928
+ size: 6,
12929
+ color: 'grey-8'
12930
+ })) : null));
12931
+ })) : null), React__default.createElement(RightArea, null, showShareLink ? React__default.createElement(ExtraAction, {
12932
+ onClick: clickHandlerShareLink
12933
+ }, React__default.createElement(ExtraActionIcon, null, React__default.createElement(Icon, {
12934
+ icon: "Link",
12935
+ size: 16,
12936
+ color: "grey-10"
12937
+ })), copyActionText) : null));
12938
+ };
12939
+
12940
+ var TabContext = React__default.createContext({
12941
+ selected: '',
12942
+ setSelected: function setSelected() {}
12943
+ });
12944
+
12945
+ var Tabs = function Tabs(_ref) {
12946
+ var children = _ref.children;
12947
+
12948
+ var _useState = React.useState(''),
12949
+ selected = _useState[0],
12950
+ setSelected = _useState[1];
12951
+
12952
+ return React__default.createElement(TabContext.Provider, {
12953
+ value: {
12954
+ selected: selected,
12955
+ setSelected: setSelected
12956
+ }
12957
+ }, children);
12958
+ };
12959
+
12960
+ var _templateObject$1n, _templateObject2$1c, _templateObject3$13, _templateObject4$Z, _templateObject5$T;
12961
+ var Container$V = styled__default.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex-direction: column;\n position: relative;\n"])));
12962
+ var HeaderArea = styled__default.div(_templateObject2$1c || (_templateObject2$1c = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: var(--max-content-width);\n padding: \n 24px\n var(--content-layout-padding-right)\n 32px\n var(--content-layout-padding-left);\n \n"])));
12963
+ var TabArea = styled__default.div(_templateObject3$13 || (_templateObject3$13 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n border-bottom: 1px solid var(--grey-8);\n"])));
12964
+ var TabAreaInner = styled__default.div(_templateObject4$Z || (_templateObject4$Z = _taggedTemplateLiteralLoose(["\n max-width: var(--max-content-width);\n flex: 1;\n width: 100%;\n padding: \n 0\n var(--content-layout-padding-right)\n 0\n var(--content-layout-padding-left);\n"])));
12965
+ var Content = styled__default.div(_templateObject5$T || (_templateObject5$T = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-width: var(--max-content-width);\n padding: \n var(--content-layout-padding-top)\n var(--content-layout-padding-right)\n var(--content-layout-padding-bottom)\n var(--content-layout-padding-left);\n"])));
12966
+
12967
+ var ContentLayout = function ContentLayout(_ref) {
12968
+ var _ref$layout = _ref.layout,
12969
+ layout = _ref$layout === void 0 ? 'default' : _ref$layout,
12970
+ _ref$HeaderContent = _ref.HeaderContent,
12971
+ HeaderContent = _ref$HeaderContent === void 0 ? {} : _ref$HeaderContent,
12972
+ children = _ref.children;
12973
+ var PageHeaderArea = HeaderContent.PageHeaderArea,
12974
+ TabsElementArea = HeaderContent.TabsElementArea,
12975
+ UtilityHeaderOptions = HeaderContent.UtilityHeaderOptions;
12976
+ var containerClass = 'content-layout-' + layout;
12977
+ return React__default.createElement(Container$V, {
12978
+ className: containerClass
12979
+ }, UtilityHeaderOptions ? React__default.createElement(UtilityHeader, Object.assign({}, UtilityHeaderOptions)) : null, PageHeaderArea ? React__default.createElement(HeaderArea, null, PageHeaderArea) : null, TabsElementArea ? React__default.createElement(Tabs, null, React__default.createElement(TabArea, null, React__default.createElement(TabAreaInner, null, TabsElementArea)), React__default.createElement(Content, null, children)) : React__default.createElement(Content, null, children));
12980
+ };
12981
+
12982
+ var _templateObject$1o, _templateObject2$1d;
12983
+ var FullWidthContainer = styled__default.div(_templateObject$1o || (_templateObject$1o = _taggedTemplateLiteralLoose(["\n min-height: ", ";\n"])), function (_ref) {
12984
+ var $contentHeight = _ref.$contentHeight;
12985
+ return $contentHeight + 'px';
12986
+ });
12987
+ var FullWidthInner = styled__default.div(_templateObject2$1d || (_templateObject2$1d = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n right: 0;\n input {width: 100%;}\n"])));
12988
+
12989
+ var FullWidthContentBlock = function FullWidthContentBlock(_ref2) {
12990
+ var children = _ref2.children;
12991
+ var innerElement = React.useRef(null);
12992
+
12993
+ var _useState = React.useState(0),
12994
+ contentHeight = _useState[0],
12995
+ setContentHeight = _useState[1];
12996
+
12997
+ React.useEffect(function () {
12998
+ if (innerElement && innerElement.current) {
12999
+ setContentHeight(innerElement.current.clientHeight);
13000
+ }
13001
+ }, [innerElement, children]);
13002
+ return React__default.createElement(FullWidthContainer, {
13003
+ "$contentHeight": contentHeight
13004
+ }, React__default.createElement(FullWidthInner, {
13005
+ ref: innerElement
13006
+ }, children));
13007
+ };
13008
+
13009
+ var _templateObject$1p, _templateObject2$1e, _templateObject3$14, _templateObject4$_, _templateObject5$U, _templateObject6$F, _templateObject7$C;
12619
13010
  var MOBILE_CLOSE_HEIGHT = 50;
12620
13011
  var MOBILE_NAVBAR_HEIGHT = 68;
12621
- var Layout = styled__default.div(_templateObject$1j || (_templateObject$1j = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n height: 100%;\n ", ";\n"])), function (_ref) {
13012
+ var Layout = styled__default.div(_templateObject$1p || (_templateObject$1p = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n height: 100%;\n ", ";\n"])), function (_ref) {
12622
13013
  var theme = _ref.theme;
12623
13014
  return theme.styles.global.background;
12624
13015
  });
12625
- var MobileLayout = styled__default.div(_templateObject2$1a || (_templateObject2$1a = _taggedTemplateLiteralLoose([""])));
12626
- var Content = styled__default.div(_templateObject3$11 || (_templateObject3$11 = _taggedTemplateLiteralLoose(["\n padding: ", ";\n flex: 1;\n overflow: auto;\n\n & > div {\n max-width: 1400px;\n }\n\n ", "\n"])), function (_ref2) {
12627
- var _ref2$padBottom = _ref2.padBottom,
12628
- padBottom = _ref2$padBottom === void 0 ? true : _ref2$padBottom;
12629
- return padBottom ? '70px 90px' : '70px 90px 0';
12630
- }, function (_ref3) {
12631
- var maxWidth = _ref3.maxWidth;
12632
- return maxWidth && styled.css(_templateObject4$X || (_templateObject4$X = _taggedTemplateLiteralLoose(["\n & > div {\n max-width: ", ";\n }\n "])), maxWidth);
12633
- });
12634
- var MainContainer = styled__default.div(_templateObject5$R || (_templateObject5$R = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"])));
12635
- var ContentArea = styled__default.div(_templateObject6$D || (_templateObject6$D = _taggedTemplateLiteralLoose(["\n flex: 1;\n width: 100%;\n padding: ", ";\n margin-left: auto;\n margin-right: auto;\n\n @media ", " {\n padding: ", ";\n }\n\n @media ", " {\n max-width: ", ";\n padding: ", ";\n }\n"])), function (_ref4) {
12636
- var paddingOverride = _ref4.paddingOverride;
12637
- return paddingOverride ? paddingOverride : '40px 20px';
12638
- }, deviceMediaQuery.medium, function (_ref5) {
12639
- var paddingOverride = _ref5.paddingOverride;
12640
- return paddingOverride ? paddingOverride : '40px';
12641
- }, deviceMediaQuery.large, function (_ref6) {
12642
- var maxWidth = _ref6.maxWidth;
12643
- return maxWidth ? maxWidth : "1200px";
12644
- }, function (_ref7) {
12645
- var paddingOverride = _ref7.paddingOverride;
12646
- return paddingOverride ? paddingOverride : '70px 90px';
13016
+ var MobileLayout = styled__default.div(_templateObject2$1e || (_templateObject2$1e = _taggedTemplateLiteralLoose([""])));
13017
+ var Content$1 = styled__default.div(_templateObject3$14 || (_templateObject3$14 = _taggedTemplateLiteralLoose(["\n padding: 0;\n flex: 1;\n overflow: auto;\n\n & > div {\n max-width: 1400px;\n }\n\n ", "\n"])), function (_ref2) {
13018
+ var maxWidth = _ref2.maxWidth;
13019
+ return maxWidth && styled.css(_templateObject4$_ || (_templateObject4$_ = _taggedTemplateLiteralLoose(["\n & > div {\n max-width: ", ";\n }\n "])), maxWidth);
13020
+ });
13021
+ var MainContainer = styled__default.div(_templateObject5$U || (_templateObject5$U = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"])));
13022
+ var ContentArea = styled__default.div(_templateObject6$F || (_templateObject6$F = _taggedTemplateLiteralLoose(["\n flex: 1;\n width: 100%;\n margin-left: auto;\n margin-right: auto;\n\n ", "\n"])), function (_ref3) {
13023
+ var legacyLayout = _ref3.legacyLayout,
13024
+ paddingOverride = _ref3.paddingOverride,
13025
+ maxWidth = _ref3.maxWidth;
13026
+ return legacyLayout && styled.css(_templateObject7$C || (_templateObject7$C = _taggedTemplateLiteralLoose(["\n padding: ", ";\n\n @media ", " {\n padding: ", ";\n }\n\n @media ", " {\n max-width: ", ";\n padding: ", ";\n }\n "])), paddingOverride ? paddingOverride : '40px 20px', deviceMediaQuery.medium, paddingOverride ? paddingOverride : '40px', deviceMediaQuery.large, maxWidth ? maxWidth : "1200px", paddingOverride ? paddingOverride : '70px 90px');
12647
13027
  });
12648
13028
 
12649
- var _templateObject$1k, _templateObject2$1b, _templateObject3$12, _templateObject4$Y, _templateObject5$S, _templateObject6$E, _templateObject7$A, _templateObject8$v, _templateObject9$o, _templateObject10$k, _templateObject11$d, _templateObject12$a, _templateObject13$9, _templateObject14$7, _templateObject15$5, _templateObject16$5, _templateObject17$5, _templateObject18$3, _templateObject19$3, _templateObject20$3, _templateObject21$3;
12650
- var ContextTitle = styled__default.div(_templateObject$1k || (_templateObject$1k = _taggedTemplateLiteralLoose(["\n opacity: 0;\n\n ", "\n\n ", "\n"])), function (_ref) {
13029
+ var _templateObject$1q, _templateObject2$1f, _templateObject3$15, _templateObject4$$, _templateObject5$V, _templateObject6$G, _templateObject7$D, _templateObject8$x, _templateObject9$q, _templateObject10$m, _templateObject11$e, _templateObject12$b, _templateObject13$9, _templateObject14$7, _templateObject15$5, _templateObject16$5, _templateObject17$5, _templateObject18$3, _templateObject19$3, _templateObject20$3, _templateObject21$3;
13030
+ var ContextTitle = styled__default.div(_templateObject$1q || (_templateObject$1q = _taggedTemplateLiteralLoose(["\n opacity: 0;\n\n ", "\n\n ", "\n"])), function (_ref) {
12651
13031
  var theme = _ref.theme;
12652
- return styled.css(_templateObject2$1b || (_templateObject2$1b = _taggedTemplateLiteralLoose(["\n transition: opacity ", " ", ";\n "])), theme.animation.speed.fast, theme.animation.easing.primary.easeInOut);
13032
+ return styled.css(_templateObject2$1f || (_templateObject2$1f = _taggedTemplateLiteralLoose(["\n transition: opacity ", " ", ";\n "])), theme.animation.speed.fast, theme.animation.easing.primary.easeInOut);
12653
13033
  }, function (_ref2) {
12654
13034
  var compact = _ref2.compact;
12655
- return compact && styled.css(_templateObject3$12 || (_templateObject3$12 = _taggedTemplateLiteralLoose(["\n font-size:14px;\n "])));
13035
+ return compact && styled.css(_templateObject3$15 || (_templateObject3$15 = _taggedTemplateLiteralLoose(["\n font-size:14px;\n "])));
12656
13036
  });
12657
- var ContextIcon$1 = styled__default.div(_templateObject4$Y || (_templateObject4$Y = _taggedTemplateLiteralLoose(["\n ", ";\n\n flex: 0 0 40px;\n width: 40px;\n height: 40px;\n margin: 0 20px;\n\n border-radius: 7px;\n display:flex;\n justify-content:center;\n align-items:center;\n\n svg {\n display: block;\n }\n"])), function (_ref3) {
13037
+ var ContextIcon$1 = styled__default.div(_templateObject4$$ || (_templateObject4$$ = _taggedTemplateLiteralLoose(["\n ", ";\n\n flex: 0 0 40px;\n width: 40px;\n height: 40px;\n margin: 0 20px;\n\n border-radius: 7px;\n display:flex;\n justify-content:center;\n align-items:center;\n\n svg {\n display: block;\n }\n"])), function (_ref3) {
12658
13038
  var theme = _ref3.theme;
12659
- return styled.css(_templateObject5$S || (_templateObject5$S = _taggedTemplateLiteralLoose(["\n ", ";\n transition: background ", " ", ";\n "])), theme.styles.global.mainMenu.iconBackground["default"], theme.animation.speed.fast, theme.animation.easing.primary.easeInOut);
13039
+ return styled.css(_templateObject5$V || (_templateObject5$V = _taggedTemplateLiteralLoose(["\n ", ";\n transition: background ", " ", ";\n "])), theme.styles.global.mainMenu.iconBackground["default"], theme.animation.speed.fast, theme.animation.easing.primary.easeInOut);
12660
13040
  });
12661
- var ContextIndicator = styled__default.div(_templateObject6$E || (_templateObject6$E = _taggedTemplateLiteralLoose(["\n width: 12px;\n height: 12px;\n flex: 0 0 14px;\n margin: 0 20px 0 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n\n svg {\n display: block;\n height: 12px;\n width: 12px;\n }\n\n opacity: 0;\n\n ", "\n\n"])), function (_ref4) {
13041
+ var ContextIndicator = styled__default.div(_templateObject6$G || (_templateObject6$G = _taggedTemplateLiteralLoose(["\n width: 12px;\n height: 12px;\n flex: 0 0 14px;\n margin: 0 20px 0 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n\n svg {\n display: block;\n height: 12px;\n width: 12px;\n }\n\n opacity: 0;\n\n ", "\n\n"])), function (_ref4) {
12662
13042
  var theme = _ref4.theme;
12663
- return styled.css(_templateObject7$A || (_templateObject7$A = _taggedTemplateLiteralLoose(["\n transition: opacity 0 ", ";\n "])), theme.animation.easing.primary.easeInOut);
13043
+ return styled.css(_templateObject7$D || (_templateObject7$D = _taggedTemplateLiteralLoose(["\n transition: opacity 0 ", ";\n "])), theme.animation.easing.primary.easeInOut);
12664
13044
  });
12665
- var ContextActionBaseCSS$1 = styled.css(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n -webkit-tap-highlight-color: transparent;\n border: none;\n background: none;\n display: flex;\n justify-content:left;\n align-items:center;\n flex-wrap: wrap;\n cursor: pointer;\n width: 100%;\n outline: none;\n padding: 0;\n text-decoration: none;\n"])));
12666
- var StyledAnchor = styled__default.a(_templateObject9$o || (_templateObject9$o = _taggedTemplateLiteralLoose(["\n display: flex;\n text-decoration: none;\n"])));
12667
- var ExternalIconWrapper = styled__default.div(_templateObject10$k || (_templateObject10$k = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
12668
- var ContextWrapper = styled__default.div(_templateObject11$d || (_templateObject11$d = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke: ", ";\n }\n }\n }\n"])), ContextActionBaseCSS$1, function (_ref5) {
13045
+ var ContextActionBaseCSS$1 = styled.css(_templateObject8$x || (_templateObject8$x = _taggedTemplateLiteralLoose(["\n -webkit-tap-highlight-color: transparent;\n border: none;\n background: none;\n display: flex;\n justify-content:left;\n align-items:center;\n flex-wrap: wrap;\n cursor: pointer;\n width: 100%;\n outline: none;\n padding: 0;\n text-decoration: none;\n"])));
13046
+ var StyledAnchor = styled__default.a(_templateObject9$q || (_templateObject9$q = _taggedTemplateLiteralLoose(["\n display: flex;\n text-decoration: none;\n"])));
13047
+ var ExternalIconWrapper = styled__default.div(_templateObject10$m || (_templateObject10$m = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
13048
+ var ContextWrapper = styled__default.div(_templateObject11$e || (_templateObject11$e = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n"])), ContextActionBaseCSS$1, function (_ref5) {
12669
13049
  var theme = _ref5.theme;
12670
- return theme && styled.css(_templateObject12$a || (_templateObject12$a = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
13050
+ return theme && styled.css(_templateObject12$b || (_templateObject12$b = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
12671
13051
  }, function (_ref6) {
12672
13052
  var $menuOpen = _ref6.$menuOpen;
12673
13053
  return $menuOpen && styled.css(_templateObject13$9 || (_templateObject13$9 = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n"])), ContextTitle);
12674
13054
  }, ContextIcon$1, function (_ref7) {
12675
13055
  var theme = _ref7.theme;
12676
13056
  return theme.styles.global.mainMenu.iconBackground.hover;
12677
- }, IconWrapper, function (_ref8) {
13057
+ }, IconWrapper);
13058
+ var ContextActionA = styled__default(reactRouterDom.Link)(_templateObject14$7 || (_templateObject14$7 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref8) {
12678
13059
  var theme = _ref8.theme;
12679
- return theme.colors.icons['inverse'];
12680
- });
12681
- var ContextActionA = styled__default(reactRouterDom.Link)(_templateObject14$7 || (_templateObject14$7 = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke: ", ";\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref9) {
12682
- var theme = _ref9.theme;
12683
13060
  return theme && styled.css(_templateObject15$5 || (_templateObject15$5 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
12684
- }, function (_ref10) {
12685
- var $menuOpen = _ref10.$menuOpen;
13061
+ }, function (_ref9) {
13062
+ var $menuOpen = _ref9.$menuOpen;
12686
13063
  return $menuOpen && styled.css(_templateObject16$5 || (_templateObject16$5 = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n "])), ContextTitle);
12687
- }, ContextIcon$1, function (_ref11) {
12688
- var theme = _ref11.theme;
13064
+ }, ContextIcon$1, function (_ref10) {
13065
+ var theme = _ref10.theme;
12689
13066
  return theme.styles.global.mainMenu.iconBackground.hover;
12690
- }, IconWrapper, function (_ref12) {
12691
- var theme = _ref12.theme;
12692
- return theme.colors.icons['inverse'];
12693
- }, function (_ref13) {
12694
- var $isActive = _ref13.$isActive;
12695
- return $isActive && styled.css(_templateObject17$5 || (_templateObject17$5 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref14) {
12696
- var theme = _ref14.theme;
13067
+ }, IconWrapper, function (_ref11) {
13068
+ var $isActive = _ref11.$isActive;
13069
+ return $isActive && styled.css(_templateObject17$5 || (_templateObject17$5 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref12) {
13070
+ var theme = _ref12.theme;
12697
13071
  return theme.styles.global.mainMenu.iconBackground.active;
12698
13072
  });
12699
13073
  });
12700
- var ContextActionButton$1 = styled__default.button(_templateObject18$3 || (_templateObject18$3 = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke: ", ";\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref15) {
12701
- var theme = _ref15.theme;
13074
+ var ContextActionButton$1 = styled__default.button(_templateObject18$3 || (_templateObject18$3 = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref13) {
13075
+ var theme = _ref13.theme;
12702
13076
  return theme && styled.css(_templateObject19$3 || (_templateObject19$3 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
12703
- }, function (_ref16) {
12704
- var menuOpen = _ref16.menuOpen,
12705
- theme = _ref16.theme;
13077
+ }, function (_ref14) {
13078
+ var menuOpen = _ref14.menuOpen,
13079
+ theme = _ref14.theme;
12706
13080
  return menuOpen && styled.css(_templateObject20$3 || (_templateObject20$3 = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n\n ", "{\n opacity: 1;\n transition: opacity ", " ", " ", ";\n }\n "])), ContextTitle, ContextIndicator, theme.animation.speed.normal, theme.animation.easing.primary.easeInOut, theme.animation.speed.fast);
12707
- }, ContextIcon$1, function (_ref17) {
12708
- var theme = _ref17.theme;
13081
+ }, ContextIcon$1, function (_ref15) {
13082
+ var theme = _ref15.theme;
12709
13083
  return theme.styles.global.mainMenu.iconBackground.hover;
12710
- }, IconWrapper, function (_ref18) {
12711
- var theme = _ref18.theme;
12712
- return theme.colors.icons['inverse'];
12713
- }, function (_ref19) {
12714
- var isActive = _ref19.isActive;
12715
- return isActive && styled.css(_templateObject21$3 || (_templateObject21$3 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref20) {
12716
- var theme = _ref20.theme;
13084
+ }, IconWrapper, function (_ref16) {
13085
+ var isActive = _ref16.isActive;
13086
+ return isActive && styled.css(_templateObject21$3 || (_templateObject21$3 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref17) {
13087
+ var theme = _ref17.theme;
12717
13088
  return theme.styles.global.mainMenu.iconBackground.active;
12718
13089
  });
12719
13090
  });
12720
13091
 
12721
- var ContextItem = function ContextItem(_ref21) {
12722
- var _ref21$hasSubmenu = _ref21.hasSubmenu,
12723
- hasSubmenu = _ref21$hasSubmenu === void 0 ? false : _ref21$hasSubmenu,
12724
- _ref21$contextKey = _ref21.contextKey,
12725
- contextKey = _ref21$contextKey === void 0 ? -1 : _ref21$contextKey,
12726
- submenuOpen = _ref21.submenuOpen,
12727
- menuOpen = _ref21.menuOpen,
12728
- title = _ref21.title,
12729
- href = _ref21.href,
12730
- icon = _ref21.icon,
12731
- compact = _ref21.compact,
12732
- isActive = _ref21.isActive,
12733
- isExternalLink = _ref21.isExternalLink,
12734
- onClickCallback = _ref21.onClickCallback;
13092
+ var ContextItem = function ContextItem(_ref18) {
13093
+ var _ref18$hasSubmenu = _ref18.hasSubmenu,
13094
+ hasSubmenu = _ref18$hasSubmenu === void 0 ? false : _ref18$hasSubmenu,
13095
+ _ref18$contextKey = _ref18.contextKey,
13096
+ contextKey = _ref18$contextKey === void 0 ? -1 : _ref18$contextKey,
13097
+ submenuOpen = _ref18.submenuOpen,
13098
+ menuOpen = _ref18.menuOpen,
13099
+ title = _ref18.title,
13100
+ href = _ref18.href,
13101
+ icon = _ref18.icon,
13102
+ compact = _ref18.compact,
13103
+ isActive = _ref18.isActive,
13104
+ isExternalLink = _ref18.isExternalLink,
13105
+ onClickCallback = _ref18.onClickCallback;
12735
13106
  var internal = React__default.createElement(React__default.Fragment, null, React__default.createElement(ContextIcon$1, Object.assign({}, {
12736
13107
  compact: compact
12737
13108
  }), React__default.createElement(Icon, {
@@ -12908,27 +13279,27 @@ var useMenu = function useMenu(defaultMenuOpen, canAlwaysPin) {
12908
13279
  };
12909
13280
  };
12910
13281
 
12911
- var _templateObject$1l, _templateObject2$1c, _templateObject3$13, _templateObject4$Z, _templateObject5$T, _templateObject6$F, _templateObject7$B, _templateObject8$w, _templateObject9$p, _templateObject10$l, _templateObject11$e, _templateObject12$b, _templateObject13$a, _templateObject14$8, _templateObject15$6;
12912
- var Submenu = styled__default.ul(_templateObject$1l || (_templateObject$1l = _taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n margin-left: 40px;\n padding: 0;\n\n"])));
12913
- var SubmenuHeader = styled__default.div(_templateObject2$1c || (_templateObject2$1c = _taggedTemplateLiteralLoose(["\n display: block;\n height: 40px;\n margin-left: 40px;\n"])));
12914
- var SubmenuItemTitle = styled__default.span(_templateObject3$13 || (_templateObject3$13 = _taggedTemplateLiteralLoose(["\n display: block;\n ", ";\n\n"])), function (_ref) {
13282
+ var _templateObject$1r, _templateObject2$1g, _templateObject3$16, _templateObject4$10, _templateObject5$W, _templateObject6$H, _templateObject7$E, _templateObject8$y, _templateObject9$r, _templateObject10$n, _templateObject11$f, _templateObject12$c, _templateObject13$a, _templateObject14$8, _templateObject15$6;
13283
+ var Submenu = styled__default.ul(_templateObject$1r || (_templateObject$1r = _taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n margin-left: 40px;\n padding: 0;\n\n"])));
13284
+ var SubmenuHeader = styled__default.div(_templateObject2$1g || (_templateObject2$1g = _taggedTemplateLiteralLoose(["\n display: block;\n height: 40px;\n margin-left: 40px;\n"])));
13285
+ var SubmenuItemTitle = styled__default.span(_templateObject3$16 || (_templateObject3$16 = _taggedTemplateLiteralLoose(["\n display: block;\n ", ";\n\n"])), function (_ref) {
12915
13286
  var theme = _ref.theme;
12916
- return theme && styled.css(_templateObject4$Z || (_templateObject4$Z = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", "\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.subheader);
13287
+ return theme && styled.css(_templateObject4$10 || (_templateObject4$10 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", "\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.subheader);
12917
13288
  });
12918
- var SubmenuItemLink = styled__default(reactRouterDom.Link)(_templateObject5$T || (_templateObject5$T = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n"])), resetButtonStyles);
12919
- var ExternalIconWrapper$1 = styled__default.div(_templateObject6$F || (_templateObject6$F = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
12920
- var SubmenuItemAnchor = styled__default.a(_templateObject7$B || (_templateObject7$B = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n"])), resetButtonStyles);
12921
- var SubmenuItem = styled__default.li(_templateObject8$w || (_templateObject8$w = _taggedTemplateLiteralLoose(["\n display: block;\n height: 30px;\n padding-left: 40px;\n position: relative;\n\n &::after {\n display: block;\n content: '';\n height: 1px;\n width: 14px;\n position: absolute;\n left: 0;\n top: 10px;\n background: ", ";\n }\n\n ", ", ", "{\n\n ", ";\n\n\n\n }\n"])), function (_ref2) {
13289
+ var SubmenuItemLink = styled__default(reactRouterDom.Link)(_templateObject5$W || (_templateObject5$W = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n"])), resetButtonStyles);
13290
+ var ExternalIconWrapper$1 = styled__default.div(_templateObject6$H || (_templateObject6$H = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
13291
+ var SubmenuItemAnchor = styled__default.a(_templateObject7$E || (_templateObject7$E = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n"])), resetButtonStyles);
13292
+ var SubmenuItem = styled__default.li(_templateObject8$y || (_templateObject8$y = _taggedTemplateLiteralLoose(["\n display: block;\n height: 30px;\n padding-left: 40px;\n position: relative;\n\n &::after {\n display: block;\n content: '';\n height: 1px;\n width: 14px;\n position: absolute;\n left: 0;\n top: 10px;\n background: ", ";\n }\n\n ", ", ", "{\n\n ", ";\n\n\n\n }\n"])), function (_ref2) {
12922
13293
  var colors = _ref2.theme.colors;
12923
13294
  return colors.divider;
12924
13295
  }, SubmenuItemLink, SubmenuItemAnchor, function (_ref3) {
12925
13296
  var theme = _ref3.theme,
12926
13297
  isActive = _ref3.isActive;
12927
- return theme && styled.css(_templateObject9$p || (_templateObject9$p = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n\n &:hover {\n ", ";\n }\n\n ", "\n\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.subItem["default"], theme.typography.global.mainMenu.subItem.hover, isActive && styled.css(_templateObject10$l || (_templateObject10$l = _taggedTemplateLiteralLoose(["\n &, &:hover {\n ", ";\n }\n "])), theme.typography.global.mainMenu.subItem.active));
13298
+ return theme && styled.css(_templateObject9$r || (_templateObject9$r = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n\n &:hover {\n ", ";\n }\n\n ", "\n\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.subItem["default"], theme.typography.global.mainMenu.subItem.hover, isActive && styled.css(_templateObject10$n || (_templateObject10$n = _taggedTemplateLiteralLoose(["\n &, &:hover {\n ", ";\n }\n "])), theme.typography.global.mainMenu.subItem.active));
12928
13299
  });
12929
- var SubmenuContainer = styled__default.div(_templateObject11$e || (_templateObject11$e = _taggedTemplateLiteralLoose(["\n ", ";\n\n position: relative;\n overflow: hidden;\n\n &::after {\n display: block;\n content: '';\n width: 1px;\n position: absolute;\n left: 40px;\n top: 0;\n bottom: 35px;\n background: ", ";\n }\n\n"])), function (_ref4) {
13300
+ var SubmenuContainer = styled__default.div(_templateObject11$f || (_templateObject11$f = _taggedTemplateLiteralLoose(["\n ", ";\n\n position: relative;\n overflow: hidden;\n\n &::after {\n display: block;\n content: '';\n width: 1px;\n position: absolute;\n left: 40px;\n top: 0;\n bottom: 35px;\n background: ", ";\n }\n\n"])), function (_ref4) {
12930
13301
  var theme = _ref4.theme;
12931
- return theme && styled.css(_templateObject12$b || (_templateObject12$b = _taggedTemplateLiteralLoose(["\n transition:\n max-height ", " ", ",\n opacity ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeOut, theme.animation.speed.fast, theme.animation.easing.primary.easeOut);
13302
+ return theme && styled.css(_templateObject12$c || (_templateObject12$c = _taggedTemplateLiteralLoose(["\n transition:\n max-height ", " ", ",\n opacity ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeOut, theme.animation.speed.fast, theme.animation.easing.primary.easeOut);
12932
13303
  }, function (_ref5) {
12933
13304
  var colors = _ref5.theme.colors;
12934
13305
  return colors.divider;
@@ -13055,24 +13426,24 @@ var generateSubmenus = function generateSubmenus(submenu, onClickCallback) {
13055
13426
  return output;
13056
13427
  };
13057
13428
 
13058
- var _templateObject$1m, _templateObject2$1d, _templateObject3$14, _templateObject4$_, _templateObject5$U, _templateObject6$G, _templateObject7$C, _templateObject8$x, _templateObject9$q, _templateObject10$m, _templateObject11$f, _templateObject12$c, _templateObject13$b, _templateObject14$9, _templateObject15$7;
13059
- var Logo = styled__default(reactRouterDom.Link)(_templateObject$1m || (_templateObject$1m = _taggedTemplateLiteralLoose(["\n height: 50px;\n margin: 0 20px 55px 15px;\n display: flex;\n\n object {\n pointer-events: none;\n }\n"])));
13060
- var LogoMark = styled__default.div(_templateObject2$1d || (_templateObject2$1d = _taggedTemplateLiteralLoose(["\n height: 50px;\n flex: 0 0 50px;\n margin-right: 15px;\n display: flex;\n justify-content: center;\n align-items: center;\n\n"])));
13061
- var LogoType = styled__default.div(_templateObject3$14 || (_templateObject3$14 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n flex: 1;\n height: 50px;\n display: flex;\n justify-content: left;\n align-items: center;\n"])));
13062
- var SVGObject = styled__default.object(_templateObject4$_ || (_templateObject4$_ = _taggedTemplateLiteralLoose([""])));
13063
- var SVGObjectText = styled__default.object(_templateObject5$U || (_templateObject5$U = _taggedTemplateLiteralLoose(["\n max-width: 180px;\n"])));
13064
- var NavigationContainer = styled__default.div(_templateObject6$G || (_templateObject6$G = _taggedTemplateLiteralLoose([""])));
13065
- var MenuFooter = styled__default.div(_templateObject7$C || (_templateObject7$C = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n flex-direction: column;\n flex: 1;\n justify-content: flex-end;\n"])), function (_ref) {
13429
+ var _templateObject$1s, _templateObject2$1h, _templateObject3$17, _templateObject4$11, _templateObject5$X, _templateObject6$I, _templateObject7$F, _templateObject8$z, _templateObject9$s, _templateObject10$o, _templateObject11$g, _templateObject12$d, _templateObject13$b, _templateObject14$9, _templateObject15$7;
13430
+ var Logo = styled__default(reactRouterDom.Link)(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteralLoose(["\n height: 50px;\n margin: 0 20px 55px 15px;\n display: flex;\n\n object {\n pointer-events: none;\n }\n"])));
13431
+ var LogoMark = styled__default.div(_templateObject2$1h || (_templateObject2$1h = _taggedTemplateLiteralLoose(["\n height: 50px;\n flex: 0 0 50px;\n margin-right: 15px;\n display: flex;\n justify-content: center;\n align-items: center;\n\n"])));
13432
+ var LogoType = styled__default.div(_templateObject3$17 || (_templateObject3$17 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n flex: 1;\n height: 50px;\n display: flex;\n justify-content: left;\n align-items: center;\n"])));
13433
+ var SVGObject = styled__default.object(_templateObject4$11 || (_templateObject4$11 = _taggedTemplateLiteralLoose([""])));
13434
+ var SVGObjectText = styled__default.object(_templateObject5$X || (_templateObject5$X = _taggedTemplateLiteralLoose(["\n max-width: 180px;\n"])));
13435
+ var NavigationContainer = styled__default.div(_templateObject6$I || (_templateObject6$I = _taggedTemplateLiteralLoose([""])));
13436
+ var MenuFooter = styled__default.div(_templateObject7$F || (_templateObject7$F = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n flex-direction: column;\n flex: 1;\n justify-content: flex-end;\n"])), function (_ref) {
13066
13437
  var theme = _ref.theme;
13067
- return theme && styled.css(_templateObject8$x || (_templateObject8$x = _taggedTemplateLiteralLoose(["\n ", "\n "])), theme.styles.global.mainMenu.footerBackground);
13438
+ return theme && styled.css(_templateObject8$z || (_templateObject8$z = _taggedTemplateLiteralLoose(["\n ", "\n "])), theme.styles.global.mainMenu.footerBackground);
13068
13439
  });
13069
- var FooterItemContainer = styled__default.div(_templateObject9$q || (_templateObject9$q = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n"])));
13070
- var PushContainer = styled__default.div(_templateObject10$m || (_templateObject10$m = _taggedTemplateLiteralLoose(["\n position: relative;\n height: 100%;\n ", ";\n"])), function (_ref2) {
13440
+ var FooterItemContainer = styled__default.div(_templateObject9$s || (_templateObject9$s = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n"])));
13441
+ var PushContainer = styled__default.div(_templateObject10$o || (_templateObject10$o = _taggedTemplateLiteralLoose(["\n position: relative;\n height: 100%;\n ", ";\n"])), function (_ref2) {
13071
13442
  var theme = _ref2.theme,
13072
13443
  isPinned = _ref2.isPinned;
13073
- return theme && styled.css(_templateObject11$f || (_templateObject11$f = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), isPinned ? theme.dimensions.global.mainMenu.width.open : theme.dimensions.global.mainMenu.width.closed);
13444
+ return theme && styled.css(_templateObject11$g || (_templateObject11$g = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), isPinned ? theme.dimensions.global.mainMenu.width.open : theme.dimensions.global.mainMenu.width.closed);
13074
13445
  });
13075
- var Container$U = styled__default.div(_templateObject12$c || (_templateObject12$c = _taggedTemplateLiteralLoose(["\n z-index: 99;\n position: fixed;\n top: 0;\n left: 0;\n ", "\n\n box-sizing: border-box;\n height: 100%;\n padding: 20px 0 0 0;\n overflow: hidden;\n"])), function (_ref3) {
13446
+ var Container$W = styled__default.div(_templateObject12$d || (_templateObject12$d = _taggedTemplateLiteralLoose(["\n z-index: 99;\n position: fixed;\n top: 0;\n left: 0;\n ", "\n\n box-sizing: border-box;\n height: 100%;\n padding: 20px 0 0 0;\n overflow: hidden;\n"])), function (_ref3) {
13076
13447
  var theme = _ref3.theme,
13077
13448
  open = _ref3.open,
13078
13449
  desktopSize = _ref3.desktopSize;
@@ -13153,7 +13524,7 @@ var MainMenu = function MainMenu(_ref5) {
13153
13524
  }, [checkedInItems, content]);
13154
13525
  return React__default.createElement(PushContainer, {
13155
13526
  isPinned: menuState.isMenuPinned
13156
- }, ReactDom.createPortal(React__default.createElement(Container$U, {
13527
+ }, ReactDom.createPortal(React__default.createElement(Container$W, {
13157
13528
  open: menuState.isMenuOpen,
13158
13529
  desktopSize: menuState.desktopSize,
13159
13530
  onPointerEnter: menuState.isMenuPinned ? function () {} : autoMenuOpen,
@@ -13200,26 +13571,26 @@ var MainMenu = function MainMenu(_ref5) {
13200
13571
  })) : null))), document.body));
13201
13572
  };
13202
13573
 
13203
- var _templateObject$1n, _templateObject2$1e, _templateObject3$15, _templateObject4$$, _templateObject5$V, _templateObject6$H, _templateObject7$D, _templateObject8$y, _templateObject9$r, _templateObject10$n, _templateObject11$g;
13204
- var MetaConatiner = styled__default.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteralLoose(["\n margin: 10px 10px;\n border: 1px solid var(--grey-3);\n background-color: var(--grey-a2);\n border-radius: 5px;\n &:active {\n box-shadow: 4px 4px var(--grey-a2);\n }\n"])));
13205
- var LabelTitle = styled__default.div(_templateObject2$1e || (_templateObject2$1e = _taggedTemplateLiteralLoose(["\n max-width: 130px;\n overflow-wrap: initial;\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n opacity: 0.76;\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-11);\n font-family: ", ";\n margin-top: 2px;\n"])), function (_ref) {
13574
+ var _templateObject$1t, _templateObject2$1i, _templateObject3$18, _templateObject4$12, _templateObject5$Y, _templateObject6$J, _templateObject7$G, _templateObject8$A, _templateObject9$t, _templateObject10$p, _templateObject11$h;
13575
+ var MetaConatiner = styled__default.div(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteralLoose(["\n margin: 10px 10px;\n border: 1px solid var(--grey-3);\n background-color: var(--grey-a2);\n border-radius: 5px;\n &:active {\n box-shadow: 4px 4px var(--grey-a2);\n }\n"])));
13576
+ var LabelTitle = styled__default.div(_templateObject2$1i || (_templateObject2$1i = _taggedTemplateLiteralLoose(["\n max-width: 130px;\n overflow-wrap: initial;\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n opacity: 0.76;\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-11);\n font-family: ", ";\n margin-top: 2px;\n"])), function (_ref) {
13206
13577
  var theme = _ref.theme;
13207
13578
  return theme.fontFamily.ui;
13208
13579
  });
13209
- var LabelContent = styled__default.div(_templateObject3$15 || (_templateObject3$15 = _taggedTemplateLiteralLoose(["\n font-size: 10px;\n padding-left: 10px;\n max-width: 200px;\n overflow-wrap: initial;\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 4px 0 5px 0;\n white-space: nowrap;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-8);\n"])));
13210
- var LabelNotes = styled__default.div(_templateObject4$$ || (_templateObject4$$ = _taggedTemplateLiteralLoose(["\n padding-left: 10px;\n max-width: 200px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 5px 0 8px 0;\n max-height: 23px;\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-8);\n ", "\n"])), function (_ref2) {
13580
+ var LabelContent = styled__default.div(_templateObject3$18 || (_templateObject3$18 = _taggedTemplateLiteralLoose(["\n font-size: 10px;\n padding-left: 10px;\n max-width: 200px;\n overflow-wrap: initial;\n white-space: break-spaces;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 4px 0 5px 0;\n white-space: nowrap;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-8);\n"])));
13581
+ var LabelNotes = styled__default.div(_templateObject4$12 || (_templateObject4$12 = _taggedTemplateLiteralLoose(["\n padding-left: 10px;\n max-width: 200px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n margin: 5px 0 8px 0;\n max-height: 23px;\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-8);\n ", "\n"])), function (_ref2) {
13211
13582
  var theme = _ref2.theme;
13212
- return theme && styled.css(_templateObject5$V || (_templateObject5$V = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.data);
13583
+ return theme && styled.css(_templateObject5$Y || (_templateObject5$Y = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.data);
13213
13584
  });
13214
- var TitleContainer = styled__default.div(_templateObject6$H || (_templateObject6$H = _taggedTemplateLiteralLoose(["\n display: flex;\n gap:6px;\n flex-direction: row;\n align-items: center;\n margin-left: 10px;\n margin: 3px 0 5px 10px;\n"])));
13215
- var Container$V = styled__default.div(_templateObject7$D || (_templateObject7$D = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n"])));
13216
- var TitleBox = styled__default.div(_templateObject8$y || (_templateObject8$y = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
13217
- var IconBox = styled__default.div(_templateObject9$r || (_templateObject9$r = _taggedTemplateLiteralLoose(["\n padding: 1px 5px 0 0;\n opacity: 0;\n ", ":hover & {\n opacity: 1;\n cursor: pointer;\n }\n"])), Container$V);
13218
- var CopyTextBox = styled__default.pre(_templateObject10$n || (_templateObject10$n = _taggedTemplateLiteralLoose(["\n padding: 5px;\n font-size: 10px;\n line-height: 1.2;\n box-shadow: 2px 2px 4px (195deg 16% 72% / 72%);\n border: 1px solid var(--grey-8);\n background-color: var(--grey-2);\n border-radius: 5px;\n opacity: 0.76;\n font-weight: 500;\n color: var(--grey-11);\n position: absolute;\n max-width: 170px;\n white-space: pre-wrap;\n font-family: ", ";\n right:10px;\n margin-top: -23px;\n"])), function (_ref3) {
13585
+ var TitleContainer = styled__default.div(_templateObject6$J || (_templateObject6$J = _taggedTemplateLiteralLoose(["\n display: flex;\n gap:6px;\n flex-direction: row;\n align-items: center;\n margin-left: 10px;\n margin: 3px 0 5px 10px;\n"])));
13586
+ var Container$X = styled__default.div(_templateObject7$G || (_templateObject7$G = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n"])));
13587
+ var TitleBox = styled__default.div(_templateObject8$A || (_templateObject8$A = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
13588
+ var IconBox = styled__default.div(_templateObject9$t || (_templateObject9$t = _taggedTemplateLiteralLoose(["\n padding: 1px 5px 0 0;\n opacity: 0;\n ", ":hover & {\n opacity: 1;\n cursor: pointer;\n }\n"])), Container$X);
13589
+ var CopyTextBox = styled__default.pre(_templateObject10$p || (_templateObject10$p = _taggedTemplateLiteralLoose(["\n padding: 5px;\n font-size: 10px;\n line-height: 1.2;\n box-shadow: 2px 2px 4px (195deg 16% 72% / 72%);\n border: 1px solid var(--grey-8);\n background-color: var(--grey-2);\n border-radius: 5px;\n opacity: 0.76;\n font-weight: 500;\n color: var(--grey-11);\n position: absolute;\n max-width: 170px;\n white-space: pre-wrap;\n font-family: ", ";\n right:10px;\n margin-top: -23px;\n"])), function (_ref3) {
13219
13590
  var theme = _ref3.theme;
13220
13591
  return theme.fontFamily.data;
13221
13592
  });
13222
- var CopyBox = styled__default.div(_templateObject11$g || (_templateObject11$g = _taggedTemplateLiteralLoose(["\n"])));
13593
+ var CopyBox = styled__default.div(_templateObject11$h || (_templateObject11$h = _taggedTemplateLiteralLoose(["\n"])));
13223
13594
 
13224
13595
  var UserDrawerMeta = function UserDrawerMeta(_ref4) {
13225
13596
  var item = _ref4.item,
@@ -13264,7 +13635,7 @@ var UserDrawerMeta = function UserDrawerMeta(_ref4) {
13264
13635
  var onLeaveMeatInfo = React.useCallback(function () {
13265
13636
  setOnHoverColorValue('dimmed');
13266
13637
  }, []);
13267
- return React__default.createElement(React.Fragment, null, title !== '' && React__default.createElement(Container$V, {
13638
+ return React__default.createElement(React.Fragment, null, title !== '' && React__default.createElement(Container$X, {
13268
13639
  onClick: onUserDrawerMetaClick
13269
13640
  }, React__default.createElement(MetaConatiner, null, React__default.createElement(TitleBox, null, React__default.createElement(TitleContainer, null, React__default.createElement(Icon, {
13270
13641
  icon: icon,
@@ -13289,20 +13660,20 @@ var UserDrawerMeta = function UserDrawerMeta(_ref4) {
13289
13660
  }, notes) : null)));
13290
13661
  };
13291
13662
 
13292
- var _templateObject$1o, _templateObject2$1f, _templateObject3$16, _templateObject4$10;
13293
- var Container$W = styled__default.div(_templateObject$1o || (_templateObject$1o = _taggedTemplateLiteralLoose(["\n padding: 16px 10px 14px 23px;\n display: flex;\n flex-direction: row;\n border-top: 1px solid ", ";\n align-items: center;\n cursor: pointer;\n svg {\n margin-top: 7px;\n }\n"])), function (_ref) {
13663
+ var _templateObject$1u, _templateObject2$1j, _templateObject3$19, _templateObject4$13;
13664
+ var Container$Y = styled__default.div(_templateObject$1u || (_templateObject$1u = _taggedTemplateLiteralLoose(["\n padding: 16px 10px 14px 23px;\n display: flex;\n flex-direction: row;\n border-top: 1px solid ", ";\n align-items: center;\n cursor: pointer;\n svg {\n margin-top: 7px;\n }\n"])), function (_ref) {
13294
13665
  var theme = _ref.theme;
13295
13666
  return theme.colors.divider;
13296
13667
  });
13297
- var ColumnContainer = styled__default.div(_templateObject2$1f || (_templateObject2$1f = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n padding-left: 14px;\n align-items: flex-start;\n"])));
13298
- var Title$8 = styled__default.div(_templateObject3$16 || (_templateObject3$16 = _taggedTemplateLiteralLoose(["\n opacity: 0.76;\n font-family: ", ";\n font-size: 12px;\n font-weight: 500;\n letter-spacing: 0.34px;\n color: ", ";\n"])), function (_ref2) {
13668
+ var ColumnContainer = styled__default.div(_templateObject2$1j || (_templateObject2$1j = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n padding-left: 14px;\n align-items: flex-start;\n"])));
13669
+ var Title$8 = styled__default.div(_templateObject3$19 || (_templateObject3$19 = _taggedTemplateLiteralLoose(["\n opacity: 0.76;\n font-family: ", ";\n font-size: 12px;\n font-weight: 500;\n letter-spacing: 0.34px;\n color: ", ";\n"])), function (_ref2) {
13299
13670
  var theme = _ref2.theme;
13300
13671
  return theme.fontFamily.ui;
13301
13672
  }, function (_ref3) {
13302
13673
  var theme = _ref3.theme;
13303
13674
  return theme.typography.global.mainMenu.subheader.color;
13304
13675
  });
13305
- var SubTitle$1 = styled__default.div(_templateObject4$10 || (_templateObject4$10 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: ", ";\n padding-top: 2px;\n opacity: 0.5;\n"])), function (_ref4) {
13676
+ var SubTitle$1 = styled__default.div(_templateObject4$13 || (_templateObject4$13 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-size: 10px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: ", ";\n padding-top: 2px;\n opacity: 0.5;\n"])), function (_ref4) {
13306
13677
  var theme = _ref4.theme;
13307
13678
  return theme.fontFamily.ui;
13308
13679
  }, function (_ref5) {
@@ -13317,7 +13688,7 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref6) {
13317
13688
  subTitle = _ref6.subTitle,
13318
13689
  _ref6$onClickCallback = _ref6.onClickCallback,
13319
13690
  onClickCallback = _ref6$onClickCallback === void 0 ? function () {} : _ref6$onClickCallback;
13320
- return React__default.createElement(Container$W, {
13691
+ return React__default.createElement(Container$Y, {
13321
13692
  onClick: onClickCallback
13322
13693
  }, React__default.createElement(Icon, {
13323
13694
  icon: icon,
@@ -13326,28 +13697,28 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref6) {
13326
13697
  }), React__default.createElement(ColumnContainer, null, React__default.createElement(Title$8, null, title), React__default.createElement(SubTitle$1, null, subTitle)));
13327
13698
  };
13328
13699
 
13329
- var _templateObject$1p, _templateObject2$1g, _templateObject3$17, _templateObject4$11, _templateObject5$W, _templateObject6$I, _templateObject7$E, _templateObject8$z, _templateObject9$s, _templateObject10$o, _templateObject11$h, _templateObject12$d, _templateObject13$c, _templateObject14$a, _templateObject15$8, _templateObject16$6, _templateObject17$6, _templateObject18$4, _templateObject19$4;
13330
- var DrawerTop = styled__default.div(_templateObject$1p || (_templateObject$1p = _taggedTemplateLiteralLoose([""])));
13331
- var DrawerBottom = styled__default.div(_templateObject2$1g || (_templateObject2$1g = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
13700
+ var _templateObject$1v, _templateObject2$1k, _templateObject3$1a, _templateObject4$14, _templateObject5$Z, _templateObject6$K, _templateObject7$H, _templateObject8$B, _templateObject9$u, _templateObject10$q, _templateObject11$i, _templateObject12$e, _templateObject13$c, _templateObject14$a, _templateObject15$8, _templateObject16$6, _templateObject17$6, _templateObject18$4, _templateObject19$4;
13701
+ var DrawerTop = styled__default.div(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteralLoose([""])));
13702
+ var DrawerBottom = styled__default.div(_templateObject2$1k || (_templateObject2$1k = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
13332
13703
  var theme = _ref.theme;
13333
- return styled.css(_templateObject3$17 || (_templateObject3$17 = _taggedTemplateLiteralLoose(["\n width: 100%;\n position: fixed;\n bottom: 50px;\n\n @media ", " {\n position: static;\n bottom: 0;\n }\n "])), theme.deviceMediaQuery.medium);
13704
+ return styled.css(_templateObject3$1a || (_templateObject3$1a = _taggedTemplateLiteralLoose(["\n width: 100%;\n position: fixed;\n bottom: 50px;\n\n @media ", " {\n position: static;\n bottom: 0;\n }\n "])), theme.deviceMediaQuery.medium);
13334
13705
  });
13335
- var DrawerHeader = styled__default.h2(_templateObject4$11 || (_templateObject4$11 = _taggedTemplateLiteralLoose(["\n ", ";\n padding: 0;\n margin: 0 0 5px;\n"])), function (_ref2) {
13706
+ var DrawerHeader = styled__default.h2(_templateObject4$14 || (_templateObject4$14 = _taggedTemplateLiteralLoose(["\n ", ";\n padding: 0;\n margin: 0 0 5px;\n"])), function (_ref2) {
13336
13707
  var theme = _ref2.theme;
13337
13708
  return theme.typography.global.mainMenu.subheader;
13338
13709
  });
13339
- var CurrentUser = styled__default.div(_templateObject5$W || (_templateObject5$W = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 15px;\n\n ", ";\n"])), function (_ref3) {
13710
+ var CurrentUser = styled__default.div(_templateObject5$Z || (_templateObject5$Z = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 15px;\n\n ", ";\n"])), function (_ref3) {
13340
13711
  var theme = _ref3.theme;
13341
- return styled.css(_templateObject6$I || (_templateObject6$I = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n ", ";\n "])), theme.styles.global.mainMenu.lines.backgroundColor, theme.typography.global.mainMenu.identity);
13712
+ return styled.css(_templateObject6$K || (_templateObject6$K = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n ", ";\n "])), theme.styles.global.mainMenu.lines.backgroundColor, theme.typography.global.mainMenu.identity);
13342
13713
  });
13343
- var UserOptions = styled__default.div(_templateObject7$E || (_templateObject7$E = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 10px 20px;\n ", ";\n\n"])), function (_ref4) {
13714
+ var UserOptions = styled__default.div(_templateObject7$H || (_templateObject7$H = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 10px 20px;\n ", ";\n\n"])), function (_ref4) {
13344
13715
  var theme = _ref4.theme;
13345
- return styled.css(_templateObject8$z || (_templateObject8$z = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n "])), theme.styles.global.mainMenu.lines.backgroundColor);
13716
+ return styled.css(_templateObject8$B || (_templateObject8$B = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n "])), theme.styles.global.mainMenu.lines.backgroundColor);
13346
13717
  });
13347
- var Logout = styled__default.div(_templateObject9$s || (_templateObject9$s = _taggedTemplateLiteralLoose(["\n padding: 0 20px;\n"])));
13348
- var LinkMenu = styled__default.ul(_templateObject10$o || (_templateObject10$o = _taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 12px 0 0 0;\n list-style: none;\n"])));
13349
- var LinkMenuItem = styled__default.li(_templateObject11$h || (_templateObject11$h = _taggedTemplateLiteralLoose(["\n padding: 10px 0;\n"])));
13350
- var IconWrapperFooter = styled__default.div(_templateObject12$d || (_templateObject12$d = _taggedTemplateLiteralLoose(["\n width: 5px;\n display: flex;\n justify-content: center;\n align-items: center;\n > div {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n padding-right: 20px;\n"])));
13718
+ var Logout = styled__default.div(_templateObject9$u || (_templateObject9$u = _taggedTemplateLiteralLoose(["\n padding: 0 20px;\n"])));
13719
+ var LinkMenu = styled__default.ul(_templateObject10$q || (_templateObject10$q = _taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 12px 0 0 0;\n list-style: none;\n"])));
13720
+ var LinkMenuItem = styled__default.li(_templateObject11$i || (_templateObject11$i = _taggedTemplateLiteralLoose(["\n padding: 10px 0;\n"])));
13721
+ var IconWrapperFooter = styled__default.div(_templateObject12$e || (_templateObject12$e = _taggedTemplateLiteralLoose(["\n width: 5px;\n display: flex;\n justify-content: center;\n align-items: center;\n > div {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n padding-right: 20px;\n"])));
13351
13722
  var LinkMenuItemA = styled__default(reactRouterDom.Link)(_templateObject13$c || (_templateObject13$c = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n width: 100%;\n\n ", ";\n\n ", ";\n"])), resetButtonStyles, function (_ref5) {
13352
13723
  var theme = _ref5.theme;
13353
13724
  return styled.css(_templateObject14$a || (_templateObject14$a = _taggedTemplateLiteralLoose(["\n ", ";\n\n &:hover {\n ", ";\n }\n "])), theme.typography.global.mainMenu.subItem["default"], theme.typography.global.mainMenu.subItem.hover);
@@ -13487,37 +13858,37 @@ var UserMenu = function UserMenu(_ref12) {
13487
13858
  }, title)) : null));
13488
13859
  };
13489
13860
 
13490
- var _templateObject$1q, _templateObject2$1h, _templateObject3$18, _templateObject4$12, _templateObject5$X, _templateObject6$J, _templateObject7$F, _templateObject8$A;
13491
- var Container$X = styled__default.div(_templateObject$1q || (_templateObject$1q = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 18px 20px 12px 20px;\n height: 122px;\n"])));
13492
- var ImgWrapper = styled__default.div(_templateObject2$1h || (_templateObject2$1h = _taggedTemplateLiteralLoose(["\n border-radius: 5px;\n overflow: hidden;\n height: 40px;\n width: 40px;\n flex-shrink: 0;\n"])));
13493
- var EmptyImg = styled__default.div(_templateObject3$18 || (_templateObject3$18 = _taggedTemplateLiteralLoose(["\n background-color: var(--grey-5);\n width: 100%;\n height: 100%;\n"])));
13494
- var Image$2 = styled__default.div(_templateObject4$12 || (_templateObject4$12 = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n background-image: url(", ");\n background-position: center center;\n background-size: cover;\n background-repeat: no-repeat;\n display: ", ";\n"])), function (p) {
13861
+ var _templateObject$1w, _templateObject2$1l, _templateObject3$1b, _templateObject4$15, _templateObject5$_, _templateObject6$L, _templateObject7$I, _templateObject8$C;
13862
+ var Container$Z = styled__default.div(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 18px 20px 12px 20px;\n height: 122px;\n"])));
13863
+ var ImgWrapper = styled__default.div(_templateObject2$1l || (_templateObject2$1l = _taggedTemplateLiteralLoose(["\n border-radius: 5px;\n overflow: hidden;\n height: 40px;\n width: 40px;\n flex-shrink: 0;\n"])));
13864
+ var EmptyImg = styled__default.div(_templateObject3$1b || (_templateObject3$1b = _taggedTemplateLiteralLoose(["\n background-color: var(--grey-5);\n width: 100%;\n height: 100%;\n"])));
13865
+ var Image$2 = styled__default.div(_templateObject4$15 || (_templateObject4$15 = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n background-image: url(", ");\n background-position: center center;\n background-size: cover;\n background-repeat: no-repeat;\n display: ", ";\n"])), function (p) {
13495
13866
  return p.image;
13496
13867
  }, function (p) {
13497
13868
  return p.image ? 'block' : 'none';
13498
13869
  });
13499
- var InfoContainer = styled__default.div(_templateObject5$X || (_templateObject5$X = _taggedTemplateLiteralLoose(["\n margin-left: 20px;\n"])));
13500
- var Title$9 = styled__default.div(_templateObject6$J || (_templateObject6$J = _taggedTemplateLiteralLoose(["\n font-size: 16px;\n font-weight: 500;\n color: var(--grey-11);\n"])));
13501
- var Message = styled__default.div(_templateObject7$F || (_templateObject7$F = _taggedTemplateLiteralLoose(["\n font-size: 13px;\n font-weight: 500;\n overflow: hidden;\n color: var(--grey-11);\n margin: 4px 0;\n height: 30px;\n text-overflow: ellipsis;\n overflow: hidden;\n display: inline-block;\n vertical-align: middle;\n"])));
13502
- var TimeMsg = styled__default.div(_templateObject8$A || (_templateObject8$A = _taggedTemplateLiteralLoose(["\n font-size: 13px;\n font-weight: 500;\n color: var(--grey-12);\n margin-top: 15px;\n"])));
13870
+ var InfoContainer = styled__default.div(_templateObject5$_ || (_templateObject5$_ = _taggedTemplateLiteralLoose(["\n margin-left: 20px;\n"])));
13871
+ var Title$9 = styled__default.div(_templateObject6$L || (_templateObject6$L = _taggedTemplateLiteralLoose(["\n font-size: 16px;\n font-weight: 500;\n color: var(--grey-11);\n"])));
13872
+ var Message = styled__default.div(_templateObject7$I || (_templateObject7$I = _taggedTemplateLiteralLoose(["\n font-size: 13px;\n font-weight: 500;\n overflow: hidden;\n color: var(--grey-11);\n margin: 4px 0;\n height: 30px;\n text-overflow: ellipsis;\n overflow: hidden;\n display: inline-block;\n vertical-align: middle;\n"])));
13873
+ var TimeMsg = styled__default.div(_templateObject8$C || (_templateObject8$C = _taggedTemplateLiteralLoose(["\n font-size: 13px;\n font-weight: 500;\n color: var(--grey-12);\n margin-top: 15px;\n"])));
13503
13874
 
13504
13875
  var NotificationItem = function NotificationItem(_ref) {
13505
13876
  var imgUrl = _ref.imgUrl,
13506
13877
  title = _ref.title,
13507
13878
  message = _ref.message,
13508
13879
  time = _ref.time;
13509
- return React__default.createElement(Container$X, null, React__default.createElement(ImgWrapper, null, imgUrl ? React__default.createElement(Image$2, {
13880
+ return React__default.createElement(Container$Z, null, React__default.createElement(ImgWrapper, null, imgUrl ? React__default.createElement(Image$2, {
13510
13881
  image: imgUrl
13511
13882
  }) : React__default.createElement(EmptyImg, null)), React__default.createElement(InfoContainer, null, React__default.createElement(Title$9, null, title), React__default.createElement(Message, null, message), React__default.createElement(TimeMsg, null, time)));
13512
13883
  };
13513
13884
 
13514
- var _templateObject$1r, _templateObject2$1i, _templateObject3$19;
13515
- var Container$Y = styled__default.div(_templateObject$1r || (_templateObject$1r = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
13516
- var StatusContainer = styled__default.h2(_templateObject2$1i || (_templateObject2$1i = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n padding: 10px 0 10px 20px;\n font-size: 14px;\n font-weight: 500;\n color: var(--grey-12);\n border-bottom: ", " 1px solid;\n margin: 0;\n"])), function (_ref) {
13885
+ var _templateObject$1x, _templateObject2$1m, _templateObject3$1c;
13886
+ var Container$_ = styled__default.div(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
13887
+ var StatusContainer = styled__default.h2(_templateObject2$1m || (_templateObject2$1m = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n padding: 10px 0 10px 20px;\n font-size: 14px;\n font-weight: 500;\n color: var(--grey-12);\n border-bottom: ", " 1px solid;\n margin: 0;\n"])), function (_ref) {
13517
13888
  var theme = _ref.theme;
13518
13889
  return theme.colors.divider;
13519
13890
  });
13520
- var NotificationWrapper = styled__default.div(_templateObject3$19 || (_templateObject3$19 = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n"])), function (_ref2) {
13891
+ var NotificationWrapper = styled__default.div(_templateObject3$1c || (_templateObject3$1c = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n"])), function (_ref2) {
13521
13892
  var colors = _ref2.theme.colors;
13522
13893
  return colors.divider;
13523
13894
  });
@@ -13541,21 +13912,21 @@ var NotificationsHistory = function NotificationsHistory(_ref3) {
13541
13912
  unreadNotificationsText = _ref3$unreadNotificat === void 0 ? 'Read' : _ref3$unreadNotificat;
13542
13913
 
13543
13914
  if (read.length === 0 && unread.length === 0) {
13544
- return React__default.createElement(Container$Y, null, React__default.createElement(StatusContainer, null, noNotificationsText));
13915
+ return React__default.createElement(Container$_, null, React__default.createElement(StatusContainer, null, noNotificationsText));
13545
13916
  }
13546
13917
 
13547
- return React__default.createElement(Container$Y, null, unread && React__default.createElement(React.Fragment, null, React__default.createElement(StatusContainer, null, readNotificationsText), renderNotifications(unread, 'unread')), read && React__default.createElement(React.Fragment, null, React__default.createElement(StatusContainer, null, unreadNotificationsText), renderNotifications(read, 'read')));
13918
+ return React__default.createElement(Container$_, null, unread && React__default.createElement(React.Fragment, null, React__default.createElement(StatusContainer, null, readNotificationsText), renderNotifications(unread, 'unread')), read && React__default.createElement(React.Fragment, null, React__default.createElement(StatusContainer, null, unreadNotificationsText), renderNotifications(read, 'read')));
13548
13919
  };
13549
13920
 
13550
- var _templateObject$1s, _templateObject2$1j, _templateObject3$1a, _templateObject4$13, _templateObject5$Y, _templateObject6$K, _templateObject7$G, _templateObject8$B, _templateObject9$t, _templateObject10$p, _templateObject11$i, _templateObject12$e, _templateObject13$d, _templateObject14$b;
13551
- var Container$Z = styled__default.div(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteralLoose(["\n z-index: 9;\n position: sticky;\n top: 0;\n align-self: flex-start;\n height: 65px;\n width: 100%;\n display: flex;\n justify-content: space-between;\n\n ", "\n"])), function (_ref) {
13921
+ var _templateObject$1y, _templateObject2$1n, _templateObject3$1d, _templateObject4$16, _templateObject5$$, _templateObject6$M, _templateObject7$J, _templateObject8$D, _templateObject9$v, _templateObject10$r, _templateObject11$j, _templateObject12$f, _templateObject13$d, _templateObject14$b;
13922
+ var Container$$ = styled__default.div(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteralLoose(["\n z-index: 9;\n position: sticky;\n top: 0;\n align-self: flex-start;\n height: 65px;\n width: 100%;\n display: flex;\n justify-content: space-between;\n\n ", "\n"])), function (_ref) {
13552
13923
  var theme = _ref.theme,
13553
13924
  colors = _ref.theme.colors;
13554
- return colors && styled.css(_templateObject2$1j || (_templateObject2$1j = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n background-color:", ";\n "])), theme.styles.global.mainMenu.lines.backgroundColor, theme.styles.global.mainMenu.background.backgroundColor);
13925
+ return colors && styled.css(_templateObject2$1n || (_templateObject2$1n = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n background-color:", ";\n "])), theme.styles.global.mainMenu.lines.backgroundColor, theme.styles.global.mainMenu.background.backgroundColor);
13555
13926
  });
13556
- var SearchBar = styled__default.div(_templateObject3$1a || (_templateObject3$1a = _taggedTemplateLiteralLoose(["\n margin-left: 25px;\n flex: 0 1 500px;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
13557
- var IconWrapper$4 = styled__default.div(_templateObject4$13 || (_templateObject4$13 = _taggedTemplateLiteralLoose(["\n flex: 0 40px;\n width: 5px;\n display: flex;\n justify-content: center;\n align-items: center;\n > div {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])));
13558
- var SearchInput = styled__default.input(_templateObject5$Y || (_templateObject5$Y = _taggedTemplateLiteralLoose(["\n ", ";\n font-family: ", ";\n flex: 1;\n height: 35px;\n line-height: 35px;\n border: none;\n outline: none;\n background: transparent;\n\n ", ";\n\n &::placeholder {\n font-style: italic;\n ", ";\n }\n"])), removeAutoFillStyle, function (_ref2) {
13927
+ var SearchBar = styled__default.div(_templateObject3$1d || (_templateObject3$1d = _taggedTemplateLiteralLoose(["\n margin-left: 25px;\n flex: 0 1 500px;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
13928
+ var IconWrapper$4 = styled__default.div(_templateObject4$16 || (_templateObject4$16 = _taggedTemplateLiteralLoose(["\n flex: 0 40px;\n width: 5px;\n display: flex;\n justify-content: center;\n align-items: center;\n > div {\n display: flex;\n flex-direction: column;\n justify-content: center;\n }\n"])));
13929
+ var SearchInput = styled__default.input(_templateObject5$$ || (_templateObject5$$ = _taggedTemplateLiteralLoose(["\n ", ";\n font-family: ", ";\n flex: 1;\n height: 35px;\n line-height: 35px;\n border: none;\n outline: none;\n background: transparent;\n\n ", ";\n\n &::placeholder {\n font-style: italic;\n ", ";\n }\n"])), removeAutoFillStyle, function (_ref2) {
13559
13930
  var theme = _ref2.theme;
13560
13931
  return theme.fontFamily.data;
13561
13932
  }, function (_ref3) {
@@ -13565,19 +13936,19 @@ var SearchInput = styled__default.input(_templateObject5$Y || (_templateObject5$
13565
13936
  var typography = _ref4.theme.typography;
13566
13937
  return typography.global.topBar.search.placeholder;
13567
13938
  });
13568
- var ButtonArea = styled__default.div(_templateObject6$K || (_templateObject6$K = _taggedTemplateLiteralLoose(["\n height: inherit;\n padding-right: 10px;\n display: flex;\n"])));
13939
+ var ButtonArea = styled__default.div(_templateObject6$M || (_templateObject6$M = _taggedTemplateLiteralLoose(["\n height: inherit;\n padding-right: 10px;\n display: flex;\n"])));
13569
13940
  var DrawerToggle = styled__default.button.attrs({
13570
13941
  type: 'button'
13571
- })(_templateObject7$G || (_templateObject7$G = _taggedTemplateLiteralLoose(["\n width: 60px;\n margin: 0 5px;\n height: inherit;\n background: none;\n border: none;\n outline: none;\n cursor: pointer;\n\n ", ";\n\n ", "\n"])), function (_ref5) {
13942
+ })(_templateObject7$J || (_templateObject7$J = _taggedTemplateLiteralLoose(["\n width: 60px;\n margin: 0 5px;\n height: inherit;\n background: none;\n border: none;\n outline: none;\n cursor: pointer;\n\n ", ";\n\n ", "\n"])), function (_ref5) {
13572
13943
  var theme = _ref5.theme;
13573
- return styled.css(_templateObject8$B || (_templateObject8$B = _taggedTemplateLiteralLoose(["\n border-bottom: 5px solid transparent;\n /*", ";*/\n\n &:hover {\n border-bottom-color: ", ";\n }\n\n transition: border ", " ", ";\n "])), theme.colors.menu.indicator, theme.colors.menu.hover, theme.animation.speed.normal, theme.animation.easing.primary.easeInOut);
13944
+ return styled.css(_templateObject8$D || (_templateObject8$D = _taggedTemplateLiteralLoose(["\n border-bottom: 5px solid transparent;\n /*", ";*/\n\n &:hover {\n border-bottom-color: ", ";\n }\n\n transition: border ", " ", ";\n "])), theme.colors.menu.indicator, theme.colors.menu.hover, theme.animation.speed.normal, theme.animation.easing.primary.easeInOut);
13574
13945
  }, function (_ref6) {
13575
13946
  var isActive = _ref6.isActive,
13576
13947
  theme = _ref6.theme;
13577
- return isActive && styled.css(_templateObject9$t || (_templateObject9$t = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: ", ";\n }\n "])), theme.colors.menu.active);
13948
+ return isActive && styled.css(_templateObject9$v || (_templateObject9$v = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: ", ";\n }\n "])), theme.colors.menu.active);
13578
13949
  });
13579
- var DrawerPortalWrapper = styled__default.div(_templateObject10$p || (_templateObject10$p = _taggedTemplateLiteralLoose([""])));
13580
- var Drawer = styled__default.div(_templateObject11$i || (_templateObject11$i = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n\n position: fixed;\n right: -10px;\n top: 65px;\n bottom: 0;\n background: ", ";\n border-left: ", " 1px solid;\n width: ", ";\n opacity: 0;\n visibility: hidden;\n z-index: 100;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n ", ";\n\n ", "\n"])), function (_ref7) {
13950
+ var DrawerPortalWrapper = styled__default.div(_templateObject10$r || (_templateObject10$r = _taggedTemplateLiteralLoose([""])));
13951
+ var Drawer = styled__default.div(_templateObject11$j || (_templateObject11$j = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n\n position: fixed;\n right: -10px;\n top: 65px;\n bottom: 0;\n background: ", ";\n border-left: ", " 1px solid;\n width: ", ";\n opacity: 0;\n visibility: hidden;\n z-index: 100;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n\n ", ";\n\n ", "\n"])), function (_ref7) {
13581
13952
  var theme = _ref7.theme;
13582
13953
  return theme.fontFamily.ui;
13583
13954
  }, function (_ref8) {
@@ -13591,7 +13962,7 @@ var Drawer = styled__default.div(_templateObject11$i || (_templateObject11$i = _
13591
13962
  return baseWidth ? baseWidth : "200px";
13592
13963
  }, function (_ref11) {
13593
13964
  var theme = _ref11.theme;
13594
- return styled.css(_templateObject12$e || (_templateObject12$e = _taggedTemplateLiteralLoose(["\n transition:\n opacity ", " ", ",\n right ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeInOut, theme.animation.speed.normal, theme.animation.easing.primary.easeInOut);
13965
+ return styled.css(_templateObject12$f || (_templateObject12$f = _taggedTemplateLiteralLoose(["\n transition:\n opacity ", " ", ",\n right ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeInOut, theme.animation.speed.normal, theme.animation.easing.primary.easeInOut);
13595
13966
  }, function (_ref12) {
13596
13967
  var isOpen = _ref12.isOpen;
13597
13968
  return isOpen && styled.css(_templateObject13$d || (_templateObject13$d = _taggedTemplateLiteralLoose(["\n right: 0;\n opacity: 1;\n visibility: visible;\n "])));
@@ -13664,7 +14035,7 @@ var TopBar = function TopBar(_ref13) {
13664
14035
  });
13665
14036
  };
13666
14037
 
13667
- return React__default.createElement(Container$Z, null, hasSearch ? React__default.createElement(SearchBar, null, React__default.createElement(IconWrapper$4, null, React__default.createElement(Icon, {
14038
+ return React__default.createElement(Container$$, null, hasSearch ? React__default.createElement(SearchBar, null, React__default.createElement(IconWrapper$4, null, React__default.createElement(Icon, {
13668
14039
  icon: 'Search',
13669
14040
  size: 18,
13670
14041
  color: 'dimmed'
@@ -13730,28 +14101,8 @@ var TopBar = function TopBar(_ref13) {
13730
14101
  }, customDrawer.customComponent)), document.body));
13731
14102
  };
13732
14103
 
13733
- var TabContext = React__default.createContext({
13734
- selected: '',
13735
- setSelected: function setSelected() {}
13736
- });
13737
-
13738
- var Tabs = function Tabs(_ref) {
13739
- var children = _ref.children;
13740
-
13741
- var _useState = React.useState(''),
13742
- selected = _useState[0],
13743
- setSelected = _useState[1];
13744
-
13745
- return React__default.createElement(TabContext.Provider, {
13746
- value: {
13747
- selected: selected,
13748
- setSelected: setSelected
13749
- }
13750
- }, children);
13751
- };
13752
-
13753
- var _templateObject$1t;
13754
- var TabListWrapper = styled__default.div(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n"])));
14104
+ var _templateObject$1z;
14105
+ var TabListWrapper = styled__default.div(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n"])));
13755
14106
 
13756
14107
  var TabList = function TabList(_ref) {
13757
14108
  var children = _ref.children,
@@ -13768,11 +14119,11 @@ var TabList = function TabList(_ref) {
13768
14119
 
13769
14120
  var _excluded$G = ["children", "tabFor", "onClick"];
13770
14121
 
13771
- var _templateObject$1u, _templateObject2$1k, _templateObject3$1b;
13772
- var TabComponent = styled__default.div(_templateObject$1u || (_templateObject$1u = _taggedTemplateLiteralLoose(["\n margin-right: 39px;\n display: flex;\n align-items: center;\n line-height: 20px;\n"])));
13773
- var TabLabel = styled__default.label(_templateObject2$1k || (_templateObject2$1k = _taggedTemplateLiteralLoose(["\n height: 40px;\n ", "\n font-size: 15px;\n font-weight: ", ";\n letter-spacing: 0.09px;\n color: ", ";\n cursor: pointer;\n border-bottom: ", ";\n padding-top: 6px;\n padding-bottom: 14px;\n flex-shrink: 0;\n"])), function (_ref) {
14122
+ var _templateObject$1A, _templateObject2$1o, _templateObject3$1e;
14123
+ var TabComponent = styled__default.div(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteralLoose(["\n margin-right: 39px;\n display: flex;\n align-items: center;\n line-height: 20px;\n"])));
14124
+ var TabLabel = styled__default.label(_templateObject2$1o || (_templateObject2$1o = _taggedTemplateLiteralLoose(["\n height: 40px;\n ", "\n font-size: 15px;\n font-weight: ", ";\n letter-spacing: 0.09px;\n color: ", ";\n cursor: pointer;\n border-bottom: ", ";\n padding-top: 6px;\n padding-bottom: 14px;\n flex-shrink: 0;\n user-select: none;\n"])), function (_ref) {
13774
14125
  var theme = _ref.theme;
13775
- return styled.css(_templateObject3$1b || (_templateObject3$1b = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
14126
+ return styled.css(_templateObject3$1e || (_templateObject3$1e = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
13776
14127
  }, function (_ref2) {
13777
14128
  var active = _ref2.active;
13778
14129
  return active ? '600' : '500';
@@ -13807,8 +14158,8 @@ var Tab = function Tab(_ref5) {
13807
14158
 
13808
14159
  var _excluded$H = ["children", "tabId"];
13809
14160
 
13810
- var _templateObject$1v;
13811
- var Container$_ = styled__default.div(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteralLoose(["\n"])));
14161
+ var _templateObject$1B;
14162
+ var Container$10 = styled__default.div(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteralLoose(["\n"])));
13812
14163
 
13813
14164
  var TabContent = function TabContent(_ref) {
13814
14165
  var children = _ref.children,
@@ -13818,20 +14169,20 @@ var TabContent = function TabContent(_ref) {
13818
14169
  var _useContext = React.useContext(TabContext),
13819
14170
  selected = _useContext.selected;
13820
14171
 
13821
- return selected === tabId ? React__default.createElement(Container$_, Object.assign({}, props), children) : null;
14172
+ return selected === tabId ? React__default.createElement(Container$10, Object.assign({}, props), children) : null;
13822
14173
  };
13823
14174
 
13824
14175
  var _excluded$I = ["tabFor", "icon", "closeId", "counter", "status"];
13825
14176
 
13826
- var _templateObject$1w, _templateObject2$1l, _templateObject3$1c, _templateObject4$14;
13827
- var Container$$ = styled__default.button(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteralLoose(["\n ", "\n flex-basis: auto;\n flex-grow: 1;\n"])), resetButtonStyles);
13828
- var LinkTab = styled__default.div(_templateObject2$1l || (_templateObject2$1l = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n\n ", ";\n\n ", "\n"])), function (_ref) {
14177
+ var _templateObject$1C, _templateObject2$1p, _templateObject3$1f, _templateObject4$17;
14178
+ var Container$11 = styled__default.button(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteralLoose(["\n ", "\n flex-basis: auto;\n flex-grow: 1;\n"])), resetButtonStyles);
14179
+ var LinkTab = styled__default.div(_templateObject2$1p || (_templateObject2$1p = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n\n ", ";\n\n ", "\n"])), function (_ref) {
13829
14180
  var theme = _ref.theme;
13830
- return styled.css(_templateObject3$1c || (_templateObject3$1c = _taggedTemplateLiteralLoose(["\n transition: border ", " ", ";\n border-bottom: 5px solid ", ";\n\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n\n &:hover {\n border-bottom-color: ", ";\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeInOut, theme.colors.menu.indicator, IconWrapper, theme.colors.icons['dimmed'], theme.colors.menu.hover, IconWrapper, theme.colors.menu.hover);
14181
+ return styled.css(_templateObject3$1f || (_templateObject3$1f = _taggedTemplateLiteralLoose(["\n transition: border ", " ", ";\n border-bottom: 5px solid ", ";\n\n ", " {\n [stroke]{\n stroke: var(--dimmed);\n }\n }\n\n &:hover {\n border-bottom-color: ", ";\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n "])), theme.animation.speed.normal, theme.animation.easing.primary.easeInOut, theme.colors.menu.indicator, IconWrapper, theme.colors.menu.hover, IconWrapper, theme.colors.menu.hover);
13831
14182
  }, function (_ref2) {
13832
14183
  var isActive = _ref2.isActive,
13833
14184
  theme = _ref2.theme;
13834
- return isActive && styled.css(_templateObject4$14 || (_templateObject4$14 = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: ", ";\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n "])), theme.colors.menu.active, IconWrapper, theme.colors.menu.active);
14185
+ return isActive && styled.css(_templateObject4$17 || (_templateObject4$17 = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: ", ";\n ", " {\n [stroke]{\n stroke: ", ";\n }\n }\n }\n "])), theme.colors.menu.active, IconWrapper, theme.colors.menu.active);
13835
14186
  });
13836
14187
 
13837
14188
  var MobileTab = function MobileTab(_ref3) {
@@ -13850,7 +14201,7 @@ var MobileTab = function MobileTab(_ref3) {
13850
14201
  var newValue = selected === tabId ? closeId : tabId;
13851
14202
  setSelected(newValue);
13852
14203
  }, [closeId, selected, setSelected]);
13853
- return React__default.createElement(Container$$, Object.assign({}, props, {
14204
+ return React__default.createElement(Container$11, Object.assign({}, props, {
13854
14205
  onClick: function onClick() {
13855
14206
  return onChangeTab(tabFor);
13856
14207
  }
@@ -13865,23 +14216,23 @@ var MobileTab = function MobileTab(_ref3) {
13865
14216
 
13866
14217
  var _excluded$J = ["icon", "title", "subtitle", "tabFor"];
13867
14218
 
13868
- var _templateObject$1x, _templateObject2$1m, _templateObject3$1d, _templateObject4$15, _templateObject5$Z, _templateObject6$L;
13869
- var Container$10 = styled__default.div(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: 22px;\n padding-bottom: 7px;\n height: 60px;\n cursor: pointer;\n\n ", ";\n ", " {\n margin-left: 2px;\n flex-shrink: 0;\n }\n"])), function (_ref) {
14219
+ var _templateObject$1D, _templateObject2$1q, _templateObject3$1g, _templateObject4$18, _templateObject5$10, _templateObject6$N;
14220
+ var Container$12 = styled__default.div(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: 22px;\n padding-bottom: 7px;\n height: 60px;\n cursor: pointer;\n\n ", ";\n ", " {\n margin-left: 2px;\n flex-shrink: 0;\n }\n"])), function (_ref) {
13870
14221
  var active = _ref.active;
13871
- return active ? styled.css(_templateObject2$1m || (_templateObject2$1m = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid var(--primary-11);\n "]))) : styled.css(_templateObject3$1d || (_templateObject3$1d = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid transparent;\n "])));
14222
+ return active ? styled.css(_templateObject2$1q || (_templateObject2$1q = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid var(--primary-11);\n "]))) : styled.css(_templateObject3$1g || (_templateObject3$1g = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid transparent;\n "])));
13872
14223
  }, IconWrapper);
13873
- var Title$a = styled__default.div(_templateObject4$15 || (_templateObject4$15 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-family: ", ";\n letter-spacing: 0.09px;\n font-weight: 500;\n color: ", ";\n margin-bottom: 5px;\n flex-shrink: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (_ref2) {
14224
+ var Title$a = styled__default.div(_templateObject4$18 || (_templateObject4$18 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-family: ", ";\n letter-spacing: 0.09px;\n font-weight: 500;\n color: ", ";\n margin-bottom: 5px;\n flex-shrink: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (_ref2) {
13874
14225
  var theme = _ref2.theme;
13875
14226
  return theme.fontFamily.ui;
13876
14227
  }, function (_ref3) {
13877
14228
  var active = _ref3.active;
13878
14229
  return active ? 'var(--primary-11)' : 'var(--grey-11)';
13879
14230
  });
13880
- var SubTitle$2 = styled__default.div(_templateObject5$Z || (_templateObject5$Z = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n font-family: ", ";\n font-style: italic;\n color: var(--grey-a10);\n flex-shrink: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (_ref4) {
14231
+ var SubTitle$2 = styled__default.div(_templateObject5$10 || (_templateObject5$10 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n font-family: ", ";\n font-style: italic;\n color: var(--grey-a10);\n flex-shrink: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (_ref4) {
13881
14232
  var theme = _ref4.theme;
13882
14233
  return theme.fontFamily.data;
13883
14234
  });
13884
- var TextGroup$1 = styled__default.div(_templateObject6$L || (_templateObject6$L = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n margin-right: 20px;\n"])));
14235
+ var TextGroup$1 = styled__default.div(_templateObject6$N || (_templateObject6$N = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n margin-right: 20px;\n"])));
13885
14236
 
13886
14237
  var TabWithIcon = function TabWithIcon(_ref5) {
13887
14238
  var icon = _ref5.icon,
@@ -13898,7 +14249,7 @@ var TabWithIcon = function TabWithIcon(_ref5) {
13898
14249
  setSelected(tabId);
13899
14250
  }, [setSelected]);
13900
14251
  var active = selected === tabFor;
13901
- return React__default.createElement(Container$10, Object.assign({}, {
14252
+ return React__default.createElement(Container$12, Object.assign({}, {
13902
14253
  active: active
13903
14254
  }, props, {
13904
14255
  onClick: function onClick() {
@@ -13915,9 +14266,9 @@ var TabWithIcon = function TabWithIcon(_ref5) {
13915
14266
  }), title), subtitle && React__default.createElement(SubTitle$2, null, subtitle)));
13916
14267
  };
13917
14268
 
13918
- var _templateObject$1y, _templateObject2$1n;
13919
- var Container$11 = styled__default.div(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteralLoose([""])));
13920
- var TabListWrapper$1 = styled__default.div(_templateObject2$1n || (_templateObject2$1n = _taggedTemplateLiteralLoose(["\n padding-top: 10px;\n padding-left: ", ";\n box-shadow: 0 -5px 5px 0 var(--black-a1);\n border-bottom: 1px solid var(--grey-6);\n overflow-y: auto;\n scrollbar-width: none; /* Firefox */\n -ms-overflow-style: none; /* Internet Explorer 10+ */\n &::-webkit-scrollbar { /* WebKit */\n width: 0;\n height: 0;\n }\n"])), function (_ref) {
14269
+ var _templateObject$1E, _templateObject2$1r;
14270
+ var Container$13 = styled__default.div(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteralLoose([""])));
14271
+ var TabListWrapper$1 = styled__default.div(_templateObject2$1r || (_templateObject2$1r = _taggedTemplateLiteralLoose(["\n padding-top: 10px;\n padding-left: ", ";\n box-shadow: 0 -5px 5px 0 var(--black-a1);\n border-bottom: 1px solid var(--grey-6);\n overflow-y: auto;\n scrollbar-width: none; /* Firefox */\n -ms-overflow-style: none; /* Internet Explorer 10+ */\n &::-webkit-scrollbar { /* WebKit */\n width: 0;\n height: 0;\n }\n"])), function (_ref) {
13921
14272
  var paddingLeft = _ref.paddingLeft;
13922
14273
  return paddingLeft ? paddingLeft : '87px';
13923
14274
  });
@@ -13926,7 +14277,7 @@ var TabsWithIconBar = function TabsWithIconBar(_ref2) {
13926
14277
  var defaultTabId = _ref2.defaultTabId,
13927
14278
  tabList = _ref2.tabList,
13928
14279
  paddingLeft = _ref2.paddingLeft;
13929
- return React__default.createElement(Container$11, null, React__default.createElement(Tabs, null, React__default.createElement(TabListWrapper$1, Object.assign({}, {
14280
+ return React__default.createElement(Container$13, null, React__default.createElement(Tabs, null, React__default.createElement(TabListWrapper$1, Object.assign({}, {
13930
14281
  paddingLeft: paddingLeft
13931
14282
  }), React__default.createElement(TabList, Object.assign({}, {
13932
14283
  defaultTabId: defaultTabId
@@ -13955,13 +14306,13 @@ var TabsWithIconBar = function TabsWithIconBar(_ref2) {
13955
14306
 
13956
14307
  var _excluded$K = ["closeId", "closeText"];
13957
14308
 
13958
- var _templateObject$1z, _templateObject2$1o, _templateObject3$1e, _templateObject4$16;
13959
- var StyledButton$7 = styled__default.button(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteralLoose(["\n ", "\n\n ", ";\n \n height: ", "px;\n position: fixed;\n bottom: 0;\n font-size: 14px;\n outline: none;\n\n width: 100%;\n text-align: center;\n white-space: nowrap;\n padding: 0 40px;\n\n"])), resetButtonStyles, function (_ref) {
14309
+ var _templateObject$1F, _templateObject2$1s, _templateObject3$1h, _templateObject4$19;
14310
+ var StyledButton$7 = styled__default.button(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteralLoose(["\n ", "\n\n ", ";\n \n height: ", "px;\n position: fixed;\n bottom: 0;\n font-size: 14px;\n outline: none;\n\n width: 100%;\n text-align: center;\n white-space: nowrap;\n padding: 0 40px;\n\n"])), resetButtonStyles, function (_ref) {
13960
14311
  var theme = _ref.theme;
13961
- return styled.css(_templateObject2$1o || (_templateObject2$1o = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n ", ";\n border-top: 1px solid ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"], theme.styles.global.mainMenu.background, theme.colors.divider);
14312
+ return styled.css(_templateObject2$1s || (_templateObject2$1s = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n ", ";\n border-top: 1px solid ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"], theme.styles.global.mainMenu.background, theme.colors.divider);
13962
14313
  }, MOBILE_CLOSE_HEIGHT);
13963
- var IconContainer$2 = styled__default.div(_templateObject3$1e || (_templateObject3$1e = _taggedTemplateLiteralLoose(["\n height: inherit;\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n margin: 0 20px;\n\n svg {\n display:block;\n }\n"])));
13964
- var TextWrapper$1 = styled__default.div(_templateObject4$16 || (_templateObject4$16 = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n"])));
14314
+ var IconContainer$2 = styled__default.div(_templateObject3$1h || (_templateObject3$1h = _taggedTemplateLiteralLoose(["\n height: inherit;\n position: absolute;\n top: 0;\n left: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n margin: 0 20px;\n\n svg {\n display:block;\n }\n"])));
14315
+ var TextWrapper$1 = styled__default.div(_templateObject4$19 || (_templateObject4$19 = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n"])));
13965
14316
 
13966
14317
  var CloseButton$1 = function CloseButton(_ref2) {
13967
14318
  var closeId = _ref2.closeId,
@@ -13983,9 +14334,9 @@ var CloseButton$1 = function CloseButton(_ref2) {
13983
14334
  })), React__default.createElement(TextWrapper$1, null, closeText));
13984
14335
  };
13985
14336
 
13986
- var _templateObject$1A, _templateObject2$1p;
13987
- var Container$12 = styled__default.div(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteralLoose(["\n position: relative;\n min-height: calc(100vh - ", "px);\n width: 100%;\n overflow-y: scroll;\n"])), MOBILE_NAVBAR_HEIGHT + MOBILE_CLOSE_HEIGHT);
13988
- var ContentWrapper = styled__default.div(_templateObject2$1p || (_templateObject2$1p = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n"])));
14337
+ var _templateObject$1G, _templateObject2$1t;
14338
+ var Container$14 = styled__default.div(_templateObject$1G || (_templateObject$1G = _taggedTemplateLiteralLoose(["\n position: relative;\n min-height: calc(100vh - ", "px);\n width: 100%;\n overflow-y: scroll;\n"])), MOBILE_NAVBAR_HEIGHT + MOBILE_CLOSE_HEIGHT);
14339
+ var ContentWrapper = styled__default.div(_templateObject2$1t || (_templateObject2$1t = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n"])));
13989
14340
 
13990
14341
  var MobileNavbarContent = function MobileNavbarContent(_ref) {
13991
14342
  var closeId = _ref.closeId,
@@ -13994,14 +14345,14 @@ var MobileNavbarContent = function MobileNavbarContent(_ref) {
13994
14345
  var _useContext = React.useContext(TabContext),
13995
14346
  selected = _useContext.selected;
13996
14347
 
13997
- return selected === closeId ? null : React__default.createElement(Container$12, null, React__default.createElement(ContentWrapper, null, children));
14348
+ return selected === closeId ? null : React__default.createElement(Container$14, null, React__default.createElement(ContentWrapper, null, children));
13998
14349
  };
13999
14350
 
14000
- var _templateObject$1B, _templateObject2$1q, _templateObject3$1f;
14001
- var Container$13 = styled__default.div(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteralLoose([""])));
14002
- var ItemWrapper = styled__default.div(_templateObject2$1q || (_templateObject2$1q = _taggedTemplateLiteralLoose(["\n padding: 14px 0;\n ", ";\n"])), function (_ref) {
14351
+ var _templateObject$1H, _templateObject2$1u, _templateObject3$1i;
14352
+ var Container$15 = styled__default.div(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteralLoose([""])));
14353
+ var ItemWrapper = styled__default.div(_templateObject2$1u || (_templateObject2$1u = _taggedTemplateLiteralLoose(["\n padding: 14px 0;\n ", ";\n"])), function (_ref) {
14003
14354
  var theme = _ref.theme;
14004
- return styled.css(_templateObject3$1f || (_templateObject3$1f = _taggedTemplateLiteralLoose(["\n border-bottom: 1px solid ", "\n "])), theme.colors.divider);
14355
+ return styled.css(_templateObject3$1i || (_templateObject3$1i = _taggedTemplateLiteralLoose(["\n border-bottom: 1px solid ", "\n "])), theme.colors.divider);
14005
14356
  });
14006
14357
 
14007
14358
  var MobileMenu = function MobileMenu(_ref2) {
@@ -14044,7 +14395,7 @@ var MobileMenu = function MobileMenu(_ref2) {
14044
14395
  var handleCloseMenu = React.useCallback(function () {
14045
14396
  setSelected(closeId);
14046
14397
  }, [closeId, setSelected]);
14047
- return React__default.createElement(Container$13, null, content.items.map(function (item, key) {
14398
+ return React__default.createElement(Container$15, null, content.items.map(function (item, key) {
14048
14399
  return React__default.createElement(ItemWrapper, {
14049
14400
  key: key,
14050
14401
  "data-key": key
@@ -14072,10 +14423,10 @@ var MobileMenu = function MobileMenu(_ref2) {
14072
14423
  })));
14073
14424
  };
14074
14425
 
14075
- var _templateObject$1C, _templateObject2$1r, _templateObject3$1g;
14076
- var Logo$1 = styled__default(reactRouterDom.Link)(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n flex-basis: 0;\n flex-grow: 1;\n justify-content: center;\n align-items: center;\n object {\n pointer-events: none;\n height: 25px;\n }\n"])), resetButtonStyles);
14077
- var LogoMark$1 = styled__default.div(_templateObject2$1r || (_templateObject2$1r = _taggedTemplateLiteralLoose(["\n margin-right: 15px;\n"])));
14078
- var SVGObject$1 = styled__default.object(_templateObject3$1g || (_templateObject3$1g = _taggedTemplateLiteralLoose([""])));
14426
+ var _templateObject$1I, _templateObject2$1v, _templateObject3$1j;
14427
+ var Logo$1 = styled__default(reactRouterDom.Link)(_templateObject$1I || (_templateObject$1I = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n flex-basis: 0;\n flex-grow: 1;\n justify-content: center;\n align-items: center;\n object {\n pointer-events: none;\n height: 25px;\n }\n"])), resetButtonStyles);
14428
+ var LogoMark$1 = styled__default.div(_templateObject2$1v || (_templateObject2$1v = _taggedTemplateLiteralLoose(["\n margin-right: 15px;\n"])));
14429
+ var SVGObject$1 = styled__default.object(_templateObject3$1j || (_templateObject3$1j = _taggedTemplateLiteralLoose([""])));
14079
14430
 
14080
14431
  var MobileLogoLink = function MobileLogoLink(_ref) {
14081
14432
  var _ref$home = _ref.home,
@@ -14099,8 +14450,8 @@ var MobileLogoLink = function MobileLogoLink(_ref) {
14099
14450
 
14100
14451
  var _excluded$L = ["closeId", "hasLanguage", "hasLogout", "logoutLink", "hasCurrentUser", "userSubmenu", "userDrawerBespoke", "loggedInUser", "onLogout", "onLanguageToggle"];
14101
14452
 
14102
- var _templateObject$1D;
14103
- var Container$14 = styled__default.div(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteralLoose(["\n background: ", ";\n z-index: 100;\n display: flex;\n flex-direction: column;\n"])), function (_ref) {
14453
+ var _templateObject$1J;
14454
+ var Container$16 = styled__default.div(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteralLoose(["\n background: ", ";\n z-index: 100;\n display: flex;\n flex-direction: column;\n"])), function (_ref) {
14104
14455
  var theme = _ref.theme;
14105
14456
  return theme.styles.global.mainMenu.background;
14106
14457
  });
@@ -14124,7 +14475,7 @@ var MobileUserMenu = function MobileUserMenu(_ref2) {
14124
14475
  var handleCloseMenu = React.useCallback(function () {
14125
14476
  setSelected(closeId);
14126
14477
  }, [closeId, setSelected]);
14127
- return React__default.createElement(Container$14, null, React__default.createElement(UserMenu, Object.assign({}, _extends({
14478
+ return React__default.createElement(Container$16, null, React__default.createElement(UserMenu, Object.assign({}, _extends({
14128
14479
  hasLanguage: hasLanguage,
14129
14480
  hasLogout: hasLogout,
14130
14481
  logoutLink: logoutLink,
@@ -14141,17 +14492,17 @@ var MobileUserMenu = function MobileUserMenu(_ref2) {
14141
14492
 
14142
14493
  var _excluded$M = ["content", "home", "logoMark", "supportUrl", "defaultMenuOpen", "closeText", "hasLanguage", "hasLogout", "logoutLink", "hasCurrentUser", "hasNotifications", "userSubmenu", "userDrawerBespoke", "loggedInUser", "notificationsHistory", "customDrawer", "onLogout", "onLanguageToggle"];
14143
14494
 
14144
- var _templateObject$1E, _templateObject2$1s;
14495
+ var _templateObject$1K, _templateObject2$1w;
14145
14496
  var CLOSE_ID = 'closeMenu';
14146
14497
  var NOTI_TAB = 'notifications';
14147
14498
  var USER_TAB = 'user';
14148
14499
  var MENU_TAB = 'menu';
14149
14500
  var CUSTOM_TAB = 'custom';
14150
- var Container$15 = styled__default.nav(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n position: sticky;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 99;\n"])), function (_ref) {
14501
+ var Container$17 = styled__default.nav(_templateObject$1K || (_templateObject$1K = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n position: sticky;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 99;\n"])), function (_ref) {
14151
14502
  var theme = _ref.theme;
14152
14503
  return theme.styles.global.mainMenu.background.backgroundColor;
14153
14504
  });
14154
- var HeaderContainer = styled__default.div(_templateObject2$1s || (_templateObject2$1s = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n height: ", "px;\n border-bottom: ", " 1px solid;\n\n ", " {\n flex-basis: 0;\n flex-grow: 3;\n }\n"])), MOBILE_NAVBAR_HEIGHT, function (_ref2) {
14505
+ var HeaderContainer = styled__default.div(_templateObject2$1w || (_templateObject2$1w = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n height: ", "px;\n border-bottom: ", " 1px solid;\n\n ", " {\n flex-basis: 0;\n flex-grow: 3;\n }\n"])), MOBILE_NAVBAR_HEIGHT, function (_ref2) {
14155
14506
  var theme = _ref2.theme;
14156
14507
  return theme.colors.divider;
14157
14508
  }, TabListWrapper);
@@ -14178,7 +14529,7 @@ var MobileNavbar = function MobileNavbar(_ref3) {
14178
14529
  onLanguageToggle = _ref3.onLanguageToggle,
14179
14530
  props = _objectWithoutPropertiesLoose(_ref3, _excluded$M);
14180
14531
 
14181
- return React__default.createElement(Container$15, null, React__default.createElement(Tabs, null, React__default.createElement(HeaderContainer, null, React__default.createElement(MobileLogoLink, Object.assign({}, {
14532
+ return React__default.createElement(Container$17, null, React__default.createElement(Tabs, null, React__default.createElement(HeaderContainer, null, React__default.createElement(MobileLogoLink, Object.assign({}, {
14182
14533
  home: home,
14183
14534
  logoMark: logoMark
14184
14535
  }, {
@@ -14235,7 +14586,7 @@ var MobileNavbar = function MobileNavbar(_ref3) {
14235
14586
  })))));
14236
14587
  };
14237
14588
 
14238
- var _excluded$N = ["content", "home", "openWidth", "logoMark", "logoText", "supportUrl", "defaultMenuOpen", "canAlwaysPin", "paddingOverride", "maxWidth", "children", "onMenuToggle"];
14589
+ var _excluded$N = ["content", "home", "openWidth", "logoMark", "logoText", "supportUrl", "defaultMenuOpen", "canAlwaysPin", "paddingOverride", "maxWidth", "legacyLayout", "children", "onMenuToggle"];
14239
14590
 
14240
14591
  var GlobalUI = function GlobalUI(_ref) {
14241
14592
  var content = _ref.content,
@@ -14248,6 +14599,7 @@ var GlobalUI = function GlobalUI(_ref) {
14248
14599
  canAlwaysPin = _ref.canAlwaysPin,
14249
14600
  paddingOverride = _ref.paddingOverride,
14250
14601
  maxWidth = _ref.maxWidth,
14602
+ legacyLayout = _ref.legacyLayout,
14251
14603
  children = _ref.children,
14252
14604
  onMenuToggle = _ref.onMenuToggle,
14253
14605
  props = _objectWithoutPropertiesLoose(_ref, _excluded$N);
@@ -14267,7 +14619,8 @@ var GlobalUI = function GlobalUI(_ref) {
14267
14619
  onMenuToggle: onMenuToggle
14268
14620
  })), React__default.createElement(MainContainer, null, React__default.createElement(TopBar, Object.assign({}, _extends({}, props))), React__default.createElement(ContentArea, Object.assign({}, {
14269
14621
  maxWidth: maxWidth,
14270
- paddingOverride: paddingOverride
14622
+ paddingOverride: paddingOverride,
14623
+ legacyLayout: legacyLayout
14271
14624
  }), children))) : React__default.createElement(MobileLayout, null, React__default.createElement(MobileNavbar, Object.assign({}, _extends({
14272
14625
  content: content,
14273
14626
  home: home,
@@ -14279,16 +14632,16 @@ var GlobalUI = function GlobalUI(_ref) {
14279
14632
 
14280
14633
  var _excluded$O = ["children"];
14281
14634
 
14282
- var _templateObject$1F, _templateObject2$1t, _templateObject3$1h, _templateObject4$17, _templateObject5$_, _templateObject6$M, _templateObject7$H, _templateObject8$C, _templateObject9$u;
14283
- var Container$16 = styled__default.div(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteralLoose(["\n width: 286px;\n border-right: 1px solid var(--grey-a7);\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n display: flex;\n flex-direction: column;\n"])));
14284
- var LogoContainer = styled__default.div(_templateObject2$1t || (_templateObject2$1t = _taggedTemplateLiteralLoose(["\n height: 84px;\n color: var(--grey-11);\n border-bottom: 1px solid var(--grey-a7);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding-top: 18px;\n padding-bottom: 15px;\n"])));
14285
- var LogoTopText = styled__default.div(_templateObject3$1h || (_templateObject3$1h = _taggedTemplateLiteralLoose(["\n height: 31px;\n font-family: Monorale;\n font-size: 18px;\n font-weight: 500;\n line-height: 1.72;\n letter-spacing: 4.5px;\n text-align: center;\n"])));
14286
- var LogoBottomText = styled__default.div(_templateObject4$17 || (_templateObject4$17 = _taggedTemplateLiteralLoose(["\n height: 19px;\n font-family: Monorale;\n font-size: 16px;\n font-weight: 300;\n line-height: normal;\n letter-spacing: 14.11px;\n text-align: center;\n"])));
14287
- var SidebarBox = styled__default.div(_templateObject5$_ || (_templateObject5$_ = _taggedTemplateLiteralLoose(["\n position: relative;\n border-bottom: 1px solid var(--grey-a7);\n padding: 22px 20px 21px 20px;\n"])));
14288
- var SidebarHeading = styled__default.div(_templateObject6$M || (_templateObject6$M = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n margin-bottom: 18px;\n"])));
14289
- var SidebarLinkHeading = styled__default.div(_templateObject7$H || (_templateObject7$H = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
14290
- var BackLink = styled__default(reactRouterDom.Link)(_templateObject8$C || (_templateObject8$C = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
14291
- var SLink = styled__default(reactRouterDom.Link)(_templateObject9$u || (_templateObject9$u = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 30px;\n top: 15px;\n /* width: 80px; */\n /* height: 30px; */\n font-size: 14px;\n font-weight: 600;\n text-align: center;\n color: var(--grey-9);\n border-radius: 3px;\n background-color: var(--primary-2);\n text-decoration: none;\n padding: 7px 20px;\n"])));
14635
+ var _templateObject$1L, _templateObject2$1x, _templateObject3$1k, _templateObject4$1a, _templateObject5$11, _templateObject6$O, _templateObject7$K, _templateObject8$E, _templateObject9$w;
14636
+ var Container$18 = styled__default.div(_templateObject$1L || (_templateObject$1L = _taggedTemplateLiteralLoose(["\n width: 286px;\n border-right: 1px solid var(--grey-a7);\n height: 100%;\n overflow-y: auto;\n overflow-x: hidden;\n display: flex;\n flex-direction: column;\n"])));
14637
+ var LogoContainer = styled__default.div(_templateObject2$1x || (_templateObject2$1x = _taggedTemplateLiteralLoose(["\n height: 84px;\n color: var(--grey-11);\n border-bottom: 1px solid var(--grey-a7);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding-top: 18px;\n padding-bottom: 15px;\n"])));
14638
+ var LogoTopText = styled__default.div(_templateObject3$1k || (_templateObject3$1k = _taggedTemplateLiteralLoose(["\n height: 31px;\n font-family: Monorale;\n font-size: 18px;\n font-weight: 500;\n line-height: 1.72;\n letter-spacing: 4.5px;\n text-align: center;\n"])));
14639
+ var LogoBottomText = styled__default.div(_templateObject4$1a || (_templateObject4$1a = _taggedTemplateLiteralLoose(["\n height: 19px;\n font-family: Monorale;\n font-size: 16px;\n font-weight: 300;\n line-height: normal;\n letter-spacing: 14.11px;\n text-align: center;\n"])));
14640
+ var SidebarBox = styled__default.div(_templateObject5$11 || (_templateObject5$11 = _taggedTemplateLiteralLoose(["\n position: relative;\n border-bottom: 1px solid var(--grey-a7);\n padding: 22px 20px 21px 20px;\n"])));
14641
+ var SidebarHeading = styled__default.div(_templateObject6$O || (_templateObject6$O = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n margin-bottom: 18px;\n"])));
14642
+ var SidebarLinkHeading = styled__default.div(_templateObject7$K || (_templateObject7$K = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
14643
+ var BackLink$1 = styled__default(reactRouterDom.Link)(_templateObject8$E || (_templateObject8$E = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
14644
+ var SLink = styled__default(reactRouterDom.Link)(_templateObject9$w || (_templateObject9$w = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 30px;\n top: 15px;\n /* width: 80px; */\n /* height: 30px; */\n font-size: 14px;\n font-weight: 600;\n text-align: center;\n color: var(--grey-9);\n border-radius: 3px;\n background-color: var(--primary-2);\n text-decoration: none;\n padding: 7px 20px;\n"])));
14292
14645
  var SidebarLink = function SidebarLink(_ref) {
14293
14646
  var title = _ref.title,
14294
14647
  to = _ref.to;
@@ -14306,7 +14659,7 @@ var Sidebar = function Sidebar(_ref3) {
14306
14659
  var children = _ref3.children,
14307
14660
  props = _objectWithoutPropertiesLoose(_ref3, _excluded$O);
14308
14661
 
14309
- return React__default.createElement(Container$16, Object.assign({}, props), children);
14662
+ return React__default.createElement(Container$18, Object.assign({}, props), children);
14310
14663
  };
14311
14664
 
14312
14665
  Object.defineProperty(exports, 'IconSVGs', {
@@ -14321,7 +14674,7 @@ exports.AlertBar = AlertBar;
14321
14674
  exports.AlertWrapper = AlertWrapper;
14322
14675
  exports.AreaUploadManager = AreaUploadManager;
14323
14676
  exports.AvatarUploader = AvatarUploader;
14324
- exports.BackLink = BackLink;
14677
+ exports.BackLink = BackLink$1;
14325
14678
  exports.BasicSearchInput = BasicSearchInput;
14326
14679
  exports.Button = Button;
14327
14680
  exports.ButtonWithIcon = ButtonWithIcon;
@@ -14330,7 +14683,8 @@ exports.CameraPanelWrapper = CameraPanelWrapper;
14330
14683
  exports.CameraPanels = CameraPanels;
14331
14684
  exports.Checkbox = Checkbox;
14332
14685
  exports.ConfirmationModal = ConfirmationModal;
14333
- exports.Content = Content;
14686
+ exports.Content = Content$1;
14687
+ exports.ContentLayout = ContentLayout;
14334
14688
  exports.Controls = Controls;
14335
14689
  exports.CropTool = CropTool;
14336
14690
  exports.DatePicker = DatePicker;
@@ -14346,6 +14700,7 @@ exports.FilterInputs = FilterInputs;
14346
14700
  exports.FilterLayout = FilterLayout;
14347
14701
  exports.FiltersResults = FiltersResults;
14348
14702
  exports.Form = Form;
14703
+ exports.FullWidthContentBlock = FullWidthContentBlock;
14349
14704
  exports.GlobalUI = GlobalUI;
14350
14705
  exports.Icon = Icon;
14351
14706
  exports.IconButton = IconButton$2;
@@ -14373,6 +14728,7 @@ exports.PTZProvider = PTZProvider;
14373
14728
  exports.PTZReducer = reducer;
14374
14729
  exports.PageHeader = PageHeader;
14375
14730
  exports.PageTitle = PageTitle;
14731
+ exports.Pagination = Pagination;
14376
14732
  exports.PasswordField = PasswordField;
14377
14733
  exports.PercentageSlider = PercentageSlider;
14378
14734
  exports.RadioButton = RadioButton;
@@ -14405,10 +14761,12 @@ exports.TagListWrapper = TagListWrapper;
14405
14761
  exports.TextArea = TextArea;
14406
14762
  exports.TextAreaField = TextAreaField;
14407
14763
  exports.TextField = TextField;
14764
+ exports.ThemeVariables = GlobalStyle;
14408
14765
  exports.TopBar = TopBar;
14409
14766
  exports.TypeTable = TypeTable;
14767
+ exports.UtilityHeader = UtilityHeader;
14410
14768
  exports.WebRTCClient = WebRTCPlayer;
14411
- exports.defaultTheme = light;
14769
+ exports.defaultTheme = index;
14412
14770
  exports.isDateInterval = isDateInterval;
14413
14771
  exports.isFilterItem = isFilterItem;
14414
14772
  exports.resetButtonStyles = resetButtonStyles;