scorer-ui-kit 2.10.2 → 2.10.4
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/Global/index.d.ts +6 -1
- package/dist/Layouts/index.d.ts +4 -2
- package/dist/Misc/atoms/Tag.d.ts +1 -0
- package/dist/Pages/atoms/PageTitle.d.ts +1 -0
- package/dist/Pages/molecules/PageHeader.d.ts +3 -0
- package/dist/index.js +273 -213
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +273 -213
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -9609,7 +9609,7 @@ var LineReducer = (function (state, action) {
|
|
|
9609
9609
|
}
|
|
9610
9610
|
});
|
|
9611
9611
|
|
|
9612
|
-
var _templateObject$11, _templateObject2$U, _templateObject3$P, _templateObject4$I, _templateObject5$D, _templateObject6$v, _templateObject7$u;
|
|
9612
|
+
var _templateObject$11, _templateObject2$U, _templateObject3$P, _templateObject4$I, _templateObject5$D, _templateObject6$v, _templateObject7$u, _templateObject8$p;
|
|
9613
9613
|
var ICON_SIZE = 24;
|
|
9614
9614
|
var GAP_LEFT = 20;
|
|
9615
9615
|
var ICON_MARGIN_LEFT = -GAP_LEFT - ICON_SIZE;
|
|
@@ -9623,6 +9623,7 @@ var Title$3 = styled__default.h1(_templateObject4$I || (_templateObject4$I = _ta
|
|
|
9623
9623
|
var AreaTitleCss = styled.css(_templateObject5$D || (_templateObject5$D = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n text-align: left;\n font-size: 18px;\n font-weight: 600;\n text-decoration: none;\n color: var(--grey-11);\n"])));
|
|
9624
9624
|
var AreaTitle = styled__default.div(_templateObject6$v || (_templateObject6$v = _taggedTemplateLiteralLoose(["\n ", "\n"])), AreaTitleCss);
|
|
9625
9625
|
var AreaLinkTitle = styled__default(reactRouterDom.Link)(_templateObject7$u || (_templateObject7$u = _taggedTemplateLiteralLoose(["\n ", "\n &:hover {\n text-decoration: underline;\n }\n"])), AreaTitleCss);
|
|
9626
|
+
var AreaButton = styled__default.button(_templateObject8$p || (_templateObject8$p = _taggedTemplateLiteralLoose(["\n ", ";\n ", ";\n &:hover {\n text-decoration: underline;\n }\n"])), resetButtonStyles, AreaTitleCss);
|
|
9626
9627
|
var PageTitle = function PageTitle(_ref2) {
|
|
9627
9628
|
var title = _ref2.title,
|
|
9628
9629
|
icon = _ref2.icon,
|
|
@@ -9635,7 +9636,8 @@ var PageTitle = function PageTitle(_ref2) {
|
|
|
9635
9636
|
_ref2$areaTitleBottom = _ref2.areaTitleBottom,
|
|
9636
9637
|
areaTitleBottom = _ref2$areaTitleBottom === void 0 ? false : _ref2$areaTitleBottom,
|
|
9637
9638
|
_ref2$iconColor = _ref2.iconColor,
|
|
9638
|
-
iconColor = _ref2$iconColor === void 0 ? 'dimmed' : _ref2$iconColor
|
|
9639
|
+
iconColor = _ref2$iconColor === void 0 ? 'dimmed' : _ref2$iconColor,
|
|
9640
|
+
onAreaClick = _ref2.onAreaClick;
|
|
9639
9641
|
useTitle(title, hideAreaInDocTitle ? undefined : areaTitle || '', undefined, updateDocTitle);
|
|
9640
9642
|
return React__default.createElement(Container$F, null, icon ? React__default.createElement(IconContainer$2, null, React__default.createElement(Icon, Object.assign({
|
|
9641
9643
|
size: ICON_SIZE,
|
|
@@ -9644,9 +9646,12 @@ var PageTitle = function PageTitle(_ref2) {
|
|
|
9644
9646
|
icon: icon
|
|
9645
9647
|
}))) : null, React__default.createElement(TitlesWrapper, {
|
|
9646
9648
|
areaTitleBottom: areaTitleBottom
|
|
9647
|
-
}, areaTitle &&
|
|
9649
|
+
}, areaTitle && onAreaClick ? React__default.createElement(AreaButton, {
|
|
9650
|
+
onClick: onAreaClick,
|
|
9651
|
+
type: "button"
|
|
9652
|
+
}, areaTitle) : areaTitle && areaHref ? React__default.createElement(AreaLinkTitle, {
|
|
9648
9653
|
to: areaHref
|
|
9649
|
-
}, areaTitle) : areaTitle
|
|
9654
|
+
}, areaTitle) : areaTitle ? React__default.createElement(AreaTitle, null, areaTitle) : null, React__default.createElement(Title$3, null, title)));
|
|
9650
9655
|
};
|
|
9651
9656
|
|
|
9652
9657
|
var _templateObject$12;
|
|
@@ -9656,26 +9661,27 @@ var IntroductionText = function IntroductionText(_ref) {
|
|
|
9656
9661
|
return React__default.createElement(Container$G, null, children);
|
|
9657
9662
|
};
|
|
9658
9663
|
|
|
9659
|
-
var _excluded$C = ["icon", "size", "weight", "label", "linkTo", "noBorder", "tagSize"];
|
|
9660
|
-
var _templateObject$13, _templateObject2$V, _templateObject3$Q, _templateObject4$J, _templateObject5$E, _templateObject6$w, _templateObject7$v;
|
|
9664
|
+
var _excluded$C = ["icon", "size", "weight", "label", "linkTo", "noBorder", "tagSize", "onTagClick"];
|
|
9665
|
+
var _templateObject$13, _templateObject2$V, _templateObject3$Q, _templateObject4$J, _templateObject5$E, _templateObject6$w, _templateObject7$v, _templateObject8$q;
|
|
9661
9666
|
var TextContainer$2 = styled__default.div(_templateObject$13 || (_templateObject$13 = _taggedTemplateLiteralLoose(["\n user-select: none;\n"])));
|
|
9662
9667
|
var StyledLink = styled__default(reactRouterDom.Link)(_templateObject2$V || (_templateObject2$V = _taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n"])));
|
|
9663
|
-
var
|
|
9668
|
+
var StyledButton$5 = styled__default.button(_templateObject3$Q || (_templateObject3$Q = _taggedTemplateLiteralLoose(["\n ", ";\n text-decoration: none;\n display: flex;\n"])), resetButtonStyles);
|
|
9669
|
+
var TagWrapper = styled__default.div(_templateObject4$J || (_templateObject4$J = _taggedTemplateLiteralLoose(["\n font-family: var(--font-data);\n font-size: ", "px;\n font-weight: 500;\n color: var(--grey-11);\n padding: 4px 10px;\n\n ", ";\n\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n gap: 8px;\n\n ", ";\n\n ", ";\n\n ", " {\n [stroke]{\n stroke: var(--dimmed);\n }\n\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n ", ";\n"])), function (_ref) {
|
|
9664
9670
|
var size = _ref.size;
|
|
9665
9671
|
return size;
|
|
9666
9672
|
}, function (_ref2) {
|
|
9667
9673
|
var noBorder = _ref2.noBorder;
|
|
9668
|
-
return !noBorder && styled.css(
|
|
9674
|
+
return !noBorder && styled.css(_templateObject5$E || (_templateObject5$E = _taggedTemplateLiteralLoose(["\n border: solid 1px var(--grey-8);\n border-radius: 3px;\n "])));
|
|
9669
9675
|
}, function (_ref3) {
|
|
9670
9676
|
var tagSize = _ref3.tagSize;
|
|
9671
|
-
return tagSize === 'compact' && styled.css(
|
|
9677
|
+
return tagSize === 'compact' && styled.css(_templateObject6$w || (_templateObject6$w = _taggedTemplateLiteralLoose(["\n padding: 2px 6px;\n gap: 4px;\n "])));
|
|
9672
9678
|
}, function (_ref4) {
|
|
9673
9679
|
var tagSize = _ref4.tagSize;
|
|
9674
|
-
return tagSize === 'default' && styled.css(
|
|
9680
|
+
return tagSize === 'default' && styled.css(_templateObject7$v || (_templateObject7$v = _taggedTemplateLiteralLoose(["\n padding: 3px 8px;\n "])));
|
|
9675
9681
|
}, IconWrapper, function (_ref5) {
|
|
9676
9682
|
var hoverColor = _ref5.hoverColor,
|
|
9677
9683
|
enableHover = _ref5.enableHover;
|
|
9678
|
-
return enableHover && styled.css(
|
|
9684
|
+
return enableHover && styled.css(_templateObject8$q || (_templateObject8$q = _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);
|
|
9679
9685
|
});
|
|
9680
9686
|
var Tag = function Tag(_ref6) {
|
|
9681
9687
|
var _ref6$icon = _ref6.icon,
|
|
@@ -9690,6 +9696,7 @@ var Tag = function Tag(_ref6) {
|
|
|
9690
9696
|
_ref6$noBorder = _ref6.noBorder,
|
|
9691
9697
|
noBorder = _ref6$noBorder === void 0 ? false : _ref6$noBorder,
|
|
9692
9698
|
tagSize = _ref6.tagSize,
|
|
9699
|
+
onTagClick = _ref6.onTagClick,
|
|
9693
9700
|
props = _objectWithoutPropertiesLoose(_ref6, _excluded$C);
|
|
9694
9701
|
var iconTagSize = React.useMemo(function () {
|
|
9695
9702
|
return tagSize === 'compact' ? 8 : 10;
|
|
@@ -9700,7 +9707,7 @@ var Tag = function Tag(_ref6) {
|
|
|
9700
9707
|
var renderTag = function renderTag() {
|
|
9701
9708
|
return React__default.createElement(TagWrapper, {
|
|
9702
9709
|
hoverColor: 'primary',
|
|
9703
|
-
enableHover: linkTo ? true : false,
|
|
9710
|
+
enableHover: onTagClick || linkTo ? true : false,
|
|
9704
9711
|
size: tagSize ? textTagSize : size,
|
|
9705
9712
|
tagSize: tagSize,
|
|
9706
9713
|
noBorder: noBorder
|
|
@@ -9710,12 +9717,15 @@ var Tag = function Tag(_ref6) {
|
|
|
9710
9717
|
weight: weight
|
|
9711
9718
|
}, props)), React__default.createElement(TextContainer$2, null, label));
|
|
9712
9719
|
};
|
|
9713
|
-
return
|
|
9720
|
+
return onTagClick ? React__default.createElement(StyledButton$5, {
|
|
9721
|
+
onClick: onTagClick,
|
|
9722
|
+
type: "button"
|
|
9723
|
+
}, renderTag()) : linkTo ? React__default.createElement(StyledLink, {
|
|
9714
9724
|
to: linkTo
|
|
9715
9725
|
}, renderTag()) : renderTag();
|
|
9716
9726
|
};
|
|
9717
9727
|
|
|
9718
|
-
var _templateObject$14, _templateObject2$W, _templateObject3$R, _templateObject4$K, _templateObject5$F, _templateObject6$x;
|
|
9728
|
+
var _templateObject$14, _templateObject2$W, _templateObject3$R, _templateObject4$K, _templateObject5$F, _templateObject6$x, _templateObject7$w;
|
|
9719
9729
|
var Container$H = styled__default.div(_templateObject$14 || (_templateObject$14 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n gap: 32px;\n"])));
|
|
9720
9730
|
var LeftPanel = styled__default.div(_templateObject2$W || (_templateObject2$W = _taggedTemplateLiteralLoose(["\n"])));
|
|
9721
9731
|
var IntroductionTextWrapper = styled__default.div(_templateObject3$R || (_templateObject3$R = _taggedTemplateLiteralLoose(["\n max-width: 648px;\n"])));
|
|
@@ -9724,6 +9734,7 @@ var RightPanel = styled__default.div(_templateObject4$K || (_templateObject4$K =
|
|
|
9724
9734
|
return iconLeftPanel && styled.css(_templateObject5$F || (_templateObject5$F = _taggedTemplateLiteralLoose(["\n padding-top: 32px;\n "])));
|
|
9725
9735
|
}, deviceMediaQuery.large);
|
|
9726
9736
|
var TagListWrapper = styled__default.div(_templateObject6$x || (_templateObject6$x = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: flex-start;\n flex-wrap: wrap;\n gap: 4px;\n margin-bottom: 5px;\n margin-top: 29px;\n"])));
|
|
9737
|
+
var BottomLeft = styled__default.div(_templateObject7$w || (_templateObject7$w = _taggedTemplateLiteralLoose([""])));
|
|
9727
9738
|
var PageHeader = function PageHeader(_ref2) {
|
|
9728
9739
|
var title = _ref2.title,
|
|
9729
9740
|
icon = _ref2.icon,
|
|
@@ -9737,7 +9748,9 @@ var PageHeader = function PageHeader(_ref2) {
|
|
|
9737
9748
|
hideAreaInDocTitle = _ref2.hideAreaInDocTitle,
|
|
9738
9749
|
tagList = _ref2.tagList,
|
|
9739
9750
|
areaTitleBottom = _ref2.areaTitleBottom,
|
|
9740
|
-
rightContent = _ref2.rightContent
|
|
9751
|
+
rightContent = _ref2.rightContent,
|
|
9752
|
+
bottomLeftContent = _ref2.bottomLeftContent,
|
|
9753
|
+
onAreaClick = _ref2.onAreaClick;
|
|
9741
9754
|
return React__default.createElement(Container$H, null, React__default.createElement(LeftPanel, null, React__default.createElement(PageTitle, Object.assign({
|
|
9742
9755
|
iconColor: iconColor
|
|
9743
9756
|
}, {
|
|
@@ -9747,11 +9760,14 @@ var PageHeader = function PageHeader(_ref2) {
|
|
|
9747
9760
|
areaTitle: areaTitle,
|
|
9748
9761
|
updateDocTitle: updateDocTitle,
|
|
9749
9762
|
hideAreaInDocTitle: hideAreaInDocTitle,
|
|
9750
|
-
areaTitleBottom: areaTitleBottom
|
|
9763
|
+
areaTitleBottom: areaTitleBottom,
|
|
9764
|
+
onAreaClick: onAreaClick,
|
|
9765
|
+
bottomLeftContent: bottomLeftContent
|
|
9751
9766
|
})), !tagList ? null : React__default.createElement(TagListWrapper, null, tagList.map(function (_ref3) {
|
|
9752
9767
|
var icon = _ref3.icon,
|
|
9753
9768
|
label = _ref3.label,
|
|
9754
|
-
linkTo = _ref3.linkTo
|
|
9769
|
+
linkTo = _ref3.linkTo,
|
|
9770
|
+
onTagClick = _ref3.onTagClick;
|
|
9755
9771
|
return React__default.createElement(Tag, Object.assign({
|
|
9756
9772
|
key: "tag-",
|
|
9757
9773
|
icon: icon || '',
|
|
@@ -9759,9 +9775,10 @@ var PageHeader = function PageHeader(_ref2) {
|
|
|
9759
9775
|
tagSize: 'compact'
|
|
9760
9776
|
}, {
|
|
9761
9777
|
label: label,
|
|
9762
|
-
linkTo: linkTo
|
|
9778
|
+
linkTo: linkTo,
|
|
9779
|
+
onTagClick: onTagClick
|
|
9763
9780
|
}));
|
|
9764
|
-
})), introductionText ? React__default.createElement(IntroductionTextWrapper, null, React__default.createElement(IntroductionText, null, introductionText)) : null), rightContent ? React__default.createElement(RightPanel, {
|
|
9781
|
+
})), introductionText ? React__default.createElement(IntroductionTextWrapper, null, React__default.createElement(IntroductionText, null, introductionText)) : null, React__default.createElement(BottomLeft, null, bottomLeftContent)), rightContent ? React__default.createElement(RightPanel, {
|
|
9765
9782
|
iconLeftPanel: !!icon
|
|
9766
9783
|
}, rightContent) : null);
|
|
9767
9784
|
};
|
|
@@ -9777,7 +9794,7 @@ var MultilineContent = function MultilineContent(_ref) {
|
|
|
9777
9794
|
}));
|
|
9778
9795
|
};
|
|
9779
9796
|
|
|
9780
|
-
var _templateObject$16, _templateObject2$X, _templateObject3$S, _templateObject4$L, _templateObject5$G, _templateObject6$y, _templateObject7$
|
|
9797
|
+
var _templateObject$16, _templateObject2$X, _templateObject3$S, _templateObject4$L, _templateObject5$G, _templateObject6$y, _templateObject7$x;
|
|
9781
9798
|
var Container$J = styled__default.div(_templateObject$16 || (_templateObject$16 = _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) {
|
|
9782
9799
|
var aspect = _ref.aspect;
|
|
9783
9800
|
return aspect === '16:9' && styled.css(_templateObject2$X || (_templateObject2$X = _taggedTemplateLiteralLoose(["\n padding-left: 56.25%;\n "])));
|
|
@@ -9791,7 +9808,7 @@ var Container$J = styled__default.div(_templateObject$16 || (_templateObject$16
|
|
|
9791
9808
|
});
|
|
9792
9809
|
var ImageWrapper = styled__default.img(_templateObject5$G || (_templateObject5$G = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n height: 100%;\n width: 100%;\n object-fit: cover;\n display: block;\n"])));
|
|
9793
9810
|
var NoImageWrapper = styled__default.div(_templateObject6$y || (_templateObject6$y = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n top: 0;\n right: 0;\n bottom: 0;\n height: 41px;\n width: 55px;\n object-fit: cover;\n display: block;\n"])));
|
|
9794
|
-
var PlayableDrop = styled__default.div(_templateObject7$
|
|
9811
|
+
var PlayableDrop = styled__default.div(_templateObject7$x || (_templateObject7$x = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n background-color: var(--black-a1);\n height: 24px;\n width: 24px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n ", " {\n display: flex;\n svg {\n padding-left: 2px;\n path {\n stroke: var(--white-1);\n }\n }\n };\n"])), IconWrapper);
|
|
9795
9812
|
var TableRowThumbnail = function TableRowThumbnail(_ref4) {
|
|
9796
9813
|
var _ref4$hoverZoom = _ref4.hoverZoom,
|
|
9797
9814
|
hoverZoom = _ref4$hoverZoom === void 0 ? true : _ref4$hoverZoom,
|
|
@@ -9916,7 +9933,7 @@ var TypeTableDeviceStatus = function TypeTableDeviceStatus(_ref2) {
|
|
|
9916
9933
|
});
|
|
9917
9934
|
};
|
|
9918
9935
|
|
|
9919
|
-
var _templateObject$18, _templateObject2$Z, _templateObject3$T, _templateObject4$M, _templateObject5$H, _templateObject6$z, _templateObject7$
|
|
9936
|
+
var _templateObject$18, _templateObject2$Z, _templateObject3$T, _templateObject4$M, _templateObject5$H, _templateObject6$z, _templateObject7$y, _templateObject8$r, _templateObject9$k, _templateObject10$g, _templateObject11$a;
|
|
9920
9937
|
var CopyToClipboard = styled__default.button(_templateObject$18 || (_templateObject$18 = _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) {
|
|
9921
9938
|
var theme = _ref.theme;
|
|
9922
9939
|
return theme && styled.css(_templateObject2$Z || (_templateObject2$Z = _taggedTemplateLiteralLoose(["\n transition: ", " ", ";\n "])), theme.animation.speed.normal, theme.animation.easing.easeOut);
|
|
@@ -9934,9 +9951,9 @@ var CellContainer = styled__default.div(_templateObject3$T || (_templateObject3$
|
|
|
9934
9951
|
}, function (_ref4) {
|
|
9935
9952
|
var styles = _ref4.theme.styles,
|
|
9936
9953
|
hideDivider = _ref4.hideDivider;
|
|
9937
|
-
return !hideDivider && styled.css(_templateObject7$
|
|
9954
|
+
return !hideDivider && styled.css(_templateObject7$y || (_templateObject7$y = _taggedTemplateLiteralLoose(["\n &::after {\n ", ";\n content: '';\n display: block;\n height: 1px;\n left: 0;\n right: 0;\n width: 100%;\n bottom: 0px;\n position: absolute;\n }\n "])), styles.tables.rows.divider);
|
|
9938
9955
|
});
|
|
9939
|
-
var UnitText = styled__default.span(_templateObject8$
|
|
9956
|
+
var UnitText = styled__default.span(_templateObject8$r || (_templateObject8$r = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref5) {
|
|
9940
9957
|
var theme = _ref5.theme;
|
|
9941
9958
|
return styled.css(_templateObject9$k || (_templateObject9$k = _taggedTemplateLiteralLoose(["\n ", ";\n "])), theme.typography.table.columnData['unit']);
|
|
9942
9959
|
});
|
|
@@ -10099,7 +10116,7 @@ var TableHeaderTitle = function TableHeaderTitle(_ref4) {
|
|
|
10099
10116
|
}), header);
|
|
10100
10117
|
};
|
|
10101
10118
|
|
|
10102
|
-
var _templateObject$1b, _templateObject2$10, _templateObject3$V, _templateObject4$O, _templateObject5$I, _templateObject6$A, _templateObject7$
|
|
10119
|
+
var _templateObject$1b, _templateObject2$10, _templateObject3$V, _templateObject4$O, _templateObject5$I, _templateObject6$A, _templateObject7$z, _templateObject8$s, _templateObject9$l, _templateObject10$h, _templateObject11$b, _templateObject12$9, _templateObject13$8, _templateObject14$7, _templateObject15$5, _templateObject16$4, _templateObject17$4;
|
|
10103
10120
|
var HeaderRow = styled__default.div(_templateObject$1b || (_templateObject$1b = _taggedTemplateLiteralLoose(["\n display: table-row;\n height: 50px;\n"])));
|
|
10104
10121
|
var HeaderItem = styled__default.div(_templateObject2$10 || (_templateObject2$10 = _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) {
|
|
10105
10122
|
return p.theme.fontFamily.ui;
|
|
@@ -10115,12 +10132,12 @@ var HeaderItem = styled__default.div(_templateObject2$10 || (_templateObject2$10
|
|
|
10115
10132
|
return p.fixedWidth && styled.css(_templateObject6$A || (_templateObject6$A = _taggedTemplateLiteralLoose(["\n width: ", "px;\n "])), p.fixedWidth);
|
|
10116
10133
|
}, function (_ref3) {
|
|
10117
10134
|
var minWidth = _ref3.minWidth;
|
|
10118
|
-
return minWidth && styled.css(_templateObject7$
|
|
10135
|
+
return minWidth && styled.css(_templateObject7$z || (_templateObject7$z = _taggedTemplateLiteralLoose(["\n min-width:", "px;\n "])), minWidth);
|
|
10119
10136
|
}, function (_ref4) {
|
|
10120
10137
|
var styles = _ref4.theme.styles,
|
|
10121
10138
|
headerStyle = _ref4.headerStyle,
|
|
10122
10139
|
isSortActive = _ref4.isSortActive;
|
|
10123
|
-
return headerStyle === 'subHeader' && styled.css(_templateObject8$
|
|
10140
|
+
return headerStyle === 'subHeader' && styled.css(_templateObject8$s || (_templateObject8$s = _taggedTemplateLiteralLoose(["\n padding-bottom: 15px;\n\n &::after {\n ", ";\n content: '';\n display: block;\n height: 1px;\n left: ", ";\n right: 0;\n width: ", ";\n bottom: 0px;\n position: absolute;\n }\n"])), styles.tables.header.divider, isSortActive ? '-15px' : '0', isSortActive ? 'calc(100% + 15px)' : '100%');
|
|
10124
10141
|
});
|
|
10125
10142
|
var TitleItems = styled__default.div(_templateObject9$l || (_templateObject9$l = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n ", ";\n"])), function (_ref5) {
|
|
10126
10143
|
var alignment = _ref5.alignment;
|
|
@@ -10356,17 +10373,17 @@ var TypeTable = function TypeTable(_ref4) {
|
|
|
10356
10373
|
};
|
|
10357
10374
|
|
|
10358
10375
|
var _excluded$D = ["type", "placeholder", "defaultValue", "rowKey", "alignment", "toLink", "saveCallback"];
|
|
10359
|
-
var _templateObject$1d, _templateObject2$12, _templateObject3$X, _templateObject4$Q, _templateObject5$K, _templateObject6$B, _templateObject7$
|
|
10376
|
+
var _templateObject$1d, _templateObject2$12, _templateObject3$X, _templateObject4$Q, _templateObject5$K, _templateObject6$B, _templateObject7$A, _templateObject8$t, _templateObject9$m, _templateObject10$i;
|
|
10360
10377
|
var Container$M = styled__default.div(_templateObject$1d || (_templateObject$1d = _taggedTemplateLiteralLoose(["\n position: relative;\n ", "\n"])), function (_ref) {
|
|
10361
10378
|
var theme = _ref.theme;
|
|
10362
10379
|
return styled.css(_templateObject2$12 || (_templateObject2$12 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n "])), theme.fontFamily.ui);
|
|
10363
10380
|
});
|
|
10364
|
-
var StyledButton$
|
|
10381
|
+
var StyledButton$6 = styled__default(Button)(_templateObject3$X || (_templateObject3$X = _taggedTemplateLiteralLoose(["\n flex-shrink: 0;\n"])));
|
|
10365
10382
|
var StyledLoadingButton = styled__default(ButtonWithLoading)(_templateObject4$Q || (_templateObject4$Q = _taggedTemplateLiteralLoose(["\n flex-shrink: 0;\n"])));
|
|
10366
10383
|
var StyledLink$1 = styled__default(reactRouterDom.Link)(_templateObject5$K || (_templateObject5$K = _taggedTemplateLiteralLoose(["\n color: inherit;\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n }\n"])));
|
|
10367
|
-
var EditContainer = styled__default.div(_templateObject6$B || (_templateObject6$B = _taggedTemplateLiteralLoose(["\n min-width: 320px;\n background-color: var(--grey-2);\n z-index: 99;\n position: absolute;\n bottom: -15px;\n left: -11px;\n display: flex;\n align-items: center;\n justify-content: center;\n ", " {\n margin:0;\n span {\n margin: 0;\n }\n }\n ", " {\n margin-left: 5px;\n }\n ", " {\n margin-left: 5px;\n }\n"])), StyledLabel, StyledButton$
|
|
10368
|
-
var StyledIconButton$1 = styled__default(IconButton$2)(_templateObject7$
|
|
10369
|
-
var TextContainer$3 = styled__default.div(_templateObject8$
|
|
10384
|
+
var EditContainer = styled__default.div(_templateObject6$B || (_templateObject6$B = _taggedTemplateLiteralLoose(["\n min-width: 320px;\n background-color: var(--grey-2);\n z-index: 99;\n position: absolute;\n bottom: -15px;\n left: -11px;\n display: flex;\n align-items: center;\n justify-content: center;\n ", " {\n margin:0;\n span {\n margin: 0;\n }\n }\n ", " {\n margin-left: 5px;\n }\n ", " {\n margin-left: 5px;\n }\n"])), StyledLabel, StyledButton$6, StyledLoadingButton);
|
|
10385
|
+
var StyledIconButton$1 = styled__default(IconButton$2)(_templateObject7$A || (_templateObject7$A = _taggedTemplateLiteralLoose([""])));
|
|
10386
|
+
var TextContainer$3 = styled__default.div(_templateObject8$t || (_templateObject8$t = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-right: 18px;\n\n ", "\n\n ", "\n\n ", " {\n opacity: 0;\n position: absolute;\n top: 7px;\n right: 0;\n };\n\n &:hover {\n ", " {\n opacity: 1;\n };\n }\n"])), function (_ref2) {
|
|
10370
10387
|
var alignment = _ref2.alignment;
|
|
10371
10388
|
return alignment === 'center' && styled.css(_templateObject9$m || (_templateObject9$m = _taggedTemplateLiteralLoose(["\n justify-content: center;\n "])));
|
|
10372
10389
|
}, function (_ref3) {
|
|
@@ -10460,7 +10477,7 @@ var EditCell = function EditCell(_ref4) {
|
|
|
10460
10477
|
},
|
|
10461
10478
|
size: 'small',
|
|
10462
10479
|
loading: loading
|
|
10463
|
-
}, loading ? 'Saving' : 'Save'), !loading && React__default.createElement(StyledButton$
|
|
10480
|
+
}, loading ? 'Saving' : 'Save'), !loading && React__default.createElement(StyledButton$6, {
|
|
10464
10481
|
onClick: function onClick() {
|
|
10465
10482
|
return setIsEditMode(false);
|
|
10466
10483
|
},
|
|
@@ -12073,7 +12090,7 @@ var Controls = function Controls(_ref) {
|
|
|
12073
12090
|
};
|
|
12074
12091
|
|
|
12075
12092
|
var _excluded$E = ["isEmptyWithIcon", "status", "noticeIcon", "hasNotice", "noticeMessage", "noticeTitle", "emptyIcon"];
|
|
12076
|
-
var _templateObject$1l, _templateObject2$19, _templateObject3$12, _templateObject4$X, _templateObject5$R, _templateObject6$D, _templateObject7$
|
|
12093
|
+
var _templateObject$1l, _templateObject2$19, _templateObject3$12, _templateObject4$X, _templateObject5$R, _templateObject6$D, _templateObject7$B, _templateObject8$u;
|
|
12077
12094
|
var Container$U = styled__default.div(_templateObject$1l || (_templateObject$1l = _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);
|
|
12078
12095
|
var EmptyWithIcon = styled__default.div(_templateObject2$19 || (_templateObject2$19 = _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) {
|
|
12079
12096
|
var hasPadding = _ref.hasPadding;
|
|
@@ -12086,8 +12103,8 @@ var Notice = styled__default.div(_templateObject3$12 || (_templateObject3$12 = _
|
|
|
12086
12103
|
var NoticeMessage = styled__default.div(_templateObject4$X || (_templateObject4$X = _taggedTemplateLiteralLoose(["\n ", ";\n max-width: 245px;\n font-size: 10px;\n"])), EllipsisStyles);
|
|
12087
12104
|
var NoticeTitle = styled__default.div(_templateObject5$R || (_templateObject5$R = _taggedTemplateLiteralLoose(["\n ", ";\n max-width: 245px;\n font-size: 12px;\n"])), EllipsisStyles);
|
|
12088
12105
|
var NoticeIcon = styled__default.div(_templateObject6$D || (_templateObject6$D = _taggedTemplateLiteralLoose(["\n height: 20px;\n width: 20px;\n margin-left: 2px;\n\n ", " {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n }\n"])), IconWrapper);
|
|
12089
|
-
var NoticeTextGroup = styled__default.div(_templateObject7$
|
|
12090
|
-
var StatusLine = styled__default.div(_templateObject8$
|
|
12106
|
+
var NoticeTextGroup = styled__default.div(_templateObject7$B || (_templateObject7$B = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n margin-left: 14px;\n"])));
|
|
12107
|
+
var StatusLine = styled__default.div(_templateObject8$u || (_templateObject8$u = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n height: 3px;\n width: 100%;\n"])), function (_ref3) {
|
|
12091
12108
|
var color = _ref3.color;
|
|
12092
12109
|
return color && "var(--" + color + ")";
|
|
12093
12110
|
});
|
|
@@ -12120,7 +12137,7 @@ var MediaStream = function MediaStream(_ref4) {
|
|
|
12120
12137
|
}));
|
|
12121
12138
|
};
|
|
12122
12139
|
|
|
12123
|
-
var _templateObject$1m, _templateObject2$1a, _templateObject3$13, _templateObject4$Y, _templateObject5$S, _templateObject6$E, _templateObject7$
|
|
12140
|
+
var _templateObject$1m, _templateObject2$1a, _templateObject3$13, _templateObject4$Y, _templateObject5$S, _templateObject6$E, _templateObject7$C, _templateObject8$v, _templateObject9$n;
|
|
12124
12141
|
var Container$V = styled__default.div(_templateObject$1m || (_templateObject$1m = _taggedTemplateLiteralLoose(["\n display: flex;\n height: 60px;\n"])));
|
|
12125
12142
|
var LeftData = styled__default.div(_templateObject2$1a || (_templateObject2$1a = _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) {
|
|
12126
12143
|
var hasRightData = _ref.hasRightData;
|
|
@@ -12135,11 +12152,11 @@ var LeftTitle = styled__default.div(_templateObject6$E || (_templateObject6$E =
|
|
|
12135
12152
|
var hasMarginBottom = _ref3.hasMarginBottom;
|
|
12136
12153
|
return hasMarginBottom && "margin-bottom: 1px;";
|
|
12137
12154
|
});
|
|
12138
|
-
var LeftSubTitle = styled__default.div(_templateObject7$
|
|
12155
|
+
var LeftSubTitle = styled__default.div(_templateObject7$C || (_templateObject7$C = _taggedTemplateLiteralLoose(["\n font-family: var(--font-data);\n ", ";\n ", "\n\n color: var(--grey-11);\n font-size: 16px;\n"])), EllipsisStyles, function (_ref4) {
|
|
12139
12156
|
var hasRightData = _ref4.hasRightData;
|
|
12140
12157
|
return hasRightData ? "max-width: 140px;" : "max-width: 250px;";
|
|
12141
12158
|
});
|
|
12142
|
-
var Title$5 = styled__default.div(_templateObject8$
|
|
12159
|
+
var Title$5 = styled__default.div(_templateObject8$v || (_templateObject8$v = _taggedTemplateLiteralLoose(["\n ", ";\n max-width: 80px;\n color: var(--grey-a10);\n font-size: 10px;\n ", ";\n"])), EllipsisStyles, function (_ref5) {
|
|
12143
12160
|
var hasMarginBottom = _ref5.hasMarginBottom;
|
|
12144
12161
|
return hasMarginBottom && "margin-bottom: 6px;";
|
|
12145
12162
|
});
|
|
@@ -12295,7 +12312,7 @@ var ActionsBar = function ActionsBar(_ref3) {
|
|
|
12295
12312
|
}, finishTextButton))), React__default.createElement(SelectedResults, null, renderSelected(selectedTemplate, totalSelected, totalAvailable)));
|
|
12296
12313
|
};
|
|
12297
12314
|
|
|
12298
|
-
var _templateObject$1r, _templateObject2$1c, _templateObject3$15, _templateObject4$_, _templateObject5$U, _templateObject6$G, _templateObject7$
|
|
12315
|
+
var _templateObject$1r, _templateObject2$1c, _templateObject3$15, _templateObject4$_, _templateObject5$U, _templateObject6$G, _templateObject7$D, _templateObject8$w, _templateObject9$o;
|
|
12299
12316
|
var WIDTH_PER_NUMBER = 12;
|
|
12300
12317
|
var PaginationContainer = styled__default.div(_templateObject$1r || (_templateObject$1r = _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: 40px;\n vertical-align: baseline;\n"])));
|
|
12301
12318
|
var StaticPageCount = styled__default.div(_templateObject2$1c || (_templateObject2$1c = _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"])));
|
|
@@ -12312,8 +12329,8 @@ var InputContainer$2 = styled__default.div(_templateObject5$U || (_templateObjec
|
|
|
12312
12329
|
return borderColorState && "border: 1px solid var(--input-" + borderColorState + "-border-color)";
|
|
12313
12330
|
});
|
|
12314
12331
|
var GoButton = styled__default(Button)(_templateObject6$G || (_templateObject6$G = _taggedTemplateLiteralLoose(["\n height: 24px;\n padding: 0 8px;\n margin-left: 8px;\n"])));
|
|
12315
|
-
var ArrowWrapper = styled__default.div(_templateObject7$
|
|
12316
|
-
var ArrowButton = styled__default.button(_templateObject8$
|
|
12332
|
+
var ArrowWrapper = styled__default.div(_templateObject7$D || (_templateObject7$D = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 0 8px;\n"])));
|
|
12333
|
+
var ArrowButton = styled__default.button(_templateObject8$w || (_templateObject8$w = _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(--input-default-border-color);\n background-color: var(grey-2);\n pointer-events: ", ";\n opacity: ", ";\n\n &:focus, &:hover {\n outline: 2px solid #838383;\n }\n"])), resetButtonStyles, function (_ref4) {
|
|
12317
12334
|
var active = _ref4.active;
|
|
12318
12335
|
return active ? 'auto' : 'none';
|
|
12319
12336
|
}, function (_ref5) {
|
|
@@ -12525,7 +12542,7 @@ var _templateObject$1s, _templateObject2$1d, _templateObject3$16, _templateObjec
|
|
|
12525
12542
|
var Container$X = styled__default.div(_templateObject$1s || (_templateObject$1s = _taggedTemplateLiteralLoose([""])));
|
|
12526
12543
|
var Title$7 = styled__default.div(_templateObject2$1d || (_templateObject2$1d = _taggedTemplateLiteralLoose(["\n font-size: 20px;\n font-weight: 400;\n text-align: left;\n text-shadow: 0px 0px 10px var(--white-a5);\n text-decoration: none;\n color: var(--grey-11);\n"])));
|
|
12527
12544
|
var MessageBox$1 = styled__default.div(_templateObject3$16 || (_templateObject3$16 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 400;\n line-height: 25px;\n text-align: left;\n text-decoration: none;\n color: var(--grey-11);\n margin: 28px 0;\n"])));
|
|
12528
|
-
var StyledButton$
|
|
12545
|
+
var StyledButton$7 = styled__default(Button)(_templateObject4$$ || (_templateObject4$$ = _taggedTemplateLiteralLoose(["\n margin-left: 10px;\n"])));
|
|
12529
12546
|
var ButtonsGroup$1 = styled__default.div(_templateObject5$V || (_templateObject5$V = _taggedTemplateLiteralLoose(["\n text-align: right;\n display: flex;\n justify-content: flex-end;\n"])));
|
|
12530
12547
|
var ConfirmationModal = function ConfirmationModal(_ref) {
|
|
12531
12548
|
var _ref$title = _ref.title,
|
|
@@ -12554,10 +12571,10 @@ var ConfirmationModal = function ConfirmationModal(_ref) {
|
|
|
12554
12571
|
rightButtonCallback();
|
|
12555
12572
|
setModalOpen(false);
|
|
12556
12573
|
};
|
|
12557
|
-
return React__default.createElement(Container$X, null, React__default.createElement(Title$7, null, title), React__default.createElement(MessageBox$1, null, message), React__default.createElement(ButtonsGroup$1, null, React__default.createElement(StyledButton$
|
|
12574
|
+
return React__default.createElement(Container$X, null, React__default.createElement(Title$7, null, title), React__default.createElement(MessageBox$1, null, message), React__default.createElement(ButtonsGroup$1, null, React__default.createElement(StyledButton$7, {
|
|
12558
12575
|
design: leftButtonDesign,
|
|
12559
12576
|
onClick: handlePrimaryBtn
|
|
12560
|
-
}, leftButtonText), React__default.createElement(StyledButton$
|
|
12577
|
+
}, leftButtonText), React__default.createElement(StyledButton$7, {
|
|
12561
12578
|
design: rightButtonDesign,
|
|
12562
12579
|
onClick: handleSecondaryBtn
|
|
12563
12580
|
}, rightButtonText)));
|
|
@@ -12600,46 +12617,66 @@ var UtilityHeaderShare = function UtilityHeaderShare(_ref) {
|
|
|
12600
12617
|
})), copyActionText);
|
|
12601
12618
|
};
|
|
12602
12619
|
|
|
12603
|
-
var _templateObject$1u, _templateObject2$1f, _templateObject3$17;
|
|
12620
|
+
var _templateObject$1u, _templateObject2$1f, _templateObject3$17, _templateObject4$10, _templateObject5$W, _templateObject6$H, _templateObject7$E;
|
|
12604
12621
|
var BackLinkIcon = styled__default.div(_templateObject$1u || (_templateObject$1u = _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"])));
|
|
12605
|
-
var
|
|
12622
|
+
var backLinkStyle = styled.css(_templateObject2$1f || (_templateObject2$1f = _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\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"])), BackLinkIcon, BackLinkIcon);
|
|
12623
|
+
var dividerStyle = styled.css(_templateObject3$17 || (_templateObject3$17 = _taggedTemplateLiteralLoose(["\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"])));
|
|
12624
|
+
var BackLink = styled__default(reactRouterDom.Link)(_templateObject4$10 || (_templateObject4$10 = _taggedTemplateLiteralLoose(["\n ", ";\n margin-left: ", ";\n\n ", "\n"])), backLinkStyle, function (props) {
|
|
12606
12625
|
return props.$iconInGutter ? '-24px' : '0';
|
|
12607
|
-
},
|
|
12626
|
+
}, function (_ref) {
|
|
12608
12627
|
var $showDivider = _ref.$showDivider;
|
|
12609
|
-
return $showDivider && styled.css(
|
|
12610
|
-
});
|
|
12611
|
-
var
|
|
12612
|
-
|
|
12613
|
-
|
|
12614
|
-
|
|
12615
|
-
|
|
12616
|
-
|
|
12617
|
-
|
|
12618
|
-
|
|
12628
|
+
return $showDivider && styled.css(_templateObject5$W || (_templateObject5$W = _taggedTemplateLiteralLoose(["\n &::after {\n ", ";\n }\n "])), dividerStyle);
|
|
12629
|
+
});
|
|
12630
|
+
var BackButton = styled__default.button(_templateObject6$H || (_templateObject6$H = _taggedTemplateLiteralLoose(["\n ", ";\n ", ";\n margin-left: ", ";\n\n ", "\n"])), resetButtonStyles, backLinkStyle, function (props) {
|
|
12631
|
+
return props.$iconInGutter ? '-24px' : '0';
|
|
12632
|
+
}, function (_ref2) {
|
|
12633
|
+
var $showDivider = _ref2.$showDivider;
|
|
12634
|
+
return $showDivider && styled.css(_templateObject7$E || (_templateObject7$E = _taggedTemplateLiteralLoose(["\n &::after {\n ", ";\n }\n "])), dividerStyle);
|
|
12635
|
+
});
|
|
12636
|
+
var UtilityHeaderBack = function UtilityHeaderBack(_ref3) {
|
|
12637
|
+
var _ref3$show = _ref3.show,
|
|
12638
|
+
show = _ref3$show === void 0 ? true : _ref3$show,
|
|
12639
|
+
link = _ref3.link,
|
|
12640
|
+
_ref3$label = _ref3.label,
|
|
12641
|
+
label = _ref3$label === void 0 ? 'Back' : _ref3$label,
|
|
12642
|
+
$showDivider = _ref3.$showDivider,
|
|
12643
|
+
$iconInGutter = _ref3.$iconInGutter,
|
|
12644
|
+
onClick = _ref3.onClick;
|
|
12645
|
+
var innerContent = React.useMemo(function () {
|
|
12646
|
+
return React__default.createElement(React__default.Fragment, null, React__default.createElement(BackLinkIcon, null, React__default.createElement(Icon, {
|
|
12647
|
+
icon: "Back",
|
|
12648
|
+
size: 16,
|
|
12649
|
+
color: "grey-10"
|
|
12650
|
+
})), label);
|
|
12651
|
+
}, [label]);
|
|
12619
12652
|
if (!show) {
|
|
12620
12653
|
return null;
|
|
12621
12654
|
}
|
|
12622
|
-
return React__default.createElement(
|
|
12655
|
+
return React__default.createElement(React__default.Fragment, null, onClick ? React__default.createElement(BackButton, Object.assign({}, {
|
|
12656
|
+
$showDivider: $showDivider,
|
|
12657
|
+
$iconInGutter: $iconInGutter,
|
|
12658
|
+
onClick: onClick
|
|
12659
|
+
}), innerContent) : React__default.createElement(BackLink, Object.assign({
|
|
12623
12660
|
to: link
|
|
12624
12661
|
}, {
|
|
12625
12662
|
$showDivider: $showDivider,
|
|
12626
12663
|
$iconInGutter: $iconInGutter
|
|
12627
|
-
}),
|
|
12628
|
-
icon: "Back",
|
|
12629
|
-
size: 16,
|
|
12630
|
-
color: "grey-10"
|
|
12631
|
-
})), label);
|
|
12664
|
+
}), innerContent));
|
|
12632
12665
|
};
|
|
12633
12666
|
|
|
12634
|
-
var _templateObject$1v, _templateObject2$1g, _templateObject3$18, _templateObject4$
|
|
12667
|
+
var _templateObject$1v, _templateObject2$1g, _templateObject3$18, _templateObject4$11, _templateObject5$X, _templateObject6$I, _templateObject7$F, _templateObject8$x, _templateObject9$p, _templateObject10$j, _templateObject11$c, _templateObject12$a;
|
|
12635
12668
|
var Container$Y = styled__default.div(_templateObject$1v || (_templateObject$1v = _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"])));
|
|
12636
12669
|
var LeftArea = styled__default.div(_templateObject2$1g || (_templateObject2$1g = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: var(--columnPadding, 16px);\n flex: 1 0 0;\n"])));
|
|
12637
12670
|
var Breadcrumbs = styled__default.div(_templateObject3$18 || (_templateObject3$18 = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n gap: 8px;\n"])));
|
|
12638
|
-
var Breadcrumb = styled__default.div(_templateObject4$
|
|
12639
|
-
var BreadcrumbIcon = styled__default.div(_templateObject5$
|
|
12640
|
-
var HomeIcon = styled__default(BreadcrumbIcon)(_templateObject6$
|
|
12641
|
-
var
|
|
12642
|
-
var
|
|
12671
|
+
var Breadcrumb = styled__default.div(_templateObject4$11 || (_templateObject4$11 = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n white-space: nowrap;\n\n"])));
|
|
12672
|
+
var BreadcrumbIcon = styled__default.div(_templateObject5$X || (_templateObject5$X = _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"])));
|
|
12673
|
+
var HomeIcon = styled__default(BreadcrumbIcon)(_templateObject6$I || (_templateObject6$I = _taggedTemplateLiteralLoose(["\n padding-bottom: 1px;\n svg path {\n transition: stroke var(--speed-normal) var(--easing-primary-out);\n }\n"])));
|
|
12674
|
+
var BreadcrumbTextStyle = styled.css(_templateObject7$F || (_templateObject7$F = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\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"])));
|
|
12675
|
+
var BreadCrumbStyle = styled.css(_templateObject8$x || (_templateObject8$x = _taggedTemplateLiteralLoose(["\n ", ";\n transition: color var(--speed-normal) var(--easing-primary-out);\n\n &:hover {\n color: var(--grey-12);\n ", " svg {\n path {\n stroke: var(--grey-12);\n }\n }\n }\n"])), BreadcrumbTextStyle, HomeIcon);
|
|
12676
|
+
var BreadcrumbLink = styled__default(reactRouterDom.Link)(_templateObject9$p || (_templateObject9$p = _taggedTemplateLiteralLoose(["\n ", ";\n"])), BreadCrumbStyle);
|
|
12677
|
+
var BreadcrumbButton = styled__default.button(_templateObject10$j || (_templateObject10$j = _taggedTemplateLiteralLoose(["\n ", ";\n ", ";\n"])), resetButtonStyles, BreadCrumbStyle);
|
|
12678
|
+
var BreadcrumbText = styled__default.span(_templateObject11$c || (_templateObject11$c = _taggedTemplateLiteralLoose(["\n ", ";\n pointer-events: none;\n"])), BreadcrumbTextStyle);
|
|
12679
|
+
var RightArea = styled__default.div(_templateObject12$a || (_templateObject12$a = _taggedTemplateLiteralLoose(["\n flex: 1;\n align-items: center;\n display: flex;\n justify-content: right;\n"])));
|
|
12643
12680
|
var UtilityHeader = function UtilityHeader(_ref) {
|
|
12644
12681
|
var _ref$showBreadcrumbs = _ref.showBreadcrumbs,
|
|
12645
12682
|
showBreadcrumbs = _ref$showBreadcrumbs === void 0 ? true : _ref$showBreadcrumbs,
|
|
@@ -12659,18 +12696,23 @@ var UtilityHeader = function UtilityHeader(_ref) {
|
|
|
12659
12696
|
"$iconInGutter": iconInGutter
|
|
12660
12697
|
}, back)), hasBreadcrumbs ? React__default.createElement(Breadcrumbs, null, breadcrumbs.map(function (breadcrumb, index) {
|
|
12661
12698
|
var text = breadcrumb.text,
|
|
12662
|
-
href = breadcrumb.href
|
|
12699
|
+
href = breadcrumb.href,
|
|
12700
|
+
onClick = breadcrumb.onClick;
|
|
12663
12701
|
var isFirst = index === 0;
|
|
12664
12702
|
var isLast = index === breadcrumbs.length - 1;
|
|
12665
|
-
|
|
12666
|
-
key: index
|
|
12667
|
-
}, React__default.createElement(Breadcrumb, null, React__default.createElement(BreadcrumbLink, {
|
|
12668
|
-
to: href
|
|
12669
|
-
}, isFirst && showHomeIcon ? React__default.createElement(HomeIcon, null, React__default.createElement(Icon, {
|
|
12703
|
+
var innerContent = React__default.createElement(React__default.Fragment, null, isFirst && showHomeIcon ? React__default.createElement(HomeIcon, null, React__default.createElement(Icon, {
|
|
12670
12704
|
icon: "Home",
|
|
12671
12705
|
size: 11,
|
|
12672
12706
|
color: 'grey-10'
|
|
12673
|
-
})) : null, text)
|
|
12707
|
+
})) : null, text);
|
|
12708
|
+
return React__default.createElement(React__default.Fragment, {
|
|
12709
|
+
key: index
|
|
12710
|
+
}, React__default.createElement(Breadcrumb, null, onClick ? React__default.createElement(BreadcrumbButton, {
|
|
12711
|
+
onClick: onClick,
|
|
12712
|
+
type: "button"
|
|
12713
|
+
}, innerContent) : href ? React__default.createElement(BreadcrumbLink, {
|
|
12714
|
+
to: href
|
|
12715
|
+
}, innerContent) : React__default.createElement(BreadcrumbText, null, innerContent), !isLast ? React__default.createElement(BreadcrumbIcon, null, React__default.createElement(Icon, {
|
|
12674
12716
|
icon: "Right",
|
|
12675
12717
|
size: 6,
|
|
12676
12718
|
color: 'grey-8'
|
|
@@ -12695,12 +12737,12 @@ var Tabs = function Tabs(_ref) {
|
|
|
12695
12737
|
}, children);
|
|
12696
12738
|
};
|
|
12697
12739
|
|
|
12698
|
-
var _templateObject$1w, _templateObject2$1h, _templateObject3$19, _templateObject4$
|
|
12740
|
+
var _templateObject$1w, _templateObject2$1h, _templateObject3$19, _templateObject4$12, _templateObject5$Y;
|
|
12699
12741
|
var Container$Z = styled__default.div(_templateObject$1w || (_templateObject$1w = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex-direction: column;\n position: relative;\n\n min-height: 100%;\n display: flex;\n"])));
|
|
12700
12742
|
var HeaderArea = styled__default.div(_templateObject2$1h || (_templateObject2$1h = _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"])));
|
|
12701
12743
|
var TabArea = styled__default.div(_templateObject3$19 || (_templateObject3$19 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n border-bottom: 1px solid var(--grey-4);\n"])));
|
|
12702
|
-
var TabAreaInner = styled__default.div(_templateObject4$
|
|
12703
|
-
var Content = styled__default.div(_templateObject5$
|
|
12744
|
+
var TabAreaInner = styled__default.div(_templateObject4$12 || (_templateObject4$12 = _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"])));
|
|
12745
|
+
var Content = styled__default.div(_templateObject5$Y || (_templateObject5$Y = _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\n display: flex;\n flex: 1;\n flex-direction: column;\n"])));
|
|
12704
12746
|
var ContentLayout = function ContentLayout(_ref) {
|
|
12705
12747
|
var _ref$layout = _ref.layout,
|
|
12706
12748
|
layout = _ref$layout === void 0 ? 'default' : _ref$layout,
|
|
@@ -12740,15 +12782,15 @@ var FullWidthContentBlock = function FullWidthContentBlock(_ref2) {
|
|
|
12740
12782
|
}, children));
|
|
12741
12783
|
};
|
|
12742
12784
|
|
|
12743
|
-
var _templateObject$1y, _templateObject2$1j, _templateObject3$1a, _templateObject4$
|
|
12785
|
+
var _templateObject$1y, _templateObject2$1j, _templateObject3$1a, _templateObject4$13, _templateObject5$Z, _templateObject6$J, _templateObject7$G, _templateObject8$y;
|
|
12744
12786
|
var Inner$1 = styled__default.div(_templateObject$1y || (_templateObject$1y = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: 0 0 200px;\n justify-content: center;\n align-items: center;\n gap: 8px;\n"])));
|
|
12745
12787
|
var Line = styled__default.div(_templateObject2$1j || (_templateObject2$1j = _taggedTemplateLiteralLoose(["\n background: var(--grey-10);\n flex: 1;\n"])));
|
|
12746
12788
|
var IconContainer$3 = styled__default.div(_templateObject3$1a || (_templateObject3$1a = _taggedTemplateLiteralLoose(["\n flex: 0 0 20px;\n svg {\n path {\n stroke: var(--grey-11);\n }\n }\n"])));
|
|
12747
|
-
var IconDefault = styled__default.svg(_templateObject4$
|
|
12789
|
+
var IconDefault = styled__default.svg(_templateObject4$13 || (_templateObject4$13 = _taggedTemplateLiteralLoose(["\n transform: ", ";\n"])), function (_ref) {
|
|
12748
12790
|
var $layout = _ref.$layout;
|
|
12749
12791
|
return $layout === 'horizontal' ? 'rotate(0deg)' : 'rotate(90deg)';
|
|
12750
12792
|
});
|
|
12751
|
-
var IconArrow = styled__default.svg(_templateObject5$
|
|
12793
|
+
var IconArrow = styled__default.svg(_templateObject5$Z || (_templateObject5$Z = _taggedTemplateLiteralLoose(["\n transform: rotate(0deg);\n ", ";\n"])), function (_ref2) {
|
|
12752
12794
|
var $direction = _ref2.$direction;
|
|
12753
12795
|
switch ($direction) {
|
|
12754
12796
|
case 'up':
|
|
@@ -12762,9 +12804,9 @@ var IconArrow = styled__default.svg(_templateObject5$Y || (_templateObject5$Y =
|
|
|
12762
12804
|
return 'transform: rotate(0deg);';
|
|
12763
12805
|
}
|
|
12764
12806
|
});
|
|
12765
|
-
var Container$_ = styled__default.div(_templateObject6$
|
|
12807
|
+
var Container$_ = styled__default.div(_templateObject6$J || (_templateObject6$J = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n\n ", "\n"])), function (_ref3) {
|
|
12766
12808
|
var $layout = _ref3.$layout;
|
|
12767
|
-
return $layout === 'horizontal' ? styled.css(_templateObject7$
|
|
12809
|
+
return $layout === 'horizontal' ? styled.css(_templateObject7$G || (_templateObject7$G = _taggedTemplateLiteralLoose(["\n width: 16px;\n flex-direction: column;\n ", "{\n flex-direction: column;\n }\n\n ", "{\n width: 1px;\n }\n\n "])), Inner$1, Line) : styled.css(_templateObject8$y || (_templateObject8$y = _taggedTemplateLiteralLoose(["\n height: 16px;\n flex-direction: row;\n ", "{\n flex-direction: row;\n }\n ", "{\n height: 1px;\n }\n "])), Inner$1, Line);
|
|
12768
12810
|
});
|
|
12769
12811
|
var ResizeLine = function ResizeLine(_ref4) {
|
|
12770
12812
|
var _ref4$state = _ref4.state,
|
|
@@ -12808,15 +12850,15 @@ var ResizeLine = function ResizeLine(_ref4) {
|
|
|
12808
12850
|
}))), React__default.createElement(Line, null)));
|
|
12809
12851
|
};
|
|
12810
12852
|
|
|
12811
|
-
var _templateObject$1z, _templateObject2$1k, _templateObject3$1b, _templateObject4$
|
|
12853
|
+
var _templateObject$1z, _templateObject2$1k, _templateObject3$1b, _templateObject4$14, _templateObject5$_, _templateObject6$K, _templateObject7$H, _templateObject8$z, _templateObject9$q, _templateObject10$k, _templateObject11$d, _templateObject12$b, _templateObject13$9, _templateObject14$8, _templateObject15$6, _templateObject16$5, _templateObject17$5, _templateObject18$3, _templateObject19$3;
|
|
12812
12854
|
var DebugData = styled__default.div(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteralLoose(["\n position: absolute;\n z-index: 10;\n bottom: 20px;\n left: 20px;\n background: #ededed99;\n border: grey 1px solid;\n padding: 20px;\n line-height: 20px;\n font-size: 12px;\n div {\n display: block;\n }\n span {\n display: inline-block;\n width: 130px;\n font-weight: 600;\n }\n"])));
|
|
12813
12855
|
var MainArea = styled__default.div(_templateObject2$1k || (_templateObject2$1k = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n flex: 1;\n\n ", "\n"])), function (_ref) {
|
|
12814
12856
|
var $layout = _ref.$layout,
|
|
12815
12857
|
$minDimension = _ref.$minDimension;
|
|
12816
|
-
return $layout === 'vertical' ? styled.css(_templateObject3$1b || (_templateObject3$1b = _taggedTemplateLiteralLoose(["\n ", ";\n "])), $minDimension ? "min-height: " + $minDimension + "px;" : null) : styled.css(_templateObject4$
|
|
12858
|
+
return $layout === 'vertical' ? styled.css(_templateObject3$1b || (_templateObject3$1b = _taggedTemplateLiteralLoose(["\n ", ";\n "])), $minDimension ? "min-height: " + $minDimension + "px;" : null) : styled.css(_templateObject4$14 || (_templateObject4$14 = _taggedTemplateLiteralLoose(["\n ", ";\n "])), $minDimension ? "min-width: " + $minDimension + "px;" : null);
|
|
12817
12859
|
});
|
|
12818
|
-
var SideAreaInner = styled__default.div(_templateObject5$
|
|
12819
|
-
var SideArea = styled__default.div(_templateObject6$
|
|
12860
|
+
var SideAreaInner = styled__default.div(_templateObject5$_ || (_templateObject5$_ = _taggedTemplateLiteralLoose(["\n display: flex;\n flex: 1;\n height: 100%;\n transition: opacity 0.2s cubic-bezier(0.85, 0, 0.15, 1);\n"])));
|
|
12861
|
+
var SideArea = styled__default.div(_templateObject6$K || (_templateObject6$K = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n flex: 0 0 ", "px;\n display: ", ";\n transition:\n min-width 0.65s cubic-bezier(0, 0.55, 0.45, 1),\n min-height 0.65s cubic-bezier(0, 0.55, 0.45, 1);\n\n ", "\n\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref2) {
|
|
12820
12862
|
var $defaultSize = _ref2.$defaultSize;
|
|
12821
12863
|
return $defaultSize;
|
|
12822
12864
|
}, function (_ref3) {
|
|
@@ -12826,25 +12868,25 @@ var SideArea = styled__default.div(_templateObject6$J || (_templateObject6$J = _
|
|
|
12826
12868
|
var $layout = _ref4.$layout,
|
|
12827
12869
|
$maxDimension = _ref4.$maxDimension,
|
|
12828
12870
|
$minDimension = _ref4.$minDimension;
|
|
12829
|
-
return $layout === 'vertical' ? styled.css(_templateObject7$
|
|
12871
|
+
return $layout === 'vertical' ? styled.css(_templateObject7$H || (_templateObject7$H = _taggedTemplateLiteralLoose(["\n ", ";\n ", ";\n ", "{\n min-height: ", "px;\n }\n "])), $minDimension ? "min-height: " + $minDimension + "px;" : '0', $maxDimension ? "max-height: " + $maxDimension + "px;" : 'none', SideAreaInner, $minDimension) : styled.css(_templateObject8$z || (_templateObject8$z = _taggedTemplateLiteralLoose(["\n ", ";\n ", ";\n ", "{\n min-width: ", "px;\n }\n "])), $minDimension ? "min-width: " + $minDimension + "px;" : '0', $maxDimension ? "max-width: " + $maxDimension + "px;" : 'none', SideAreaInner, $minDimension);
|
|
12830
12872
|
}, function (_ref5) {
|
|
12831
12873
|
var $layout = _ref5.$layout,
|
|
12832
12874
|
$collapseState = _ref5.$collapseState,
|
|
12833
12875
|
$minDimension = _ref5.$minDimension;
|
|
12834
|
-
return $collapseState === 'collapsing' ? styled.css(_templateObject9$
|
|
12876
|
+
return $collapseState === 'collapsing' ? styled.css(_templateObject9$q || (_templateObject9$q = _taggedTemplateLiteralLoose(["\n transition: none;\n ", ";\n ", "{\n flex: 0 0 ", "px;\n min-width: ", "px;\n opacity: 0.5;\n }\n "])), $layout === 'horizontal' ? 'min-width: 0' : 'min-height: 0', SideAreaInner, $minDimension, $minDimension) : null;
|
|
12835
12877
|
}, function (_ref6) {
|
|
12836
12878
|
var $collapseState = _ref6.$collapseState;
|
|
12837
|
-
return $collapseState === 'collapsed' ? styled.css(_templateObject10$
|
|
12879
|
+
return $collapseState === 'collapsed' ? styled.css(_templateObject10$k || (_templateObject10$k = _taggedTemplateLiteralLoose(["\n ", "{\n display: none;\n }\n "])), SideAreaInner) : null;
|
|
12838
12880
|
}, function (_ref7) {
|
|
12839
12881
|
var $layout = _ref7.$layout,
|
|
12840
12882
|
$collapseState = _ref7.$collapseState,
|
|
12841
12883
|
$minDimension = _ref7.$minDimension;
|
|
12842
|
-
return $collapseState === 'peeking' ? styled.css(_templateObject11$
|
|
12884
|
+
return $collapseState === 'peeking' ? styled.css(_templateObject11$d || (_templateObject11$d = _taggedTemplateLiteralLoose(["\n ", ";\n ", "{\n min-width: ", "px;\n opacity: 0.5;\n }\n "])), $layout === 'horizontal' ? 'min-width: 0' : 'min-height: 0', SideAreaInner, $minDimension) : null;
|
|
12843
12885
|
}, function (_ref8) {
|
|
12844
12886
|
var $layout = _ref8.$layout,
|
|
12845
12887
|
$collapseState = _ref8.$collapseState,
|
|
12846
12888
|
$minDimension = _ref8.$minDimension;
|
|
12847
|
-
return $collapseState === 'opening' ? styled.css(_templateObject12$
|
|
12889
|
+
return $collapseState === 'opening' ? styled.css(_templateObject12$b || (_templateObject12$b = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", "{\n min-width: ", "px;\n }\n "])), $layout === 'horizontal' ? 'min-width: 0' : 'min-height: 0', SideAreaInner, $minDimension) : null;
|
|
12848
12890
|
});
|
|
12849
12891
|
var DragContainer = styled__default.div(_templateObject13$9 || (_templateObject13$9 = _taggedTemplateLiteralLoose(["\n flex: 0 0 ", "px;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: col-resize;\n\n > div {\n transition: opacity 0.15s cubic-bezier(0.45, 0, 0.55, 1);\n }\n\n &:hover > div {\n opacity: 1;\n }\n\n ", "\n\n"])), function (_ref9) {
|
|
12850
12892
|
var $size = _ref9.$size;
|
|
@@ -13152,43 +13194,43 @@ var clampInt = function clampInt(value, lower, upper) {
|
|
|
13152
13194
|
return clampedInt;
|
|
13153
13195
|
};
|
|
13154
13196
|
|
|
13155
|
-
var _templateObject$1A, _templateObject2$1l, _templateObject3$1c, _templateObject4$
|
|
13197
|
+
var _templateObject$1A, _templateObject2$1l, _templateObject3$1c, _templateObject4$15, _templateObject5$$, _templateObject6$L, _templateObject7$I;
|
|
13156
13198
|
var MOBILE_CLOSE_HEIGHT = 50;
|
|
13157
13199
|
var MOBILE_NAVBAR_HEIGHT = 68;
|
|
13158
13200
|
var Layout = styled__default.div(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
13159
13201
|
var MobileLayout = styled__default.div(_templateObject2$1l || (_templateObject2$1l = _taggedTemplateLiteralLoose([""])));
|
|
13160
13202
|
var Content$1 = styled__default.div(_templateObject3$1c || (_templateObject3$1c = _taggedTemplateLiteralLoose(["\n padding: 0;\n flex: 1;\n overflow: auto;\n\n & > div {\n max-width: 1400px;\n }\n\n ", "\n"])), function (_ref) {
|
|
13161
13203
|
var maxWidth = _ref.maxWidth;
|
|
13162
|
-
return maxWidth && styled.css(_templateObject4$
|
|
13204
|
+
return maxWidth && styled.css(_templateObject4$15 || (_templateObject4$15 = _taggedTemplateLiteralLoose(["\n & > div {\n max-width: ", ";\n }\n "])), maxWidth);
|
|
13163
13205
|
});
|
|
13164
|
-
var MainContainer = styled__default.div(_templateObject5
|
|
13165
|
-
var ContentArea = styled__default.div(_templateObject6$
|
|
13206
|
+
var MainContainer = styled__default.div(_templateObject5$$ || (_templateObject5$$ = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n flex-direction: column;\n"])));
|
|
13207
|
+
var ContentArea = styled__default.div(_templateObject6$L || (_templateObject6$L = _taggedTemplateLiteralLoose(["\n flex: 1;\n width: 100%;\n margin-left: auto;\n margin-right: auto;\n\n ", "\n"])), function (_ref2) {
|
|
13166
13208
|
var legacyLayout = _ref2.legacyLayout,
|
|
13167
13209
|
paddingOverride = _ref2.paddingOverride,
|
|
13168
13210
|
maxWidth = _ref2.maxWidth;
|
|
13169
|
-
return legacyLayout && styled.css(_templateObject7$
|
|
13211
|
+
return legacyLayout && styled.css(_templateObject7$I || (_templateObject7$I = _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');
|
|
13170
13212
|
});
|
|
13171
13213
|
|
|
13172
|
-
var _templateObject$1B, _templateObject2$1m, _templateObject3$1d, _templateObject4$
|
|
13214
|
+
var _templateObject$1B, _templateObject2$1m, _templateObject3$1d, _templateObject4$16, _templateObject5$10, _templateObject6$M, _templateObject7$J, _templateObject8$A, _templateObject9$r, _templateObject10$l, _templateObject11$e, _templateObject12$c, _templateObject13$a, _templateObject14$9, _templateObject15$7;
|
|
13173
13215
|
var ContextTitle = styled__default.div(_templateObject$1B || (_templateObject$1B = _taggedTemplateLiteralLoose(["\n opacity: 0;\n transition: opacity var(--speed-fast) var(--easing-primary-in-out);\n\n ", "\n"])), function (_ref) {
|
|
13174
13216
|
var compact = _ref.compact;
|
|
13175
13217
|
return compact && styled.css(_templateObject2$1m || (_templateObject2$1m = _taggedTemplateLiteralLoose(["\n font-size:14px;\n "])));
|
|
13176
13218
|
});
|
|
13177
13219
|
var ContextIcon$1 = styled__default.div(_templateObject3$1d || (_templateObject3$1d = _taggedTemplateLiteralLoose(["\n background-color: var(--global-menu-icon-background-default);\n transition: background-color var(--speed-fast) var(--easing-primary-out);\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"])));
|
|
13178
|
-
var ContextIndicator = styled__default.div(_templateObject4$
|
|
13179
|
-
var ContextActionBaseCSS$1 = styled.css(_templateObject5
|
|
13180
|
-
var StyledAnchor = styled__default.a(_templateObject6$
|
|
13181
|
-
var ExternalIconWrapper = styled__default.div(_templateObject7$
|
|
13182
|
-
var ContextWrapper = styled__default.div(_templateObject8$
|
|
13220
|
+
var ContextIndicator = styled__default.div(_templateObject4$16 || (_templateObject4$16 = _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 opacity: 0;\n transition: opacity 0 var(--easing-primary-out);\n\n svg {\n display: block;\n height: 12px;\n width: 12px;\n }\n"])));
|
|
13221
|
+
var ContextActionBaseCSS$1 = styled.css(_templateObject5$10 || (_templateObject5$10 = _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 font-family: var(--font-ui);\n font-weight: 500;\n font-size: 16px;\n color: var(--grey-11);\n\n &:hover{\n color: var(--grey-12);\n }\n"])));
|
|
13222
|
+
var StyledAnchor = styled__default.a(_templateObject6$M || (_templateObject6$M = _taggedTemplateLiteralLoose(["\n display: flex;\n text-decoration: none;\n"])));
|
|
13223
|
+
var ExternalIconWrapper = styled__default.div(_templateObject7$J || (_templateObject7$J = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
|
|
13224
|
+
var ContextWrapper = styled__default.div(_templateObject8$A || (_templateObject8$A = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n background-color: var(--global-menu-icon-background-hover);\n\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n"])), ContextActionBaseCSS$1, function (_ref2) {
|
|
13183
13225
|
var $menuOpen = _ref2.$menuOpen;
|
|
13184
|
-
return $menuOpen && styled.css(_templateObject9$
|
|
13226
|
+
return $menuOpen && styled.css(_templateObject9$r || (_templateObject9$r = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n"])), ContextTitle);
|
|
13185
13227
|
}, ContextIcon$1, IconWrapper);
|
|
13186
|
-
var ContextActionA = styled__default(reactRouterDom.Link)(_templateObject10$
|
|
13228
|
+
var ContextActionA = styled__default(reactRouterDom.Link)(_templateObject10$l || (_templateObject10$l = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n background-color: var(--global-menu-icon-background-hover);\n\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref3) {
|
|
13187
13229
|
var $menuOpen = _ref3.$menuOpen;
|
|
13188
|
-
return $menuOpen && styled.css(_templateObject11$
|
|
13230
|
+
return $menuOpen && styled.css(_templateObject11$e || (_templateObject11$e = _taggedTemplateLiteralLoose(["\n ", "{\n opacity: 1;\n }\n "])), ContextTitle);
|
|
13189
13231
|
}, ContextIcon$1, IconWrapper, function (_ref4) {
|
|
13190
13232
|
var $isActive = _ref4.$isActive;
|
|
13191
|
-
return $isActive && styled.css(_templateObject12$
|
|
13233
|
+
return $isActive && styled.css(_templateObject12$c || (_templateObject12$c = _taggedTemplateLiteralLoose(["\n color: var(--grey-12);\n\n ", ",\n &:hover ", "{\n background-color: var(--global-menu-icon-background-active);\n }\n "])), ContextIcon$1, ContextIcon$1);
|
|
13192
13234
|
});
|
|
13193
13235
|
var ContextActionButton$1 = styled__default.button(_templateObject13$a || (_templateObject13$a = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n &:hover ", "{\n opacity: 1;\n background-color: var(--global-menu-icon-background-hover);\n\n ", "{\n [stroke]{\n stroke: var(--inverse);\n }\n }\n }\n\n ", "\n"])), ContextActionBaseCSS$1, function (_ref5) {
|
|
13194
13236
|
var menuOpen = _ref5.menuOpen;
|
|
@@ -13368,20 +13410,20 @@ var useMenu = function useMenu(defaultMenuOpen, canAlwaysPin) {
|
|
|
13368
13410
|
};
|
|
13369
13411
|
};
|
|
13370
13412
|
|
|
13371
|
-
var _templateObject$1C, _templateObject2$1n, _templateObject3$1e, _templateObject4$
|
|
13413
|
+
var _templateObject$1C, _templateObject2$1n, _templateObject3$1e, _templateObject4$17, _templateObject5$11, _templateObject6$N, _templateObject7$K, _templateObject8$B, _templateObject9$s, _templateObject10$m, _templateObject11$f, _templateObject12$d, _templateObject13$b;
|
|
13372
13414
|
var Submenu = styled__default.ul(_templateObject$1C || (_templateObject$1C = _taggedTemplateLiteralLoose(["\n display: block;\n position: relative;\n margin-left: 40px;\n padding: 0;\n\n"])));
|
|
13373
13415
|
var SubmenuHeader = styled__default.div(_templateObject2$1n || (_templateObject2$1n = _taggedTemplateLiteralLoose(["\n display: block;\n height: 40px;\n margin-left: 40px;\n"])));
|
|
13374
13416
|
var SubmenuContainerInner = styled__default.div(_templateObject3$1e || (_templateObject3$1e = _taggedTemplateLiteralLoose(["\n overflow: hidden;\n"])));
|
|
13375
|
-
var SubmenuItemTitle = styled__default.span(_templateObject4$
|
|
13376
|
-
var SubmenuItemLink = styled__default(reactRouterDom.Link)(_templateObject5$
|
|
13377
|
-
var ExternalIconWrapper$1 = styled__default.div(_templateObject6$
|
|
13378
|
-
var SubmenuItemAnchor = styled__default.a(_templateObject7$
|
|
13379
|
-
var SubmenuItem = styled__default.li(_templateObject8$
|
|
13417
|
+
var SubmenuItemTitle = styled__default.span(_templateObject4$17 || (_templateObject4$17 = _taggedTemplateLiteralLoose(["\n display: block;\n font-family: var(--font-ui);\n font-size: 14px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.35px;\n color: var(--grey-11);\n"])));
|
|
13418
|
+
var SubmenuItemLink = styled__default(reactRouterDom.Link)(_templateObject5$11 || (_templateObject5$11 = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n"])), resetButtonStyles);
|
|
13419
|
+
var ExternalIconWrapper$1 = styled__default.div(_templateObject6$N || (_templateObject6$N = _taggedTemplateLiteralLoose(["\n margin-left: 15px;\n"])));
|
|
13420
|
+
var SubmenuItemAnchor = styled__default.a(_templateObject7$K || (_templateObject7$K = _taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n align-items: center;\n"])), resetButtonStyles);
|
|
13421
|
+
var SubmenuItem = styled__default.li(_templateObject8$B || (_templateObject8$B = _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: var(--dividing-line);\n }\n\n ", ", ", "{\n font-family: var(--font-ui);\n font-size: 14px;\n font-weight: 400;\n text-decoration: none;\n color: var(--grey-11);\n\n ", ";\n\n }\n"])), SubmenuItemLink, SubmenuItemAnchor, function (_ref) {
|
|
13380
13422
|
var isActive = _ref.isActive;
|
|
13381
|
-
return styled.css(_templateObject9$
|
|
13423
|
+
return styled.css(_templateObject9$s || (_templateObject9$s = _taggedTemplateLiteralLoose(["\n \n &:hover {\n color: var(--grey-12);\n }\n\n ", "\n\n "])), isActive && styled.css(_templateObject10$m || (_templateObject10$m = _taggedTemplateLiteralLoose(["\n &, &:hover {\n color: var(--grey-11);\n font-weight: 600;\n }\n "]))));
|
|
13382
13424
|
});
|
|
13383
|
-
var SubmenuContainer = styled__default.div(_templateObject11$
|
|
13384
|
-
var ContextContainer = styled__default.div(_templateObject12$
|
|
13425
|
+
var SubmenuContainer = styled__default.div(_templateObject11$f || (_templateObject11$f = _taggedTemplateLiteralLoose(["\n position: relative;\n overflow: hidden;\n\n transition:\n grid-template-rows var(--speed-normal) var(--easing-primary-in-out),\n opacity var(--speed-fast) var(--easing-primary-in-out);\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: var(--dividing-line);\n }\n\n"])));
|
|
13426
|
+
var ContextContainer = styled__default.div(_templateObject12$d || (_templateObject12$d = _taggedTemplateLiteralLoose(["\n min-height: ", ";\n width: inherit;\n\n ", "{\n display: grid;\n grid-template-rows: 0fr;\n };\n\n ", ";\n"])), function (_ref2) {
|
|
13385
13427
|
var mobileMenu = _ref2.mobileMenu;
|
|
13386
13428
|
return mobileMenu ? '30px' : '70px';
|
|
13387
13429
|
}, SubmenuContainer, function (_ref3) {
|
|
@@ -13477,23 +13519,23 @@ var generateSubmenus = function generateSubmenus(submenu, onClickCallback) {
|
|
|
13477
13519
|
return output;
|
|
13478
13520
|
};
|
|
13479
13521
|
|
|
13480
|
-
var _templateObject$1D, _templateObject2$1o, _templateObject3$1f, _templateObject4$
|
|
13522
|
+
var _templateObject$1D, _templateObject2$1o, _templateObject3$1f, _templateObject4$18, _templateObject5$12, _templateObject6$O, _templateObject7$L, _templateObject8$C, _templateObject9$t, _templateObject10$n, _templateObject11$g, _templateObject12$e, _templateObject13$c, _templateObject14$a;
|
|
13481
13523
|
var Logo = styled__default(reactRouterDom.Link)(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteralLoose(["\n height: 50px;\n margin: 0 20px 55px 15px;\n display: flex;\n\n object {\n pointer-events: none;\n }\n"])));
|
|
13482
13524
|
var LogoMark = styled__default.div(_templateObject2$1o || (_templateObject2$1o = _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"])));
|
|
13483
13525
|
var LogoType = styled__default.div(_templateObject3$1f || (_templateObject3$1f = _taggedTemplateLiteralLoose(["\n opacity: 0;\n flex: 1;\n height: 50px;\n display: flex;\n justify-content: left;\n align-items: center;\n"])));
|
|
13484
|
-
var SVGObject = styled__default.object(_templateObject4$
|
|
13485
|
-
var SVGObjectText = styled__default.object(_templateObject5$
|
|
13486
|
-
var NavigationContainer = styled__default.div(_templateObject6$
|
|
13487
|
-
var MenuFooter = styled__default.div(_templateObject7$
|
|
13488
|
-
var FooterItemContainer = styled__default.div(_templateObject8$
|
|
13489
|
-
var PushContainer = styled__default.div(_templateObject9$
|
|
13526
|
+
var SVGObject = styled__default.object(_templateObject4$18 || (_templateObject4$18 = _taggedTemplateLiteralLoose([""])));
|
|
13527
|
+
var SVGObjectText = styled__default.object(_templateObject5$12 || (_templateObject5$12 = _taggedTemplateLiteralLoose(["\n max-width: 180px;\n"])));
|
|
13528
|
+
var NavigationContainer = styled__default.div(_templateObject6$O || (_templateObject6$O = _taggedTemplateLiteralLoose([""])));
|
|
13529
|
+
var MenuFooter = styled__default.div(_templateObject7$L || (_templateObject7$L = _taggedTemplateLiteralLoose(["\n background: var(--global-element-background);\n display: flex;\n flex-direction: column;\n flex: 1;\n justify-content: flex-end;\n"])));
|
|
13530
|
+
var FooterItemContainer = styled__default.div(_templateObject8$C || (_templateObject8$C = _taggedTemplateLiteralLoose(["\n min-height: 70px;\n"])));
|
|
13531
|
+
var PushContainer = styled__default.div(_templateObject9$t || (_templateObject9$t = _taggedTemplateLiteralLoose(["\n position: relative;\n height: 100%;\n ", ";\n"])), function (_ref) {
|
|
13490
13532
|
var isPinned = _ref.isPinned;
|
|
13491
|
-
return styled.css(_templateObject10$
|
|
13533
|
+
return styled.css(_templateObject10$n || (_templateObject10$n = _taggedTemplateLiteralLoose(["\n width: ", ";\n "])), isPinned ? "var(--global-menu-width-open)" : "var(--global-menu-width-closed)");
|
|
13492
13534
|
});
|
|
13493
|
-
var Container$10 = styled__default.div(_templateObject11$
|
|
13535
|
+
var Container$10 = styled__default.div(_templateObject11$g || (_templateObject11$g = _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 (_ref2) {
|
|
13494
13536
|
var open = _ref2.open,
|
|
13495
13537
|
desktopSize = _ref2.desktopSize;
|
|
13496
|
-
return styled.css(_templateObject12$
|
|
13538
|
+
return styled.css(_templateObject12$e || (_templateObject12$e = _taggedTemplateLiteralLoose(["\n background-color: var(--global-element-background);\n box-shadow: 0px 0px 7px 0px var(--primary-a2);\n width: ", ";\n border-right: 1px solid var(--dividing-line);\n\n ", ";\n\n ", "{\n transition: opacity var(--speed-normal) var(--easing-primary-in-out);\n opacity: ", ";\n }\n "])), open ? "var(--global-menu-width-open)" : "var(--global-menu-width-closed)", desktopSize === 'xxlarge' ? "" : styled.css(_templateObject13$c || (_templateObject13$c = _taggedTemplateLiteralLoose(["\n transition: width var(--speed-normal) var(--easing-primary-in);\n "]))), LogoType, open ? 1 : 0);
|
|
13497
13539
|
});
|
|
13498
13540
|
var ContainerInner = styled__default.div(_templateObject14$a || (_templateObject14$a = _taggedTemplateLiteralLoose(["\n width: var(--global-menu-width-open);\n display: flex;\n flex-direction: column;\n height: 100%;\n"])));
|
|
13499
13541
|
var MainMenu = function MainMenu(_ref3) {
|
|
@@ -13595,17 +13637,17 @@ var MainMenu = function MainMenu(_ref3) {
|
|
|
13595
13637
|
})) : null))), document.body));
|
|
13596
13638
|
};
|
|
13597
13639
|
|
|
13598
|
-
var _templateObject$1E, _templateObject2$1p, _templateObject3$1g, _templateObject4$
|
|
13640
|
+
var _templateObject$1E, _templateObject2$1p, _templateObject3$1g, _templateObject4$19, _templateObject5$13, _templateObject6$P, _templateObject7$M, _templateObject8$D, _templateObject9$u, _templateObject10$o;
|
|
13599
13641
|
var MetaConatiner = styled__default.div(_templateObject$1E || (_templateObject$1E = _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"])));
|
|
13600
13642
|
var LabelTitle = styled__default.div(_templateObject2$1p || (_templateObject2$1p = _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: var(--font-ui);\n margin-top: 2px;\n"])));
|
|
13601
13643
|
var LabelContent = styled__default.div(_templateObject3$1g || (_templateObject3$1g = _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"])));
|
|
13602
|
-
var LabelNotes = styled__default.div(_templateObject4$
|
|
13603
|
-
var TitleContainer = styled__default.div(_templateObject5$
|
|
13604
|
-
var Container$11 = styled__default.div(_templateObject6$
|
|
13605
|
-
var TitleBox = styled__default.div(_templateObject7$
|
|
13606
|
-
var IconBox = styled__default.div(_templateObject8$
|
|
13607
|
-
var CopyTextBox = styled__default.pre(_templateObject9$
|
|
13608
|
-
var CopyBox = styled__default.div(_templateObject10$
|
|
13644
|
+
var LabelNotes = styled__default.div(_templateObject4$19 || (_templateObject4$19 = _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 font-family: var(--font-data);\n"])));
|
|
13645
|
+
var TitleContainer = styled__default.div(_templateObject5$13 || (_templateObject5$13 = _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"])));
|
|
13646
|
+
var Container$11 = styled__default.div(_templateObject6$P || (_templateObject6$P = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n"])));
|
|
13647
|
+
var TitleBox = styled__default.div(_templateObject7$M || (_templateObject7$M = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
13648
|
+
var IconBox = styled__default.div(_templateObject8$D || (_templateObject8$D = _taggedTemplateLiteralLoose(["\n padding: 1px 5px 0 0;\n opacity: 0;\n ", ":hover & {\n opacity: 1;\n cursor: pointer;\n }\n"])), Container$11);
|
|
13649
|
+
var CopyTextBox = styled__default.pre(_templateObject9$u || (_templateObject9$u = _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: var(--font-data);\n right:10px;\n margin-top: -23px;\n"])));
|
|
13650
|
+
var CopyBox = styled__default.div(_templateObject10$o || (_templateObject10$o = _taggedTemplateLiteralLoose(["\n"])));
|
|
13609
13651
|
var UserDrawerMeta = function UserDrawerMeta(_ref) {
|
|
13610
13652
|
var item = _ref.item,
|
|
13611
13653
|
onUserDrawerMetaClick = _ref.onUserDrawerMetaClick,
|
|
@@ -13668,11 +13710,11 @@ var UserDrawerMeta = function UserDrawerMeta(_ref) {
|
|
|
13668
13710
|
}, notes) : null)));
|
|
13669
13711
|
};
|
|
13670
13712
|
|
|
13671
|
-
var _templateObject$1F, _templateObject2$1q, _templateObject3$1h, _templateObject4$
|
|
13713
|
+
var _templateObject$1F, _templateObject2$1q, _templateObject3$1h, _templateObject4$1a;
|
|
13672
13714
|
var Container$12 = styled__default.div(_templateObject$1F || (_templateObject$1F = _taggedTemplateLiteralLoose(["\n padding: 16px 10px 14px 23px;\n display: flex;\n flex-direction: row;\n border-top: 1px solid var(--dividing-line);\n align-items: center;\n cursor: pointer;\n svg {\n margin-top: 7px;\n }\n"])));
|
|
13673
13715
|
var ColumnContainer = styled__default.div(_templateObject2$1q || (_templateObject2$1q = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n padding-left: 14px;\n align-items: flex-start;\n"])));
|
|
13674
13716
|
var Title$8 = styled__default.div(_templateObject3$1h || (_templateObject3$1h = _taggedTemplateLiteralLoose(["\n opacity: 0.76;\n font-family: var(--font-ui);\n font-size: 12px;\n font-weight: 500;\n letter-spacing: 0.34px;\n color: var(--grey-11);\n"])));
|
|
13675
|
-
var SubTitle$1 = styled__default.div(_templateObject4$
|
|
13717
|
+
var SubTitle$1 = styled__default.div(_templateObject4$1a || (_templateObject4$1a = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n font-size: 10px;\n line-height: 12px;\n font-weight: 500;\n letter-spacing: 0.29px;\n color: var(--grey-11);\n padding-top: 2px;\n opacity: 0.5;\n"])));
|
|
13676
13718
|
var DrawerBottomMenu = function DrawerBottomMenu(_ref) {
|
|
13677
13719
|
var _ref$icon = _ref.icon,
|
|
13678
13720
|
icon = _ref$icon === void 0 ? 'Settings' : _ref$icon,
|
|
@@ -13689,21 +13731,21 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref) {
|
|
|
13689
13731
|
}), React__default.createElement(ColumnContainer, null, React__default.createElement(Title$8, null, title), React__default.createElement(SubTitle$1, null, subTitle)));
|
|
13690
13732
|
};
|
|
13691
13733
|
|
|
13692
|
-
var _templateObject$1G, _templateObject2$1r, _templateObject3$1i, _templateObject4$
|
|
13734
|
+
var _templateObject$1G, _templateObject2$1r, _templateObject3$1i, _templateObject4$1b, _templateObject5$14, _templateObject6$Q, _templateObject7$N, _templateObject8$E, _templateObject9$v, _templateObject10$p, _templateObject11$h, _templateObject12$f, _templateObject13$d, _templateObject14$b;
|
|
13693
13735
|
var DrawerTop = styled__default.div(_templateObject$1G || (_templateObject$1G = _taggedTemplateLiteralLoose([""])));
|
|
13694
13736
|
var DrawerBottom = styled__default.div(_templateObject2$1r || (_templateObject2$1r = _taggedTemplateLiteralLoose(["\n width: 100%;\n position: fixed;\n bottom: 50px;\n @media ", " {\n position: static;\n bottom: 0;\n }\n"])), deviceMediaQuery.medium);
|
|
13695
13737
|
var DrawerHeader = styled__default.h2(_templateObject3$1i || (_templateObject3$1i = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.35px;\n color: var(--grey-11);\n padding: 0;\n margin: 0 0 5px;\n"])));
|
|
13696
|
-
var CurrentUser = styled__default.div(_templateObject4$
|
|
13697
|
-
var UserOptions = styled__default.div(_templateObject5$
|
|
13698
|
-
var Logout = styled__default.div(_templateObject6$
|
|
13699
|
-
var LinkMenu = styled__default.ul(_templateObject7$
|
|
13700
|
-
var LinkMenuItem = styled__default.li(_templateObject8$
|
|
13701
|
-
var IconWrapperFooter = styled__default.div(_templateObject9$
|
|
13702
|
-
var LinkMenuItemA = styled__default(reactRouterDom.Link)(_templateObject10$
|
|
13738
|
+
var CurrentUser = styled__default.div(_templateObject4$1b || (_templateObject4$1b = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 15px;\n border-bottom: var(--dividing-line) 1px solid;\n font-size: 12px;\n font-weight: 400;\n color: var(--grey-11);\n"])));
|
|
13739
|
+
var UserOptions = styled__default.div(_templateObject5$14 || (_templateObject5$14 = _taggedTemplateLiteralLoose(["\n padding: 20px 20px 10px 20px;\n border-bottom: var(--dividing-line) 1px solid;\n"])));
|
|
13740
|
+
var Logout = styled__default.div(_templateObject6$Q || (_templateObject6$Q = _taggedTemplateLiteralLoose(["\n padding: 0 20px;\n"])));
|
|
13741
|
+
var LinkMenu = styled__default.ul(_templateObject7$N || (_templateObject7$N = _taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 12px 0 0 0;\n list-style: none;\n"])));
|
|
13742
|
+
var LinkMenuItem = styled__default.li(_templateObject8$E || (_templateObject8$E = _taggedTemplateLiteralLoose(["\n padding: 10px 0;\n"])));
|
|
13743
|
+
var IconWrapperFooter = styled__default.div(_templateObject9$v || (_templateObject9$v = _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"])));
|
|
13744
|
+
var LinkMenuItemA = styled__default(reactRouterDom.Link)(_templateObject10$p || (_templateObject10$p = _taggedTemplateLiteralLoose(["\n ", ";\n display: block;\n width: 100%;\n font-size: 14px;\n font-weight: 400;\n color: var(--grey-10);\n text-decoration: none;\n\n &:hover {\n color: var(--primary-9);\n }\n\n ", ";\n"])), resetButtonStyles, function (_ref) {
|
|
13703
13745
|
var isActive = _ref.isActive;
|
|
13704
|
-
return isActive && styled.css(_templateObject11$
|
|
13746
|
+
return isActive && styled.css(_templateObject11$h || (_templateObject11$h = _taggedTemplateLiteralLoose(["\n &, &:hover {\n color: var(--primary-9);\n }\n "])));
|
|
13705
13747
|
});
|
|
13706
|
-
var FooterMeta = styled__default.div(_templateObject12$
|
|
13748
|
+
var FooterMeta = styled__default.div(_templateObject12$f || (_templateObject12$f = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n border-top: var(--dividing-line) 1px solid;\n margin-top: auto;\n display: flex;\n flex-direction: row;\n align-items: center;\n width: 100%;\n font-size: 10px;\n font-weight: 400;\n color: var(--grey-a11);\n padding: 10px;\n padding-left: ", ";\n"])), function (_ref2) {
|
|
13707
13749
|
var icon = _ref2.icon;
|
|
13708
13750
|
return icon !== '' ? '31px;' : '21px;';
|
|
13709
13751
|
});
|
|
@@ -13842,19 +13884,19 @@ var UserMenu = function UserMenu(_ref4) {
|
|
|
13842
13884
|
}, title)) : null));
|
|
13843
13885
|
};
|
|
13844
13886
|
|
|
13845
|
-
var _templateObject$1H, _templateObject2$1s, _templateObject3$1j, _templateObject4$
|
|
13887
|
+
var _templateObject$1H, _templateObject2$1s, _templateObject3$1j, _templateObject4$1c, _templateObject5$15, _templateObject6$R, _templateObject7$O, _templateObject8$F;
|
|
13846
13888
|
var Container$13 = styled__default.div(_templateObject$1H || (_templateObject$1H = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 18px 20px 12px 20px;\n height: 122px;\n"])));
|
|
13847
13889
|
var ImgWrapper = styled__default.div(_templateObject2$1s || (_templateObject2$1s = _taggedTemplateLiteralLoose(["\n border-radius: 5px;\n overflow: hidden;\n height: 40px;\n width: 40px;\n flex-shrink: 0;\n"])));
|
|
13848
13890
|
var EmptyImg = styled__default.div(_templateObject3$1j || (_templateObject3$1j = _taggedTemplateLiteralLoose(["\n background-color: var(--grey-5);\n width: 100%;\n height: 100%;\n"])));
|
|
13849
|
-
var Image$2 = styled__default.div(_templateObject4$
|
|
13891
|
+
var Image$2 = styled__default.div(_templateObject4$1c || (_templateObject4$1c = _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) {
|
|
13850
13892
|
return p.image;
|
|
13851
13893
|
}, function (p) {
|
|
13852
13894
|
return p.image ? 'block' : 'none';
|
|
13853
13895
|
});
|
|
13854
|
-
var InfoContainer = styled__default.div(_templateObject5$
|
|
13855
|
-
var Title$9 = styled__default.div(_templateObject6$
|
|
13856
|
-
var Message = styled__default.div(_templateObject7$
|
|
13857
|
-
var TimeMsg = styled__default.div(_templateObject8$
|
|
13896
|
+
var InfoContainer = styled__default.div(_templateObject5$15 || (_templateObject5$15 = _taggedTemplateLiteralLoose(["\n margin-left: 20px;\n"])));
|
|
13897
|
+
var Title$9 = styled__default.div(_templateObject6$R || (_templateObject6$R = _taggedTemplateLiteralLoose(["\n font-size: 16px;\n font-weight: 500;\n color: var(--grey-11);\n"])));
|
|
13898
|
+
var Message = styled__default.div(_templateObject7$O || (_templateObject7$O = _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"])));
|
|
13899
|
+
var TimeMsg = styled__default.div(_templateObject8$F || (_templateObject8$F = _taggedTemplateLiteralLoose(["\n font-size: 13px;\n font-weight: 500;\n color: var(--grey-12);\n margin-top: 15px;\n"])));
|
|
13858
13900
|
var NotificationItem = function NotificationItem(_ref) {
|
|
13859
13901
|
var imgUrl = _ref.imgUrl,
|
|
13860
13902
|
title = _ref.title,
|
|
@@ -13891,32 +13933,35 @@ var NotificationsHistory = function NotificationsHistory(_ref) {
|
|
|
13891
13933
|
return React__default.createElement(Container$14, null, unread && React__default.createElement(React.Fragment, null, React__default.createElement(StatusContainer, null, readNotificationsText), renderNotifications(unread, 'unread')), read && React__default.createElement(React.Fragment, null, React__default.createElement(StatusContainer, null, unreadNotificationsText), renderNotifications(read, 'read')));
|
|
13892
13934
|
};
|
|
13893
13935
|
|
|
13894
|
-
var _templateObject$1J, _templateObject2$1u, _templateObject3$1l, _templateObject4$
|
|
13936
|
+
var _templateObject$1J, _templateObject2$1u, _templateObject3$1l, _templateObject4$1d, _templateObject5$16, _templateObject6$S, _templateObject7$P, _templateObject8$G, _templateObject9$w, _templateObject10$q, _templateObject11$i, _templateObject12$g, _templateObject13$e, _templateObject14$c, _templateObject15$8;
|
|
13895
13937
|
var CoreStyle = styled.css(_templateObject$1J || (_templateObject$1J = _taggedTemplateLiteralLoose(["\n display: flex;\n height: 32px;\n padding: 8px;\n align-items: center;\n justify-content: center;\n text-align: center;\n gap: 8px;\n border-radius: 3px;\n\n font-family: Lato;\n font-size: 14px;\n font-style: normal;\n font-weight: 500;\n line-height: 12px; /* 85.714% */\n white-space: nowrap;\n\n transition: opacity var(--speed-fast) var(--easing-primary-out);\n\n"])));
|
|
13896
13938
|
var ContainerStatic = styled__default.div(_templateObject2$1u || (_templateObject2$1u = _taggedTemplateLiteralLoose(["\n ", ";\n\n ", ";\n"])), CoreStyle, function (_ref) {
|
|
13897
13939
|
var themeColor = _ref.themeColor;
|
|
13898
|
-
return themeColor ? styled.css(_templateObject3$1l || (_templateObject3$1l = _taggedTemplateLiteralLoose(["\n border: 2px solid var(--", "-9);\n color: var(--", "-11);\n "])), themeColor, themeColor) : styled.css(_templateObject4$
|
|
13940
|
+
return themeColor ? styled.css(_templateObject3$1l || (_templateObject3$1l = _taggedTemplateLiteralLoose(["\n border: 2px solid var(--", "-9);\n color: var(--", "-11);\n "])), themeColor, themeColor) : styled.css(_templateObject4$1d || (_templateObject4$1d = _taggedTemplateLiteralLoose(["\n border: 2px solid var(--info-9);\n color: var(--info-11);\n "])));
|
|
13899
13941
|
});
|
|
13900
|
-
var DefaultText = styled__default.span(_templateObject5$
|
|
13901
|
-
var LinkText = styled__default.span(_templateObject6$
|
|
13902
|
-
var
|
|
13942
|
+
var DefaultText = styled__default.span(_templateObject5$16 || (_templateObject5$16 = _taggedTemplateLiteralLoose(["\n display: inline-block;\n"])));
|
|
13943
|
+
var LinkText = styled__default.span(_templateObject6$S || (_templateObject6$S = _taggedTemplateLiteralLoose([""])));
|
|
13944
|
+
var InteractiveStyle = styled.css(_templateObject7$P || (_templateObject7$P = _taggedTemplateLiteralLoose(["\n ", ";\n text-decoration: none;\n\n ", ";\n\n &:hover {\n ", ";\n }\n"])), CoreStyle, function (_ref2) {
|
|
13903
13945
|
var themeColor = _ref2.themeColor;
|
|
13904
|
-
return themeColor ? styled.css(_templateObject8$
|
|
13946
|
+
return themeColor ? styled.css(_templateObject8$G || (_templateObject8$G = _taggedTemplateLiteralLoose(["\n background-color: transparent;\n border: 2px solid var(--", "-9);\n color: var(--", "-11);\n "])), themeColor, themeColor) : styled.css(_templateObject9$w || (_templateObject9$w = _taggedTemplateLiteralLoose(["\n background-color: transparent;\n border: 2px solid var(--info-9);\n color: var(--info-11);\n "])));
|
|
13905
13947
|
}, function (_ref3) {
|
|
13906
13948
|
var themeColor = _ref3.themeColor;
|
|
13907
|
-
return themeColor ? styled.css(_templateObject10$
|
|
13949
|
+
return themeColor ? styled.css(_templateObject10$q || (_templateObject10$q = _taggedTemplateLiteralLoose(["\n background-color: var(--", "-9);\n border: 2px solid var(--", "-9);\n color: var(--white-12);\n "])), themeColor, themeColor) : styled.css(_templateObject11$i || (_templateObject11$i = _taggedTemplateLiteralLoose(["\n background-color: var(--info-9);\n border: 2px solid var(--info-9);\n color: var(--white-12);\n "])));
|
|
13908
13950
|
});
|
|
13909
|
-
var
|
|
13951
|
+
var ContainerLinked = styled__default.div(_templateObject12$g || (_templateObject12$g = _taggedTemplateLiteralLoose(["\n a {\n ", ";\n }\n"])), InteractiveStyle);
|
|
13952
|
+
var ContainerButton = styled__default.div(_templateObject13$e || (_templateObject13$e = _taggedTemplateLiteralLoose(["\n button {\n ", ";\n ", ";\n }\n"])), resetButtonStyles, InteractiveStyle);
|
|
13953
|
+
var Container$15 = styled__default.div(_templateObject14$c || (_templateObject14$c = _taggedTemplateLiteralLoose(["\n ", ";\n"])), function (_ref4) {
|
|
13910
13954
|
var ready = _ref4.ready,
|
|
13911
13955
|
minWidth = _ref4.minWidth;
|
|
13912
|
-
return styled.css(
|
|
13956
|
+
return styled.css(_templateObject15$8 || (_templateObject15$8 = _taggedTemplateLiteralLoose(["\n \n visibility: ", ";\n opacity: ", ";\n\n transition: opacity var(--speed-fast) var(--easing-primary-in-out);\n\n ", ", ", "{\n /* Required to accurately measure container sizes and ensure hover doesn't resize. */\n ", ";\n }\n "])), ready ? 'visible' : 'hidden', ready ? '1' : '0', DefaultText, LinkText, ready && "min-width: " + minWidth + "px;");
|
|
13913
13957
|
});
|
|
13914
13958
|
var TopBarBadge = function TopBarBadge(_ref5) {
|
|
13915
13959
|
var text = _ref5.text,
|
|
13916
13960
|
color = _ref5.color,
|
|
13917
13961
|
linkHref = _ref5.linkHref,
|
|
13918
13962
|
linkTo = _ref5.linkTo,
|
|
13919
|
-
linkText = _ref5.linkText
|
|
13963
|
+
linkText = _ref5.linkText,
|
|
13964
|
+
onClick = _ref5.onClick;
|
|
13920
13965
|
var defaultTextRef = React.useRef();
|
|
13921
13966
|
var linkTextRef = React.useRef();
|
|
13922
13967
|
var _useState = React.useState(false),
|
|
@@ -13939,30 +13984,45 @@ var TopBarBadge = function TopBarBadge(_ref5) {
|
|
|
13939
13984
|
setReady(true);
|
|
13940
13985
|
}, 100);
|
|
13941
13986
|
}, [defaultTextRef, linkTextRef, text, linkText, setMinWidth, setReady]);
|
|
13942
|
-
var defaultTextElement =
|
|
13943
|
-
|
|
13944
|
-
|
|
13945
|
-
|
|
13946
|
-
|
|
13947
|
-
|
|
13948
|
-
|
|
13949
|
-
|
|
13950
|
-
|
|
13951
|
-
|
|
13952
|
-
|
|
13953
|
-
|
|
13954
|
-
|
|
13955
|
-
|
|
13956
|
-
|
|
13957
|
-
|
|
13958
|
-
|
|
13959
|
-
|
|
13960
|
-
|
|
13961
|
-
|
|
13962
|
-
|
|
13963
|
-
|
|
13964
|
-
|
|
13965
|
-
|
|
13987
|
+
var defaultTextElement = React.useMemo(function () {
|
|
13988
|
+
return React__default.createElement(DefaultText, {
|
|
13989
|
+
ref: defaultTextRef
|
|
13990
|
+
}, text);
|
|
13991
|
+
}, [text]);
|
|
13992
|
+
var linkTextElement = React.useMemo(function () {
|
|
13993
|
+
return onClick || linkTo || linkHref ? React__default.createElement(LinkText, {
|
|
13994
|
+
ref: linkTextRef
|
|
13995
|
+
}, linkText || text) : null;
|
|
13996
|
+
}, [onClick, linkTo, linkHref, linkText, text]);
|
|
13997
|
+
var renderContent = React.useMemo(function () {
|
|
13998
|
+
return !ready ? React__default.createElement(React.Fragment, null, defaultTextElement, linkTextElement) : React__default.createElement(React.Fragment, null, !hover ? defaultTextElement : linkTextElement);
|
|
13999
|
+
}, [ready, hover, defaultTextElement, linkTextElement]);
|
|
14000
|
+
var badgeComponent = React.useMemo(function () {
|
|
14001
|
+
if (onClick) {
|
|
14002
|
+
return React__default.createElement(ContainerButton, {
|
|
14003
|
+
themeColor: color
|
|
14004
|
+
}, React__default.createElement("button", {
|
|
14005
|
+
onClick: onClick,
|
|
14006
|
+
type: "button"
|
|
14007
|
+
}, renderContent));
|
|
14008
|
+
} else if (linkTo) {
|
|
14009
|
+
return React__default.createElement(ContainerLinked, {
|
|
14010
|
+
themeColor: color
|
|
14011
|
+
}, React__default.createElement(reactRouterDom.Link, {
|
|
14012
|
+
to: linkTo
|
|
14013
|
+
}, renderContent));
|
|
14014
|
+
} else if (linkHref) {
|
|
14015
|
+
return React__default.createElement(ContainerLinked, {
|
|
14016
|
+
themeColor: color
|
|
14017
|
+
}, React__default.createElement("a", {
|
|
14018
|
+
href: linkHref
|
|
14019
|
+
}, renderContent));
|
|
14020
|
+
} else {
|
|
14021
|
+
return React__default.createElement(ContainerStatic, {
|
|
14022
|
+
themeColor: color
|
|
14023
|
+
}, defaultTextElement);
|
|
14024
|
+
}
|
|
14025
|
+
}, [onClick, linkTo, linkHref, color, renderContent, defaultTextElement]);
|
|
13966
14026
|
return React__default.createElement(Container$15, Object.assign({}, {
|
|
13967
14027
|
ready: ready,
|
|
13968
14028
|
minWidth: minWidth
|
|
@@ -13976,27 +14036,27 @@ var TopBarBadge = function TopBarBadge(_ref5) {
|
|
|
13976
14036
|
}), badgeComponent);
|
|
13977
14037
|
};
|
|
13978
14038
|
|
|
13979
|
-
var _templateObject$1K, _templateObject2$1v, _templateObject3$1m, _templateObject4$
|
|
14039
|
+
var _templateObject$1K, _templateObject2$1v, _templateObject3$1m, _templateObject4$1e, _templateObject5$17, _templateObject6$T, _templateObject7$Q, _templateObject8$H, _templateObject9$x, _templateObject10$r, _templateObject11$j, _templateObject12$h, _templateObject13$f;
|
|
13980
14040
|
var Container$16 = styled__default.div(_templateObject$1K || (_templateObject$1K = _taggedTemplateLiteralLoose(["\n z-index: 9;\n position: sticky;\n top: 0;\n height: 56px;\n padding: 0 16px 0 24px;\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-self: flex-start;\n border-bottom: 1px solid var(--dividing-line);\n background: var(--grey-2);\n box-shadow: 5px 0px 10px 0px var(--primary-a2);\n"])));
|
|
13981
14041
|
var RightArea$1 = styled__default.div(_templateObject2$1v || (_templateObject2$1v = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 24px;\n height: 100%;\n"])));
|
|
13982
14042
|
var SearchBar = styled__default.div(_templateObject3$1m || (_templateObject3$1m = _taggedTemplateLiteralLoose(["\n flex: 0 1 500px;\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 8px;\n"])));
|
|
13983
|
-
var IconWrapper$4 = styled__default.div(_templateObject4$
|
|
13984
|
-
var SearchInput = styled__default.input(_templateObject5$
|
|
13985
|
-
var ButtonArea = styled__default.div(_templateObject6$
|
|
13986
|
-
var buttonClickAnimation = styled.keyframes(_templateObject7$
|
|
14043
|
+
var IconWrapper$4 = styled__default.div(_templateObject4$1e || (_templateObject4$1e = _taggedTemplateLiteralLoose(["\n flex: 0;\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"])));
|
|
14044
|
+
var SearchInput = styled__default.input(_templateObject5$17 || (_templateObject5$17 = _taggedTemplateLiteralLoose(["\n ", ";\n font-family: var(--font-data);\n flex: 1;\n height: 35px;\n line-height: 35px;\n border: none;\n outline: none;\n background: transparent;\n color: var(--grey-10);\n font-size: 14px;\n\n &::placeholder {\n font-family: var(--font-data);\n font-weight: 400;\n font-style: italic;\n font-size: 14px;\n color: var(--grey-8);\n }\n\n &:lang(ja)::placeholder {\n font-style: normal;\n };\n"])), removeAutoFillStyle);
|
|
14045
|
+
var ButtonArea = styled__default.div(_templateObject6$T || (_templateObject6$T = _taggedTemplateLiteralLoose(["\n height: inherit;\n display: flex;\n gap: 0;\n"])));
|
|
14046
|
+
var buttonClickAnimation = styled.keyframes(_templateObject7$Q || (_templateObject7$Q = _taggedTemplateLiteralLoose(["\n 0% {\n opacity:0.9;\n transform: scale(0.85);\n }\n 100% {\n opacity:1;\n transform: scale(1);\n }\n"])));
|
|
13987
14047
|
var DrawerToggle = styled__default.button.attrs({
|
|
13988
14048
|
type: 'button'
|
|
13989
|
-
})(_templateObject8$
|
|
14049
|
+
})(_templateObject8$H || (_templateObject8$H = _taggedTemplateLiteralLoose(["\n position: relative;\n flex: 0 56px;\n width: 56px;\n height: inherit;\n display: flex;\n justify-content: center;\n align-items: center;\n border: none;\n background: none;\n outline: none;\n cursor: pointer;\n\n &::after {\n content: '';\n position: absolute;\n bottom: 0;\n right: 0;\n left: 0;\n height: 5px;\n background-color: transparent;\n border-radius: 2px 2px 0 0;\n }\n\n transition: background-color var(--speed-normal) var(--easing-primary-out);\n\n svg {\n transition: transform var(--speed-normal) var(--easing-primary-out);\n }\n\n &:hover {\n opacity: 0.9;\n &::after {\n background-color: var(--primary-6);\n }\n }\n\n ", "\n"])), function (_ref) {
|
|
13990
14050
|
var isActive = _ref.isActive;
|
|
13991
|
-
return isActive && styled.css(_templateObject9$
|
|
14051
|
+
return isActive && styled.css(_templateObject9$x || (_templateObject9$x = _taggedTemplateLiteralLoose(["\n &, &:hover {\n border-bottom-color: var(--primary-9);\n &::after {\n background-color: var(--primary-9);\n }\n svg {\n transform: scale(1);\n animation: ", " 0.35s cubic-bezier(0.7, 0, 0.84, 0);\n }\n\n }\n "])), buttonClickAnimation);
|
|
13992
14052
|
});
|
|
13993
|
-
var DrawerPortalWrapper = styled__default.div(_templateObject10$
|
|
13994
|
-
var Drawer = styled__default.div(_templateObject11$
|
|
14053
|
+
var DrawerPortalWrapper = styled__default.div(_templateObject10$r || (_templateObject10$r = _taggedTemplateLiteralLoose([""])));
|
|
14054
|
+
var Drawer = styled__default.div(_templateObject11$j || (_templateObject11$j = _taggedTemplateLiteralLoose(["\n font-family: var(--font-ui);\n\n position: fixed;\n right: -10px;\n top: 56px;\n bottom: 0;\n background: var(--global-element-background);\n border-left: var(--dividing-line) 1px solid;\n\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 transition:\n opacity var(--speed-normal) var(--easing-primary-in-out),\n right var(--speed-normal) var(--easing-primary-in-out);\n\n ", "\n"])), function (_ref2) {
|
|
13995
14055
|
var baseWidth = _ref2.baseWidth;
|
|
13996
14056
|
return baseWidth ? baseWidth : "200px";
|
|
13997
14057
|
}, function (_ref3) {
|
|
13998
14058
|
var isOpen = _ref3.isOpen;
|
|
13999
|
-
return isOpen && styled.css(_templateObject12$
|
|
14059
|
+
return isOpen && styled.css(_templateObject12$h || (_templateObject12$h = _taggedTemplateLiteralLoose(["\n right: 0;\n opacity: 1;\n visibility: visible;\n "])));
|
|
14000
14060
|
});
|
|
14001
14061
|
var NotificationsContainer = styled__default.div(_templateObject13$f || (_templateObject13$f = _taggedTemplateLiteralLoose(["\n overflow-y: scroll;\n margin-right: -17px;\n"])));
|
|
14002
14062
|
var TopBar = function TopBar(_ref4) {
|
|
@@ -14193,7 +14253,7 @@ var TabContent = function TabContent(_ref) {
|
|
|
14193
14253
|
};
|
|
14194
14254
|
|
|
14195
14255
|
var _excluded$K = ["tabFor", "icon", "closeId", "counter", "status"];
|
|
14196
|
-
var _templateObject$1O, _templateObject2$1x, _templateObject3$1o, _templateObject4$
|
|
14256
|
+
var _templateObject$1O, _templateObject2$1x, _templateObject3$1o, _templateObject4$1f;
|
|
14197
14257
|
var Container$18 = styled__default.button(_templateObject$1O || (_templateObject$1O = _taggedTemplateLiteralLoose(["\n ", "\n flex-basis: auto;\n flex-grow: 1;\n"])), resetButtonStyles);
|
|
14198
14258
|
var LinkTab = styled__default.div(_templateObject2$1x || (_templateObject2$1x = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n\n ", ";\n\n ", "\n"])), function (_ref) {
|
|
14199
14259
|
var theme = _ref.theme;
|
|
@@ -14201,7 +14261,7 @@ var LinkTab = styled__default.div(_templateObject2$1x || (_templateObject2$1x =
|
|
|
14201
14261
|
}, function (_ref2) {
|
|
14202
14262
|
var isActive = _ref2.isActive,
|
|
14203
14263
|
theme = _ref2.theme;
|
|
14204
|
-
return isActive && styled.css(_templateObject4$
|
|
14264
|
+
return isActive && styled.css(_templateObject4$1f || (_templateObject4$1f = _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);
|
|
14205
14265
|
});
|
|
14206
14266
|
var MobileTab = function MobileTab(_ref3) {
|
|
14207
14267
|
var tabFor = _ref3.tabFor,
|
|
@@ -14231,23 +14291,23 @@ var MobileTab = function MobileTab(_ref3) {
|
|
|
14231
14291
|
};
|
|
14232
14292
|
|
|
14233
14293
|
var _excluded$L = ["icon", "title", "subtitle", "tabFor"];
|
|
14234
|
-
var _templateObject$1P, _templateObject2$1y, _templateObject3$1p, _templateObject4$
|
|
14294
|
+
var _templateObject$1P, _templateObject2$1y, _templateObject3$1p, _templateObject4$1g, _templateObject5$18, _templateObject6$U;
|
|
14235
14295
|
var Container$19 = styled__default.div(_templateObject$1P || (_templateObject$1P = _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) {
|
|
14236
14296
|
var active = _ref.active;
|
|
14237
14297
|
return active ? styled.css(_templateObject2$1y || (_templateObject2$1y = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid var(--primary-11);\n "]))) : styled.css(_templateObject3$1p || (_templateObject3$1p = _taggedTemplateLiteralLoose(["\n border-bottom: 3px solid transparent;\n "])));
|
|
14238
14298
|
}, IconWrapper);
|
|
14239
|
-
var Title$a = styled__default.div(_templateObject4$
|
|
14299
|
+
var Title$a = styled__default.div(_templateObject4$1g || (_templateObject4$1g = _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) {
|
|
14240
14300
|
var theme = _ref2.theme;
|
|
14241
14301
|
return theme.fontFamily.ui;
|
|
14242
14302
|
}, function (_ref3) {
|
|
14243
14303
|
var active = _ref3.active;
|
|
14244
14304
|
return active ? 'var(--primary-11)' : 'var(--grey-11)';
|
|
14245
14305
|
});
|
|
14246
|
-
var SubTitle$2 = styled__default.div(_templateObject5$
|
|
14306
|
+
var SubTitle$2 = styled__default.div(_templateObject5$18 || (_templateObject5$18 = _taggedTemplateLiteralLoose(["\n font-size: 12px;\n font-family: ", ";\n font-style: italic;\n &:lang(ja) {\n font-style: normal;\n }\n color: var(--grey-a10);\n flex-shrink: 0;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (_ref4) {
|
|
14247
14307
|
var theme = _ref4.theme;
|
|
14248
14308
|
return theme.fontFamily.data;
|
|
14249
14309
|
});
|
|
14250
|
-
var TextGroup$1 = styled__default.div(_templateObject6$
|
|
14310
|
+
var TextGroup$1 = styled__default.div(_templateObject6$U || (_templateObject6$U = _taggedTemplateLiteralLoose(["\n margin-left: 12px;\n margin-right: 20px;\n"])));
|
|
14251
14311
|
var TabWithIcon = function TabWithIcon(_ref5) {
|
|
14252
14312
|
var icon = _ref5.icon,
|
|
14253
14313
|
title = _ref5.title,
|
|
@@ -14317,7 +14377,7 @@ var TabsWithIconBar = function TabsWithIconBar(_ref2) {
|
|
|
14317
14377
|
|
|
14318
14378
|
var _excluded$M = ["closeId", "closeText"];
|
|
14319
14379
|
var _templateObject$1R, _templateObject2$1A, _templateObject3$1q;
|
|
14320
|
-
var StyledButton$
|
|
14380
|
+
var StyledButton$8 = styled__default.button(_templateObject$1R || (_templateObject$1R = _taggedTemplateLiteralLoose(["\n ", "\n \n font-family: var(--font-ui);\n background-color: var(--global-element-background);\n border-top: 1px solid var(--dividing-line);\n font-weight: 400;\n color: var(--grey-10);\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, MOBILE_CLOSE_HEIGHT);
|
|
14321
14381
|
var IconContainer$4 = styled__default.div(_templateObject2$1A || (_templateObject2$1A = _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"])));
|
|
14322
14382
|
var TextWrapper$1 = styled__default.div(_templateObject3$1q || (_templateObject3$1q = _taggedTemplateLiteralLoose(["\n text-transform: uppercase;\n"])));
|
|
14323
14383
|
var CloseButton$1 = function CloseButton(_ref) {
|
|
@@ -14327,7 +14387,7 @@ var CloseButton$1 = function CloseButton(_ref) {
|
|
|
14327
14387
|
props = _objectWithoutPropertiesLoose(_ref, _excluded$M);
|
|
14328
14388
|
var _useContext = React.useContext(TabContext),
|
|
14329
14389
|
setSelected = _useContext.setSelected;
|
|
14330
|
-
return React__default.createElement(StyledButton$
|
|
14390
|
+
return React__default.createElement(StyledButton$8, Object.assign({
|
|
14331
14391
|
onClick: function onClick() {
|
|
14332
14392
|
return setSelected(closeId);
|
|
14333
14393
|
}
|
|
@@ -14597,16 +14657,16 @@ var GlobalUI = function GlobalUI(_ref) {
|
|
|
14597
14657
|
};
|
|
14598
14658
|
|
|
14599
14659
|
var _excluded$Q = ["children"];
|
|
14600
|
-
var _templateObject$1X, _templateObject2$1F, _templateObject3$1s, _templateObject4$
|
|
14660
|
+
var _templateObject$1X, _templateObject2$1F, _templateObject3$1s, _templateObject4$1h, _templateObject5$19, _templateObject6$V, _templateObject7$R, _templateObject8$I, _templateObject9$y;
|
|
14601
14661
|
var Container$1f = styled__default.div(_templateObject$1X || (_templateObject$1X = _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"])));
|
|
14602
14662
|
var LogoContainer = styled__default.div(_templateObject2$1F || (_templateObject2$1F = _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"])));
|
|
14603
14663
|
var LogoTopText = styled__default.div(_templateObject3$1s || (_templateObject3$1s = _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"])));
|
|
14604
|
-
var LogoBottomText = styled__default.div(_templateObject4$
|
|
14605
|
-
var SidebarBox = styled__default.div(_templateObject5$
|
|
14606
|
-
var SidebarHeading = styled__default.div(_templateObject6$
|
|
14607
|
-
var SidebarLinkHeading = styled__default.div(_templateObject7$
|
|
14608
|
-
var BackLink$1 = styled__default(reactRouterDom.Link)(_templateObject8$
|
|
14609
|
-
var SLink = styled__default(reactRouterDom.Link)(_templateObject9$
|
|
14664
|
+
var LogoBottomText = styled__default.div(_templateObject4$1h || (_templateObject4$1h = _taggedTemplateLiteralLoose(["\n height: 19px;\n font-family: Monorale;\n font-size: 16px;\n font-weight: 400;\n line-height: normal;\n letter-spacing: 14.11px;\n text-align: center;\n"])));
|
|
14665
|
+
var SidebarBox = styled__default.div(_templateObject5$19 || (_templateObject5$19 = _taggedTemplateLiteralLoose(["\n position: relative;\n border-bottom: 1px solid var(--grey-a7);\n padding: 22px 20px 21px 20px;\n"])));
|
|
14666
|
+
var SidebarHeading = styled__default.div(_templateObject6$V || (_templateObject6$V = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n margin-bottom: 18px;\n"])));
|
|
14667
|
+
var SidebarLinkHeading = styled__default.div(_templateObject7$R || (_templateObject7$R = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
|
|
14668
|
+
var BackLink$1 = styled__default(reactRouterDom.Link)(_templateObject8$I || (_templateObject8$I = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 500;\n letter-spacing: 0.35px;\n color: var(--grey-10);\n"])));
|
|
14669
|
+
var SLink = styled__default(reactRouterDom.Link)(_templateObject9$y || (_templateObject9$y = _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"])));
|
|
14610
14670
|
var SidebarLink = function SidebarLink(_ref) {
|
|
14611
14671
|
var title = _ref.title,
|
|
14612
14672
|
to = _ref.to;
|