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/Form/atoms/IconButton.d.ts +1 -1
- package/dist/Global/atoms/Layout.d.ts +1 -0
- package/dist/Global/templates/GlobalUI.d.ts +1 -0
- package/dist/Layouts/atoms/FullWidthContentBlock.d.ts +3 -0
- package/dist/Layouts/index.d.ts +22 -0
- package/dist/Layouts/molecules/UtilityHeader.d.ts +4 -0
- package/dist/Layouts/organisms/ContentLayout.d.ts +8 -0
- package/dist/Misc/index.d.ts +3 -2
- package/dist/Misc/molecules/Pagination.d.ts +20 -0
- package/dist/index.d.ts +6 -4
- package/dist/index.js +911 -553
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +903 -550
- package/dist/index.modern.js.map +1 -1
- package/dist/theme/ThemeVariables.d.ts +2 -0
- package/dist/theme/variables/Layout.d.ts +1 -0
- package/package.json +1 -1
- /package/dist/{themes → theme}/common.d.ts +0 -0
- /package/dist/{themes/light/light.d.ts → theme/index.d.ts} +0 -0
- /package/dist/{themes/light → theme/legacy}/colors.d.ts +0 -0
- /package/dist/{themes/light → theme/legacy}/custom.d.ts +0 -0
- /package/dist/{themes/light → theme/legacy}/styles.d.ts +0 -0
- /package/dist/{themes/light → theme/legacy}/typography.d.ts +0 -0
package/dist/index.modern.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import styled, { css, createGlobalStyle, keyframes } from 'styled-components';
|
|
1
2
|
import React__default, { useState, useEffect, useCallback, useRef, createElement, Fragment, useContext, useMemo, useLayoutEffect, createContext, useReducer } from 'react';
|
|
2
|
-
import styled, { css, keyframes } from 'styled-components';
|
|
3
3
|
import { IconSVGs } from '@future-standard/icons';
|
|
4
4
|
export { IconSVGs } from '@future-standard/icons';
|
|
5
5
|
import ReactDom from 'react-dom';
|
|
@@ -101,7 +101,7 @@ var deviceSize = {
|
|
|
101
101
|
medium: 768,
|
|
102
102
|
large: 1024,
|
|
103
103
|
xlarge: 1280,
|
|
104
|
-
xxlarge:
|
|
104
|
+
xxlarge: 1536
|
|
105
105
|
};
|
|
106
106
|
var deviceMediaQuery = {
|
|
107
107
|
small: "(min-width: " + deviceSize.small + "px)",
|
|
@@ -1639,7 +1639,7 @@ var custom = {
|
|
|
1639
1639
|
}
|
|
1640
1640
|
};
|
|
1641
1641
|
|
|
1642
|
-
var
|
|
1642
|
+
var index = {
|
|
1643
1643
|
fontFamily: fontFamily,
|
|
1644
1644
|
dimensions: dimensions,
|
|
1645
1645
|
typography: typography,
|
|
@@ -1692,8 +1692,14 @@ function _taggedTemplateLiteralLoose(strings, raw) {
|
|
|
1692
1692
|
return strings;
|
|
1693
1693
|
}
|
|
1694
1694
|
|
|
1695
|
-
var _templateObject
|
|
1696
|
-
var
|
|
1695
|
+
var _templateObject;
|
|
1696
|
+
var layoutVariables = 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);
|
|
1697
|
+
|
|
1698
|
+
var _templateObject$1;
|
|
1699
|
+
var GlobalStyle = 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);
|
|
1700
|
+
|
|
1701
|
+
var _templateObject$2, _templateObject2, _templateObject3;
|
|
1702
|
+
var wrapperCss = 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"])));
|
|
1697
1703
|
var IconWrapper = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), wrapperCss);
|
|
1698
1704
|
var IconWrapperForSVG = styled.g(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), wrapperCss);
|
|
1699
1705
|
|
|
@@ -1704,7 +1710,7 @@ var Icon = function Icon(_ref) {
|
|
|
1704
1710
|
_ref$weight = _ref.weight,
|
|
1705
1711
|
weight = _ref$weight === void 0 ? 'regular' : _ref$weight,
|
|
1706
1712
|
_ref$color = _ref.color,
|
|
1707
|
-
color = _ref$color === void 0 ? '
|
|
1713
|
+
color = _ref$color === void 0 ? 'grey-12' : _ref$color,
|
|
1708
1714
|
_ref$forSvgUsage = _ref.forSvgUsage,
|
|
1709
1715
|
forSvgUsage = _ref$forSvgUsage === void 0 ? false : _ref$forSvgUsage;
|
|
1710
1716
|
var iconWeight = dimensions.icons.weights[weight];
|
|
@@ -1712,23 +1718,23 @@ var Icon = function Icon(_ref) {
|
|
|
1712
1718
|
return IconSVG != null ? forSvgUsage ? React__default.createElement(IconWrapperForSVG, null, IconSVG({
|
|
1713
1719
|
size: size,
|
|
1714
1720
|
weight: iconWeight,
|
|
1715
|
-
color: "var(--" + color + ")"
|
|
1721
|
+
color: "var(--" + color + ", var(--grey-12))"
|
|
1716
1722
|
})) : React__default.createElement(IconWrapper, null, IconSVG({
|
|
1717
1723
|
size: size,
|
|
1718
1724
|
weight: iconWeight,
|
|
1719
|
-
color: "var(--" + color + ")"
|
|
1725
|
+
color: "var(--" + color + ", var(--grey-12))"
|
|
1720
1726
|
})) : null;
|
|
1721
1727
|
};
|
|
1722
1728
|
|
|
1723
|
-
var _templateObject$
|
|
1724
|
-
var RowCss = css(_templateObject$
|
|
1729
|
+
var _templateObject$3, _templateObject2$1, _templateObject3$1, _templateObject4, _templateObject5;
|
|
1730
|
+
var RowCss = css(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n position:relative;\n display: flex;\n flex-direction: row;\n align-items:center;\n"])));
|
|
1725
1731
|
var ColumnCss = css(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
1726
1732
|
var resetButtonStyles = 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"])));
|
|
1727
1733
|
var removeAutoFillStyle = 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"])));
|
|
1728
1734
|
var EllipsisStyles = css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"])));
|
|
1729
1735
|
|
|
1730
|
-
var _templateObject$
|
|
1731
|
-
var IconButton = styled.button(_templateObject$
|
|
1736
|
+
var _templateObject$4, _templateObject2$2, _templateObject3$2, _templateObject4$1;
|
|
1737
|
+
var IconButton = styled.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) {
|
|
1732
1738
|
var _ref$selected = _ref.selected,
|
|
1733
1739
|
selected = _ref$selected === void 0 ? false : _ref$selected;
|
|
1734
1740
|
return selected && css(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n border-bottom: 5px solid var(--primary-7);\n "])));
|
|
@@ -1775,8 +1781,8 @@ var AlertBar = function AlertBar(_ref3) {
|
|
|
1775
1781
|
}))) : null;
|
|
1776
1782
|
};
|
|
1777
1783
|
|
|
1778
|
-
var _templateObject$
|
|
1779
|
-
var initAnimation = keyframes(_templateObject$
|
|
1784
|
+
var _templateObject$5, _templateObject2$3, _templateObject3$3, _templateObject4$2, _templateObject5$1, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
1785
|
+
var initAnimation = keyframes(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translate(-50%, -100%);\n }\n 100% {\n transform: translate(-50%, 0%);\n }\n"])));
|
|
1780
1786
|
var closeAnimation = keyframes(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translate(-50%, 0);\n }\n 100% {\n transform: translate(-50%, -100%);\n }\n"])));
|
|
1781
1787
|
var Container = styled.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) {
|
|
1782
1788
|
var type = _ref.type;
|
|
@@ -1907,8 +1913,8 @@ var Notification = function Notification(_ref6) {
|
|
|
1907
1913
|
|
|
1908
1914
|
var _excluded = ["design", "size", "children"];
|
|
1909
1915
|
|
|
1910
|
-
var _templateObject$
|
|
1911
|
-
var StyledButton = styled.button(_templateObject$
|
|
1916
|
+
var _templateObject$6, _templateObject2$4;
|
|
1917
|
+
var StyledButton = styled.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) {
|
|
1912
1918
|
var theme = _ref.theme,
|
|
1913
1919
|
design = _ref.design,
|
|
1914
1920
|
size = _ref.size;
|
|
@@ -1933,8 +1939,8 @@ var Button = function Button(_ref2) {
|
|
|
1933
1939
|
|
|
1934
1940
|
var _excluded$1 = ["design", "size", "onClick", "disabled", "position", "icon", "children"];
|
|
1935
1941
|
|
|
1936
|
-
var _templateObject$
|
|
1937
|
-
var TextContainer = styled.div(_templateObject$
|
|
1942
|
+
var _templateObject$7, _templateObject2$5, _templateObject3$4, _templateObject4$3, _templateObject5$2, _templateObject6$1, _templateObject7$1;
|
|
1943
|
+
var TextContainer = styled.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) {
|
|
1938
1944
|
var position = _ref.position,
|
|
1939
1945
|
size = _ref.size;
|
|
1940
1946
|
return position && position === 'left' ? css(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n padding-left: ", ";\n "])), size === 'xsmall' ? "10px" : "20px") : css(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n padding-right: ", ";\n "])), size === 'xsmall' ? "10px" : "20px");
|
|
@@ -1979,7 +1985,7 @@ var ButtonWithIcon = function ButtonWithIcon(_ref4) {
|
|
|
1979
1985
|
}))));
|
|
1980
1986
|
};
|
|
1981
1987
|
|
|
1982
|
-
var _templateObject$
|
|
1988
|
+
var _templateObject$8, _templateObject2$6, _templateObject3$5, _templateObject4$4;
|
|
1983
1989
|
|
|
1984
1990
|
var circumference = function circumference(radius) {
|
|
1985
1991
|
return 2 * 3.1416 * radius;
|
|
@@ -1987,7 +1993,7 @@ var circumference = function circumference(radius) {
|
|
|
1987
1993
|
|
|
1988
1994
|
var animation$1 = function animation(radius) {
|
|
1989
1995
|
var c = circumference(radius);
|
|
1990
|
-
return keyframes(_templateObject$
|
|
1996
|
+
return 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);
|
|
1991
1997
|
};
|
|
1992
1998
|
|
|
1993
1999
|
var rotate = keyframes(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n"])));
|
|
@@ -2066,8 +2072,8 @@ var Spinner = function Spinner(_ref5) {
|
|
|
2066
2072
|
|
|
2067
2073
|
var _excluded$2 = ["design", "size", "onClick", "disabled", "position", "loading", "children"];
|
|
2068
2074
|
|
|
2069
|
-
var _templateObject$
|
|
2070
|
-
var LoadingButton = styled(Button)(_templateObject$
|
|
2075
|
+
var _templateObject$9, _templateObject2$7, _templateObject3$6, _templateObject4$5, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11;
|
|
2076
|
+
var LoadingButton = styled(Button)(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
|
|
2071
2077
|
var $loading = _ref.$loading,
|
|
2072
2078
|
theme = _ref.theme;
|
|
2073
2079
|
return $loading && 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);
|
|
@@ -2128,15 +2134,13 @@ var ButtonWithLoading = function ButtonWithLoading(_ref6) {
|
|
|
2128
2134
|
|
|
2129
2135
|
var _excluded$3 = ["icon", "size", "weight", "color", "hoverColor"];
|
|
2130
2136
|
|
|
2131
|
-
var _templateObject$
|
|
2132
|
-
var StyledButton$1 = styled.button(_templateObject$
|
|
2133
|
-
var
|
|
2134
|
-
|
|
2135
|
-
return theme.colors.icons[color];
|
|
2137
|
+
var _templateObject$a;
|
|
2138
|
+
var StyledButton$1 = styled.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) {
|
|
2139
|
+
var color = _ref.color;
|
|
2140
|
+
return color;
|
|
2136
2141
|
}, IconWrapper, function (_ref2) {
|
|
2137
|
-
var
|
|
2138
|
-
|
|
2139
|
-
return theme.colors.icons[hoverColor];
|
|
2142
|
+
var hoverColor = _ref2.hoverColor;
|
|
2143
|
+
return hoverColor;
|
|
2140
2144
|
});
|
|
2141
2145
|
|
|
2142
2146
|
var IconButton$2 = function IconButton(_ref3) {
|
|
@@ -2162,8 +2166,8 @@ var IconButton$2 = function IconButton(_ref3) {
|
|
|
2162
2166
|
}));
|
|
2163
2167
|
};
|
|
2164
2168
|
|
|
2165
|
-
var _templateObject$
|
|
2166
|
-
var StyledIconButton = styled(IconButton$2)(_templateObject$
|
|
2169
|
+
var _templateObject$b, _templateObject2$8, _templateObject3$7, _templateObject4$6, _templateObject5$4;
|
|
2170
|
+
var StyledIconButton = styled(IconButton$2)(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose([""])));
|
|
2167
2171
|
var Container$1 = styled.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) {
|
|
2168
2172
|
var alignment = _ref.alignment;
|
|
2169
2173
|
return alignment === 'left' && css(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n justify-content: flex-start;\n "])));
|
|
@@ -2202,8 +2206,8 @@ var ActionButtons = function ActionButtons(_ref4) {
|
|
|
2202
2206
|
|
|
2203
2207
|
var _excluded$4 = ["type", "placeholder", "defaultValue", "fieldState", "feedbackMessage", "actionCallback", "actionIcon", "postfix"];
|
|
2204
2208
|
|
|
2205
|
-
var _templateObject$
|
|
2206
|
-
var ActionContainer = styled.div(_templateObject$
|
|
2209
|
+
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;
|
|
2210
|
+
var ActionContainer = styled.div(_templateObject$c || (_templateObject$c = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 0;\n top: 0;\n"])));
|
|
2207
2211
|
var InputActionButton = styled.button.attrs({
|
|
2208
2212
|
type: "button"
|
|
2209
2213
|
})(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteralLoose(["\n width: 40px;\n height: 40px;\n background: transparent;\n border: none;\n cursor: pointer;\n outline: none;\n"])));
|
|
@@ -2324,8 +2328,8 @@ var Input = function Input(_ref13) {
|
|
|
2324
2328
|
|
|
2325
2329
|
var _excluded$5 = ["htmlFor", "labelText", "rightAlign", "children"];
|
|
2326
2330
|
|
|
2327
|
-
var _templateObject$
|
|
2328
|
-
var StyledLabel = styled.label(_templateObject$
|
|
2331
|
+
var _templateObject$d, _templateObject2$a;
|
|
2332
|
+
var StyledLabel = styled.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) {
|
|
2329
2333
|
var theme = _ref.theme;
|
|
2330
2334
|
return theme.fontFamily.ui;
|
|
2331
2335
|
}, function (_ref2) {
|
|
@@ -2355,8 +2359,8 @@ var Label = function Label(_ref4) {
|
|
|
2355
2359
|
|
|
2356
2360
|
var _excluded$6 = ["unit", "label", "name", "type", "placeholder", "defaultValue", "fieldState", "className"];
|
|
2357
2361
|
|
|
2358
|
-
var _templateObject$
|
|
2359
|
-
var StyledInput$1 = styled.input(_templateObject$
|
|
2362
|
+
var _templateObject$e, _templateObject2$b, _templateObject3$9, _templateObject4$8, _templateObject5$6, _templateObject6$4, _templateObject7$4, _templateObject8$3, _templateObject9$3, _templateObject10$3;
|
|
2363
|
+
var StyledInput$1 = styled.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) {
|
|
2360
2364
|
var theme = _ref.theme,
|
|
2361
2365
|
fieldState = _ref.fieldState;
|
|
2362
2366
|
return 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);
|
|
@@ -2429,7 +2433,7 @@ var SmallInput = function SmallInput(_ref8) {
|
|
|
2429
2433
|
}, unit) : null)));
|
|
2430
2434
|
};
|
|
2431
2435
|
|
|
2432
|
-
var _templateObject$
|
|
2436
|
+
var _templateObject$f, _templateObject2$c, _templateObject3$a, _templateObject4$9, _templateObject5$7, _templateObject6$5, _templateObject7$5, _templateObject8$4, _templateObject9$4, _templateObject10$4, _templateObject11$2;
|
|
2433
2437
|
var SwitchPosition;
|
|
2434
2438
|
|
|
2435
2439
|
(function (SwitchPosition) {
|
|
@@ -2445,7 +2449,7 @@ var intentPosition = function intentPosition(left, checked) {
|
|
|
2445
2449
|
return intentLeft + "px";
|
|
2446
2450
|
};
|
|
2447
2451
|
|
|
2448
|
-
var RealInput = styled.input(_templateObject$
|
|
2452
|
+
var RealInput = styled.input(_templateObject$f || (_templateObject$f = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
|
|
2449
2453
|
var SwitchOuter = styled.div(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n border: 1px solid transparent;\n box-sizing: border-box;\n cursor: pointer;\n position: relative;\n"])));
|
|
2450
2454
|
|
|
2451
2455
|
var getPositionKey = function getPositionKey(switchPos) {
|
|
@@ -2727,7 +2731,7 @@ function SvgNoImage() {
|
|
|
2727
2731
|
}));
|
|
2728
2732
|
}
|
|
2729
2733
|
|
|
2730
|
-
var _templateObject$
|
|
2734
|
+
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;
|
|
2731
2735
|
var CheckboxState;
|
|
2732
2736
|
|
|
2733
2737
|
(function (CheckboxState) {
|
|
@@ -2736,7 +2740,7 @@ var CheckboxState;
|
|
|
2736
2740
|
CheckboxState["Indeterminate"] = "indeterminate";
|
|
2737
2741
|
})(CheckboxState || (CheckboxState = {}));
|
|
2738
2742
|
|
|
2739
|
-
var RealInput$1 = styled.input(_templateObject$
|
|
2743
|
+
var RealInput$1 = styled.input(_templateObject$g || (_templateObject$g = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
|
|
2740
2744
|
var CheckboxOuter = styled.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"])));
|
|
2741
2745
|
var CheckboxInner = styled.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"])));
|
|
2742
2746
|
var IconWrapper$2 = styled.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) {
|
|
@@ -2812,8 +2816,8 @@ var Checkbox = function Checkbox(_ref5) {
|
|
|
2812
2816
|
})), " ");
|
|
2813
2817
|
};
|
|
2814
2818
|
|
|
2815
|
-
var _templateObject$
|
|
2816
|
-
var InnerRadio = styled.div(_templateObject$
|
|
2819
|
+
var _templateObject$h, _templateObject2$e, _templateObject3$c, _templateObject4$b, _templateObject5$9, _templateObject6$7, _templateObject7$7, _templateObject8$6, _templateObject9$6, _templateObject10$6;
|
|
2820
|
+
var InnerRadio = styled.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteralLoose(["\n width: 10px;\n height: 10px;\n border-radius: 50%;\n user-select: none;\n"])));
|
|
2817
2821
|
var OuterRadio = styled.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) {
|
|
2818
2822
|
var styles = _ref.theme.styles,
|
|
2819
2823
|
isChecked = _ref.isChecked,
|
|
@@ -2857,8 +2861,8 @@ var RadioButton = function RadioButton(_ref2) {
|
|
|
2857
2861
|
|
|
2858
2862
|
var _excluded$7 = ["placeholder", "fieldState", "feedbackMessage", "children"];
|
|
2859
2863
|
|
|
2860
|
-
var _templateObject$
|
|
2861
|
-
var FeedbackIcon$1 = styled.div(_templateObject$
|
|
2864
|
+
var _templateObject$i, _templateObject2$f, _templateObject3$d, _templateObject4$c, _templateObject5$a, _templateObject6$8, _templateObject7$8, _templateObject8$7, _templateObject9$7, _templateObject10$7;
|
|
2865
|
+
var FeedbackIcon$1 = styled.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"])));
|
|
2862
2866
|
var StyledTextArea = styled.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) {
|
|
2863
2867
|
var theme = _ref.theme,
|
|
2864
2868
|
fieldState = _ref.fieldState;
|
|
@@ -2961,8 +2965,8 @@ var TextArea = function TextArea(_ref13) {
|
|
|
2961
2965
|
|
|
2962
2966
|
var _excluded$8 = ["placeholder", "label", "isCompact", "defaultValue", "changeCallback", "children"];
|
|
2963
2967
|
|
|
2964
|
-
var _templateObject$
|
|
2965
|
-
var SelectWrapper = styled.div(_templateObject$
|
|
2968
|
+
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;
|
|
2969
|
+
var SelectWrapper = styled.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);
|
|
2966
2970
|
var StyledSelect = styled.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) {
|
|
2967
2971
|
var styles = _ref.theme.styles;
|
|
2968
2972
|
return css(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n ", ";\n "])), styles.form.input["default"].normal);
|
|
@@ -3119,15 +3123,15 @@ var uniqueID = function uniqueID() {
|
|
|
3119
3123
|
};
|
|
3120
3124
|
|
|
3121
3125
|
var isNotNumber = function isNotNumber(value) {
|
|
3122
|
-
var intValue =
|
|
3126
|
+
var intValue = Number(value);
|
|
3123
3127
|
return intValue !== intValue;
|
|
3124
3128
|
};
|
|
3125
3129
|
|
|
3126
3130
|
var _excluded$9 = ["min", "max", "marks", "defaultValue", "thumbColor", "disabled", "onlyMarkSelect", "inputCallback", "onChangeCallback", "allMarkCentered"];
|
|
3127
3131
|
|
|
3128
|
-
var _templateObject$
|
|
3132
|
+
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;
|
|
3129
3133
|
var ThumbDiameter = 16;
|
|
3130
|
-
var SliderWrapper = styled.div(_templateObject$
|
|
3134
|
+
var SliderWrapper = styled.div(_templateObject$k || (_templateObject$k = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n position: relative;\n height: 30px;\n margin-top: 20px;\n ", ";\n"])), function (_ref) {
|
|
3131
3135
|
var theme = _ref.theme;
|
|
3132
3136
|
return theme.fontFamily.data;
|
|
3133
3137
|
}, function (_ref2) {
|
|
@@ -3371,8 +3375,8 @@ var SliderInput = function SliderInput(_ref12) {
|
|
|
3371
3375
|
|
|
3372
3376
|
var _excluded$a = ["text", "buttonDesign", "buttonSize", "inputCallback"];
|
|
3373
3377
|
|
|
3374
|
-
var _templateObject$
|
|
3375
|
-
var Container$9 = styled.div(_templateObject$
|
|
3378
|
+
var _templateObject$l, _templateObject2$i, _templateObject3$g;
|
|
3379
|
+
var Container$9 = styled.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose([""])));
|
|
3376
3380
|
var HiddenInput$2 = styled.input(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
|
|
3377
3381
|
var StyledButton$2 = styled(Button)(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteralLoose(["\n text-align: center;\n"])));
|
|
3378
3382
|
|
|
@@ -3420,8 +3424,8 @@ var InputFileButton = function InputFileButton(_ref) {
|
|
|
3420
3424
|
|
|
3421
3425
|
var _excluded$b = ["max", "min", "defaultValue", "title", "timeUnit", "controlledValue", "inputCallback"];
|
|
3422
3426
|
|
|
3423
|
-
var _templateObject$
|
|
3424
|
-
var Container$a = styled.div(_templateObject$
|
|
3427
|
+
var _templateObject$m, _templateObject2$j, _templateObject3$h, _templateObject4$f, _templateObject5$d;
|
|
3428
|
+
var Container$a = styled.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteralLoose([""])));
|
|
3425
3429
|
var Headers = styled.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"])));
|
|
3426
3430
|
var ValueLabel = styled(Label)(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n margin-bottom: 0;\n"])), function (_ref) {
|
|
3427
3431
|
var theme = _ref.theme;
|
|
@@ -3475,8 +3479,8 @@ var DurationSlider = function DurationSlider(_ref3) {
|
|
|
3475
3479
|
|
|
3476
3480
|
var _excluded$c = ["defaultValue", "inputCallback", "updateThumbColor", "updateTitle", "showValue", "allMarkCentered"];
|
|
3477
3481
|
|
|
3478
|
-
var _templateObject$
|
|
3479
|
-
var Container$b = styled.div(_templateObject$
|
|
3482
|
+
var _templateObject$n, _templateObject2$k, _templateObject3$i;
|
|
3483
|
+
var Container$b = styled.div(_templateObject$n || (_templateObject$n = _taggedTemplateLiteralLoose([""])));
|
|
3480
3484
|
var Headers$1 = styled.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) {
|
|
3481
3485
|
var allMarkCentered = _ref.allMarkCentered;
|
|
3482
3486
|
return allMarkCentered ? "padding: 0;" : "padding: 0 6px;";
|
|
@@ -3632,8 +3636,8 @@ var TextAreaField = function TextAreaField(_ref) {
|
|
|
3632
3636
|
|
|
3633
3637
|
var _excluded$g = ["height", "text", "dropCallback"];
|
|
3634
3638
|
|
|
3635
|
-
var _templateObject$
|
|
3636
|
-
var Container$c = styled.div(_templateObject$
|
|
3639
|
+
var _templateObject$o, _templateObject2$l;
|
|
3640
|
+
var Container$c = styled.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n ", ";\n position: relative;\n"])), function (_ref) {
|
|
3637
3641
|
var height = _ref.height;
|
|
3638
3642
|
return height ? "height: " + height : null;
|
|
3639
3643
|
});
|
|
@@ -3961,8 +3965,8 @@ var areDimensionsDiff = function areDimensionsDiff(oldDimensions, newValues) {
|
|
|
3961
3965
|
return isDifferent;
|
|
3962
3966
|
};
|
|
3963
3967
|
|
|
3964
|
-
var _templateObject$
|
|
3965
|
-
var CropLineStyle = css(_templateObject$
|
|
3968
|
+
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;
|
|
3969
|
+
var CropLineStyle = css(_templateObject$p || (_templateObject$p = _taggedTemplateLiteralLoose(["\n position: absolute;\n display: block;\n opacity: 0.1;\n"])));
|
|
3966
3970
|
var TopLine = styled.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);
|
|
3967
3971
|
var RightLine = styled.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);
|
|
3968
3972
|
var BottomLine = styled.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);
|
|
@@ -4039,31 +4043,28 @@ var CropArea = function CropArea(_ref9) {
|
|
|
4039
4043
|
})));
|
|
4040
4044
|
};
|
|
4041
4045
|
|
|
4042
|
-
var _templateObject$
|
|
4043
|
-
var Container$d = styled.div(_templateObject$
|
|
4046
|
+
var _templateObject$q, _templateObject2$n, _templateObject3$k, _templateObject4$h, _templateObject5$f, _templateObject6$c, _templateObject7$c, _templateObject8$b, _templateObject9$b;
|
|
4047
|
+
var Container$d = styled.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) {
|
|
4044
4048
|
var theme = _ref.theme;
|
|
4045
4049
|
return theme.fontFamily.ui;
|
|
4046
4050
|
});
|
|
4047
4051
|
var InnerContainer$2 = styled.div(_templateObject2$n || (_templateObject2$n = _taggedTemplateLiteralLoose(["\n position: relative;\n z-index: 99;\n"])));
|
|
4048
4052
|
var ToolHeader = styled.div(_templateObject3$k || (_templateObject3$k = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: 17px;\n"])));
|
|
4049
|
-
var TextGroup = styled.div(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: 20px;\n font-weight: 500;\n color:
|
|
4050
|
-
var theme = _ref2.theme;
|
|
4051
|
-
return theme.colors.icons.mono;
|
|
4052
|
-
}, IconWrapper);
|
|
4053
|
+
var TextGroup = styled.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);
|
|
4053
4054
|
var ButtonsGroup = styled.div(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n button + button {\n margin-left: 10px;\n }\n"])));
|
|
4054
|
-
var PreviewArea = styled.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 (
|
|
4055
|
-
var canvasHeight =
|
|
4055
|
+
var PreviewArea = styled.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) {
|
|
4056
|
+
var canvasHeight = _ref2.canvasHeight;
|
|
4056
4057
|
return canvasHeight ? canvasHeight + "px" : "462px";
|
|
4057
|
-
}, function (
|
|
4058
|
-
var canvasWidth =
|
|
4058
|
+
}, function (_ref3) {
|
|
4059
|
+
var canvasWidth = _ref3.canvasWidth;
|
|
4059
4060
|
return canvasWidth ? canvasWidth + "px" : "485px";
|
|
4060
4061
|
});
|
|
4061
4062
|
var HiddenImage = styled.img(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteralLoose(["\n display: none;\n"])));
|
|
4062
|
-
var SelectedArea = styled.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 (
|
|
4063
|
-
var cropLeft =
|
|
4064
|
-
cropTop =
|
|
4065
|
-
cropWidth =
|
|
4066
|
-
cropHeight =
|
|
4063
|
+
var SelectedArea = styled.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) {
|
|
4064
|
+
var cropLeft = _ref4.cropLeft,
|
|
4065
|
+
cropTop = _ref4.cropTop,
|
|
4066
|
+
cropWidth = _ref4.cropWidth,
|
|
4067
|
+
cropHeight = _ref4.cropHeight;
|
|
4067
4068
|
return css(_templateObject9$b || (_templateObject9$b = _taggedTemplateLiteralLoose(["\n top: ", "px;\n left: ", "px;\n width: ", "px;\n height: ", "px;\n "])), cropTop, cropLeft, cropWidth, cropHeight);
|
|
4068
4069
|
});
|
|
4069
4070
|
var viewDimensions = {
|
|
@@ -4081,30 +4082,30 @@ var viewDimensions = {
|
|
|
4081
4082
|
isResizing: false
|
|
4082
4083
|
};
|
|
4083
4084
|
|
|
4084
|
-
var CropTool = function CropTool(
|
|
4085
|
-
var
|
|
4086
|
-
title =
|
|
4087
|
-
|
|
4088
|
-
cancelBtnTxt =
|
|
4089
|
-
|
|
4090
|
-
cropBtnTxt =
|
|
4091
|
-
|
|
4092
|
-
isResizable =
|
|
4093
|
-
|
|
4094
|
-
cropHeight =
|
|
4095
|
-
|
|
4096
|
-
cropWidth =
|
|
4097
|
-
|
|
4098
|
-
canvasHeight =
|
|
4099
|
-
|
|
4100
|
-
canvasWidth =
|
|
4101
|
-
aspectRatio =
|
|
4102
|
-
imgUrl =
|
|
4103
|
-
onCrop =
|
|
4104
|
-
|
|
4105
|
-
onClose =
|
|
4106
|
-
|
|
4107
|
-
onError =
|
|
4085
|
+
var CropTool = function CropTool(_ref5) {
|
|
4086
|
+
var _ref5$title = _ref5.title,
|
|
4087
|
+
title = _ref5$title === void 0 ? 'Crop Image' : _ref5$title,
|
|
4088
|
+
_ref5$cancelBtnTxt = _ref5.cancelBtnTxt,
|
|
4089
|
+
cancelBtnTxt = _ref5$cancelBtnTxt === void 0 ? 'Cancel' : _ref5$cancelBtnTxt,
|
|
4090
|
+
_ref5$cropBtnTxt = _ref5.cropBtnTxt,
|
|
4091
|
+
cropBtnTxt = _ref5$cropBtnTxt === void 0 ? 'Crop & Save' : _ref5$cropBtnTxt,
|
|
4092
|
+
_ref5$isResizable = _ref5.isResizable,
|
|
4093
|
+
isResizable = _ref5$isResizable === void 0 ? true : _ref5$isResizable,
|
|
4094
|
+
_ref5$cropHeight = _ref5.cropHeight,
|
|
4095
|
+
cropHeight = _ref5$cropHeight === void 0 ? 300 : _ref5$cropHeight,
|
|
4096
|
+
_ref5$cropWidth = _ref5.cropWidth,
|
|
4097
|
+
cropWidth = _ref5$cropWidth === void 0 ? 350 : _ref5$cropWidth,
|
|
4098
|
+
_ref5$canvasHeight = _ref5.canvasHeight,
|
|
4099
|
+
canvasHeight = _ref5$canvasHeight === void 0 ? 400 : _ref5$canvasHeight,
|
|
4100
|
+
_ref5$canvasWidth = _ref5.canvasWidth,
|
|
4101
|
+
canvasWidth = _ref5$canvasWidth === void 0 ? 450 : _ref5$canvasWidth,
|
|
4102
|
+
aspectRatio = _ref5.aspectRatio,
|
|
4103
|
+
imgUrl = _ref5.imgUrl,
|
|
4104
|
+
onCrop = _ref5.onCrop,
|
|
4105
|
+
_ref5$onClose = _ref5.onClose,
|
|
4106
|
+
onClose = _ref5$onClose === void 0 ? function () {} : _ref5$onClose,
|
|
4107
|
+
_ref5$onError = _ref5.onError,
|
|
4108
|
+
onError = _ref5$onError === void 0 ? function () {} : _ref5$onError;
|
|
4108
4109
|
|
|
4109
4110
|
var _useState = useState(false),
|
|
4110
4111
|
isLoading = _useState[0],
|
|
@@ -4237,9 +4238,9 @@ var CropTool = function CropTool(_ref6) {
|
|
|
4237
4238
|
top = rect.top,
|
|
4238
4239
|
width = rect.width,
|
|
4239
4240
|
height = rect.height;
|
|
4240
|
-
var
|
|
4241
|
-
posX =
|
|
4242
|
-
posY =
|
|
4241
|
+
var _ref6 = [e.clientX, e.clientY],
|
|
4242
|
+
posX = _ref6[0],
|
|
4243
|
+
posY = _ref6[1];
|
|
4243
4244
|
var newCursorStyle;
|
|
4244
4245
|
|
|
4245
4246
|
if (!isResizable) {
|
|
@@ -4293,9 +4294,9 @@ var CropTool = function CropTool(_ref6) {
|
|
|
4293
4294
|
return;
|
|
4294
4295
|
}
|
|
4295
4296
|
|
|
4296
|
-
var
|
|
4297
|
-
posX =
|
|
4298
|
-
posY =
|
|
4297
|
+
var _ref7 = [e.clientX, e.clientY],
|
|
4298
|
+
posX = _ref7[0],
|
|
4299
|
+
posY = _ref7[1];
|
|
4299
4300
|
var newDimensions = aspectRatio ? updateCropWithAspect(viewDimensions, posX, posY, aspectRatio) : updateCropValues(viewDimensions, posX, posY);
|
|
4300
4301
|
|
|
4301
4302
|
if (!newDimensions.isUpdateRequired) {
|
|
@@ -4370,7 +4371,7 @@ var CropTool = function CropTool(_ref6) {
|
|
|
4370
4371
|
})))))), document.body);
|
|
4371
4372
|
};
|
|
4372
4373
|
|
|
4373
|
-
var _templateObject$
|
|
4374
|
+
var _templateObject$r, _templateObject2$o, _templateObject3$l, _templateObject4$i, _templateObject5$g, _templateObject6$d, _templateObject7$d, _templateObject8$c, _templateObject9$c;
|
|
4374
4375
|
var CROP_HEIGHT_AREA = 500;
|
|
4375
4376
|
var CROP_WIDTH_AREA = 475;
|
|
4376
4377
|
var CANVAS_HEIGHT = 490;
|
|
@@ -4378,7 +4379,7 @@ var CANVAS_WIDTH = 460;
|
|
|
4378
4379
|
var ratio = Math.round(CROP_WIDTH_AREA / CROP_HEIGHT_AREA * 100) / 100;
|
|
4379
4380
|
var PHOTO_HEIGHT = "150px";
|
|
4380
4381
|
var PHOTO_WIDTH = "142px";
|
|
4381
|
-
var Container$e = styled.div(_templateObject$
|
|
4382
|
+
var Container$e = styled.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n position: relative;\n width: ", ";\n ", "\n button {\n width: 100%;\n }\n"])), PHOTO_WIDTH, function (_ref) {
|
|
4382
4383
|
var theme = _ref.theme;
|
|
4383
4384
|
return css(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
|
|
4384
4385
|
});
|
|
@@ -4540,8 +4541,8 @@ var AvatarUploader = function AvatarUploader(_ref2) {
|
|
|
4540
4541
|
|
|
4541
4542
|
var _excluded$h = ["icons", "color", "size", "weight"];
|
|
4542
4543
|
|
|
4543
|
-
var _templateObject$
|
|
4544
|
-
var Container$f = styled.div(_templateObject$
|
|
4544
|
+
var _templateObject$s, _templateObject2$p, _templateObject3$m;
|
|
4545
|
+
var Container$f = styled.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);
|
|
4545
4546
|
var PlusIcon = styled(Icon)(_templateObject2$p || (_templateObject2$p = _taggedTemplateLiteralLoose([""])));
|
|
4546
4547
|
var PlusIconWrapper = styled.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);
|
|
4547
4548
|
|
|
@@ -4571,8 +4572,8 @@ var BigIconsSummary = function BigIconsSummary(_ref) {
|
|
|
4571
4572
|
}));
|
|
4572
4573
|
};
|
|
4573
4574
|
|
|
4574
|
-
var _templateObject$
|
|
4575
|
-
var Container$g = styled.div(_templateObject$
|
|
4575
|
+
var _templateObject$t, _templateObject2$q, _templateObject3$n, _templateObject4$j, _templateObject5$h, _templateObject6$e;
|
|
4576
|
+
var Container$g = styled.div(_templateObject$t || (_templateObject$t = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n"])), function (_ref) {
|
|
4576
4577
|
var theme = _ref.theme;
|
|
4577
4578
|
return theme.fontFamily.ui;
|
|
4578
4579
|
});
|
|
@@ -4703,8 +4704,8 @@ var AreaUploadManager = function AreaUploadManager(_ref3) {
|
|
|
4703
4704
|
|
|
4704
4705
|
var _excluded$i = ["children", "spacing"];
|
|
4705
4706
|
|
|
4706
|
-
var _templateObject$
|
|
4707
|
-
var FormContainer = styled.form(_templateObject$
|
|
4707
|
+
var _templateObject$u, _templateObject2$r;
|
|
4708
|
+
var FormContainer = styled.form(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
4708
4709
|
var spacing = _ref.spacing;
|
|
4709
4710
|
return spacing && css(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteralLoose(["\n & > ", " {\n margin-bottom: ", ";\n }\n "])), StyledLabel, spacing);
|
|
4710
4711
|
});
|
|
@@ -4722,8 +4723,8 @@ var Form = function Form(_ref2) {
|
|
|
4722
4723
|
|
|
4723
4724
|
var _excluded$j = ["text", "icon", "design", "noBorderTop", "textMaxWidth", "size", "onClickCallback", "closeCallback", "hasOnSelectLoading"];
|
|
4724
4725
|
|
|
4725
|
-
var _templateObject$
|
|
4726
|
-
var StyledButton$3 = styled.button(_templateObject$
|
|
4726
|
+
var _templateObject$v, _templateObject2$s, _templateObject3$o, _templateObject4$k, _templateObject5$i, _templateObject6$f, _templateObject7$e, _templateObject8$d;
|
|
4727
|
+
var StyledButton$3 = styled.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) {
|
|
4727
4728
|
var noBorderTop = _ref.noBorderTop;
|
|
4728
4729
|
return noBorderTop ? "border-top: none" : css(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n border-top: 1px solid var(--border-color)"])));
|
|
4729
4730
|
}, IconWrapper, function (_ref2) {
|
|
@@ -4905,8 +4906,8 @@ function useClickOutside(elRef, elCallback) {
|
|
|
4905
4906
|
}, [elCallback, elRef]);
|
|
4906
4907
|
}
|
|
4907
4908
|
|
|
4908
|
-
var _templateObject$
|
|
4909
|
-
var Container$h = styled.div(_templateObject$
|
|
4909
|
+
var _templateObject$w, _templateObject2$t, _templateObject3$p, _templateObject4$l, _templateObject5$j, _templateObject6$g, _templateObject7$f;
|
|
4910
|
+
var Container$h = styled.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) {
|
|
4910
4911
|
var theme = _ref.theme;
|
|
4911
4912
|
return theme && css(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteralLoose([""])));
|
|
4912
4913
|
}, function (_ref2) {
|
|
@@ -4917,42 +4918,39 @@ var Container$h = styled.div(_templateObject$u || (_templateObject$u = _taggedTe
|
|
|
4917
4918
|
return theme.styles.modal.overlay;
|
|
4918
4919
|
});
|
|
4919
4920
|
var CloseIcon = styled(Icon)(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose([""])));
|
|
4920
|
-
var CloseButton = styled.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:
|
|
4921
|
-
var
|
|
4922
|
-
|
|
4923
|
-
}, IconWrapper, function (_ref5) {
|
|
4924
|
-
var _ref5$selected = _ref5.selected,
|
|
4925
|
-
selected = _ref5$selected === void 0 ? false : _ref5$selected;
|
|
4921
|
+
var CloseButton = styled.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) {
|
|
4922
|
+
var _ref4$selected = _ref4.selected,
|
|
4923
|
+
selected = _ref4$selected === void 0 ? false : _ref4$selected;
|
|
4926
4924
|
return selected && css(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteralLoose(["\n border-bottom: 5px solid var(--primary-7);\n "])));
|
|
4927
|
-
}, function (
|
|
4928
|
-
var theme =
|
|
4925
|
+
}, function (_ref5) {
|
|
4926
|
+
var theme = _ref5.theme;
|
|
4929
4927
|
return theme && css(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteralLoose(["\n opacity: .8;\n transition: transform ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.primary.inOut);
|
|
4930
4928
|
});
|
|
4931
|
-
var LightBox = styled.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 (
|
|
4932
|
-
var width =
|
|
4929
|
+
var LightBox = styled.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) {
|
|
4930
|
+
var width = _ref6.width;
|
|
4933
4931
|
return width ? width : "580px";
|
|
4934
|
-
}, function (
|
|
4935
|
-
var padding =
|
|
4932
|
+
}, function (_ref7) {
|
|
4933
|
+
var padding = _ref7.padding;
|
|
4936
4934
|
return padding ? "30px 40px" : "0";
|
|
4937
|
-
}, function (
|
|
4938
|
-
var theme =
|
|
4935
|
+
}, function (_ref8) {
|
|
4936
|
+
var theme = _ref8.theme;
|
|
4939
4937
|
return theme.styles.modal.container;
|
|
4940
4938
|
});
|
|
4941
4939
|
|
|
4942
|
-
var Modal = function Modal(
|
|
4943
|
-
var
|
|
4944
|
-
isOpen =
|
|
4945
|
-
|
|
4946
|
-
isCloseEnable =
|
|
4947
|
-
|
|
4948
|
-
closeText =
|
|
4949
|
-
|
|
4950
|
-
width =
|
|
4951
|
-
|
|
4952
|
-
padding =
|
|
4953
|
-
customComponent =
|
|
4954
|
-
onDismiss =
|
|
4955
|
-
dismissCallback =
|
|
4940
|
+
var Modal = function Modal(_ref9) {
|
|
4941
|
+
var _ref9$isOpen = _ref9.isOpen,
|
|
4942
|
+
isOpen = _ref9$isOpen === void 0 ? false : _ref9$isOpen,
|
|
4943
|
+
_ref9$isCloseEnable = _ref9.isCloseEnable,
|
|
4944
|
+
isCloseEnable = _ref9$isCloseEnable === void 0 ? true : _ref9$isCloseEnable,
|
|
4945
|
+
_ref9$closeText = _ref9.closeText,
|
|
4946
|
+
closeText = _ref9$closeText === void 0 ? '' : _ref9$closeText,
|
|
4947
|
+
_ref9$width = _ref9.width,
|
|
4948
|
+
width = _ref9$width === void 0 ? '' : _ref9$width,
|
|
4949
|
+
_ref9$padding = _ref9.padding,
|
|
4950
|
+
padding = _ref9$padding === void 0 ? true : _ref9$padding,
|
|
4951
|
+
customComponent = _ref9.customComponent,
|
|
4952
|
+
onDismiss = _ref9.onDismiss,
|
|
4953
|
+
dismissCallback = _ref9.dismissCallback;
|
|
4956
4954
|
var lightBoxRef = useRef(null);
|
|
4957
4955
|
|
|
4958
4956
|
var onClickOutside = function onClickOutside() {
|
|
@@ -5312,8 +5310,8 @@ function SvgNoImageBig(props) {
|
|
|
5312
5310
|
|
|
5313
5311
|
var _excluded$k = ["loop", "autoPlay", "controls", "muted"];
|
|
5314
5312
|
|
|
5315
|
-
var _templateObject$
|
|
5316
|
-
var MediaBoxWrapper = styled.div(_templateObject$
|
|
5313
|
+
var _templateObject$x, _templateObject2$u, _templateObject3$q, _templateObject4$m, _templateObject5$k, _templateObject6$h, _templateObject7$g, _templateObject8$e;
|
|
5314
|
+
var MediaBoxWrapper = styled.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n position: relative;\n line-height: 0;\n ", ";\n ", ";\n"])), function (_ref) {
|
|
5317
5315
|
var minHeight = _ref.minHeight;
|
|
5318
5316
|
return minHeight && "min-height: " + minHeight;
|
|
5319
5317
|
}, function (_ref2) {
|
|
@@ -5616,9 +5614,9 @@ var _excluded$l = ["mainButtonId", "buttonList", "design", "size", "textMaxWidth
|
|
|
5616
5614
|
_excluded2 = ["id", "text", "icon", "disabled"],
|
|
5617
5615
|
_excluded3 = ["id", "text", "icon", "disabled"];
|
|
5618
5616
|
|
|
5619
|
-
var _templateObject$
|
|
5617
|
+
var _templateObject$y, _templateObject2$v, _templateObject3$r;
|
|
5620
5618
|
var TOGGLE_ICON_WIDTH = 20;
|
|
5621
|
-
var Container$i = styled.div(_templateObject$
|
|
5619
|
+
var Container$i = styled.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"])));
|
|
5622
5620
|
var MainButtonWrapper = styled.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"])));
|
|
5623
5621
|
var ToggleIcon = styled.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);
|
|
5624
5622
|
|
|
@@ -5712,8 +5710,8 @@ var SplitButton = function SplitButton(_ref) {
|
|
|
5712
5710
|
})) : null);
|
|
5713
5711
|
};
|
|
5714
5712
|
|
|
5715
|
-
var _templateObject$
|
|
5716
|
-
var Container$j = styled.div(_templateObject$
|
|
5713
|
+
var _templateObject$z, _templateObject2$w, _templateObject3$s, _templateObject4$n, _templateObject5$l, _templateObject6$i, _templateObject7$h, _templateObject8$f;
|
|
5714
|
+
var Container$j = styled.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n\n ", "\n"])), function (_ref) {
|
|
5717
5715
|
var hide = _ref.hide;
|
|
5718
5716
|
return hide && css(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n display: none;\n "])));
|
|
5719
5717
|
});
|
|
@@ -5915,7 +5913,7 @@ var DateTimeBlock = function DateTimeBlock(_ref6) {
|
|
|
5915
5913
|
})))));
|
|
5916
5914
|
};
|
|
5917
5915
|
|
|
5918
|
-
var _templateObject$
|
|
5916
|
+
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;
|
|
5919
5917
|
|
|
5920
5918
|
var initializeInterval = function initializeInterval(day) {
|
|
5921
5919
|
return {
|
|
@@ -5929,7 +5927,7 @@ var initializeInterval = function initializeInterval(day) {
|
|
|
5929
5927
|
|
|
5930
5928
|
var TODAY = new Date();
|
|
5931
5929
|
var TODAY_INTERVAL = initializeInterval(startOfDay(new Date()));
|
|
5932
|
-
var Container$k = styled.div(_templateObject$
|
|
5930
|
+
var Container$k = styled.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
5933
5931
|
var DateTimeArea = styled.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"])));
|
|
5934
5932
|
var TimeZoneOption = styled.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"])));
|
|
5935
5933
|
var TimeZoneLabel = styled.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);
|
|
@@ -6232,8 +6230,8 @@ var getInitialValue = function getInitialValue(hasEmptyValue, initialValue) {
|
|
|
6232
6230
|
|
|
6233
6231
|
var _excluded$m = ["children"];
|
|
6234
6232
|
|
|
6235
|
-
var _templateObject$
|
|
6236
|
-
var Container$l = styled.div(_templateObject$
|
|
6233
|
+
var _templateObject$B, _templateObject2$y;
|
|
6234
|
+
var Container$l = styled.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"])));
|
|
6237
6235
|
var Inner = styled.div(_templateObject2$y || (_templateObject2$y = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: row;\n"])));
|
|
6238
6236
|
|
|
6239
6237
|
var FilterDropdownContainer = function FilterDropdownContainer(_ref) {
|
|
@@ -6245,8 +6243,8 @@ var FilterDropdownContainer = function FilterDropdownContainer(_ref) {
|
|
|
6245
6243
|
|
|
6246
6244
|
var _excluded$n = ["icon", "hasFlipArrow", "isSortAscending", "isOpen", "children"];
|
|
6247
6245
|
|
|
6248
|
-
var _templateObject$
|
|
6249
|
-
var FlipWrapper = styled.div(_templateObject$
|
|
6246
|
+
var _templateObject$C, _templateObject2$z, _templateObject3$u, _templateObject4$p, _templateObject5$n, _templateObject6$k, _templateObject7$j;
|
|
6247
|
+
var FlipWrapper = styled.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
|
|
6250
6248
|
var isSortAscending = _ref.isSortAscending;
|
|
6251
6249
|
return isSortAscending && css(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteralLoose(["\n transform: scaleY(-1);\n "])));
|
|
6252
6250
|
});
|
|
@@ -6295,37 +6293,34 @@ var FilterButton = function FilterButton(_ref5) {
|
|
|
6295
6293
|
|
|
6296
6294
|
var _excluded$o = ["title", "value", "optionType", "selected", "disabled", "onClick"];
|
|
6297
6295
|
|
|
6298
|
-
var _templateObject$
|
|
6299
|
-
var Title$1 = styled.div(_templateObject$
|
|
6296
|
+
var _templateObject$D, _templateObject2$A, _templateObject3$v, _templateObject4$q, _templateObject5$o, _templateObject6$l, _templateObject7$k, _templateObject8$h, _templateObject9$e, _templateObject10$c;
|
|
6297
|
+
var Title$1 = styled.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) {
|
|
6300
6298
|
var theme = _ref.theme;
|
|
6301
6299
|
return theme.fontFamily.data;
|
|
6302
6300
|
});
|
|
6303
6301
|
var FakeCheckbox = styled.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"])));
|
|
6304
6302
|
var FakeCheckboxInner = styled.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"])));
|
|
6305
|
-
var CheckMarkWrapper = styled.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:
|
|
6306
|
-
var theme = _ref2.theme;
|
|
6307
|
-
return theme.colors.icons.inverse;
|
|
6308
|
-
});
|
|
6303
|
+
var CheckMarkWrapper = styled.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"])));
|
|
6309
6304
|
var FakeRadioButton = styled.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"])));
|
|
6310
6305
|
var FakeInnerRadio = styled.div(_templateObject6$l || (_templateObject6$l = _taggedTemplateLiteralLoose(["\n width: 10px;\n height: 10px;\n border-radius: 50%;\n user-select: none;\n"])));
|
|
6311
|
-
var Container$m = styled.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (
|
|
6312
|
-
var styles =
|
|
6313
|
-
selected =
|
|
6314
|
-
disabled =
|
|
6306
|
+
var Container$m = styled.div(_templateObject7$k || (_templateObject7$k = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 100%;\n width: 100%;\n\n ", ";\n"])), function (_ref2) {
|
|
6307
|
+
var styles = _ref2.theme.styles,
|
|
6308
|
+
selected = _ref2.selected,
|
|
6309
|
+
disabled = _ref2.disabled;
|
|
6315
6310
|
return styles && 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 && 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 && css(_templateObject10$c || (_templateObject10$c = _taggedTemplateLiteralLoose(["\n cursor: not-allowed;\n "]))));
|
|
6316
6311
|
});
|
|
6317
6312
|
|
|
6318
|
-
var FilterOption = function FilterOption(
|
|
6319
|
-
var title =
|
|
6320
|
-
|
|
6321
|
-
optionType =
|
|
6322
|
-
|
|
6323
|
-
selected =
|
|
6324
|
-
|
|
6325
|
-
disabled =
|
|
6326
|
-
|
|
6327
|
-
onClick =
|
|
6328
|
-
props = _objectWithoutPropertiesLoose(
|
|
6313
|
+
var FilterOption = function FilterOption(_ref3) {
|
|
6314
|
+
var title = _ref3.title,
|
|
6315
|
+
_ref3$optionType = _ref3.optionType,
|
|
6316
|
+
optionType = _ref3$optionType === void 0 ? "text" : _ref3$optionType,
|
|
6317
|
+
_ref3$selected = _ref3.selected,
|
|
6318
|
+
selected = _ref3$selected === void 0 ? false : _ref3$selected,
|
|
6319
|
+
_ref3$disabled = _ref3.disabled,
|
|
6320
|
+
disabled = _ref3$disabled === void 0 ? false : _ref3$disabled,
|
|
6321
|
+
_ref3$onClick = _ref3.onClick,
|
|
6322
|
+
onClick = _ref3$onClick === void 0 ? function () {} : _ref3$onClick,
|
|
6323
|
+
props = _objectWithoutPropertiesLoose(_ref3, _excluded$o);
|
|
6329
6324
|
|
|
6330
6325
|
var iconWeight = dimensions.icons.weights['regular'];
|
|
6331
6326
|
return React__default.createElement(Container$m, Object.assign({}, {
|
|
@@ -6342,8 +6337,8 @@ var FilterOption = function FilterOption(_ref4) {
|
|
|
6342
6337
|
|
|
6343
6338
|
var _excluded$p = ["color", "hasBorder", "iconSize", "disabled", "noBackground", "hasCrossButton", "onCrossClick", "width"];
|
|
6344
6339
|
|
|
6345
|
-
var _templateObject$
|
|
6346
|
-
var Container$n = styled.div(_templateObject$
|
|
6340
|
+
var _templateObject$E, _templateObject2$B, _templateObject3$w, _templateObject4$r, _templateObject5$p, _templateObject6$m, _templateObject7$l, _templateObject8$i;
|
|
6341
|
+
var Container$n = styled.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) {
|
|
6347
6342
|
var styles = _ref.theme.styles,
|
|
6348
6343
|
theme = _ref.theme,
|
|
6349
6344
|
hasBorder = _ref.hasBorder,
|
|
@@ -6354,12 +6349,10 @@ var Container$n = styled.div(_templateObject$C || (_templateObject$C = _taggedTe
|
|
|
6354
6349
|
}, IconWrapper);
|
|
6355
6350
|
var CrossButton = styled.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);
|
|
6356
6351
|
var StyledInput$2 = styled.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) {
|
|
6357
|
-
var
|
|
6358
|
-
typography = _ref2$theme.typography,
|
|
6359
|
-
colors = _ref2$theme.colors,
|
|
6352
|
+
var typography = _ref2.theme.typography,
|
|
6360
6353
|
theme = _ref2.theme,
|
|
6361
6354
|
color = _ref2.color;
|
|
6362
|
-
return 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,
|
|
6355
|
+
return 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);
|
|
6363
6356
|
});
|
|
6364
6357
|
|
|
6365
6358
|
var BasicSearchInput = function BasicSearchInput(_ref3) {
|
|
@@ -6421,8 +6414,8 @@ var isFilterItem = function isFilterItem(item) {
|
|
|
6421
6414
|
|
|
6422
6415
|
var _excluded$q = ["buttonIcon", "buttonText", "disabled", "minWidth", "minHeight", "isSortAscending", "children", "onToggleOpenCallback", "onCloseCallback"];
|
|
6423
6416
|
|
|
6424
|
-
var _templateObject$
|
|
6425
|
-
var Container$o = styled.div(_templateObject$
|
|
6417
|
+
var _templateObject$F, _templateObject2$C, _templateObject3$x, _templateObject4$s;
|
|
6418
|
+
var Container$o = styled.div(_templateObject$F || (_templateObject$F = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
6426
6419
|
var ButtonWrapper = styled.div(_templateObject2$C || (_templateObject2$C = _taggedTemplateLiteralLoose(["\n display: inline-block;\n"])));
|
|
6427
6420
|
var ContentBox = styled.div(_templateObject3$x || (_templateObject3$x = _taggedTemplateLiteralLoose(["\n z-index: 100;\n min-width: ", "px;\n position: absolute;\n\n ", ";\n"])), function (_ref) {
|
|
6428
6421
|
var minWidth = _ref.minWidth;
|
|
@@ -6536,8 +6529,8 @@ var FilterDropHandler = function FilterDropHandler(_ref3) {
|
|
|
6536
6529
|
}), children));
|
|
6537
6530
|
};
|
|
6538
6531
|
|
|
6539
|
-
var _templateObject$
|
|
6540
|
-
var Container$p = styled.div(_templateObject$
|
|
6532
|
+
var _templateObject$G, _templateObject2$D;
|
|
6533
|
+
var Container$p = styled.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"])));
|
|
6541
6534
|
var LoadingText = styled.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);
|
|
6542
6535
|
|
|
6543
6536
|
var LoadingBox = function LoadingBox(_ref) {
|
|
@@ -6550,8 +6543,8 @@ var LoadingBox = function LoadingBox(_ref) {
|
|
|
6550
6543
|
|
|
6551
6544
|
var _excluded$r = ["buttonIcon", "buttonText", "list", "selected", "disabled", "isLoading", "loadingText", "optionType", "hasOptionsFilter", "searchPlaceholder", "maxDisplayedItems", "searchResultText", "emptyResultText", "onSelect"];
|
|
6552
6545
|
|
|
6553
|
-
var _templateObject$
|
|
6554
|
-
var Container$q = styled.div(_templateObject$
|
|
6546
|
+
var _templateObject$H, _templateObject2$E, _templateObject3$y, _templateObject4$t, _templateObject5$q, _templateObject6$n, _templateObject7$m, _templateObject8$j, _templateObject9$f, _templateObject10$d;
|
|
6547
|
+
var Container$q = styled.div(_templateObject$H || (_templateObject$H = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
|
|
6555
6548
|
var TopLine$1 = styled.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"])));
|
|
6556
6549
|
var InnerBox = styled.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"])));
|
|
6557
6550
|
var StyledFilterOption = styled(FilterOption)(_templateObject4$t || (_templateObject4$t = _taggedTemplateLiteralLoose(["\n letter-spacing: 0.2px;\n"])));
|
|
@@ -6797,8 +6790,8 @@ var FilterDropdown = function FilterDropdown(_ref2) {
|
|
|
6797
6790
|
|
|
6798
6791
|
var _excluded$s = ["buttonText", "disabled", "list", "isLoading", "loadingText", "isSortAscending", "selected", "descendingText", "ascendingText", "onSelect"];
|
|
6799
6792
|
|
|
6800
|
-
var _templateObject$
|
|
6801
|
-
var Container$r = styled.div(_templateObject$
|
|
6793
|
+
var _templateObject$I, _templateObject2$F, _templateObject3$z, _templateObject4$u, _templateObject5$r, _templateObject6$o, _templateObject7$n, _templateObject8$k, _templateObject9$g;
|
|
6794
|
+
var Container$r = styled.div(_templateObject$I || (_templateObject$I = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
|
|
6802
6795
|
var TopLine$2 = styled.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"])));
|
|
6803
6796
|
var InnerBox$1 = styled.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"])));
|
|
6804
6797
|
var StyledFilterOption$1 = styled(FilterOption)(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteralLoose(["\n letter-spacing: 0.2px;\n"])));
|
|
@@ -6884,8 +6877,8 @@ var SortDropdown = function SortDropdown(_ref2) {
|
|
|
6884
6877
|
}))))));
|
|
6885
6878
|
};
|
|
6886
6879
|
|
|
6887
|
-
var _templateObject$
|
|
6888
|
-
var Container$s = styled.div(_templateObject$
|
|
6880
|
+
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;
|
|
6881
|
+
var Container$s = styled.div(_templateObject$J || (_templateObject$J = _taggedTemplateLiteralLoose(["\n display: inline-block;\n position: relative;\n"])));
|
|
6889
6882
|
var ContextActionBaseCSS = 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"])));
|
|
6890
6883
|
var ContextIcon = styled.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) {
|
|
6891
6884
|
var theme = _ref.theme;
|
|
@@ -7072,10 +7065,10 @@ var FilterLayout = function FilterLayout(_ref6) {
|
|
|
7072
7065
|
|
|
7073
7066
|
var _excluded$t = ["buttonIcon", "buttonText", "disabled", "initialValue", "dateMode", "timeMode", "selected", "dateTimeTextUpper", "dateTimeTextLower", "timeZoneTitle", "timeZoneValueTitle", "lang", "onCloseCallback", "onUpdateCallback", "onToggleCallback"];
|
|
7074
7067
|
|
|
7075
|
-
var _templateObject$
|
|
7068
|
+
var _templateObject$K;
|
|
7076
7069
|
var MIN_WIDTH = 470;
|
|
7077
7070
|
var MIN_HEIGHT = 360;
|
|
7078
|
-
var Container$t = styled.div(_templateObject$
|
|
7071
|
+
var Container$t = styled.div(_templateObject$K || (_templateObject$K = _taggedTemplateLiteralLoose([""])));
|
|
7079
7072
|
|
|
7080
7073
|
var DropdownDatePicker = function DropdownDatePicker(_ref) {
|
|
7081
7074
|
var buttonIcon = _ref.buttonIcon,
|
|
@@ -7169,8 +7162,8 @@ var DropdownDatePicker = function DropdownDatePicker(_ref) {
|
|
|
7169
7162
|
|
|
7170
7163
|
var _excluded$u = ["hasShowMore", "searchFilters", "datePickerFilters", "dropdownFilters", "showMoreText", "showLessText"];
|
|
7171
7164
|
|
|
7172
|
-
var _templateObject$
|
|
7173
|
-
var fadeInAnimation = keyframes(_templateObject$
|
|
7165
|
+
var _templateObject$L, _templateObject2$H, _templateObject3$B, _templateObject4$w, _templateObject5$t, _templateObject6$q, _templateObject7$p, _templateObject8$m;
|
|
7166
|
+
var fadeInAnimation = 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"])));
|
|
7174
7167
|
var SearchInputWrapper = styled.div(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteralLoose(["\n flex: 1 1 200px;\n max-width: 320px;\n"])));
|
|
7175
7168
|
var CloseSearchInputWrapper = styled.div(_templateObject3$B || (_templateObject3$B = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
|
|
7176
7169
|
var theme = _ref.theme;
|
|
@@ -7295,8 +7288,8 @@ var FilterInputs = function FilterInputs(_ref2) {
|
|
|
7295
7288
|
|
|
7296
7289
|
var _excluded$v = ["labelLists", "totalResults", "resultTextTemplate", "clearText", "resultsDateFormat", "onRemoveFilter", "onClearAll"];
|
|
7297
7290
|
|
|
7298
|
-
var _templateObject$
|
|
7299
|
-
var Container$v = styled.div(_templateObject$
|
|
7291
|
+
var _templateObject$M, _templateObject2$I, _templateObject3$C, _templateObject4$x, _templateObject5$u, _templateObject6$r, _templateObject7$q;
|
|
7292
|
+
var Container$v = styled.div(_templateObject$M || (_templateObject$M = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n font-size: 12px;\n min-height: 22px;\n"])));
|
|
7300
7293
|
var ResultsTextWrapper = styled.div(_templateObject2$I || (_templateObject2$I = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n color: var(--grey-9);\n"])), fontFamily.ui);
|
|
7301
7294
|
var FilterLabel = styled.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);
|
|
7302
7295
|
var FilterLabelText = styled.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) {
|
|
@@ -7405,8 +7398,8 @@ var FiltersResults = function FiltersResults(_ref2) {
|
|
|
7405
7398
|
|
|
7406
7399
|
var _excluded$w = ["filtersTitle", "hasShowMore", "searchersConfig", "dropdownsConfig", "datePickersConfig", "showMoreText", "showLessText", "resultTextTemplate", "clearText", "totalResults", "singleFilter", "resultsDateFormat", "onChangeCallback"];
|
|
7407
7400
|
|
|
7408
|
-
var _templateObject$
|
|
7409
|
-
var Title$2 = styled.div(_templateObject$
|
|
7401
|
+
var _templateObject$N, _templateObject2$J, _templateObject3$D;
|
|
7402
|
+
var Title$2 = styled.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);
|
|
7410
7403
|
var StyledFilterResults = styled(FiltersResults)(_templateObject2$J || (_templateObject2$J = _taggedTemplateLiteralLoose([""])));
|
|
7411
7404
|
var Container$w = styled.div(_templateObject3$D || (_templateObject3$D = _taggedTemplateLiteralLoose(["\n ", " {\n margin-top: 29px;\n min-height: 19px;\n }\n"])), StyledFilterResults);
|
|
7412
7405
|
|
|
@@ -7836,8 +7829,8 @@ var FilterBar = function FilterBar(_ref4) {
|
|
|
7836
7829
|
})));
|
|
7837
7830
|
};
|
|
7838
7831
|
|
|
7839
|
-
var _templateObject$
|
|
7840
|
-
var Container$x = styled.div(_templateObject$
|
|
7832
|
+
var _templateObject$O, _templateObject2$K, _templateObject3$E, _templateObject4$y, _templateObject5$v;
|
|
7833
|
+
var Container$x = styled.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-block;\n"])));
|
|
7841
7834
|
var StatusCounter = styled.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) {
|
|
7842
7835
|
var animation = _ref.theme.animation;
|
|
7843
7836
|
return css(_templateObject3$E || (_templateObject3$E = _taggedTemplateLiteralLoose(["\n transition: background-color ", " ", ";\n "])), animation.speed.slow, animation.easing.primary.easeInOut);
|
|
@@ -7872,8 +7865,8 @@ var StatusIcon = function StatusIcon(_ref5) {
|
|
|
7872
7865
|
}));
|
|
7873
7866
|
};
|
|
7874
7867
|
|
|
7875
|
-
var _templateObject$
|
|
7876
|
-
var HandleTouchReactionKeyframes = keyframes(_templateObject$
|
|
7868
|
+
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;
|
|
7869
|
+
var HandleTouchReactionKeyframes = 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"])));
|
|
7877
7870
|
var HandleMouseReactionKeyframes = 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"])));
|
|
7878
7871
|
var HandleBase = styled.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) {
|
|
7879
7872
|
var theme = _ref.theme,
|
|
@@ -8121,8 +8114,8 @@ var HandleUnit = function HandleUnit(props) {
|
|
|
8121
8114
|
}, index + pointIndexOffset))));
|
|
8122
8115
|
};
|
|
8123
8116
|
|
|
8124
|
-
var _templateObject$
|
|
8125
|
-
var ContrastLine = styled.line(_templateObject$
|
|
8117
|
+
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;
|
|
8118
|
+
var ContrastLine = styled.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) {
|
|
8126
8119
|
var theme = _ref.theme,
|
|
8127
8120
|
styling = _ref.styling;
|
|
8128
8121
|
return theme.custom.lines[styling].contrastLine.stroke;
|
|
@@ -8411,8 +8404,8 @@ var LineUnit = function LineUnit(props) {
|
|
|
8411
8404
|
|
|
8412
8405
|
var LineSetContext = createContext({});
|
|
8413
8406
|
|
|
8414
|
-
var _templateObject$
|
|
8415
|
-
var FilledPolygon = styled.polygon(_templateObject$
|
|
8407
|
+
var _templateObject$R, _templateObject2$N, _templateObject3$H, _templateObject4$B;
|
|
8408
|
+
var FilledPolygon = styled.polygon(_templateObject$R || (_templateObject$R = _taggedTemplateLiteralLoose(["\n fill: ", ";\n opacity: ", ";\n"])), function (_ref) {
|
|
8416
8409
|
var color = _ref.color;
|
|
8417
8410
|
return color;
|
|
8418
8411
|
}, function (_ref2) {
|
|
@@ -8695,8 +8688,8 @@ var LineSet = function LineSet(_ref8) {
|
|
|
8695
8688
|
}));
|
|
8696
8689
|
};
|
|
8697
8690
|
|
|
8698
|
-
var _templateObject$
|
|
8699
|
-
var Container$y = styled.div(_templateObject$
|
|
8691
|
+
var _templateObject$S, _templateObject2$O, _templateObject3$I, _templateObject4$C, _templateObject5$y;
|
|
8692
|
+
var Container$y = styled.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"])));
|
|
8700
8693
|
var LoadingOverlay$1 = styled.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"])));
|
|
8701
8694
|
var Frame = styled.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) {
|
|
8702
8695
|
return props.transculent && css(_templateObject4$C || (_templateObject4$C = _taggedTemplateLiteralLoose(["\n background: hsla(0deg, 0%, 0%, 35%);\n "])));
|
|
@@ -8904,8 +8897,8 @@ var LineUI = function LineUI(_ref) {
|
|
|
8904
8897
|
|
|
8905
8898
|
var _excluded$x = ["loop", "autoPlay", "controls", "muted"];
|
|
8906
8899
|
|
|
8907
|
-
var _templateObject$
|
|
8908
|
-
var Container$z = styled.div(_templateObject$
|
|
8900
|
+
var _templateObject$T, _templateObject2$P, _templateObject3$J, _templateObject4$D, _templateObject5$z;
|
|
8901
|
+
var Container$z = styled.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"])));
|
|
8909
8902
|
var Video$1 = styled.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"])));
|
|
8910
8903
|
var LoadingOverlay$2 = styled.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"])));
|
|
8911
8904
|
var Frame$1 = styled.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) {
|
|
@@ -9132,8 +9125,8 @@ var LineUIVideo = function LineUIVideo(_ref) {
|
|
|
9132
9125
|
|
|
9133
9126
|
var _excluded$y = ["id", "enabled", "peerAddress", "maxConnectionAttempts", "rtcConfiguration", "setStatus", "setError", "autoPlay", "muted"];
|
|
9134
9127
|
|
|
9135
|
-
var _templateObject$
|
|
9136
|
-
var Video$2 = styled.video(_templateObject$
|
|
9128
|
+
var _templateObject$U;
|
|
9129
|
+
var Video$2 = styled.video(_templateObject$U || (_templateObject$U = _taggedTemplateLiteralLoose(["\n /* width: 800px; */\n"])));
|
|
9137
9130
|
|
|
9138
9131
|
var WebRTCPlayer = function WebRTCPlayer(_ref) {
|
|
9139
9132
|
var _ref$id = _ref.id,
|
|
@@ -9457,8 +9450,8 @@ function getPeerId(id) {
|
|
|
9457
9450
|
return 'WRP_' + id + '_' + Math.floor(Math.random() * (9000 - 10) + 10).toString();
|
|
9458
9451
|
}
|
|
9459
9452
|
|
|
9460
|
-
var _templateObject$
|
|
9461
|
-
var Container$A = styled.div(_templateObject$
|
|
9453
|
+
var _templateObject$V, _templateObject2$Q, _templateObject3$K, _templateObject4$E, _templateObject5$A;
|
|
9454
|
+
var Container$A = styled.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"])));
|
|
9462
9455
|
var Video$3 = styled(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"])));
|
|
9463
9456
|
var LoadingOverlay$3 = styled.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"])));
|
|
9464
9457
|
var Frame$2 = styled.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) {
|
|
@@ -9808,8 +9801,8 @@ var LineReducer = (function (state, action) {
|
|
|
9808
9801
|
}
|
|
9809
9802
|
});
|
|
9810
9803
|
|
|
9811
|
-
var _templateObject$
|
|
9812
|
-
var Container$B = styled.div(_templateObject$
|
|
9804
|
+
var _templateObject$W, _templateObject2$R, _templateObject3$L, _templateObject4$F, _templateObject5$B, _templateObject6$u, _templateObject7$t, _templateObject8$p;
|
|
9805
|
+
var Container$B = styled.div(_templateObject$W || (_templateObject$W = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
9813
9806
|
var IconContainer$1 = styled.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"])));
|
|
9814
9807
|
var Title$3 = styled.h1(_templateObject3$L || (_templateObject3$L = _taggedTemplateLiteralLoose(["\n ", "\n margin: 0 0 20px;\n"])), function (_ref) {
|
|
9815
9808
|
var theme = _ref.theme;
|
|
@@ -9842,8 +9835,8 @@ var PageTitle = function PageTitle(_ref3) {
|
|
|
9842
9835
|
}))) : null);
|
|
9843
9836
|
};
|
|
9844
9837
|
|
|
9845
|
-
var _templateObject$
|
|
9846
|
-
var Container$C = styled.p(_templateObject$
|
|
9838
|
+
var _templateObject$X, _templateObject2$S;
|
|
9839
|
+
var Container$C = styled.p(_templateObject$X || (_templateObject$X = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
9847
9840
|
var theme = _ref.theme;
|
|
9848
9841
|
return css(_templateObject2$S || (_templateObject2$S = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.pageHeader.introduction);
|
|
9849
9842
|
});
|
|
@@ -9853,8 +9846,8 @@ var IntroductionText = function IntroductionText(_ref2) {
|
|
|
9853
9846
|
return React__default.createElement(Container$C, null, children);
|
|
9854
9847
|
};
|
|
9855
9848
|
|
|
9856
|
-
var _templateObject$
|
|
9857
|
-
var Container$D = styled.div(_templateObject$
|
|
9849
|
+
var _templateObject$Y;
|
|
9850
|
+
var Container$D = styled.div(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteralLoose([""])));
|
|
9858
9851
|
|
|
9859
9852
|
var PageHeader = function PageHeader(_ref) {
|
|
9860
9853
|
var title = _ref.title,
|
|
@@ -9875,8 +9868,8 @@ var PageHeader = function PageHeader(_ref) {
|
|
|
9875
9868
|
})), introductionText ? React__default.createElement(IntroductionText, null, introductionText) : null);
|
|
9876
9869
|
};
|
|
9877
9870
|
|
|
9878
|
-
var _templateObject$
|
|
9879
|
-
var Container$E = styled.div(_templateObject$
|
|
9871
|
+
var _templateObject$Z;
|
|
9872
|
+
var Container$E = styled.div(_templateObject$Z || (_templateObject$Z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
9880
9873
|
|
|
9881
9874
|
var MultilineContent = function MultilineContent(_ref) {
|
|
9882
9875
|
var contentArray = _ref.contentArray;
|
|
@@ -9887,8 +9880,8 @@ var MultilineContent = function MultilineContent(_ref) {
|
|
|
9887
9880
|
}));
|
|
9888
9881
|
};
|
|
9889
9882
|
|
|
9890
|
-
var _templateObject$
|
|
9891
|
-
var Container$F = styled.div(_templateObject$
|
|
9883
|
+
var _templateObject$_, _templateObject2$T, _templateObject3$M, _templateObject4$G, _templateObject5$C, _templateObject6$v, _templateObject7$u;
|
|
9884
|
+
var Container$F = styled.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) {
|
|
9892
9885
|
var aspect = _ref.aspect;
|
|
9893
9886
|
return aspect === '16:9' && css(_templateObject2$T || (_templateObject2$T = _taggedTemplateLiteralLoose(["\n padding-left: 56.25%;\n "])));
|
|
9894
9887
|
}, function (_ref2) {
|
|
@@ -10021,8 +10014,8 @@ var TableRowThumbnail = function TableRowThumbnail(_ref4) {
|
|
|
10021
10014
|
})));
|
|
10022
10015
|
};
|
|
10023
10016
|
|
|
10024
|
-
var _templateObject
|
|
10025
|
-
var Container$G = styled.div(_templateObject
|
|
10017
|
+
var _templateObject$$, _templateObject2$U;
|
|
10018
|
+
var Container$G = styled.div(_templateObject$$ || (_templateObject$$ = _taggedTemplateLiteralLoose(["\n height: 42px;\n width: 4px;\n border-radius: 3px;\n display: block;\n\n ", "\n\n"])), function (_ref) {
|
|
10026
10019
|
var status = _ref.status,
|
|
10027
10020
|
colors = _ref.theme.colors;
|
|
10028
10021
|
return css(_templateObject2$U || (_templateObject2$U = _taggedTemplateLiteralLoose(["\n background: ", ";\n content:'", "';\n "])), colors.status[status], status);
|
|
@@ -10036,8 +10029,8 @@ var TypeTableDeviceStatus = function TypeTableDeviceStatus(_ref2) {
|
|
|
10036
10029
|
});
|
|
10037
10030
|
};
|
|
10038
10031
|
|
|
10039
|
-
var _templateObject$
|
|
10040
|
-
var CopyToClipboard = styled.button(_templateObject$
|
|
10032
|
+
var _templateObject$10, _templateObject2$V, _templateObject3$N, _templateObject4$H, _templateObject5$D, _templateObject6$w, _templateObject7$v, _templateObject8$q, _templateObject9$k, _templateObject10$h, _templateObject11$b;
|
|
10033
|
+
var CopyToClipboard = styled.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) {
|
|
10041
10034
|
var theme = _ref.theme;
|
|
10042
10035
|
return theme && css(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteralLoose(["\n transition: ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.easeOut);
|
|
10043
10036
|
});
|
|
@@ -10108,8 +10101,8 @@ var TypeTableCell = function TypeTableCell(_ref7) {
|
|
|
10108
10101
|
})) : null);
|
|
10109
10102
|
};
|
|
10110
10103
|
|
|
10111
|
-
var _templateObject
|
|
10112
|
-
var RowContainer = styled.div(_templateObject
|
|
10104
|
+
var _templateObject$11, _templateObject2$W;
|
|
10105
|
+
var RowContainer = styled.div(_templateObject$11 || (_templateObject$11 = _taggedTemplateLiteralLoose(["\n display: table-row;\n ", ";\n"])), function (_ref) {
|
|
10113
10106
|
var isEmpty = _ref.isEmpty;
|
|
10114
10107
|
return isEmpty && css(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteralLoose(["\n visibility: hidden;\n "])));
|
|
10115
10108
|
});
|
|
@@ -10185,8 +10178,8 @@ var TypeTableRow = function TypeTableRow(_ref2) {
|
|
|
10185
10178
|
}));
|
|
10186
10179
|
};
|
|
10187
10180
|
|
|
10188
|
-
var _templateObject$
|
|
10189
|
-
var HeaderTitle = styled.div(_templateObject$
|
|
10181
|
+
var _templateObject$12, _templateObject2$X, _templateObject3$O, _templateObject4$I;
|
|
10182
|
+
var HeaderTitle = styled.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) {
|
|
10190
10183
|
var ascending = _ref.ascending;
|
|
10191
10184
|
return ascending && 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 "])));
|
|
10192
10185
|
}, function (_ref2) {
|
|
@@ -10225,8 +10218,8 @@ var TableHeaderTitle = function TableHeaderTitle(_ref4) {
|
|
|
10225
10218
|
}), header);
|
|
10226
10219
|
};
|
|
10227
10220
|
|
|
10228
|
-
var _templateObject$
|
|
10229
|
-
var HeaderRow = styled.div(_templateObject$
|
|
10221
|
+
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;
|
|
10222
|
+
var HeaderRow = styled.div(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteralLoose(["\n display: table-row;\n height: 50px;\n"])));
|
|
10230
10223
|
var HeaderItem = styled.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) {
|
|
10231
10224
|
return p.theme.fontFamily.ui;
|
|
10232
10225
|
}, function (_ref) {
|
|
@@ -10394,8 +10387,8 @@ var TypeTableHeader = function TypeTableHeader(_ref9) {
|
|
|
10394
10387
|
}));
|
|
10395
10388
|
};
|
|
10396
10389
|
|
|
10397
|
-
var _templateObject$
|
|
10398
|
-
var Container$H = styled.div(_templateObject$
|
|
10390
|
+
var _templateObject$14, _templateObject2$Z, _templateObject3$Q, _templateObject4$K, _templateObject5$F;
|
|
10391
|
+
var Container$H = styled.div(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteralLoose([""])));
|
|
10399
10392
|
var TableContainer = styled.div(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteralLoose(["\n display: table;\n width: 100%;\n position: relative;\n"])));
|
|
10400
10393
|
var LoadingText$1 = styled.div(_templateObject3$Q || (_templateObject3$Q = _taggedTemplateLiteralLoose(["\n color: var(--grey-a11);\n"])));
|
|
10401
10394
|
var LoadingBox$1 = styled.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) {
|
|
@@ -10492,8 +10485,8 @@ var TypeTable = function TypeTable(_ref3) {
|
|
|
10492
10485
|
|
|
10493
10486
|
var _excluded$A = ["type", "placeholder", "defaultValue", "rowKey", "alignment", "toLink", "saveCallback"];
|
|
10494
10487
|
|
|
10495
|
-
var _templateObject$
|
|
10496
|
-
var Container$I = styled.div(_templateObject$
|
|
10488
|
+
var _templateObject$15, _templateObject2$_, _templateObject3$R, _templateObject4$L, _templateObject5$G, _templateObject6$y, _templateObject7$x, _templateObject8$s, _templateObject9$m, _templateObject10$j;
|
|
10489
|
+
var Container$I = styled.div(_templateObject$15 || (_templateObject$15 = _taggedTemplateLiteralLoose(["\n position: relative;\n ", "\n"])), function (_ref) {
|
|
10497
10490
|
var theme = _ref.theme;
|
|
10498
10491
|
return css(_templateObject2$_ || (_templateObject2$_ = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
|
|
10499
10492
|
});
|
|
@@ -10960,8 +10953,8 @@ var PTZProvider = function PTZProvider(_ref) {
|
|
|
10960
10953
|
}, children);
|
|
10961
10954
|
};
|
|
10962
10955
|
|
|
10963
|
-
var _templateObject$
|
|
10964
|
-
var Active = styled.g(_templateObject$
|
|
10956
|
+
var _templateObject$16, _templateObject2$$, _templateObject3$S, _templateObject4$M, _templateObject5$H;
|
|
10957
|
+
var Active = styled.g(_templateObject$16 || (_templateObject$16 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
|
|
10965
10958
|
var active = _ref.active;
|
|
10966
10959
|
return active && css(_templateObject2$$ || (_templateObject2$$ = _taggedTemplateLiteralLoose(["opacity: 1;"])));
|
|
10967
10960
|
});
|
|
@@ -11042,8 +11035,8 @@ var Up = function Up() {
|
|
|
11042
11035
|
})));
|
|
11043
11036
|
};
|
|
11044
11037
|
|
|
11045
|
-
var _templateObject$
|
|
11046
|
-
var Active$1 = styled.g(_templateObject$
|
|
11038
|
+
var _templateObject$17, _templateObject2$10, _templateObject3$T, _templateObject4$N, _templateObject5$I, _templateObject6$z;
|
|
11039
|
+
var Active$1 = styled.g(_templateObject$17 || (_templateObject$17 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
|
|
11047
11040
|
var active = _ref.active;
|
|
11048
11041
|
return active && css(_templateObject2$10 || (_templateObject2$10 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
|
|
11049
11042
|
});
|
|
@@ -11126,8 +11119,8 @@ var Down = function Down() {
|
|
|
11126
11119
|
})));
|
|
11127
11120
|
};
|
|
11128
11121
|
|
|
11129
|
-
var _templateObject$
|
|
11130
|
-
var Active$2 = styled.g(_templateObject$
|
|
11122
|
+
var _templateObject$18, _templateObject2$11, _templateObject3$U, _templateObject4$O, _templateObject5$J;
|
|
11123
|
+
var Active$2 = styled.g(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
|
|
11131
11124
|
var active = _ref.active;
|
|
11132
11125
|
return active && css(_templateObject2$11 || (_templateObject2$11 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
|
|
11133
11126
|
});
|
|
@@ -11210,8 +11203,8 @@ var Left = function Left() {
|
|
|
11210
11203
|
})));
|
|
11211
11204
|
};
|
|
11212
11205
|
|
|
11213
|
-
var _templateObject$
|
|
11214
|
-
var Active$3 = styled.g(_templateObject$
|
|
11206
|
+
var _templateObject$19, _templateObject2$12, _templateObject3$V, _templateObject4$P, _templateObject5$K;
|
|
11207
|
+
var Active$3 = styled.g(_templateObject$19 || (_templateObject$19 = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
|
|
11215
11208
|
var active = _ref.active;
|
|
11216
11209
|
return active && css(_templateObject2$12 || (_templateObject2$12 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
|
|
11217
11210
|
});
|
|
@@ -12107,8 +12100,8 @@ var ZoomBase = function ZoomBase(_ref) {
|
|
|
12107
12100
|
})), children));
|
|
12108
12101
|
};
|
|
12109
12102
|
|
|
12110
|
-
var _templateObject$
|
|
12111
|
-
var Active$4 = styled.g(_templateObject$
|
|
12103
|
+
var _templateObject$1a, _templateObject2$13, _templateObject3$W, _templateObject4$Q, _templateObject5$L;
|
|
12104
|
+
var Active$4 = styled.g(_templateObject$1a || (_templateObject$1a = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
|
|
12112
12105
|
var active = _ref.active;
|
|
12113
12106
|
return active && css(_templateObject2$13 || (_templateObject2$13 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
|
|
12114
12107
|
});
|
|
@@ -12184,8 +12177,8 @@ var Up$1 = function Up() {
|
|
|
12184
12177
|
})));
|
|
12185
12178
|
};
|
|
12186
12179
|
|
|
12187
|
-
var _templateObject$
|
|
12188
|
-
var Active$5 = styled.g(_templateObject$
|
|
12180
|
+
var _templateObject$1b, _templateObject2$14, _templateObject3$X, _templateObject4$R, _templateObject5$M;
|
|
12181
|
+
var Active$5 = styled.g(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteralLoose(["\n opacity: 0;\n ", "\n\n"])), function (_ref) {
|
|
12189
12182
|
var active = _ref.active;
|
|
12190
12183
|
return active && css(_templateObject2$14 || (_templateObject2$14 = _taggedTemplateLiteralLoose(["opacity: 1;"])));
|
|
12191
12184
|
});
|
|
@@ -12257,8 +12250,8 @@ var Up$2 = function Up() {
|
|
|
12257
12250
|
})));
|
|
12258
12251
|
};
|
|
12259
12252
|
|
|
12260
|
-
var _templateObject$
|
|
12261
|
-
var Container$P = styled.div(_templateObject$
|
|
12253
|
+
var _templateObject$1c;
|
|
12254
|
+
var Container$P = styled.div(_templateObject$1c || (_templateObject$1c = _taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n flex-direction: column;\n"])));
|
|
12262
12255
|
|
|
12263
12256
|
var Controls = function Controls(_ref) {
|
|
12264
12257
|
var _ref$debug = _ref.debug,
|
|
@@ -12272,8 +12265,8 @@ var Controls = function Controls(_ref) {
|
|
|
12272
12265
|
|
|
12273
12266
|
var _excluded$B = ["isEmptyWithIcon", "status", "noticeIcon", "hasNotice", "noticeMessage", "noticeTitle", "emptyIcon"];
|
|
12274
12267
|
|
|
12275
|
-
var _templateObject$
|
|
12276
|
-
var Container$Q = styled.div(_templateObject$
|
|
12268
|
+
var _templateObject$1d, _templateObject2$15, _templateObject3$Y, _templateObject4$S, _templateObject5$N, _templateObject6$A, _templateObject7$y, _templateObject8$t;
|
|
12269
|
+
var Container$Q = styled.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);
|
|
12277
12270
|
var EmptyWithIcon = styled.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) {
|
|
12278
12271
|
var hasPadding = _ref.hasPadding;
|
|
12279
12272
|
return hasPadding && "\n padding-bottom: 43px\n ";
|
|
@@ -12321,8 +12314,8 @@ var MediaStream = function MediaStream(_ref4) {
|
|
|
12321
12314
|
}));
|
|
12322
12315
|
};
|
|
12323
12316
|
|
|
12324
|
-
var _templateObject$
|
|
12325
|
-
var Container$R = styled.div(_templateObject$
|
|
12317
|
+
var _templateObject$1e, _templateObject2$16, _templateObject3$Z, _templateObject4$T, _templateObject5$O, _templateObject6$B, _templateObject7$z, _templateObject8$u, _templateObject9$n;
|
|
12318
|
+
var Container$R = styled.div(_templateObject$1e || (_templateObject$1e = _taggedTemplateLiteralLoose(["\n display: flex;\n height: 60px;\n"])));
|
|
12326
12319
|
var LeftData = styled.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) {
|
|
12327
12320
|
var hasRightData = _ref.hasRightData;
|
|
12328
12321
|
return hasRightData && css(_templateObject3$Z || (_templateObject3$Z = _taggedTemplateLiteralLoose(["\n border-right: var(--grey-6) 1px solid;\n width: 195px;\n "])));
|
|
@@ -12377,8 +12370,8 @@ var PanelMetaData = function PanelMetaData(_ref6) {
|
|
|
12377
12370
|
|
|
12378
12371
|
var _excluded$C = ["streamProps", "panelMetaData", "customBottom", "panelOnClick"];
|
|
12379
12372
|
|
|
12380
|
-
var _templateObject$
|
|
12381
|
-
var CameraPanelWrapper = styled.div(_templateObject$
|
|
12373
|
+
var _templateObject$1f;
|
|
12374
|
+
var CameraPanelWrapper = styled.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) {
|
|
12382
12375
|
var hasOnClick = _ref.hasOnClick;
|
|
12383
12376
|
return hasOnClick && "\n cursor: pointer;\n ";
|
|
12384
12377
|
});
|
|
@@ -12396,8 +12389,8 @@ var NewComponent = function NewComponent(_ref2) {
|
|
|
12396
12389
|
}, props), React__default.createElement(MediaStream, Object.assign({}, streamProps)), customBottom ? customBottom : panelMetaData && React__default.createElement(PanelMetaData, Object.assign({}, panelMetaData)));
|
|
12397
12390
|
};
|
|
12398
12391
|
|
|
12399
|
-
var _templateObject$
|
|
12400
|
-
var CameraGrid = styled.div(_templateObject$
|
|
12392
|
+
var _templateObject$1g;
|
|
12393
|
+
var CameraGrid = styled.div(_templateObject$1g || (_templateObject$1g = _taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(auto-fill, 300px);\n gap: 20px 20px;\n"])));
|
|
12401
12394
|
|
|
12402
12395
|
var CameraPanels = function CameraPanels(_ref) {
|
|
12403
12396
|
var panels = _ref.panels;
|
|
@@ -12410,36 +12403,32 @@ var CameraPanels = function CameraPanels(_ref) {
|
|
|
12410
12403
|
|
|
12411
12404
|
var _excluded$D = ["icon", "size", "weight", "label", "linkTo"];
|
|
12412
12405
|
|
|
12413
|
-
var _templateObject$
|
|
12414
|
-
var TextContainer$3 = styled.div(_templateObject$
|
|
12406
|
+
var _templateObject$1h, _templateObject2$17, _templateObject3$_, _templateObject4$U;
|
|
12407
|
+
var TextContainer$3 = styled.div(_templateObject$1h || (_templateObject$1h = _taggedTemplateLiteralLoose(["\n user-select: none;\n"])));
|
|
12415
12408
|
var StyledLink$1 = styled(Link)(_templateObject2$17 || (_templateObject2$17 = _taggedTemplateLiteralLoose(["\n text-decoration: none;\n"])));
|
|
12416
|
-
var TagWrapper = styled.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
|
|
12409
|
+
var TagWrapper = styled.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) {
|
|
12417
12410
|
var theme = _ref.theme;
|
|
12418
12411
|
return theme.fontFamily.ui;
|
|
12419
12412
|
}, function (_ref2) {
|
|
12420
12413
|
var size = _ref2.size;
|
|
12421
12414
|
return size;
|
|
12422
12415
|
}, IconWrapper, function (_ref3) {
|
|
12423
|
-
var
|
|
12424
|
-
|
|
12425
|
-
|
|
12426
|
-
var theme = _ref4.theme,
|
|
12427
|
-
hoverColor = _ref4.hoverColor,
|
|
12428
|
-
enableHover = _ref4.enableHover;
|
|
12429
|
-
return enableHover && 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]);
|
|
12416
|
+
var hoverColor = _ref3.hoverColor,
|
|
12417
|
+
enableHover = _ref3.enableHover;
|
|
12418
|
+
return enableHover && 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);
|
|
12430
12419
|
});
|
|
12431
12420
|
|
|
12432
|
-
var Tag = function Tag(
|
|
12433
|
-
var
|
|
12434
|
-
icon =
|
|
12435
|
-
|
|
12436
|
-
size =
|
|
12437
|
-
|
|
12438
|
-
weight =
|
|
12439
|
-
|
|
12440
|
-
label =
|
|
12441
|
-
linkTo =
|
|
12442
|
-
props = _objectWithoutPropertiesLoose(
|
|
12421
|
+
var Tag = function Tag(_ref4) {
|
|
12422
|
+
var _ref4$icon = _ref4.icon,
|
|
12423
|
+
icon = _ref4$icon === void 0 ? '' : _ref4$icon,
|
|
12424
|
+
_ref4$size = _ref4.size,
|
|
12425
|
+
size = _ref4$size === void 0 ? 14 : _ref4$size,
|
|
12426
|
+
_ref4$weight = _ref4.weight,
|
|
12427
|
+
weight = _ref4$weight === void 0 ? 'regular' : _ref4$weight,
|
|
12428
|
+
_ref4$label = _ref4.label,
|
|
12429
|
+
label = _ref4$label === void 0 ? '' : _ref4$label,
|
|
12430
|
+
linkTo = _ref4.linkTo,
|
|
12431
|
+
props = _objectWithoutPropertiesLoose(_ref4, _excluded$D);
|
|
12443
12432
|
|
|
12444
12433
|
var renderTag = function renderTag() {
|
|
12445
12434
|
return React__default.createElement(TagWrapper, {
|
|
@@ -12458,8 +12447,8 @@ var Tag = function Tag(_ref5) {
|
|
|
12458
12447
|
}, renderTag()) : renderTag();
|
|
12459
12448
|
};
|
|
12460
12449
|
|
|
12461
|
-
var _templateObject$
|
|
12462
|
-
var TagListWrapper = styled.div(_templateObject$
|
|
12450
|
+
var _templateObject$1i;
|
|
12451
|
+
var TagListWrapper = styled.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);
|
|
12463
12452
|
|
|
12464
12453
|
var TagList = function TagList(_ref) {
|
|
12465
12454
|
var tagsConfig = _ref.tagsConfig;
|
|
@@ -12506,8 +12495,8 @@ var DebouncedSearcher = function DebouncedSearcher(_ref) {
|
|
|
12506
12495
|
|
|
12507
12496
|
var _excluded$F = ["design", "size", "position", "text"];
|
|
12508
12497
|
|
|
12509
|
-
var _templateObject$
|
|
12510
|
-
var Container$S = styled.div(_templateObject$
|
|
12498
|
+
var _templateObject$1j, _templateObject2$18, _templateObject3$$, _templateObject4$V, _templateObject5$P, _templateObject6$C;
|
|
12499
|
+
var Container$S = styled.div(_templateObject$1j || (_templateObject$1j = _taggedTemplateLiteralLoose([""])));
|
|
12511
12500
|
var Title$6 = styled.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) {
|
|
12512
12501
|
var theme = _ref.theme;
|
|
12513
12502
|
return theme.fontFamily.ui;
|
|
@@ -12559,18 +12548,275 @@ var ActionsBar = function ActionsBar(_ref3) {
|
|
|
12559
12548
|
}, finishTextButton))), React__default.createElement(SelectedResults, null, renderSelected(selectedTemplate, totalSelected, totalAvailable)));
|
|
12560
12549
|
};
|
|
12561
12550
|
|
|
12562
|
-
var _templateObject$
|
|
12563
|
-
var
|
|
12564
|
-
var
|
|
12551
|
+
var _templateObject$1k, _templateObject2$19, _templateObject3$10, _templateObject4$W, _templateObject5$Q, _templateObject6$D, _templateObject7$A, _templateObject8$v, _templateObject9$o, _templateObject10$k;
|
|
12552
|
+
var WIDTH_PER_NUMBER = 12;
|
|
12553
|
+
var PaginationContainer = styled.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"])));
|
|
12554
|
+
var PageLabel = styled.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"])));
|
|
12555
|
+
var StaticPageCount = styled.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"])));
|
|
12556
|
+
var StyledInput$3 = styled.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) {
|
|
12557
|
+
var textColor = _ref.textColor;
|
|
12558
|
+
return textColor;
|
|
12559
|
+
}, function (_ref2) {
|
|
12560
|
+
var maxWidth = _ref2.maxWidth;
|
|
12561
|
+
return maxWidth ? maxWidth : '40px';
|
|
12562
|
+
}, WIDTH_PER_NUMBER / 2);
|
|
12563
|
+
var shakeAnimation = 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"])));
|
|
12564
|
+
var InputContainer$2 = styled.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) {
|
|
12565
|
+
var shouldShake = _ref3.shouldShake;
|
|
12566
|
+
return shouldShake ? shakeAnimation : 'none';
|
|
12567
|
+
}, function (_ref4) {
|
|
12568
|
+
var borderColor = _ref4.borderColor;
|
|
12569
|
+
return borderColor && "border: 1px solid " + borderColor;
|
|
12570
|
+
});
|
|
12571
|
+
var GoButton = styled(Button)(_templateObject7$A || (_templateObject7$A = _taggedTemplateLiteralLoose(["\n height: 24px;\n padding: 0 8px;\n margin-left: 8px;\n"])));
|
|
12572
|
+
var ArrowWrapper = styled.div(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 0 8px;\n"])));
|
|
12573
|
+
var ArrowButton = styled.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) {
|
|
12574
|
+
var active = _ref5.active;
|
|
12575
|
+
return active ? 'auto' : 'none';
|
|
12576
|
+
}, function (_ref6) {
|
|
12577
|
+
var active = _ref6.active;
|
|
12578
|
+
return active ? '1' : '0.5';
|
|
12579
|
+
});
|
|
12580
|
+
var ItemsSelectWrapper = styled.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) {
|
|
12581
|
+
var width = _ref7.width;
|
|
12582
|
+
return width ? width : "60px";
|
|
12583
|
+
}, StyledLabel);
|
|
12584
|
+
|
|
12585
|
+
var Pagination = function Pagination(props) {
|
|
12586
|
+
var _props$pageText = props.pageText,
|
|
12587
|
+
pageText = _props$pageText === void 0 ? 'Page:' : _props$pageText,
|
|
12588
|
+
_props$totalPages = props.totalPages,
|
|
12589
|
+
totalPages = _props$totalPages === void 0 ? 199 : _props$totalPages,
|
|
12590
|
+
_props$activePage = props.activePage,
|
|
12591
|
+
activePage = _props$activePage === void 0 ? 1 : _props$activePage,
|
|
12592
|
+
_props$buttonText = props.buttonText,
|
|
12593
|
+
buttonText = _props$buttonText === void 0 ? 'GO' : _props$buttonText,
|
|
12594
|
+
_props$itemsText = props.itemsText,
|
|
12595
|
+
itemsText = _props$itemsText === void 0 ? 'Items Per Page' : _props$itemsText,
|
|
12596
|
+
_props$selectWidth = props.selectWidth,
|
|
12597
|
+
selectWidth = _props$selectWidth === void 0 ? '60px' : _props$selectWidth,
|
|
12598
|
+
_props$selectDisabled = props.selectDisabled,
|
|
12599
|
+
selectDisabled = _props$selectDisabled === void 0 ? false : _props$selectDisabled,
|
|
12600
|
+
_props$itemsOptions = props.itemsOptions,
|
|
12601
|
+
itemsOptions = _props$itemsOptions === void 0 ? [] : _props$itemsOptions,
|
|
12602
|
+
onPageChange = props.onPageChange,
|
|
12603
|
+
onItemsChange = props.onItemsChange;
|
|
12604
|
+
|
|
12605
|
+
var _useState = useState('default'),
|
|
12606
|
+
fieldState = _useState[0],
|
|
12607
|
+
setFieldState = _useState[1];
|
|
12608
|
+
|
|
12609
|
+
var _useState2 = useState(activePage.toString()),
|
|
12610
|
+
pageValue = _useState2[0],
|
|
12611
|
+
setPageValue = _useState2[1];
|
|
12612
|
+
|
|
12613
|
+
var _useState3 = useState(parseInt(pageValue) > totalPages && fieldState !== '' ? false : true),
|
|
12614
|
+
disableGo = _useState3[0],
|
|
12615
|
+
setDisabledGo = _useState3[1];
|
|
12616
|
+
|
|
12617
|
+
var _useState4 = useState(false),
|
|
12618
|
+
shouldShake = _useState4[0],
|
|
12619
|
+
setShouldShake = _useState4[1];
|
|
12620
|
+
|
|
12621
|
+
var inputRef = useRef(null);
|
|
12622
|
+
var getValidWidth = useCallback(function () {
|
|
12623
|
+
return totalPages.toString().length * WIDTH_PER_NUMBER + WIDTH_PER_NUMBER / 2 + "px";
|
|
12624
|
+
}, [totalPages]);
|
|
12625
|
+
var isValidInput = useCallback(function (value) {
|
|
12626
|
+
if (isNotNumber(value)) {
|
|
12627
|
+
return false;
|
|
12628
|
+
}
|
|
12629
|
+
|
|
12630
|
+
if (parseInt(value) > totalPages) {
|
|
12631
|
+
return false;
|
|
12632
|
+
}
|
|
12633
|
+
|
|
12634
|
+
if (parseInt(value) <= 0) {
|
|
12635
|
+
return false;
|
|
12636
|
+
}
|
|
12637
|
+
|
|
12638
|
+
if (value === '') {
|
|
12639
|
+
return false;
|
|
12640
|
+
}
|
|
12641
|
+
|
|
12642
|
+
return true;
|
|
12643
|
+
}, [totalPages]);
|
|
12644
|
+
var onInputChange = useCallback(function (_ref8) {
|
|
12645
|
+
var value = _ref8.target.value;
|
|
12646
|
+
setShouldShake(false);
|
|
12647
|
+
|
|
12648
|
+
if (isNotNumber(value)) {
|
|
12649
|
+
return;
|
|
12650
|
+
}
|
|
12651
|
+
|
|
12652
|
+
var validDigitValue = value === '' ? '' : Number(value.slice(-totalPages.toString().length)).toString();
|
|
12653
|
+
setPageValue(validDigitValue);
|
|
12654
|
+
|
|
12655
|
+
if (isValidInput(validDigitValue)) {
|
|
12656
|
+
setFieldState('processing');
|
|
12657
|
+
setDisabledGo(false);
|
|
12658
|
+
} else {
|
|
12659
|
+
setFieldState('invalid');
|
|
12660
|
+
setDisabledGo(true);
|
|
12661
|
+
setShouldShake(true);
|
|
12662
|
+
}
|
|
12663
|
+
}, [isValidInput, totalPages]);
|
|
12664
|
+
|
|
12665
|
+
var _onBlur = useCallback(function (_ref9) {
|
|
12666
|
+
var value = _ref9.target.value;
|
|
12667
|
+
|
|
12668
|
+
if (value === '') {
|
|
12669
|
+
setPageValue(activePage.toString());
|
|
12670
|
+
} else if (isValidInput(value) && parseInt(value) !== activePage) {
|
|
12671
|
+
setDisabledGo(false);
|
|
12672
|
+
setFieldState('processing');
|
|
12673
|
+
return;
|
|
12674
|
+
} else if (!isValidInput(value)) {
|
|
12675
|
+
setFieldState('invalid');
|
|
12676
|
+
setDisabledGo(true);
|
|
12677
|
+
return;
|
|
12678
|
+
}
|
|
12679
|
+
|
|
12680
|
+
setFieldState('default');
|
|
12681
|
+
}, [activePage, isValidInput]);
|
|
12682
|
+
|
|
12683
|
+
var handleKeyDown = function handleKeyDown(event) {
|
|
12684
|
+
if (event.key === 'Enter' && isValidInput(pageValue)) {
|
|
12685
|
+
onClickGo();
|
|
12686
|
+
}
|
|
12687
|
+
};
|
|
12688
|
+
|
|
12689
|
+
var _onFocus = function onFocus(_ref10) {
|
|
12690
|
+
var value = _ref10.target.value;
|
|
12691
|
+
|
|
12692
|
+
if (isValidInput(value)) {
|
|
12693
|
+
setFieldState('processing');
|
|
12694
|
+
} else {
|
|
12695
|
+
setFieldState('invalid');
|
|
12696
|
+
setDisabledGo(true);
|
|
12697
|
+
}
|
|
12698
|
+
};
|
|
12699
|
+
|
|
12700
|
+
var getStateColor = useCallback(function (state) {
|
|
12701
|
+
switch (state) {
|
|
12702
|
+
case 'processing':
|
|
12703
|
+
return 'var(--primary-7)';
|
|
12704
|
+
|
|
12705
|
+
case 'invalid':
|
|
12706
|
+
return 'var(--warning-8)';
|
|
12707
|
+
|
|
12708
|
+
case 'default':
|
|
12709
|
+
default:
|
|
12710
|
+
return 'var(--grey-9)';
|
|
12711
|
+
}
|
|
12712
|
+
}, []);
|
|
12713
|
+
var onClickGo = useCallback(function () {
|
|
12714
|
+
onPageChange(parseInt(pageValue));
|
|
12715
|
+
inputRef.current && inputRef.current.blur();
|
|
12716
|
+
setDisabledGo(true);
|
|
12717
|
+
setFieldState('default');
|
|
12718
|
+
}, [onPageChange, pageValue]);
|
|
12719
|
+
|
|
12720
|
+
var handlePageChange = function handlePageChange(value) {
|
|
12721
|
+
onPageChange(value);
|
|
12722
|
+
setPageValue(value.toString());
|
|
12723
|
+
};
|
|
12724
|
+
|
|
12725
|
+
var onItemsSelectChange = useCallback(function (value) {
|
|
12726
|
+
onItemsChange(Number(value));
|
|
12727
|
+
}, [onItemsChange]);
|
|
12728
|
+
|
|
12729
|
+
var handlePaste = function handlePaste(e) {
|
|
12730
|
+
var clipboardData = e.clipboardData || window.clipboardData;
|
|
12731
|
+
var pastedText = clipboardData.getData('text');
|
|
12732
|
+
|
|
12733
|
+
if (!/^\d+$/.test(pastedText)) {
|
|
12734
|
+
e.preventDefault();
|
|
12735
|
+
}
|
|
12736
|
+
};
|
|
12737
|
+
|
|
12738
|
+
return React__default.createElement(PaginationContainer, null, React__default.createElement(ItemsSelectWrapper, {
|
|
12739
|
+
width: selectWidth
|
|
12740
|
+
}, React__default.createElement(SelectField, {
|
|
12741
|
+
disabled: selectDisabled,
|
|
12742
|
+
label: {
|
|
12743
|
+
htmlFor: 'paginationPages',
|
|
12744
|
+
text: itemsText,
|
|
12745
|
+
isSameRow: true
|
|
12746
|
+
},
|
|
12747
|
+
defaultValue: 1,
|
|
12748
|
+
changeCallback: onItemsSelectChange
|
|
12749
|
+
}, React__default.createElement(Fragment, null, itemsOptions.map(function (_ref11, index) {
|
|
12750
|
+
var value = _ref11.value,
|
|
12751
|
+
textValue = _ref11.textValue;
|
|
12752
|
+
return React__default.createElement("option", {
|
|
12753
|
+
key: index,
|
|
12754
|
+
value: value
|
|
12755
|
+
}, textValue);
|
|
12756
|
+
})))), React__default.createElement(PageLabel, {
|
|
12757
|
+
htmlFor: 'goButton'
|
|
12758
|
+
}, pageText), React__default.createElement(InputContainer$2, {
|
|
12759
|
+
borderColor: getStateColor(fieldState),
|
|
12760
|
+
shouldShake: shouldShake
|
|
12761
|
+
}, React__default.createElement(StyledInput$3, {
|
|
12762
|
+
ref: inputRef,
|
|
12763
|
+
value: pageValue,
|
|
12764
|
+
onChange: function onChange(e) {
|
|
12765
|
+
return onInputChange(e);
|
|
12766
|
+
},
|
|
12767
|
+
textColor: getStateColor(fieldState),
|
|
12768
|
+
onFocus: function onFocus(e) {
|
|
12769
|
+
return _onFocus(e);
|
|
12770
|
+
},
|
|
12771
|
+
onBlur: function onBlur(e) {
|
|
12772
|
+
return _onBlur(e);
|
|
12773
|
+
},
|
|
12774
|
+
onPaste: function onPaste(e) {
|
|
12775
|
+
return handlePaste(e);
|
|
12776
|
+
},
|
|
12777
|
+
onKeyDown: handleKeyDown,
|
|
12778
|
+
maxWidth: getValidWidth()
|
|
12779
|
+
}), React__default.createElement(StaticPageCount, null, '/' + "\xA0" + totalPages.toString()), React__default.createElement(GoButton, {
|
|
12780
|
+
id: 'goButton',
|
|
12781
|
+
size: 'small',
|
|
12782
|
+
design: 'primary',
|
|
12783
|
+
disabled: disableGo,
|
|
12784
|
+
onClick: onClickGo
|
|
12785
|
+
}, buttonText)), React__default.createElement(ArrowWrapper, null, React__default.createElement(ArrowButton, {
|
|
12786
|
+
onClick: function onClick() {
|
|
12787
|
+
return handlePageChange(activePage - 1);
|
|
12788
|
+
},
|
|
12789
|
+
disabled: activePage <= 1,
|
|
12790
|
+
active: fieldState === 'default' && activePage > 1
|
|
12791
|
+
}, React__default.createElement(Icon, {
|
|
12792
|
+
icon: 'Left',
|
|
12793
|
+
color: 'dimmed',
|
|
12794
|
+
size: 8
|
|
12795
|
+
})), React__default.createElement(ArrowButton, {
|
|
12796
|
+
onClick: function onClick() {
|
|
12797
|
+
return handlePageChange(activePage + 1);
|
|
12798
|
+
},
|
|
12799
|
+
disabled: activePage >= totalPages,
|
|
12800
|
+
active: fieldState === 'default' && activePage < totalPages
|
|
12801
|
+
}, React__default.createElement(Icon, {
|
|
12802
|
+
icon: 'Right',
|
|
12803
|
+
color: 'dimmed',
|
|
12804
|
+
size: 8
|
|
12805
|
+
}))));
|
|
12806
|
+
};
|
|
12807
|
+
|
|
12808
|
+
var _templateObject$1l, _templateObject2$1a, _templateObject3$11, _templateObject4$X, _templateObject5$R;
|
|
12809
|
+
var Container$T = styled.div(_templateObject$1l || (_templateObject$1l = _taggedTemplateLiteralLoose([""])));
|
|
12810
|
+
var Title$7 = styled.div(_templateObject2$1a || (_templateObject2$1a = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
|
|
12565
12811
|
var typography = _ref.theme.typography;
|
|
12566
12812
|
return typography.modal.title;
|
|
12567
12813
|
});
|
|
12568
|
-
var MessageBox$1 = styled.div(_templateObject3$
|
|
12814
|
+
var MessageBox$1 = styled.div(_templateObject3$11 || (_templateObject3$11 = _taggedTemplateLiteralLoose(["\n ", ";\n margin: 28px 0;\n"])), function (_ref2) {
|
|
12569
12815
|
var typography = _ref2.theme.typography;
|
|
12570
12816
|
return typography.modal.basicContent;
|
|
12571
12817
|
});
|
|
12572
|
-
var StyledButton$6 = styled(Button)(_templateObject4$
|
|
12573
|
-
var ButtonsGroup$1 = styled.div(_templateObject5$
|
|
12818
|
+
var StyledButton$6 = styled(Button)(_templateObject4$X || (_templateObject4$X = _taggedTemplateLiteralLoose(["\n margin-left: 10px;\n"])));
|
|
12819
|
+
var ButtonsGroup$1 = styled.div(_templateObject5$R || (_templateObject5$R = _taggedTemplateLiteralLoose(["\n text-align: right;\n"])));
|
|
12574
12820
|
|
|
12575
12821
|
var ConfirmationModal = function ConfirmationModal(_ref3) {
|
|
12576
12822
|
var _ref3$title = _ref3.title,
|
|
@@ -12612,123 +12858,248 @@ var ConfirmationModal = function ConfirmationModal(_ref3) {
|
|
|
12612
12858
|
}, rightButtonText)));
|
|
12613
12859
|
};
|
|
12614
12860
|
|
|
12615
|
-
var _templateObject$
|
|
12861
|
+
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;
|
|
12862
|
+
var Container$U = styled.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"])));
|
|
12863
|
+
var LeftArea = styled.div(_templateObject2$1b || (_templateObject2$1b = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: var(--columnPadding, 16px);\n flex: 1 0 0;\n"])));
|
|
12864
|
+
var BackLinkIcon = styled.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"])));
|
|
12865
|
+
var BackLink = styled(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) {
|
|
12866
|
+
return props.$iconInGutter ? '-24px' : '0';
|
|
12867
|
+
}, BackLinkIcon, BackLinkIcon, function (_ref) {
|
|
12868
|
+
var $showDivider = _ref.$showDivider;
|
|
12869
|
+
return $showDivider && 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 "])));
|
|
12870
|
+
});
|
|
12871
|
+
var ExtraActionIcon = styled.div(_templateObject6$E || (_templateObject6$E = _taggedTemplateLiteralLoose(["\n display: flex;\n width: 16px;\n height: 16px;\n justify-content: center;\n align-items: center;\n"])));
|
|
12872
|
+
var ExtraAction = styled.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);
|
|
12873
|
+
var Breadcrumbs = styled.div(_templateObject8$w || (_templateObject8$w = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"])));
|
|
12874
|
+
var Breadcrumb = styled.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"])));
|
|
12875
|
+
var BreadcrumbIcon = styled.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"])));
|
|
12876
|
+
var BreadcrumbLink = styled(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"])));
|
|
12877
|
+
var RightArea = styled.div(_templateObject12$a || (_templateObject12$a = _taggedTemplateLiteralLoose(["\n flex: 1;\n align-items: center;\n display: flex;\n justify-content: right;\n"])));
|
|
12878
|
+
|
|
12879
|
+
var UtilityHeader = function UtilityHeader(_ref2) {
|
|
12880
|
+
var _ref2$showBreadcrumbs = _ref2.showBreadcrumbs,
|
|
12881
|
+
showBreadcrumbs = _ref2$showBreadcrumbs === void 0 ? true : _ref2$showBreadcrumbs,
|
|
12882
|
+
_ref2$breadcrumbs = _ref2.breadcrumbs,
|
|
12883
|
+
breadcrumbs = _ref2$breadcrumbs === void 0 ? [] : _ref2$breadcrumbs,
|
|
12884
|
+
backLink = _ref2.backLink,
|
|
12885
|
+
_ref2$$iconInGutter = _ref2.$iconInGutter,
|
|
12886
|
+
$iconInGutter = _ref2$$iconInGutter === void 0 ? true : _ref2$$iconInGutter,
|
|
12887
|
+
_ref2$showShareLink = _ref2.showShareLink,
|
|
12888
|
+
showShareLink = _ref2$showShareLink === void 0 ? false : _ref2$showShareLink,
|
|
12889
|
+
shareLink = _ref2.shareLink;
|
|
12890
|
+
|
|
12891
|
+
var _useState = useState("Share"),
|
|
12892
|
+
copyActionText = _useState[0],
|
|
12893
|
+
setCopyActionText = _useState[1];
|
|
12894
|
+
|
|
12895
|
+
var _useCopyToClipboard = useCopyToClipboard(),
|
|
12896
|
+
copyToClipboard = _useCopyToClipboard.copyToClipboard;
|
|
12897
|
+
|
|
12898
|
+
var hasBreadcrumbs = showBreadcrumbs && breadcrumbs.length > 0;
|
|
12899
|
+
var clickHandlerShareLink = useCallback(function () {
|
|
12900
|
+
copyToClipboard(shareLink ? shareLink : window.location.href);
|
|
12901
|
+
setCopyActionText("Copied");
|
|
12902
|
+
setTimeout(function () {
|
|
12903
|
+
return setCopyActionText("Share");
|
|
12904
|
+
}, 2000);
|
|
12905
|
+
}, [shareLink, copyToClipboard]);
|
|
12906
|
+
return React__default.createElement(Container$U, null, React__default.createElement(LeftArea, null, backLink ? React__default.createElement(BackLink, Object.assign({
|
|
12907
|
+
to: backLink,
|
|
12908
|
+
"$showDivider": hasBreadcrumbs
|
|
12909
|
+
}, {
|
|
12910
|
+
$iconInGutter: $iconInGutter
|
|
12911
|
+
}), React__default.createElement(BackLinkIcon, null, React__default.createElement(Icon, {
|
|
12912
|
+
icon: "Back",
|
|
12913
|
+
size: 16,
|
|
12914
|
+
color: "grey-10"
|
|
12915
|
+
})), "Back") : null, hasBreadcrumbs ? React__default.createElement(Breadcrumbs, null, breadcrumbs.map(function (breadcrumb, index) {
|
|
12916
|
+
var text = breadcrumb.text,
|
|
12917
|
+
href = breadcrumb.href;
|
|
12918
|
+
var isLast = index === breadcrumbs.length - 1;
|
|
12919
|
+
return React__default.createElement(React__default.Fragment, {
|
|
12920
|
+
key: index
|
|
12921
|
+
}, React__default.createElement(Breadcrumb, null, React__default.createElement(BreadcrumbLink, {
|
|
12922
|
+
to: href
|
|
12923
|
+
}, text), !isLast ? React__default.createElement(BreadcrumbIcon, null, React__default.createElement(Icon, {
|
|
12924
|
+
icon: "Right",
|
|
12925
|
+
size: 6,
|
|
12926
|
+
color: 'grey-8'
|
|
12927
|
+
})) : null));
|
|
12928
|
+
})) : null), React__default.createElement(RightArea, null, showShareLink ? React__default.createElement(ExtraAction, {
|
|
12929
|
+
onClick: clickHandlerShareLink
|
|
12930
|
+
}, React__default.createElement(ExtraActionIcon, null, React__default.createElement(Icon, {
|
|
12931
|
+
icon: "Link",
|
|
12932
|
+
size: 16,
|
|
12933
|
+
color: "grey-10"
|
|
12934
|
+
})), copyActionText) : null));
|
|
12935
|
+
};
|
|
12936
|
+
|
|
12937
|
+
var TabContext = React__default.createContext({
|
|
12938
|
+
selected: '',
|
|
12939
|
+
setSelected: function setSelected() {}
|
|
12940
|
+
});
|
|
12941
|
+
|
|
12942
|
+
var Tabs = function Tabs(_ref) {
|
|
12943
|
+
var children = _ref.children;
|
|
12944
|
+
|
|
12945
|
+
var _useState = useState(''),
|
|
12946
|
+
selected = _useState[0],
|
|
12947
|
+
setSelected = _useState[1];
|
|
12948
|
+
|
|
12949
|
+
return React__default.createElement(TabContext.Provider, {
|
|
12950
|
+
value: {
|
|
12951
|
+
selected: selected,
|
|
12952
|
+
setSelected: setSelected
|
|
12953
|
+
}
|
|
12954
|
+
}, children);
|
|
12955
|
+
};
|
|
12956
|
+
|
|
12957
|
+
var _templateObject$1n, _templateObject2$1c, _templateObject3$13, _templateObject4$Z, _templateObject5$T;
|
|
12958
|
+
var Container$V = styled.div(_templateObject$1n || (_templateObject$1n = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex-direction: column;\n position: relative;\n"])));
|
|
12959
|
+
var HeaderArea = styled.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"])));
|
|
12960
|
+
var TabArea = styled.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"])));
|
|
12961
|
+
var TabAreaInner = styled.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"])));
|
|
12962
|
+
var Content = styled.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"])));
|
|
12963
|
+
|
|
12964
|
+
var ContentLayout = function ContentLayout(_ref) {
|
|
12965
|
+
var _ref$layout = _ref.layout,
|
|
12966
|
+
layout = _ref$layout === void 0 ? 'default' : _ref$layout,
|
|
12967
|
+
_ref$HeaderContent = _ref.HeaderContent,
|
|
12968
|
+
HeaderContent = _ref$HeaderContent === void 0 ? {} : _ref$HeaderContent,
|
|
12969
|
+
children = _ref.children;
|
|
12970
|
+
var PageHeaderArea = HeaderContent.PageHeaderArea,
|
|
12971
|
+
TabsElementArea = HeaderContent.TabsElementArea,
|
|
12972
|
+
UtilityHeaderOptions = HeaderContent.UtilityHeaderOptions;
|
|
12973
|
+
var containerClass = 'content-layout-' + layout;
|
|
12974
|
+
return React__default.createElement(Container$V, {
|
|
12975
|
+
className: containerClass
|
|
12976
|
+
}, 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));
|
|
12977
|
+
};
|
|
12978
|
+
|
|
12979
|
+
var _templateObject$1o, _templateObject2$1d;
|
|
12980
|
+
var FullWidthContainer = styled.div(_templateObject$1o || (_templateObject$1o = _taggedTemplateLiteralLoose(["\n min-height: ", ";\n"])), function (_ref) {
|
|
12981
|
+
var $contentHeight = _ref.$contentHeight;
|
|
12982
|
+
return $contentHeight + 'px';
|
|
12983
|
+
});
|
|
12984
|
+
var FullWidthInner = styled.div(_templateObject2$1d || (_templateObject2$1d = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n right: 0;\n input {width: 100%;}\n"])));
|
|
12985
|
+
|
|
12986
|
+
var FullWidthContentBlock = function FullWidthContentBlock(_ref2) {
|
|
12987
|
+
var children = _ref2.children;
|
|
12988
|
+
var innerElement = useRef(null);
|
|
12989
|
+
|
|
12990
|
+
var _useState = useState(0),
|
|
12991
|
+
contentHeight = _useState[0],
|
|
12992
|
+
setContentHeight = _useState[1];
|
|
12993
|
+
|
|
12994
|
+
useEffect(function () {
|
|
12995
|
+
if (innerElement && innerElement.current) {
|
|
12996
|
+
setContentHeight(innerElement.current.clientHeight);
|
|
12997
|
+
}
|
|
12998
|
+
}, [innerElement, children]);
|
|
12999
|
+
return React__default.createElement(FullWidthContainer, {
|
|
13000
|
+
"$contentHeight": contentHeight
|
|
13001
|
+
}, React__default.createElement(FullWidthInner, {
|
|
13002
|
+
ref: innerElement
|
|
13003
|
+
}, children));
|
|
13004
|
+
};
|
|
13005
|
+
|
|
13006
|
+
var _templateObject$1p, _templateObject2$1e, _templateObject3$14, _templateObject4$_, _templateObject5$U, _templateObject6$F, _templateObject7$C;
|
|
12616
13007
|
var MOBILE_CLOSE_HEIGHT = 50;
|
|
12617
13008
|
var MOBILE_NAVBAR_HEIGHT = 68;
|
|
12618
|
-
var Layout = styled.div(_templateObject$
|
|
13009
|
+
var Layout = styled.div(_templateObject$1p || (_templateObject$1p = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n height: 100%;\n ", ";\n"])), function (_ref) {
|
|
12619
13010
|
var theme = _ref.theme;
|
|
12620
13011
|
return theme.styles.global.background;
|
|
12621
13012
|
});
|
|
12622
|
-
var MobileLayout = styled.div(_templateObject2$
|
|
12623
|
-
var Content = styled.div(_templateObject3$
|
|
12624
|
-
var
|
|
12625
|
-
|
|
12626
|
-
|
|
12627
|
-
|
|
12628
|
-
|
|
12629
|
-
|
|
12630
|
-
|
|
12631
|
-
|
|
12632
|
-
|
|
12633
|
-
var paddingOverride = _ref4.paddingOverride;
|
|
12634
|
-
return paddingOverride ? paddingOverride : '40px 20px';
|
|
12635
|
-
}, deviceMediaQuery.medium, function (_ref5) {
|
|
12636
|
-
var paddingOverride = _ref5.paddingOverride;
|
|
12637
|
-
return paddingOverride ? paddingOverride : '40px';
|
|
12638
|
-
}, deviceMediaQuery.large, function (_ref6) {
|
|
12639
|
-
var maxWidth = _ref6.maxWidth;
|
|
12640
|
-
return maxWidth ? maxWidth : "1200px";
|
|
12641
|
-
}, function (_ref7) {
|
|
12642
|
-
var paddingOverride = _ref7.paddingOverride;
|
|
12643
|
-
return paddingOverride ? paddingOverride : '70px 90px';
|
|
13013
|
+
var MobileLayout = styled.div(_templateObject2$1e || (_templateObject2$1e = _taggedTemplateLiteralLoose([""])));
|
|
13014
|
+
var Content$1 = styled.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) {
|
|
13015
|
+
var maxWidth = _ref2.maxWidth;
|
|
13016
|
+
return maxWidth && css(_templateObject4$_ || (_templateObject4$_ = _taggedTemplateLiteralLoose(["\n & > div {\n max-width: ", ";\n }\n "])), maxWidth);
|
|
13017
|
+
});
|
|
13018
|
+
var MainContainer = styled.div(_templateObject5$U || (_templateObject5$U = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"])));
|
|
13019
|
+
var ContentArea = styled.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) {
|
|
13020
|
+
var legacyLayout = _ref3.legacyLayout,
|
|
13021
|
+
paddingOverride = _ref3.paddingOverride,
|
|
13022
|
+
maxWidth = _ref3.maxWidth;
|
|
13023
|
+
return legacyLayout && 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');
|
|
12644
13024
|
});
|
|
12645
13025
|
|
|
12646
|
-
var _templateObject$
|
|
12647
|
-
var ContextTitle = styled.div(_templateObject$
|
|
13026
|
+
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;
|
|
13027
|
+
var ContextTitle = styled.div(_templateObject$1q || (_templateObject$1q = _taggedTemplateLiteralLoose(["\n opacity: 0;\n\n ", "\n\n ", "\n"])), function (_ref) {
|
|
12648
13028
|
var theme = _ref.theme;
|
|
12649
|
-
return css(_templateObject2$
|
|
13029
|
+
return css(_templateObject2$1f || (_templateObject2$1f = _taggedTemplateLiteralLoose(["\n transition: opacity ", " ", ";\n "])), theme.animation.speed.fast, theme.animation.easing.primary.easeInOut);
|
|
12650
13030
|
}, function (_ref2) {
|
|
12651
13031
|
var compact = _ref2.compact;
|
|
12652
|
-
return compact && css(_templateObject3$
|
|
13032
|
+
return compact && css(_templateObject3$15 || (_templateObject3$15 = _taggedTemplateLiteralLoose(["\n font-size:14px;\n "])));
|
|
12653
13033
|
});
|
|
12654
|
-
var ContextIcon$1 = styled.div(_templateObject4
|
|
13034
|
+
var ContextIcon$1 = styled.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) {
|
|
12655
13035
|
var theme = _ref3.theme;
|
|
12656
|
-
return css(_templateObject5$
|
|
13036
|
+
return 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);
|
|
12657
13037
|
});
|
|
12658
|
-
var ContextIndicator = styled.div(_templateObject6$
|
|
13038
|
+
var ContextIndicator = styled.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) {
|
|
12659
13039
|
var theme = _ref4.theme;
|
|
12660
|
-
return css(_templateObject7$
|
|
13040
|
+
return css(_templateObject7$D || (_templateObject7$D = _taggedTemplateLiteralLoose(["\n transition: opacity 0 ", ";\n "])), theme.animation.easing.primary.easeInOut);
|
|
12661
13041
|
});
|
|
12662
|
-
var ContextActionBaseCSS$1 = css(_templateObject8$
|
|
12663
|
-
var StyledAnchor = styled.a(_templateObject9$
|
|
12664
|
-
var ExternalIconWrapper = styled.div(_templateObject10$
|
|
12665
|
-
var ContextWrapper = styled.div(_templateObject11$
|
|
13042
|
+
var ContextActionBaseCSS$1 = 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"])));
|
|
13043
|
+
var StyledAnchor = styled.a(_templateObject9$q || (_templateObject9$q = _taggedTemplateLiteralLoose(["\n display: flex;\n text-decoration: none;\n"])));
|
|
13044
|
+
var ExternalIconWrapper = styled.div(_templateObject10$m || (_templateObject10$m = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
|
|
13045
|
+
var ContextWrapper = styled.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) {
|
|
12666
13046
|
var theme = _ref5.theme;
|
|
12667
|
-
return theme && css(_templateObject12$
|
|
13047
|
+
return theme && css(_templateObject12$b || (_templateObject12$b = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
|
|
12668
13048
|
}, function (_ref6) {
|
|
12669
13049
|
var $menuOpen = _ref6.$menuOpen;
|
|
12670
13050
|
return $menuOpen && css(_templateObject13$9 || (_templateObject13$9 = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n"])), ContextTitle);
|
|
12671
13051
|
}, ContextIcon$1, function (_ref7) {
|
|
12672
13052
|
var theme = _ref7.theme;
|
|
12673
13053
|
return theme.styles.global.mainMenu.iconBackground.hover;
|
|
12674
|
-
}, IconWrapper
|
|
13054
|
+
}, IconWrapper);
|
|
13055
|
+
var ContextActionA = styled(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) {
|
|
12675
13056
|
var theme = _ref8.theme;
|
|
12676
|
-
return theme.colors.icons['inverse'];
|
|
12677
|
-
});
|
|
12678
|
-
var ContextActionA = styled(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) {
|
|
12679
|
-
var theme = _ref9.theme;
|
|
12680
13057
|
return theme && css(_templateObject15$5 || (_templateObject15$5 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
|
|
12681
|
-
}, function (
|
|
12682
|
-
var $menuOpen =
|
|
13058
|
+
}, function (_ref9) {
|
|
13059
|
+
var $menuOpen = _ref9.$menuOpen;
|
|
12683
13060
|
return $menuOpen && css(_templateObject16$5 || (_templateObject16$5 = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n "])), ContextTitle);
|
|
12684
|
-
}, ContextIcon$1, function (
|
|
12685
|
-
var theme =
|
|
13061
|
+
}, ContextIcon$1, function (_ref10) {
|
|
13062
|
+
var theme = _ref10.theme;
|
|
12686
13063
|
return theme.styles.global.mainMenu.iconBackground.hover;
|
|
12687
|
-
}, IconWrapper, function (
|
|
12688
|
-
var
|
|
12689
|
-
return
|
|
12690
|
-
|
|
12691
|
-
var $isActive = _ref13.$isActive;
|
|
12692
|
-
return $isActive && css(_templateObject17$5 || (_templateObject17$5 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref14) {
|
|
12693
|
-
var theme = _ref14.theme;
|
|
13064
|
+
}, IconWrapper, function (_ref11) {
|
|
13065
|
+
var $isActive = _ref11.$isActive;
|
|
13066
|
+
return $isActive && css(_templateObject17$5 || (_templateObject17$5 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref12) {
|
|
13067
|
+
var theme = _ref12.theme;
|
|
12694
13068
|
return theme.styles.global.mainMenu.iconBackground.active;
|
|
12695
13069
|
});
|
|
12696
13070
|
});
|
|
12697
|
-
var ContextActionButton$1 = styled.button(_templateObject18$3 || (_templateObject18$3 = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n ", ";\n ", "{\n [stroke]{\n stroke:
|
|
12698
|
-
var theme =
|
|
13071
|
+
var ContextActionButton$1 = styled.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) {
|
|
13072
|
+
var theme = _ref13.theme;
|
|
12699
13073
|
return theme && css(_templateObject19$3 || (_templateObject19$3 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", ";\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.menuItem["default"]);
|
|
12700
|
-
}, function (
|
|
12701
|
-
var menuOpen =
|
|
12702
|
-
theme =
|
|
13074
|
+
}, function (_ref14) {
|
|
13075
|
+
var menuOpen = _ref14.menuOpen,
|
|
13076
|
+
theme = _ref14.theme;
|
|
12703
13077
|
return menuOpen && 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);
|
|
12704
|
-
}, ContextIcon$1, function (
|
|
12705
|
-
var theme =
|
|
13078
|
+
}, ContextIcon$1, function (_ref15) {
|
|
13079
|
+
var theme = _ref15.theme;
|
|
12706
13080
|
return theme.styles.global.mainMenu.iconBackground.hover;
|
|
12707
|
-
}, IconWrapper, function (
|
|
12708
|
-
var
|
|
12709
|
-
return
|
|
12710
|
-
|
|
12711
|
-
var isActive = _ref19.isActive;
|
|
12712
|
-
return isActive && css(_templateObject21$3 || (_templateObject21$3 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref20) {
|
|
12713
|
-
var theme = _ref20.theme;
|
|
13081
|
+
}, IconWrapper, function (_ref16) {
|
|
13082
|
+
var isActive = _ref16.isActive;
|
|
13083
|
+
return isActive && css(_templateObject21$3 || (_templateObject21$3 = _taggedTemplateLiteralLoose(["\n ", ",\n &:hover ", "{\n ", ";\n }\n "])), ContextIcon$1, ContextIcon$1, function (_ref17) {
|
|
13084
|
+
var theme = _ref17.theme;
|
|
12714
13085
|
return theme.styles.global.mainMenu.iconBackground.active;
|
|
12715
13086
|
});
|
|
12716
13087
|
});
|
|
12717
13088
|
|
|
12718
|
-
var ContextItem = function ContextItem(
|
|
12719
|
-
var
|
|
12720
|
-
hasSubmenu =
|
|
12721
|
-
|
|
12722
|
-
contextKey =
|
|
12723
|
-
submenuOpen =
|
|
12724
|
-
menuOpen =
|
|
12725
|
-
title =
|
|
12726
|
-
href =
|
|
12727
|
-
icon =
|
|
12728
|
-
compact =
|
|
12729
|
-
isActive =
|
|
12730
|
-
isExternalLink =
|
|
12731
|
-
onClickCallback =
|
|
13089
|
+
var ContextItem = function ContextItem(_ref18) {
|
|
13090
|
+
var _ref18$hasSubmenu = _ref18.hasSubmenu,
|
|
13091
|
+
hasSubmenu = _ref18$hasSubmenu === void 0 ? false : _ref18$hasSubmenu,
|
|
13092
|
+
_ref18$contextKey = _ref18.contextKey,
|
|
13093
|
+
contextKey = _ref18$contextKey === void 0 ? -1 : _ref18$contextKey,
|
|
13094
|
+
submenuOpen = _ref18.submenuOpen,
|
|
13095
|
+
menuOpen = _ref18.menuOpen,
|
|
13096
|
+
title = _ref18.title,
|
|
13097
|
+
href = _ref18.href,
|
|
13098
|
+
icon = _ref18.icon,
|
|
13099
|
+
compact = _ref18.compact,
|
|
13100
|
+
isActive = _ref18.isActive,
|
|
13101
|
+
isExternalLink = _ref18.isExternalLink,
|
|
13102
|
+
onClickCallback = _ref18.onClickCallback;
|
|
12732
13103
|
var internal = React__default.createElement(React__default.Fragment, null, React__default.createElement(ContextIcon$1, Object.assign({}, {
|
|
12733
13104
|
compact: compact
|
|
12734
13105
|
}), React__default.createElement(Icon, {
|
|
@@ -12905,27 +13276,27 @@ var useMenu = function useMenu(defaultMenuOpen, canAlwaysPin) {
|
|
|
12905
13276
|
};
|
|
12906
13277
|
};
|
|
12907
13278
|
|
|
12908
|
-
var _templateObject$
|
|
12909
|
-
var Submenu = styled.ul(_templateObject$
|
|
12910
|
-
var SubmenuHeader = styled.div(_templateObject2$
|
|
12911
|
-
var SubmenuItemTitle = styled.span(_templateObject3$
|
|
13279
|
+
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;
|
|
13280
|
+
var Submenu = styled.ul(_templateObject$1r || (_templateObject$1r = _taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n margin-left: 40px;\n padding: 0;\n\n"])));
|
|
13281
|
+
var SubmenuHeader = styled.div(_templateObject2$1g || (_templateObject2$1g = _taggedTemplateLiteralLoose(["\n display: block;\n height: 40px;\n margin-left: 40px;\n"])));
|
|
13282
|
+
var SubmenuItemTitle = styled.span(_templateObject3$16 || (_templateObject3$16 = _taggedTemplateLiteralLoose(["\n display: block;\n ", ";\n\n"])), function (_ref) {
|
|
12912
13283
|
var theme = _ref.theme;
|
|
12913
|
-
return theme && css(_templateObject4$
|
|
13284
|
+
return theme && css(_templateObject4$10 || (_templateObject4$10 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n ", "\n "])), theme.fontFamily.ui, theme.typography.global.mainMenu.subheader);
|
|
12914
13285
|
});
|
|
12915
|
-
var SubmenuItemLink = styled(Link)(_templateObject5$
|
|
12916
|
-
var ExternalIconWrapper$1 = styled.div(_templateObject6$
|
|
12917
|
-
var SubmenuItemAnchor = styled.a(_templateObject7$
|
|
12918
|
-
var SubmenuItem = styled.li(_templateObject8$
|
|
13286
|
+
var SubmenuItemLink = styled(Link)(_templateObject5$W || (_templateObject5$W = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n"])), resetButtonStyles);
|
|
13287
|
+
var ExternalIconWrapper$1 = styled.div(_templateObject6$H || (_templateObject6$H = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
|
|
13288
|
+
var SubmenuItemAnchor = styled.a(_templateObject7$E || (_templateObject7$E = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n"])), resetButtonStyles);
|
|
13289
|
+
var SubmenuItem = styled.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) {
|
|
12919
13290
|
var colors = _ref2.theme.colors;
|
|
12920
13291
|
return colors.divider;
|
|
12921
13292
|
}, SubmenuItemLink, SubmenuItemAnchor, function (_ref3) {
|
|
12922
13293
|
var theme = _ref3.theme,
|
|
12923
13294
|
isActive = _ref3.isActive;
|
|
12924
|
-
return theme && css(_templateObject9$
|
|
13295
|
+
return theme && 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 && css(_templateObject10$n || (_templateObject10$n = _taggedTemplateLiteralLoose(["\n &, &:hover {\n ", ";\n }\n "])), theme.typography.global.mainMenu.subItem.active));
|
|
12925
13296
|
});
|
|
12926
|
-
var SubmenuContainer = styled.div(_templateObject11$
|
|
13297
|
+
var SubmenuContainer = styled.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) {
|
|
12927
13298
|
var theme = _ref4.theme;
|
|
12928
|
-
return theme && css(_templateObject12$
|
|
13299
|
+
return theme && 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);
|
|
12929
13300
|
}, function (_ref5) {
|
|
12930
13301
|
var colors = _ref5.theme.colors;
|
|
12931
13302
|
return colors.divider;
|
|
@@ -13052,24 +13423,24 @@ var generateSubmenus = function generateSubmenus(submenu, onClickCallback) {
|
|
|
13052
13423
|
return output;
|
|
13053
13424
|
};
|
|
13054
13425
|
|
|
13055
|
-
var _templateObject$
|
|
13056
|
-
var Logo = styled(Link)(_templateObject$
|
|
13057
|
-
var LogoMark = styled.div(_templateObject2$
|
|
13058
|
-
var LogoType = styled.div(_templateObject3$
|
|
13059
|
-
var SVGObject = styled.object(_templateObject4$
|
|
13060
|
-
var SVGObjectText = styled.object(_templateObject5$
|
|
13061
|
-
var NavigationContainer = styled.div(_templateObject6$
|
|
13062
|
-
var MenuFooter = styled.div(_templateObject7$
|
|
13426
|
+
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;
|
|
13427
|
+
var Logo = styled(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"])));
|
|
13428
|
+
var LogoMark = styled.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"])));
|
|
13429
|
+
var LogoType = styled.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"])));
|
|
13430
|
+
var SVGObject = styled.object(_templateObject4$11 || (_templateObject4$11 = _taggedTemplateLiteralLoose([""])));
|
|
13431
|
+
var SVGObjectText = styled.object(_templateObject5$X || (_templateObject5$X = _taggedTemplateLiteralLoose(["\n max-width: 180px;\n"])));
|
|
13432
|
+
var NavigationContainer = styled.div(_templateObject6$I || (_templateObject6$I = _taggedTemplateLiteralLoose([""])));
|
|
13433
|
+
var MenuFooter = styled.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) {
|
|
13063
13434
|
var theme = _ref.theme;
|
|
13064
|
-
return theme && css(_templateObject8$
|
|
13435
|
+
return theme && css(_templateObject8$z || (_templateObject8$z = _taggedTemplateLiteralLoose(["\n ", "\n "])), theme.styles.global.mainMenu.footerBackground);
|
|
13065
13436
|
});
|
|
13066
|
-
var FooterItemContainer = styled.div(_templateObject9$
|
|
13067
|
-
var PushContainer = styled.div(_templateObject10$
|
|
13437
|
+
var FooterItemContainer = styled.div(_templateObject9$s || (_templateObject9$s = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n"])));
|
|
13438
|
+
var PushContainer = styled.div(_templateObject10$o || (_templateObject10$o = _taggedTemplateLiteralLoose(["\n position: relative;\n height: 100%;\n ", ";\n"])), function (_ref2) {
|
|
13068
13439
|
var theme = _ref2.theme,
|
|
13069
13440
|
isPinned = _ref2.isPinned;
|
|
13070
|
-
return theme && css(_templateObject11$
|
|
13441
|
+
return theme && css(_templateObject11$g || (_templateObject11$g = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), isPinned ? theme.dimensions.global.mainMenu.width.open : theme.dimensions.global.mainMenu.width.closed);
|
|
13071
13442
|
});
|
|
13072
|
-
var Container$
|
|
13443
|
+
var Container$W = styled.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) {
|
|
13073
13444
|
var theme = _ref3.theme,
|
|
13074
13445
|
open = _ref3.open,
|
|
13075
13446
|
desktopSize = _ref3.desktopSize;
|
|
@@ -13150,7 +13521,7 @@ var MainMenu = function MainMenu(_ref5) {
|
|
|
13150
13521
|
}, [checkedInItems, content]);
|
|
13151
13522
|
return React__default.createElement(PushContainer, {
|
|
13152
13523
|
isPinned: menuState.isMenuPinned
|
|
13153
|
-
}, ReactDom.createPortal(React__default.createElement(Container$
|
|
13524
|
+
}, ReactDom.createPortal(React__default.createElement(Container$W, {
|
|
13154
13525
|
open: menuState.isMenuOpen,
|
|
13155
13526
|
desktopSize: menuState.desktopSize,
|
|
13156
13527
|
onPointerEnter: menuState.isMenuPinned ? function () {} : autoMenuOpen,
|
|
@@ -13197,26 +13568,26 @@ var MainMenu = function MainMenu(_ref5) {
|
|
|
13197
13568
|
})) : null))), document.body));
|
|
13198
13569
|
};
|
|
13199
13570
|
|
|
13200
|
-
var _templateObject$
|
|
13201
|
-
var MetaConatiner = styled.div(_templateObject$
|
|
13202
|
-
var LabelTitle = styled.div(_templateObject2$
|
|
13571
|
+
var _templateObject$1t, _templateObject2$1i, _templateObject3$18, _templateObject4$12, _templateObject5$Y, _templateObject6$J, _templateObject7$G, _templateObject8$A, _templateObject9$t, _templateObject10$p, _templateObject11$h;
|
|
13572
|
+
var MetaConatiner = styled.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"])));
|
|
13573
|
+
var LabelTitle = styled.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) {
|
|
13203
13574
|
var theme = _ref.theme;
|
|
13204
13575
|
return theme.fontFamily.ui;
|
|
13205
13576
|
});
|
|
13206
|
-
var LabelContent = styled.div(_templateObject3$
|
|
13207
|
-
var LabelNotes = styled.div(_templateObject4
|
|
13577
|
+
var LabelContent = styled.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"])));
|
|
13578
|
+
var LabelNotes = styled.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) {
|
|
13208
13579
|
var theme = _ref2.theme;
|
|
13209
|
-
return theme && css(_templateObject5$
|
|
13580
|
+
return theme && css(_templateObject5$Y || (_templateObject5$Y = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.data);
|
|
13210
13581
|
});
|
|
13211
|
-
var TitleContainer = styled.div(_templateObject6$
|
|
13212
|
-
var Container$
|
|
13213
|
-
var TitleBox = styled.div(_templateObject8$
|
|
13214
|
-
var IconBox = styled.div(_templateObject9$
|
|
13215
|
-
var CopyTextBox = styled.pre(_templateObject10$
|
|
13582
|
+
var TitleContainer = styled.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"])));
|
|
13583
|
+
var Container$X = styled.div(_templateObject7$G || (_templateObject7$G = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n"])));
|
|
13584
|
+
var TitleBox = styled.div(_templateObject8$A || (_templateObject8$A = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
13585
|
+
var IconBox = styled.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);
|
|
13586
|
+
var CopyTextBox = styled.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) {
|
|
13216
13587
|
var theme = _ref3.theme;
|
|
13217
13588
|
return theme.fontFamily.data;
|
|
13218
13589
|
});
|
|
13219
|
-
var CopyBox = styled.div(_templateObject11$
|
|
13590
|
+
var CopyBox = styled.div(_templateObject11$h || (_templateObject11$h = _taggedTemplateLiteralLoose(["\n"])));
|
|
13220
13591
|
|
|
13221
13592
|
var UserDrawerMeta = function UserDrawerMeta(_ref4) {
|
|
13222
13593
|
var item = _ref4.item,
|
|
@@ -13261,7 +13632,7 @@ var UserDrawerMeta = function UserDrawerMeta(_ref4) {
|
|
|
13261
13632
|
var onLeaveMeatInfo = useCallback(function () {
|
|
13262
13633
|
setOnHoverColorValue('dimmed');
|
|
13263
13634
|
}, []);
|
|
13264
|
-
return React__default.createElement(Fragment, null, title !== '' && React__default.createElement(Container$
|
|
13635
|
+
return React__default.createElement(Fragment, null, title !== '' && React__default.createElement(Container$X, {
|
|
13265
13636
|
onClick: onUserDrawerMetaClick
|
|
13266
13637
|
}, React__default.createElement(MetaConatiner, null, React__default.createElement(TitleBox, null, React__default.createElement(TitleContainer, null, React__default.createElement(Icon, {
|
|
13267
13638
|
icon: icon,
|
|
@@ -13286,20 +13657,20 @@ var UserDrawerMeta = function UserDrawerMeta(_ref4) {
|
|
|
13286
13657
|
}, notes) : null)));
|
|
13287
13658
|
};
|
|
13288
13659
|
|
|
13289
|
-
var _templateObject$
|
|
13290
|
-
var Container$
|
|
13660
|
+
var _templateObject$1u, _templateObject2$1j, _templateObject3$19, _templateObject4$13;
|
|
13661
|
+
var Container$Y = styled.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) {
|
|
13291
13662
|
var theme = _ref.theme;
|
|
13292
13663
|
return theme.colors.divider;
|
|
13293
13664
|
});
|
|
13294
|
-
var ColumnContainer = styled.div(_templateObject2$
|
|
13295
|
-
var Title$8 = styled.div(_templateObject3$
|
|
13665
|
+
var ColumnContainer = styled.div(_templateObject2$1j || (_templateObject2$1j = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n padding-left: 14px;\n align-items: flex-start;\n"])));
|
|
13666
|
+
var Title$8 = styled.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) {
|
|
13296
13667
|
var theme = _ref2.theme;
|
|
13297
13668
|
return theme.fontFamily.ui;
|
|
13298
13669
|
}, function (_ref3) {
|
|
13299
13670
|
var theme = _ref3.theme;
|
|
13300
13671
|
return theme.typography.global.mainMenu.subheader.color;
|
|
13301
13672
|
});
|
|
13302
|
-
var SubTitle$1 = styled.div(_templateObject4$
|
|
13673
|
+
var SubTitle$1 = styled.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) {
|
|
13303
13674
|
var theme = _ref4.theme;
|
|
13304
13675
|
return theme.fontFamily.ui;
|
|
13305
13676
|
}, function (_ref5) {
|
|
@@ -13314,7 +13685,7 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref6) {
|
|
|
13314
13685
|
subTitle = _ref6.subTitle,
|
|
13315
13686
|
_ref6$onClickCallback = _ref6.onClickCallback,
|
|
13316
13687
|
onClickCallback = _ref6$onClickCallback === void 0 ? function () {} : _ref6$onClickCallback;
|
|
13317
|
-
return React__default.createElement(Container$
|
|
13688
|
+
return React__default.createElement(Container$Y, {
|
|
13318
13689
|
onClick: onClickCallback
|
|
13319
13690
|
}, React__default.createElement(Icon, {
|
|
13320
13691
|
icon: icon,
|
|
@@ -13323,28 +13694,28 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref6) {
|
|
|
13323
13694
|
}), React__default.createElement(ColumnContainer, null, React__default.createElement(Title$8, null, title), React__default.createElement(SubTitle$1, null, subTitle)));
|
|
13324
13695
|
};
|
|
13325
13696
|
|
|
13326
|
-
var _templateObject$
|
|
13327
|
-
var DrawerTop = styled.div(_templateObject$
|
|
13328
|
-
var DrawerBottom = styled.div(_templateObject2$
|
|
13697
|
+
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;
|
|
13698
|
+
var DrawerTop = styled.div(_templateObject$1v || (_templateObject$1v = _taggedTemplateLiteralLoose([""])));
|
|
13699
|
+
var DrawerBottom = styled.div(_templateObject2$1k || (_templateObject2$1k = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref) {
|
|
13329
13700
|
var theme = _ref.theme;
|
|
13330
|
-
return css(_templateObject3$
|
|
13701
|
+
return 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);
|
|
13331
13702
|
});
|
|
13332
|
-
var DrawerHeader = styled.h2(_templateObject4$
|
|
13703
|
+
var DrawerHeader = styled.h2(_templateObject4$14 || (_templateObject4$14 = _taggedTemplateLiteralLoose(["\n ", ";\n padding: 0;\n margin: 0 0 5px;\n"])), function (_ref2) {
|
|
13333
13704
|
var theme = _ref2.theme;
|
|
13334
13705
|
return theme.typography.global.mainMenu.subheader;
|
|
13335
13706
|
});
|
|
13336
|
-
var CurrentUser = styled.div(_templateObject5$
|
|
13707
|
+
var CurrentUser = styled.div(_templateObject5$Z || (_templateObject5$Z = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 15px;\n\n ", ";\n"])), function (_ref3) {
|
|
13337
13708
|
var theme = _ref3.theme;
|
|
13338
|
-
return css(_templateObject6$
|
|
13709
|
+
return css(_templateObject6$K || (_templateObject6$K = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n ", ";\n "])), theme.styles.global.mainMenu.lines.backgroundColor, theme.typography.global.mainMenu.identity);
|
|
13339
13710
|
});
|
|
13340
|
-
var UserOptions = styled.div(_templateObject7$
|
|
13711
|
+
var UserOptions = styled.div(_templateObject7$H || (_templateObject7$H = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 10px 20px;\n ", ";\n\n"])), function (_ref4) {
|
|
13341
13712
|
var theme = _ref4.theme;
|
|
13342
|
-
return css(_templateObject8$
|
|
13713
|
+
return css(_templateObject8$B || (_templateObject8$B = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n "])), theme.styles.global.mainMenu.lines.backgroundColor);
|
|
13343
13714
|
});
|
|
13344
|
-
var Logout = styled.div(_templateObject9$
|
|
13345
|
-
var LinkMenu = styled.ul(_templateObject10$
|
|
13346
|
-
var LinkMenuItem = styled.li(_templateObject11$
|
|
13347
|
-
var IconWrapperFooter = styled.div(_templateObject12$
|
|
13715
|
+
var Logout = styled.div(_templateObject9$u || (_templateObject9$u = _taggedTemplateLiteralLoose(["\n padding: 0 20px;\n"])));
|
|
13716
|
+
var LinkMenu = styled.ul(_templateObject10$q || (_templateObject10$q = _taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 12px 0 0 0;\n list-style: none;\n"])));
|
|
13717
|
+
var LinkMenuItem = styled.li(_templateObject11$i || (_templateObject11$i = _taggedTemplateLiteralLoose(["\n padding: 10px 0;\n"])));
|
|
13718
|
+
var IconWrapperFooter = styled.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"])));
|
|
13348
13719
|
var LinkMenuItemA = styled(Link)(_templateObject13$c || (_templateObject13$c = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n width: 100%;\n\n ", ";\n\n ", ";\n"])), resetButtonStyles, function (_ref5) {
|
|
13349
13720
|
var theme = _ref5.theme;
|
|
13350
13721
|
return 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);
|
|
@@ -13484,37 +13855,37 @@ var UserMenu = function UserMenu(_ref12) {
|
|
|
13484
13855
|
}, title)) : null));
|
|
13485
13856
|
};
|
|
13486
13857
|
|
|
13487
|
-
var _templateObject$
|
|
13488
|
-
var Container$
|
|
13489
|
-
var ImgWrapper = styled.div(_templateObject2$
|
|
13490
|
-
var EmptyImg = styled.div(_templateObject3$
|
|
13491
|
-
var Image$2 = styled.div(_templateObject4$
|
|
13858
|
+
var _templateObject$1w, _templateObject2$1l, _templateObject3$1b, _templateObject4$15, _templateObject5$_, _templateObject6$L, _templateObject7$I, _templateObject8$C;
|
|
13859
|
+
var Container$Z = styled.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"])));
|
|
13860
|
+
var ImgWrapper = styled.div(_templateObject2$1l || (_templateObject2$1l = _taggedTemplateLiteralLoose(["\n border-radius: 5px;\n overflow: hidden;\n height: 40px;\n width: 40px;\n flex-shrink: 0;\n"])));
|
|
13861
|
+
var EmptyImg = styled.div(_templateObject3$1b || (_templateObject3$1b = _taggedTemplateLiteralLoose(["\n background-color: var(--grey-5);\n width: 100%;\n height: 100%;\n"])));
|
|
13862
|
+
var Image$2 = styled.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) {
|
|
13492
13863
|
return p.image;
|
|
13493
13864
|
}, function (p) {
|
|
13494
13865
|
return p.image ? 'block' : 'none';
|
|
13495
13866
|
});
|
|
13496
|
-
var InfoContainer = styled.div(_templateObject5$
|
|
13497
|
-
var Title$9 = styled.div(_templateObject6$
|
|
13498
|
-
var Message = styled.div(_templateObject7$
|
|
13499
|
-
var TimeMsg = styled.div(_templateObject8$
|
|
13867
|
+
var InfoContainer = styled.div(_templateObject5$_ || (_templateObject5$_ = _taggedTemplateLiteralLoose(["\n margin-left: 20px;\n"])));
|
|
13868
|
+
var Title$9 = styled.div(_templateObject6$L || (_templateObject6$L = _taggedTemplateLiteralLoose(["\n font-size: 16px;\n font-weight: 500;\n color: var(--grey-11);\n"])));
|
|
13869
|
+
var Message = styled.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"])));
|
|
13870
|
+
var TimeMsg = styled.div(_templateObject8$C || (_templateObject8$C = _taggedTemplateLiteralLoose(["\n font-size: 13px;\n font-weight: 500;\n color: var(--grey-12);\n margin-top: 15px;\n"])));
|
|
13500
13871
|
|
|
13501
13872
|
var NotificationItem = function NotificationItem(_ref) {
|
|
13502
13873
|
var imgUrl = _ref.imgUrl,
|
|
13503
13874
|
title = _ref.title,
|
|
13504
13875
|
message = _ref.message,
|
|
13505
13876
|
time = _ref.time;
|
|
13506
|
-
return React__default.createElement(Container$
|
|
13877
|
+
return React__default.createElement(Container$Z, null, React__default.createElement(ImgWrapper, null, imgUrl ? React__default.createElement(Image$2, {
|
|
13507
13878
|
image: imgUrl
|
|
13508
13879
|
}) : 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)));
|
|
13509
13880
|
};
|
|
13510
13881
|
|
|
13511
|
-
var _templateObject$
|
|
13512
|
-
var Container$
|
|
13513
|
-
var StatusContainer = styled.h2(_templateObject2$
|
|
13882
|
+
var _templateObject$1x, _templateObject2$1m, _templateObject3$1c;
|
|
13883
|
+
var Container$_ = styled.div(_templateObject$1x || (_templateObject$1x = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
13884
|
+
var StatusContainer = styled.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) {
|
|
13514
13885
|
var theme = _ref.theme;
|
|
13515
13886
|
return theme.colors.divider;
|
|
13516
13887
|
});
|
|
13517
|
-
var NotificationWrapper = styled.div(_templateObject3$
|
|
13888
|
+
var NotificationWrapper = styled.div(_templateObject3$1c || (_templateObject3$1c = _taggedTemplateLiteralLoose(["\n border-bottom: ", " 1px solid;\n"])), function (_ref2) {
|
|
13518
13889
|
var colors = _ref2.theme.colors;
|
|
13519
13890
|
return colors.divider;
|
|
13520
13891
|
});
|
|
@@ -13538,21 +13909,21 @@ var NotificationsHistory = function NotificationsHistory(_ref3) {
|
|
|
13538
13909
|
unreadNotificationsText = _ref3$unreadNotificat === void 0 ? 'Read' : _ref3$unreadNotificat;
|
|
13539
13910
|
|
|
13540
13911
|
if (read.length === 0 && unread.length === 0) {
|
|
13541
|
-
return React__default.createElement(Container$
|
|
13912
|
+
return React__default.createElement(Container$_, null, React__default.createElement(StatusContainer, null, noNotificationsText));
|
|
13542
13913
|
}
|
|
13543
13914
|
|
|
13544
|
-
return React__default.createElement(Container$
|
|
13915
|
+
return React__default.createElement(Container$_, null, unread && React__default.createElement(Fragment, null, React__default.createElement(StatusContainer, null, readNotificationsText), renderNotifications(unread, 'unread')), read && React__default.createElement(Fragment, null, React__default.createElement(StatusContainer, null, unreadNotificationsText), renderNotifications(read, 'read')));
|
|
13545
13916
|
};
|
|
13546
13917
|
|
|
13547
|
-
var _templateObject$
|
|
13548
|
-
var Container
|
|
13918
|
+
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;
|
|
13919
|
+
var Container$$ = styled.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) {
|
|
13549
13920
|
var theme = _ref.theme,
|
|
13550
13921
|
colors = _ref.theme.colors;
|
|
13551
|
-
return colors && css(_templateObject2$
|
|
13922
|
+
return colors && 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);
|
|
13552
13923
|
});
|
|
13553
|
-
var SearchBar = styled.div(_templateObject3$
|
|
13554
|
-
var IconWrapper$4 = styled.div(_templateObject4$
|
|
13555
|
-
var SearchInput = styled.input(_templateObject5
|
|
13924
|
+
var SearchBar = styled.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"])));
|
|
13925
|
+
var IconWrapper$4 = styled.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"])));
|
|
13926
|
+
var SearchInput = styled.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) {
|
|
13556
13927
|
var theme = _ref2.theme;
|
|
13557
13928
|
return theme.fontFamily.data;
|
|
13558
13929
|
}, function (_ref3) {
|
|
@@ -13562,19 +13933,19 @@ var SearchInput = styled.input(_templateObject5$Y || (_templateObject5$Y = _tagg
|
|
|
13562
13933
|
var typography = _ref4.theme.typography;
|
|
13563
13934
|
return typography.global.topBar.search.placeholder;
|
|
13564
13935
|
});
|
|
13565
|
-
var ButtonArea = styled.div(_templateObject6$
|
|
13936
|
+
var ButtonArea = styled.div(_templateObject6$M || (_templateObject6$M = _taggedTemplateLiteralLoose(["\n height: inherit;\n padding-right: 10px;\n display: flex;\n"])));
|
|
13566
13937
|
var DrawerToggle = styled.button.attrs({
|
|
13567
13938
|
type: 'button'
|
|
13568
|
-
})(_templateObject7$
|
|
13939
|
+
})(_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) {
|
|
13569
13940
|
var theme = _ref5.theme;
|
|
13570
|
-
return css(_templateObject8$
|
|
13941
|
+
return 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);
|
|
13571
13942
|
}, function (_ref6) {
|
|
13572
13943
|
var isActive = _ref6.isActive,
|
|
13573
13944
|
theme = _ref6.theme;
|
|
13574
|
-
return isActive && css(_templateObject9$
|
|
13945
|
+
return isActive && css(_templateObject9$v || (_templateObject9$v = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: ", ";\n }\n "])), theme.colors.menu.active);
|
|
13575
13946
|
});
|
|
13576
|
-
var DrawerPortalWrapper = styled.div(_templateObject10$
|
|
13577
|
-
var Drawer = styled.div(_templateObject11$
|
|
13947
|
+
var DrawerPortalWrapper = styled.div(_templateObject10$r || (_templateObject10$r = _taggedTemplateLiteralLoose([""])));
|
|
13948
|
+
var Drawer = styled.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) {
|
|
13578
13949
|
var theme = _ref7.theme;
|
|
13579
13950
|
return theme.fontFamily.ui;
|
|
13580
13951
|
}, function (_ref8) {
|
|
@@ -13588,7 +13959,7 @@ var Drawer = styled.div(_templateObject11$i || (_templateObject11$i = _taggedTem
|
|
|
13588
13959
|
return baseWidth ? baseWidth : "200px";
|
|
13589
13960
|
}, function (_ref11) {
|
|
13590
13961
|
var theme = _ref11.theme;
|
|
13591
|
-
return css(_templateObject12$
|
|
13962
|
+
return 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);
|
|
13592
13963
|
}, function (_ref12) {
|
|
13593
13964
|
var isOpen = _ref12.isOpen;
|
|
13594
13965
|
return isOpen && css(_templateObject13$d || (_templateObject13$d = _taggedTemplateLiteralLoose(["\n right: 0;\n opacity: 1;\n visibility: visible;\n "])));
|
|
@@ -13661,7 +14032,7 @@ var TopBar = function TopBar(_ref13) {
|
|
|
13661
14032
|
});
|
|
13662
14033
|
};
|
|
13663
14034
|
|
|
13664
|
-
return React__default.createElement(Container
|
|
14035
|
+
return React__default.createElement(Container$$, null, hasSearch ? React__default.createElement(SearchBar, null, React__default.createElement(IconWrapper$4, null, React__default.createElement(Icon, {
|
|
13665
14036
|
icon: 'Search',
|
|
13666
14037
|
size: 18,
|
|
13667
14038
|
color: 'dimmed'
|
|
@@ -13727,28 +14098,8 @@ var TopBar = function TopBar(_ref13) {
|
|
|
13727
14098
|
}, customDrawer.customComponent)), document.body));
|
|
13728
14099
|
};
|
|
13729
14100
|
|
|
13730
|
-
var
|
|
13731
|
-
|
|
13732
|
-
setSelected: function setSelected() {}
|
|
13733
|
-
});
|
|
13734
|
-
|
|
13735
|
-
var Tabs = function Tabs(_ref) {
|
|
13736
|
-
var children = _ref.children;
|
|
13737
|
-
|
|
13738
|
-
var _useState = useState(''),
|
|
13739
|
-
selected = _useState[0],
|
|
13740
|
-
setSelected = _useState[1];
|
|
13741
|
-
|
|
13742
|
-
return React__default.createElement(TabContext.Provider, {
|
|
13743
|
-
value: {
|
|
13744
|
-
selected: selected,
|
|
13745
|
-
setSelected: setSelected
|
|
13746
|
-
}
|
|
13747
|
-
}, children);
|
|
13748
|
-
};
|
|
13749
|
-
|
|
13750
|
-
var _templateObject$1t;
|
|
13751
|
-
var TabListWrapper = styled.div(_templateObject$1t || (_templateObject$1t = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n"])));
|
|
14101
|
+
var _templateObject$1z;
|
|
14102
|
+
var TabListWrapper = styled.div(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n"])));
|
|
13752
14103
|
|
|
13753
14104
|
var TabList = function TabList(_ref) {
|
|
13754
14105
|
var children = _ref.children,
|
|
@@ -13765,11 +14116,11 @@ var TabList = function TabList(_ref) {
|
|
|
13765
14116
|
|
|
13766
14117
|
var _excluded$G = ["children", "tabFor", "onClick"];
|
|
13767
14118
|
|
|
13768
|
-
var _templateObject$
|
|
13769
|
-
var TabComponent = styled.div(_templateObject$
|
|
13770
|
-
var TabLabel = styled.label(_templateObject2$
|
|
14119
|
+
var _templateObject$1A, _templateObject2$1o, _templateObject3$1e;
|
|
14120
|
+
var TabComponent = styled.div(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteralLoose(["\n margin-right: 39px;\n display: flex;\n align-items: center;\n line-height: 20px;\n"])));
|
|
14121
|
+
var TabLabel = styled.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) {
|
|
13771
14122
|
var theme = _ref.theme;
|
|
13772
|
-
return css(_templateObject3$
|
|
14123
|
+
return css(_templateObject3$1e || (_templateObject3$1e = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
|
|
13773
14124
|
}, function (_ref2) {
|
|
13774
14125
|
var active = _ref2.active;
|
|
13775
14126
|
return active ? '600' : '500';
|
|
@@ -13804,8 +14155,8 @@ var Tab = function Tab(_ref5) {
|
|
|
13804
14155
|
|
|
13805
14156
|
var _excluded$H = ["children", "tabId"];
|
|
13806
14157
|
|
|
13807
|
-
var _templateObject$
|
|
13808
|
-
var Container$
|
|
14158
|
+
var _templateObject$1B;
|
|
14159
|
+
var Container$10 = styled.div(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteralLoose(["\n"])));
|
|
13809
14160
|
|
|
13810
14161
|
var TabContent = function TabContent(_ref) {
|
|
13811
14162
|
var children = _ref.children,
|
|
@@ -13815,20 +14166,20 @@ var TabContent = function TabContent(_ref) {
|
|
|
13815
14166
|
var _useContext = useContext(TabContext),
|
|
13816
14167
|
selected = _useContext.selected;
|
|
13817
14168
|
|
|
13818
|
-
return selected === tabId ? React__default.createElement(Container$
|
|
14169
|
+
return selected === tabId ? React__default.createElement(Container$10, Object.assign({}, props), children) : null;
|
|
13819
14170
|
};
|
|
13820
14171
|
|
|
13821
14172
|
var _excluded$I = ["tabFor", "icon", "closeId", "counter", "status"];
|
|
13822
14173
|
|
|
13823
|
-
var _templateObject$
|
|
13824
|
-
var Container
|
|
13825
|
-
var LinkTab = styled.div(_templateObject2$
|
|
14174
|
+
var _templateObject$1C, _templateObject2$1p, _templateObject3$1f, _templateObject4$17;
|
|
14175
|
+
var Container$11 = styled.button(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteralLoose(["\n ", "\n flex-basis: auto;\n flex-grow: 1;\n"])), resetButtonStyles);
|
|
14176
|
+
var LinkTab = styled.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) {
|
|
13826
14177
|
var theme = _ref.theme;
|
|
13827
|
-
return css(_templateObject3$
|
|
14178
|
+
return 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);
|
|
13828
14179
|
}, function (_ref2) {
|
|
13829
14180
|
var isActive = _ref2.isActive,
|
|
13830
14181
|
theme = _ref2.theme;
|
|
13831
|
-
return isActive && css(_templateObject4$
|
|
14182
|
+
return isActive && 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);
|
|
13832
14183
|
});
|
|
13833
14184
|
|
|
13834
14185
|
var MobileTab = function MobileTab(_ref3) {
|
|
@@ -13847,7 +14198,7 @@ var MobileTab = function MobileTab(_ref3) {
|
|
|
13847
14198
|
var newValue = selected === tabId ? closeId : tabId;
|
|
13848
14199
|
setSelected(newValue);
|
|
13849
14200
|
}, [closeId, selected, setSelected]);
|
|
13850
|
-
return React__default.createElement(Container
|
|
14201
|
+
return React__default.createElement(Container$11, Object.assign({}, props, {
|
|
13851
14202
|
onClick: function onClick() {
|
|
13852
14203
|
return onChangeTab(tabFor);
|
|
13853
14204
|
}
|
|
@@ -13862,23 +14213,23 @@ var MobileTab = function MobileTab(_ref3) {
|
|
|
13862
14213
|
|
|
13863
14214
|
var _excluded$J = ["icon", "title", "subtitle", "tabFor"];
|
|
13864
14215
|
|
|
13865
|
-
var _templateObject$
|
|
13866
|
-
var Container$
|
|
14216
|
+
var _templateObject$1D, _templateObject2$1q, _templateObject3$1g, _templateObject4$18, _templateObject5$10, _templateObject6$N;
|
|
14217
|
+
var Container$12 = styled.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) {
|
|
13867
14218
|
var active = _ref.active;
|
|
13868
|
-
return active ? css(_templateObject2$
|
|
14219
|
+
return active ? css(_templateObject2$1q || (_templateObject2$1q = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid var(--primary-11);\n "]))) : css(_templateObject3$1g || (_templateObject3$1g = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid transparent;\n "])));
|
|
13869
14220
|
}, IconWrapper);
|
|
13870
|
-
var Title$a = styled.div(_templateObject4$
|
|
14221
|
+
var Title$a = styled.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) {
|
|
13871
14222
|
var theme = _ref2.theme;
|
|
13872
14223
|
return theme.fontFamily.ui;
|
|
13873
14224
|
}, function (_ref3) {
|
|
13874
14225
|
var active = _ref3.active;
|
|
13875
14226
|
return active ? 'var(--primary-11)' : 'var(--grey-11)';
|
|
13876
14227
|
});
|
|
13877
|
-
var SubTitle$2 = styled.div(_templateObject5$
|
|
14228
|
+
var SubTitle$2 = styled.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) {
|
|
13878
14229
|
var theme = _ref4.theme;
|
|
13879
14230
|
return theme.fontFamily.data;
|
|
13880
14231
|
});
|
|
13881
|
-
var TextGroup$1 = styled.div(_templateObject6$
|
|
14232
|
+
var TextGroup$1 = styled.div(_templateObject6$N || (_templateObject6$N = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n margin-right: 20px;\n"])));
|
|
13882
14233
|
|
|
13883
14234
|
var TabWithIcon = function TabWithIcon(_ref5) {
|
|
13884
14235
|
var icon = _ref5.icon,
|
|
@@ -13895,7 +14246,7 @@ var TabWithIcon = function TabWithIcon(_ref5) {
|
|
|
13895
14246
|
setSelected(tabId);
|
|
13896
14247
|
}, [setSelected]);
|
|
13897
14248
|
var active = selected === tabFor;
|
|
13898
|
-
return React__default.createElement(Container$
|
|
14249
|
+
return React__default.createElement(Container$12, Object.assign({}, {
|
|
13899
14250
|
active: active
|
|
13900
14251
|
}, props, {
|
|
13901
14252
|
onClick: function onClick() {
|
|
@@ -13912,9 +14263,9 @@ var TabWithIcon = function TabWithIcon(_ref5) {
|
|
|
13912
14263
|
}), title), subtitle && React__default.createElement(SubTitle$2, null, subtitle)));
|
|
13913
14264
|
};
|
|
13914
14265
|
|
|
13915
|
-
var _templateObject$
|
|
13916
|
-
var Container$
|
|
13917
|
-
var TabListWrapper$1 = styled.div(_templateObject2$
|
|
14266
|
+
var _templateObject$1E, _templateObject2$1r;
|
|
14267
|
+
var Container$13 = styled.div(_templateObject$1E || (_templateObject$1E = _taggedTemplateLiteralLoose([""])));
|
|
14268
|
+
var TabListWrapper$1 = styled.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) {
|
|
13918
14269
|
var paddingLeft = _ref.paddingLeft;
|
|
13919
14270
|
return paddingLeft ? paddingLeft : '87px';
|
|
13920
14271
|
});
|
|
@@ -13923,7 +14274,7 @@ var TabsWithIconBar = function TabsWithIconBar(_ref2) {
|
|
|
13923
14274
|
var defaultTabId = _ref2.defaultTabId,
|
|
13924
14275
|
tabList = _ref2.tabList,
|
|
13925
14276
|
paddingLeft = _ref2.paddingLeft;
|
|
13926
|
-
return React__default.createElement(Container$
|
|
14277
|
+
return React__default.createElement(Container$13, null, React__default.createElement(Tabs, null, React__default.createElement(TabListWrapper$1, Object.assign({}, {
|
|
13927
14278
|
paddingLeft: paddingLeft
|
|
13928
14279
|
}), React__default.createElement(TabList, Object.assign({}, {
|
|
13929
14280
|
defaultTabId: defaultTabId
|
|
@@ -13952,13 +14303,13 @@ var TabsWithIconBar = function TabsWithIconBar(_ref2) {
|
|
|
13952
14303
|
|
|
13953
14304
|
var _excluded$K = ["closeId", "closeText"];
|
|
13954
14305
|
|
|
13955
|
-
var _templateObject$
|
|
13956
|
-
var StyledButton$7 = styled.button(_templateObject$
|
|
14306
|
+
var _templateObject$1F, _templateObject2$1s, _templateObject3$1h, _templateObject4$19;
|
|
14307
|
+
var StyledButton$7 = styled.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) {
|
|
13957
14308
|
var theme = _ref.theme;
|
|
13958
|
-
return css(_templateObject2$
|
|
14309
|
+
return 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);
|
|
13959
14310
|
}, MOBILE_CLOSE_HEIGHT);
|
|
13960
|
-
var IconContainer$2 = styled.div(_templateObject3$
|
|
13961
|
-
var TextWrapper$1 = styled.div(_templateObject4$
|
|
14311
|
+
var IconContainer$2 = styled.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"])));
|
|
14312
|
+
var TextWrapper$1 = styled.div(_templateObject4$19 || (_templateObject4$19 = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n"])));
|
|
13962
14313
|
|
|
13963
14314
|
var CloseButton$1 = function CloseButton(_ref2) {
|
|
13964
14315
|
var closeId = _ref2.closeId,
|
|
@@ -13980,9 +14331,9 @@ var CloseButton$1 = function CloseButton(_ref2) {
|
|
|
13980
14331
|
})), React__default.createElement(TextWrapper$1, null, closeText));
|
|
13981
14332
|
};
|
|
13982
14333
|
|
|
13983
|
-
var _templateObject$
|
|
13984
|
-
var Container$
|
|
13985
|
-
var ContentWrapper = styled.div(_templateObject2$
|
|
14334
|
+
var _templateObject$1G, _templateObject2$1t;
|
|
14335
|
+
var Container$14 = styled.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);
|
|
14336
|
+
var ContentWrapper = styled.div(_templateObject2$1t || (_templateObject2$1t = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n left: 0;\n height: 100%;\n width: 100%;\n"])));
|
|
13986
14337
|
|
|
13987
14338
|
var MobileNavbarContent = function MobileNavbarContent(_ref) {
|
|
13988
14339
|
var closeId = _ref.closeId,
|
|
@@ -13991,14 +14342,14 @@ var MobileNavbarContent = function MobileNavbarContent(_ref) {
|
|
|
13991
14342
|
var _useContext = useContext(TabContext),
|
|
13992
14343
|
selected = _useContext.selected;
|
|
13993
14344
|
|
|
13994
|
-
return selected === closeId ? null : React__default.createElement(Container$
|
|
14345
|
+
return selected === closeId ? null : React__default.createElement(Container$14, null, React__default.createElement(ContentWrapper, null, children));
|
|
13995
14346
|
};
|
|
13996
14347
|
|
|
13997
|
-
var _templateObject$
|
|
13998
|
-
var Container$
|
|
13999
|
-
var ItemWrapper = styled.div(_templateObject2$
|
|
14348
|
+
var _templateObject$1H, _templateObject2$1u, _templateObject3$1i;
|
|
14349
|
+
var Container$15 = styled.div(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteralLoose([""])));
|
|
14350
|
+
var ItemWrapper = styled.div(_templateObject2$1u || (_templateObject2$1u = _taggedTemplateLiteralLoose(["\n padding: 14px 0;\n ", ";\n"])), function (_ref) {
|
|
14000
14351
|
var theme = _ref.theme;
|
|
14001
|
-
return css(_templateObject3$
|
|
14352
|
+
return css(_templateObject3$1i || (_templateObject3$1i = _taggedTemplateLiteralLoose(["\n border-bottom: 1px solid ", "\n "])), theme.colors.divider);
|
|
14002
14353
|
});
|
|
14003
14354
|
|
|
14004
14355
|
var MobileMenu = function MobileMenu(_ref2) {
|
|
@@ -14041,7 +14392,7 @@ var MobileMenu = function MobileMenu(_ref2) {
|
|
|
14041
14392
|
var handleCloseMenu = useCallback(function () {
|
|
14042
14393
|
setSelected(closeId);
|
|
14043
14394
|
}, [closeId, setSelected]);
|
|
14044
|
-
return React__default.createElement(Container$
|
|
14395
|
+
return React__default.createElement(Container$15, null, content.items.map(function (item, key) {
|
|
14045
14396
|
return React__default.createElement(ItemWrapper, {
|
|
14046
14397
|
key: key,
|
|
14047
14398
|
"data-key": key
|
|
@@ -14069,10 +14420,10 @@ var MobileMenu = function MobileMenu(_ref2) {
|
|
|
14069
14420
|
})));
|
|
14070
14421
|
};
|
|
14071
14422
|
|
|
14072
|
-
var _templateObject$
|
|
14073
|
-
var Logo$1 = styled(Link)(_templateObject$
|
|
14074
|
-
var LogoMark$1 = styled.div(_templateObject2$
|
|
14075
|
-
var SVGObject$1 = styled.object(_templateObject3$
|
|
14423
|
+
var _templateObject$1I, _templateObject2$1v, _templateObject3$1j;
|
|
14424
|
+
var Logo$1 = styled(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);
|
|
14425
|
+
var LogoMark$1 = styled.div(_templateObject2$1v || (_templateObject2$1v = _taggedTemplateLiteralLoose(["\n margin-right: 15px;\n"])));
|
|
14426
|
+
var SVGObject$1 = styled.object(_templateObject3$1j || (_templateObject3$1j = _taggedTemplateLiteralLoose([""])));
|
|
14076
14427
|
|
|
14077
14428
|
var MobileLogoLink = function MobileLogoLink(_ref) {
|
|
14078
14429
|
var _ref$home = _ref.home,
|
|
@@ -14096,8 +14447,8 @@ var MobileLogoLink = function MobileLogoLink(_ref) {
|
|
|
14096
14447
|
|
|
14097
14448
|
var _excluded$L = ["closeId", "hasLanguage", "hasLogout", "logoutLink", "hasCurrentUser", "userSubmenu", "userDrawerBespoke", "loggedInUser", "onLogout", "onLanguageToggle"];
|
|
14098
14449
|
|
|
14099
|
-
var _templateObject$
|
|
14100
|
-
var Container$
|
|
14450
|
+
var _templateObject$1J;
|
|
14451
|
+
var Container$16 = styled.div(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteralLoose(["\n background: ", ";\n z-index: 100;\n display: flex;\n flex-direction: column;\n"])), function (_ref) {
|
|
14101
14452
|
var theme = _ref.theme;
|
|
14102
14453
|
return theme.styles.global.mainMenu.background;
|
|
14103
14454
|
});
|
|
@@ -14121,7 +14472,7 @@ var MobileUserMenu = function MobileUserMenu(_ref2) {
|
|
|
14121
14472
|
var handleCloseMenu = useCallback(function () {
|
|
14122
14473
|
setSelected(closeId);
|
|
14123
14474
|
}, [closeId, setSelected]);
|
|
14124
|
-
return React__default.createElement(Container$
|
|
14475
|
+
return React__default.createElement(Container$16, null, React__default.createElement(UserMenu, Object.assign({}, _extends({
|
|
14125
14476
|
hasLanguage: hasLanguage,
|
|
14126
14477
|
hasLogout: hasLogout,
|
|
14127
14478
|
logoutLink: logoutLink,
|
|
@@ -14138,17 +14489,17 @@ var MobileUserMenu = function MobileUserMenu(_ref2) {
|
|
|
14138
14489
|
|
|
14139
14490
|
var _excluded$M = ["content", "home", "logoMark", "supportUrl", "defaultMenuOpen", "closeText", "hasLanguage", "hasLogout", "logoutLink", "hasCurrentUser", "hasNotifications", "userSubmenu", "userDrawerBespoke", "loggedInUser", "notificationsHistory", "customDrawer", "onLogout", "onLanguageToggle"];
|
|
14140
14491
|
|
|
14141
|
-
var _templateObject$
|
|
14492
|
+
var _templateObject$1K, _templateObject2$1w;
|
|
14142
14493
|
var CLOSE_ID = 'closeMenu';
|
|
14143
14494
|
var NOTI_TAB = 'notifications';
|
|
14144
14495
|
var USER_TAB = 'user';
|
|
14145
14496
|
var MENU_TAB = 'menu';
|
|
14146
14497
|
var CUSTOM_TAB = 'custom';
|
|
14147
|
-
var Container$
|
|
14498
|
+
var Container$17 = styled.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) {
|
|
14148
14499
|
var theme = _ref.theme;
|
|
14149
14500
|
return theme.styles.global.mainMenu.background.backgroundColor;
|
|
14150
14501
|
});
|
|
14151
|
-
var HeaderContainer = styled.div(_templateObject2$
|
|
14502
|
+
var HeaderContainer = styled.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) {
|
|
14152
14503
|
var theme = _ref2.theme;
|
|
14153
14504
|
return theme.colors.divider;
|
|
14154
14505
|
}, TabListWrapper);
|
|
@@ -14175,7 +14526,7 @@ var MobileNavbar = function MobileNavbar(_ref3) {
|
|
|
14175
14526
|
onLanguageToggle = _ref3.onLanguageToggle,
|
|
14176
14527
|
props = _objectWithoutPropertiesLoose(_ref3, _excluded$M);
|
|
14177
14528
|
|
|
14178
|
-
return React__default.createElement(Container$
|
|
14529
|
+
return React__default.createElement(Container$17, null, React__default.createElement(Tabs, null, React__default.createElement(HeaderContainer, null, React__default.createElement(MobileLogoLink, Object.assign({}, {
|
|
14179
14530
|
home: home,
|
|
14180
14531
|
logoMark: logoMark
|
|
14181
14532
|
}, {
|
|
@@ -14232,7 +14583,7 @@ var MobileNavbar = function MobileNavbar(_ref3) {
|
|
|
14232
14583
|
})))));
|
|
14233
14584
|
};
|
|
14234
14585
|
|
|
14235
|
-
var _excluded$N = ["content", "home", "openWidth", "logoMark", "logoText", "supportUrl", "defaultMenuOpen", "canAlwaysPin", "paddingOverride", "maxWidth", "children", "onMenuToggle"];
|
|
14586
|
+
var _excluded$N = ["content", "home", "openWidth", "logoMark", "logoText", "supportUrl", "defaultMenuOpen", "canAlwaysPin", "paddingOverride", "maxWidth", "legacyLayout", "children", "onMenuToggle"];
|
|
14236
14587
|
|
|
14237
14588
|
var GlobalUI = function GlobalUI(_ref) {
|
|
14238
14589
|
var content = _ref.content,
|
|
@@ -14245,6 +14596,7 @@ var GlobalUI = function GlobalUI(_ref) {
|
|
|
14245
14596
|
canAlwaysPin = _ref.canAlwaysPin,
|
|
14246
14597
|
paddingOverride = _ref.paddingOverride,
|
|
14247
14598
|
maxWidth = _ref.maxWidth,
|
|
14599
|
+
legacyLayout = _ref.legacyLayout,
|
|
14248
14600
|
children = _ref.children,
|
|
14249
14601
|
onMenuToggle = _ref.onMenuToggle,
|
|
14250
14602
|
props = _objectWithoutPropertiesLoose(_ref, _excluded$N);
|
|
@@ -14264,7 +14616,8 @@ var GlobalUI = function GlobalUI(_ref) {
|
|
|
14264
14616
|
onMenuToggle: onMenuToggle
|
|
14265
14617
|
})), React__default.createElement(MainContainer, null, React__default.createElement(TopBar, Object.assign({}, _extends({}, props))), React__default.createElement(ContentArea, Object.assign({}, {
|
|
14266
14618
|
maxWidth: maxWidth,
|
|
14267
|
-
paddingOverride: paddingOverride
|
|
14619
|
+
paddingOverride: paddingOverride,
|
|
14620
|
+
legacyLayout: legacyLayout
|
|
14268
14621
|
}), children))) : React__default.createElement(MobileLayout, null, React__default.createElement(MobileNavbar, Object.assign({}, _extends({
|
|
14269
14622
|
content: content,
|
|
14270
14623
|
home: home,
|
|
@@ -14276,16 +14629,16 @@ var GlobalUI = function GlobalUI(_ref) {
|
|
|
14276
14629
|
|
|
14277
14630
|
var _excluded$O = ["children"];
|
|
14278
14631
|
|
|
14279
|
-
var _templateObject$
|
|
14280
|
-
var Container$
|
|
14281
|
-
var LogoContainer = styled.div(_templateObject2$
|
|
14282
|
-
var LogoTopText = styled.div(_templateObject3$
|
|
14283
|
-
var LogoBottomText = styled.div(_templateObject4$
|
|
14284
|
-
var SidebarBox = styled.div(_templateObject5$
|
|
14285
|
-
var SidebarHeading = styled.div(_templateObject6$
|
|
14286
|
-
var SidebarLinkHeading = styled.div(_templateObject7$
|
|
14287
|
-
var BackLink = styled(Link)(_templateObject8$
|
|
14288
|
-
var SLink = styled(Link)(_templateObject9$
|
|
14632
|
+
var _templateObject$1L, _templateObject2$1x, _templateObject3$1k, _templateObject4$1a, _templateObject5$11, _templateObject6$O, _templateObject7$K, _templateObject8$E, _templateObject9$w;
|
|
14633
|
+
var Container$18 = styled.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"])));
|
|
14634
|
+
var LogoContainer = styled.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"])));
|
|
14635
|
+
var LogoTopText = styled.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"])));
|
|
14636
|
+
var LogoBottomText = styled.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"])));
|
|
14637
|
+
var SidebarBox = styled.div(_templateObject5$11 || (_templateObject5$11 = _taggedTemplateLiteralLoose(["\n position: relative;\n border-bottom: 1px solid var(--grey-a7);\n padding: 22px 20px 21px 20px;\n"])));
|
|
14638
|
+
var SidebarHeading = styled.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"])));
|
|
14639
|
+
var SidebarLinkHeading = styled.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"])));
|
|
14640
|
+
var BackLink$1 = styled(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"])));
|
|
14641
|
+
var SLink = styled(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"])));
|
|
14289
14642
|
var SidebarLink = function SidebarLink(_ref) {
|
|
14290
14643
|
var title = _ref.title,
|
|
14291
14644
|
to = _ref.to;
|
|
@@ -14303,8 +14656,8 @@ var Sidebar = function Sidebar(_ref3) {
|
|
|
14303
14656
|
var children = _ref3.children,
|
|
14304
14657
|
props = _objectWithoutPropertiesLoose(_ref3, _excluded$O);
|
|
14305
14658
|
|
|
14306
|
-
return React__default.createElement(Container$
|
|
14659
|
+
return React__default.createElement(Container$18, Object.assign({}, props), children);
|
|
14307
14660
|
};
|
|
14308
14661
|
|
|
14309
|
-
export { ActionButtons, ActionsBar, AlertBar, AlertWrapper, AreaUploadManager, AvatarUploader, BackLink, BasicSearchInput, Button, ButtonWithIcon, ButtonWithLoading, CameraPanelWrapper, CameraPanels, Checkbox, ConfirmationModal, Content, Controls, CropTool, DatePicker, DebouncedSearcher, DropArea, DurationSlider, EditCell, FilterBar, FilterButton, FilterDropdown, FilterDropdownContainer, FilterInputs, FilterLayout, FiltersResults, Form, GlobalUI, Icon, IconButton$2 as IconButton, Input, InputFileButton, IntroductionText, Label, Layout, LineReducer, LineSetContext, LineUI, LineUI$1 as LineUIRTC, LineUIVideo, Logo$2 as Logo, MainContainer, MainMenu, MediaBox, ModalContext, ModalProvider, MultilineContent, Notification, NotificationProvider, PTZContext, PTZProvider, reducer as PTZReducer, PageHeader, PageTitle, PasswordField, PercentageSlider, RadioButton, SelectField, SelectWrapper, Sidebar, SidebarBox, SidebarHeading, SidebarLink, SidebarLinkHeading, SliderInput, SmallInput, SortDropdown, Spinner, SplitButton, StatusIcon, Switch, Tab, TabContent, TabContext, TabList, TabWithIcon, TableHeaderTitle, TableRowThumbnail, Tabs, TabsWithIconBar, Tag, TagList, TagListWrapper, TextArea, TextAreaField, TextField, TopBar, TypeTable, WebRTCPlayer as WebRTCClient,
|
|
14662
|
+
export { ActionButtons, ActionsBar, AlertBar, AlertWrapper, AreaUploadManager, AvatarUploader, BackLink$1 as BackLink, BasicSearchInput, Button, ButtonWithIcon, ButtonWithLoading, CameraPanelWrapper, CameraPanels, Checkbox, ConfirmationModal, Content$1 as Content, ContentLayout, Controls, CropTool, DatePicker, DebouncedSearcher, DropArea, DurationSlider, EditCell, FilterBar, FilterButton, FilterDropdown, FilterDropdownContainer, FilterInputs, FilterLayout, FiltersResults, Form, FullWidthContentBlock, GlobalUI, Icon, IconButton$2 as IconButton, Input, InputFileButton, IntroductionText, Label, Layout, LineReducer, LineSetContext, LineUI, LineUI$1 as LineUIRTC, LineUIVideo, Logo$2 as Logo, MainContainer, MainMenu, MediaBox, ModalContext, ModalProvider, MultilineContent, Notification, NotificationProvider, PTZContext, PTZProvider, reducer as PTZReducer, PageHeader, PageTitle, Pagination, PasswordField, PercentageSlider, RadioButton, SelectField, SelectWrapper, Sidebar, SidebarBox, SidebarHeading, SidebarLink, SidebarLinkHeading, SliderInput, SmallInput, SortDropdown, Spinner, SplitButton, StatusIcon, Switch, Tab, TabContent, TabContext, TabList, TabWithIcon, TableHeaderTitle, TableRowThumbnail, Tabs, TabsWithIconBar, Tag, TagList, TagListWrapper, TextArea, TextAreaField, TextField, GlobalStyle as ThemeVariables, TopBar, TypeTable, UtilityHeader, WebRTCPlayer as WebRTCClient, index as defaultTheme, isDateInterval, isFilterItem, resetButtonStyles, useClickOutside, useCopyToClipboard, useInterval, useMediaModal, useModal, useNotification, usePTZ, usePoll, useThemeToggle, useTitle, useTo };
|
|
14310
14663
|
//# sourceMappingURL=index.modern.js.map
|