@mw-kit/mw-ui 1.2.0 → 1.2.3
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/components/Input/components/Select/interfaces.d.ts +6 -8
- package/dist/components/Loader/interfaces.d.ts +1 -0
- package/dist/components/Menu/interfaces.d.ts +1 -0
- package/dist/components/ScrollContainer/interfaces.d.ts +1 -0
- package/dist/index.js +229 -182
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +229 -182
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.modern.js
CHANGED
|
@@ -224,21 +224,23 @@ var getSpacings = function getSpacings(value, defaults) {
|
|
|
224
224
|
return values.top + " " + values.right + " " + values.bottom + " " + values.left;
|
|
225
225
|
};
|
|
226
226
|
|
|
227
|
-
var _templateObject, _templateObject2, _templateObject3;
|
|
227
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
|
|
228
228
|
var loader = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n from { transform: rotate(0deg); }\n to { transform: rotate(360deg); }\n"])));
|
|
229
229
|
var Loader = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
230
230
|
var size = _ref.size,
|
|
231
231
|
borderSize = _ref.borderSize,
|
|
232
232
|
bgColor = _ref.bgColor,
|
|
233
233
|
color = _ref.color,
|
|
234
|
-
theme = _ref.theme
|
|
234
|
+
theme = _ref.theme,
|
|
235
|
+
filled = _ref.filled;
|
|
235
236
|
size = size || theme.spacings.s4;
|
|
236
237
|
borderSize = borderSize || "calc(" + size + " * 0.0757)";
|
|
237
238
|
color = color || 'blue';
|
|
238
239
|
bgColor = bgColor || color;
|
|
239
240
|
var beforeColor = isKeyOf(theme.colors, bgColor) ? theme.getColor(bgColor, 25) : color;
|
|
240
241
|
var afterColor = isKeyOf(theme.colors, color) ? theme.getColor(color) : color;
|
|
241
|
-
|
|
242
|
+
var fill = !filled ? css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose([""]))) : css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n top: 0;\n background-color: ", ";\n width: 100%;\n height: 100%;\n "])), theme.colors.white);
|
|
243
|
+
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n ", "\n\n pointer-events: none;\n\n ::before,\n ::after {\n position: absolute;\n content: '';\n\n top: calc(50% - ", " / 2);\n left: calc(50% - ", " / 2);\n width: ", ";\n height: ", ";\n border-radius: 50%;\n border-width: ", ";\n border-style: solid;\n }\n\n ::before {\n border-color: ", ";\n }\n\n ::after {\n animation: ", " 0.6s linear;\n animation-iteration-count: infinite;\n border-color: ", " transparent transparent;\n }\n "])), fill, size, size, size, size, borderSize, beforeColor, loader, afterColor);
|
|
242
244
|
});
|
|
243
245
|
|
|
244
246
|
var sizes = {
|
|
@@ -258,7 +260,7 @@ var fontSizes = {
|
|
|
258
260
|
default: '14px'
|
|
259
261
|
};
|
|
260
262
|
|
|
261
|
-
var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
263
|
+
var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
|
|
262
264
|
var Button = styled.button(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteralLoose(["\n padding: 0\n ", ";\n font-family: 'Lato', sans-serif;\n font-weight: ", ";\n border-radius: 4px;\n position: relative;\n user-select: none;\n\n font-size: ", ";\n\n height: ", ";\n\n background-color: ", ";\n\n border: ", ";\n\n color: ", ";\n\n :disabled {\n ", "\n }\n\n :hover {\n cursor: ", ";\n\n ", "\n }\n\n :active {\n ", ";\n }\n\n ", "\n"])), function (_ref) {
|
|
263
265
|
var theme = _ref.theme,
|
|
264
266
|
appearance = _ref.appearance;
|
|
@@ -334,9 +336,9 @@ var Button = styled.button(_templateObject$1 || (_templateObject$1 = _taggedTemp
|
|
|
334
336
|
theme = _ref10.theme;
|
|
335
337
|
|
|
336
338
|
if (appearance === 'bordered') {
|
|
337
|
-
return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n color: ", ";\n border: 1px solid ", ";\n "])), theme.getColor(color || 'blue', 70), theme.getColor(color || 'blue', 70));
|
|
339
|
+
return css(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n border: 1px solid ", ";\n "])), theme.getColor(color || 'blue', 70), theme.getColor(color || 'blue', 70));
|
|
338
340
|
} else if (['link', 'bordeless'].includes(appearance)) {
|
|
339
|
-
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n "])), theme.colors.blue);
|
|
341
|
+
return css(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n "])), theme.colors.blue);
|
|
340
342
|
}
|
|
341
343
|
|
|
342
344
|
return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n "])), theme.getColor(color || 'blue', 70));
|
|
@@ -11676,7 +11678,7 @@ var icons = {
|
|
|
11676
11678
|
zoom_out: SvgZoomOut
|
|
11677
11679
|
};
|
|
11678
11680
|
|
|
11679
|
-
var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$
|
|
11681
|
+
var _templateObject$2, _templateObject2$2, _templateObject3$2, _templateObject4$2, _templateObject5$2;
|
|
11680
11682
|
var SemanticIcon = styled(Icon$1)(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteralLoose(["\n &.icon,\n &.icon:before {\n margin: 0;\n color: ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n\n ", "\n\n ", "\n }\n\n &.icon:before {\n height: 100%;\n }\n"])), function (_ref) {
|
|
11681
11683
|
var fontcolor = _ref.fontcolor;
|
|
11682
11684
|
return fontcolor;
|
|
@@ -11689,13 +11691,13 @@ var SemanticIcon = styled(Icon$1)(_templateObject$2 || (_templateObject$2 = _tag
|
|
|
11689
11691
|
if (!height) return;
|
|
11690
11692
|
return css(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n font-size: ", ";\n height: ", ";\n "])), height, height);
|
|
11691
11693
|
});
|
|
11692
|
-
var SVGContainer = styled.div(_templateObject4$
|
|
11694
|
+
var SVGContainer = styled.div(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n > svg {\n &,\n * {\n stroke: ", ";\n\n ", "\n }\n }\n"])), function (_ref4) {
|
|
11693
11695
|
var color = _ref4.color;
|
|
11694
11696
|
return color;
|
|
11695
11697
|
}, function (_ref5) {
|
|
11696
11698
|
var strokeWidth = _ref5.strokeWidth;
|
|
11697
11699
|
if (!strokeWidth) return;
|
|
11698
|
-
return css(_templateObject5$
|
|
11700
|
+
return css(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n stroke-width: ", ";\n "])), strokeWidth);
|
|
11699
11701
|
});
|
|
11700
11702
|
|
|
11701
11703
|
var getColor = function getColor(c) {
|
|
@@ -11804,7 +11806,7 @@ var EllipsisContainer$1 = function EllipsisContainer$1(props) {
|
|
|
11804
11806
|
}));
|
|
11805
11807
|
};
|
|
11806
11808
|
|
|
11807
|
-
var _templateObject$5, _templateObject2$3, _templateObject3$3, _templateObject4$
|
|
11809
|
+
var _templateObject$5, _templateObject2$3, _templateObject3$3, _templateObject4$3, _templateObject5$3;
|
|
11808
11810
|
var Container$1 = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n ", ";\n\n padding-right: calc(", " / 2);\n display: flex;\n width: 100%;\n display: flex;\n flex-direction: column;\n"])), function (_ref) {
|
|
11809
11811
|
var theme = _ref.theme;
|
|
11810
11812
|
return theme.useTypography('p');
|
|
@@ -11829,12 +11831,14 @@ var OverflowContainer = styled.div(_templateObject2$3 || (_templateObject2$3 = _
|
|
|
11829
11831
|
var spacing = _ref7.spacing,
|
|
11830
11832
|
theme = _ref7.theme;
|
|
11831
11833
|
var value = getSpacings(spacing || '0', '0').split(' ');
|
|
11832
|
-
return css(_templateObject4$
|
|
11834
|
+
return css(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n padding: ", " calc(", " * 1.5) ", "\n ", ";\n "])), value[0], theme.spacings.s1, value[2], value[3]);
|
|
11833
11835
|
});
|
|
11836
|
+
var RelativeContainer = styled.div(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n position: relative;\n flex: 1;\n"])));
|
|
11834
11837
|
|
|
11835
11838
|
var ScrollContainer = function ScrollContainer(props) {
|
|
11836
11839
|
var before = props.before,
|
|
11837
|
-
after = props.after
|
|
11840
|
+
after = props.after,
|
|
11841
|
+
loading = props.loading;
|
|
11838
11842
|
|
|
11839
11843
|
var onScrollEnd = props.onScrollEnd || function () {};
|
|
11840
11844
|
|
|
@@ -11860,17 +11864,19 @@ var ScrollContainer = function ScrollContainer(props) {
|
|
|
11860
11864
|
|
|
11861
11865
|
var _onScroll = props.onScroll || function () {};
|
|
11862
11866
|
|
|
11863
|
-
var htmlProps = filterObject(props, ['onScrollEnd', 'before', 'after']);
|
|
11864
|
-
return React__default.createElement(Container$1, null, before, React__default.createElement(OverflowContainer, Object.assign({}, htmlProps, {
|
|
11867
|
+
var htmlProps = filterObject(props, ['onScrollEnd', 'before', 'after', 'loading']);
|
|
11868
|
+
return React__default.createElement(Container$1, null, before, React__default.createElement(RelativeContainer, null, React__default.createElement(OverflowContainer, Object.assign({}, htmlProps, {
|
|
11865
11869
|
onScroll: function onScroll(event) {
|
|
11866
11870
|
_onScroll(event);
|
|
11867
11871
|
|
|
11868
11872
|
_onScroll2(event);
|
|
11869
11873
|
}
|
|
11874
|
+
})), loading && React__default.createElement(Loader, {
|
|
11875
|
+
filled: true
|
|
11870
11876
|
})), after);
|
|
11871
11877
|
};
|
|
11872
11878
|
|
|
11873
|
-
var _templateObject$6, _templateObject2$4, _templateObject3$4, _templateObject4$
|
|
11879
|
+
var _templateObject$6, _templateObject2$4, _templateObject3$4, _templateObject4$4, _templateObject5$4, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
|
|
11874
11880
|
var positions = {
|
|
11875
11881
|
'top right': function topRight(_ref) {
|
|
11876
11882
|
var left = _ref.left;
|
|
@@ -11886,11 +11892,11 @@ var positions = {
|
|
|
11886
11892
|
},
|
|
11887
11893
|
'bottom left': function bottomLeft(_ref4) {
|
|
11888
11894
|
var right = _ref4.right;
|
|
11889
|
-
return css(_templateObject4$
|
|
11895
|
+
return css(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n bottom: 0;\n right: ", ";\n "])), right || '100%');
|
|
11890
11896
|
},
|
|
11891
11897
|
'right top': function rightTop(_ref5) {
|
|
11892
11898
|
var bottom = _ref5.bottom;
|
|
11893
|
-
return css(_templateObject5$
|
|
11899
|
+
return css(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n bottom: ", ";\n right: 0;\n "])), bottom || '100%');
|
|
11894
11900
|
},
|
|
11895
11901
|
'right bottom': function rightBottom(_ref6) {
|
|
11896
11902
|
var top = _ref6.top;
|
|
@@ -11989,7 +11995,7 @@ var AbsoluteContainer = function AbsoluteContainer(props) {
|
|
|
11989
11995
|
}), React__default.createElement("div", null, props.children));
|
|
11990
11996
|
};
|
|
11991
11997
|
|
|
11992
|
-
var _templateObject$7, _templateObject2$5, _templateObject3$5, _templateObject4$
|
|
11998
|
+
var _templateObject$7, _templateObject2$5, _templateObject3$5, _templateObject4$5, _templateObject5$5, _templateObject6$2, _templateObject7$2, _templateObject8$2;
|
|
11993
11999
|
var Option = styled.div(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n ", ";\n line-height: ", ";\n display: flex;\n\n > :nth-child(1) {\n flex: 1;\n }\n\n ", ";\n\n :hover {\n background-color: ", ";\n }\n"])), function (_ref) {
|
|
11994
12000
|
var theme = _ref.theme;
|
|
11995
12001
|
return theme.useTypography('p');
|
|
@@ -12008,13 +12014,13 @@ var Option = styled.div(_templateObject$7 || (_templateObject$7 = _taggedTemplat
|
|
|
12008
12014
|
var theme = _ref4.theme;
|
|
12009
12015
|
return theme.colors.iceWhite;
|
|
12010
12016
|
});
|
|
12011
|
-
var Container$3 = styled(AbsoluteContainer)(_templateObject4$
|
|
12017
|
+
var Container$3 = styled(AbsoluteContainer)(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n > div {\n > div:nth-child(1) {\n background-color: ", ";\n border-radius: 4px;\n }\n\n ", "\n\n ", "\n }\n"])), function (_ref5) {
|
|
12012
12018
|
var theme = _ref5.theme;
|
|
12013
12019
|
return theme.colors.white;
|
|
12014
12020
|
}, function (_ref6) {
|
|
12015
12021
|
var bordered = _ref6.bordered;
|
|
12016
12022
|
if (!bordered) return;
|
|
12017
|
-
return css(_templateObject5$
|
|
12023
|
+
return css(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n ", " {\n :not(:last-child) {\n border-bottom: 1px solid\n ", ";\n }\n }\n "])), Option, function (_ref7) {
|
|
12018
12024
|
var theme = _ref7.theme;
|
|
12019
12025
|
return theme.getColor('greyishBlue', 10);
|
|
12020
12026
|
});
|
|
@@ -12057,7 +12063,8 @@ var Menu = function Menu(props) {
|
|
|
12057
12063
|
before = _props.before,
|
|
12058
12064
|
after = _props.after,
|
|
12059
12065
|
scrollHeight = _props.scrollHeight,
|
|
12060
|
-
scrollSpacing = _props.scrollSpacing
|
|
12066
|
+
scrollSpacing = _props.scrollSpacing,
|
|
12067
|
+
loading = _props.loading;
|
|
12061
12068
|
|
|
12062
12069
|
var _useState = useState(-1),
|
|
12063
12070
|
activeOption = _useState[0],
|
|
@@ -12105,7 +12112,8 @@ var Menu = function Menu(props) {
|
|
|
12105
12112
|
before: before,
|
|
12106
12113
|
after: after,
|
|
12107
12114
|
height: scrollHeight,
|
|
12108
|
-
spacing: scrollSpacing
|
|
12115
|
+
spacing: scrollSpacing,
|
|
12116
|
+
loading: loading
|
|
12109
12117
|
}, options.map(function (option, index) {
|
|
12110
12118
|
var _option = _extends({}, option),
|
|
12111
12119
|
delimiter = _option.delimiter,
|
|
@@ -12178,7 +12186,7 @@ var Menu = function Menu(props) {
|
|
|
12178
12186
|
})), getSubmenu(activeOption));
|
|
12179
12187
|
};
|
|
12180
12188
|
|
|
12181
|
-
var _templateObject$8, _templateObject2$6, _templateObject3$6, _templateObject4$
|
|
12189
|
+
var _templateObject$8, _templateObject2$6, _templateObject3$6, _templateObject4$6, _templateObject5$6, _templateObject6$3;
|
|
12182
12190
|
var Container$4 = styled.div(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n div {\n border-radius: 50%;\n width: ", ";\n height: ", ";\n\n ", "\n\n ", "\n ", "\n ", "\n ", "\n }\n\n span {\n display: inline-block;\n margin-left: 8px;\n color: ", ";\n }\n"])), function (_ref) {
|
|
12183
12191
|
var props = _ref.props;
|
|
12184
12192
|
return props.size === 'medium' ? '15px' : '6px';
|
|
@@ -12199,13 +12207,13 @@ var Container$4 = styled.div(_templateObject$8 || (_templateObject$8 = _taggedTe
|
|
|
12199
12207
|
});
|
|
12200
12208
|
}, function (_ref7) {
|
|
12201
12209
|
var props = _ref7.props;
|
|
12202
|
-
return props.type === 'danger' && css(_templateObject4$
|
|
12210
|
+
return props.type === 'danger' && css(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n "])), function (_ref8) {
|
|
12203
12211
|
var theme = _ref8.theme;
|
|
12204
12212
|
return theme.colors.warningRed;
|
|
12205
12213
|
});
|
|
12206
12214
|
}, function (_ref9) {
|
|
12207
12215
|
var props = _ref9.props;
|
|
12208
|
-
return props.type === 'success' && css(_templateObject5$
|
|
12216
|
+
return props.type === 'success' && css(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n "])), function (_ref10) {
|
|
12209
12217
|
var theme = _ref10.theme;
|
|
12210
12218
|
return theme.colors.green;
|
|
12211
12219
|
});
|
|
@@ -12225,7 +12233,7 @@ var Indicator = function Indicator(props) {
|
|
|
12225
12233
|
}, React__default.createElement("div", null), React__default.createElement("span", null, " ", props.description, " "));
|
|
12226
12234
|
};
|
|
12227
12235
|
|
|
12228
|
-
var _templateObject$9, _templateObject2$7, _templateObject3$7, _templateObject4$
|
|
12236
|
+
var _templateObject$9, _templateObject2$7, _templateObject3$7, _templateObject4$7, _templateObject5$7, _templateObject6$4, _templateObject7$3;
|
|
12229
12237
|
var Container$5 = styled.div(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n\n span {\n display: inline-block;\n margin-left: 7px;\n color: #000000cc;\n }\n"])));
|
|
12230
12238
|
var Progress = styled.div(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteralLoose(["\n width: 64px;\n height: 12px;\n border: 1px solid #e4e4e4;\n div {\n width: ", ";\n max-width: 64px;\n height: 100%;\n ", "\n\n ", "\n ", "\n ", "\n ", "\n }\n"])), function (props) {
|
|
12231
12239
|
return props.value + "%";
|
|
@@ -12235,12 +12243,12 @@ var Progress = styled.div(_templateObject2$7 || (_templateObject2$7 = _taggedTem
|
|
|
12235
12243
|
return theme.colors.warningGray;
|
|
12236
12244
|
});
|
|
12237
12245
|
}, function (props) {
|
|
12238
|
-
return props.type === 'info' && css(_templateObject4$
|
|
12246
|
+
return props.type === 'info' && css(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n "])), function (_ref2) {
|
|
12239
12247
|
var theme = _ref2.theme;
|
|
12240
12248
|
return theme.colors.blue;
|
|
12241
12249
|
});
|
|
12242
12250
|
}, function (props) {
|
|
12243
|
-
return props.type === 'danger' && css(_templateObject5$
|
|
12251
|
+
return props.type === 'danger' && css(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n "])), function (_ref3) {
|
|
12244
12252
|
var theme = _ref3.theme;
|
|
12245
12253
|
return theme.colors.warningRed;
|
|
12246
12254
|
});
|
|
@@ -12295,7 +12303,7 @@ function SvgClose(props) {
|
|
|
12295
12303
|
})));
|
|
12296
12304
|
}
|
|
12297
12305
|
|
|
12298
|
-
var _templateObject$a, _templateObject2$8, _templateObject3$8, _templateObject4$
|
|
12306
|
+
var _templateObject$a, _templateObject2$8, _templateObject3$8, _templateObject4$8, _templateObject5$8, _templateObject6$5;
|
|
12299
12307
|
var Container$6 = styled.div(_templateObject$a || (_templateObject$a = _taggedTemplateLiteralLoose(["\n display: block;\n border-bottom-style: solid;\n\n ", "\n"])), function (_ref) {
|
|
12300
12308
|
var theme = _ref.theme,
|
|
12301
12309
|
internal = _ref.internal;
|
|
@@ -12304,9 +12312,9 @@ var Container$6 = styled.div(_templateObject$a || (_templateObject$a = _taggedTe
|
|
|
12304
12312
|
var Tabs = styled.ul(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n user-select: none;\n list-style: none;\n display: inline-flex;\n gap: 1px;\n padding: 0;\n margin: 0;\n\n ", "\n"])), function (_ref2) {
|
|
12305
12313
|
var theme = _ref2.theme,
|
|
12306
12314
|
internal = _ref2.internal;
|
|
12307
|
-
return css(_templateObject4$
|
|
12315
|
+
return css(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteralLoose(["\n height: ", ";\n box-shadow: 0 0 10px 0 ", ";\n "])), internal ? '41px' : '49px', theme.getColor('black', 10));
|
|
12308
12316
|
});
|
|
12309
|
-
var Tab = styled.li(_templateObject5$
|
|
12317
|
+
var Tab = styled.li(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: space-between;\n border-radius: 4px 4px 0 0;\n\n svg {\n transform: scale(calc(18 / 24));\n stroke-width: 2px;\n }\n\n ", "\n"])), function (_ref3) {
|
|
12310
12318
|
var theme = _ref3.theme,
|
|
12311
12319
|
active = _ref3.active;
|
|
12312
12320
|
return css(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n padding: 0 ", ";\n gap: ", ";\n\n span {\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n\n color: ", ";\n }\n\n svg {\n stroke: ", ";\n\n &:hover {\n stroke: ", ";\n }\n }\n "])), theme.colors[active ? 'blue' : 'white'], theme.spacings.s2, theme.spacings.s2, theme.typographies.h2.fontFamily, theme.typographies.h2.fontSize, theme.typographies.h2.fontWeight, theme.colors[active ? 'white' : 'darkBlue'], theme.colors[active ? 'white' : 'darkBlue'], theme.colors.red);
|
|
@@ -12398,7 +12406,7 @@ var getMask = function getMask(mask) {
|
|
|
12398
12406
|
};
|
|
12399
12407
|
};
|
|
12400
12408
|
|
|
12401
|
-
var _templateObject$b, _templateObject2$9, _templateObject3$9, _templateObject4$
|
|
12409
|
+
var _templateObject$b, _templateObject2$9, _templateObject3$9, _templateObject4$9, _templateObject5$9, _templateObject6$6, _templateObject7$4, _templateObject8$3, _templateObject9$2, _templateObject10$2, _templateObject11$1, _templateObject12$1;
|
|
12402
12410
|
var IconContainer = styled.button(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: calc(", " + 1px);\n display: flex;\n justify-content: center;\n align-items: center;\n height: 17px;\n\n background-color: transparent;\n border: none;\n box-shadow: none;\n padding: 0;\n\n ", "\n"])), function (_ref) {
|
|
12403
12411
|
var theme = _ref.theme;
|
|
12404
12412
|
return theme.spacings.s2;
|
|
@@ -12408,7 +12416,7 @@ var IconContainer = styled.button(_templateObject$b || (_templateObject$b = _tag
|
|
|
12408
12416
|
if (!onClick || disabled) return;
|
|
12409
12417
|
return css(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n "])));
|
|
12410
12418
|
});
|
|
12411
|
-
var Input = styled.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteralLoose(["\n ", ";\n\n color: ", ";\n\n line-height: 17px;\n\n ::placeholder {\n color: ", ";\n\n line-height: 17px;\n\n ", "\n }\n\n width: 100%;\n box-sizing: border-box;\n\n padding: ", ";\n\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: 4px;\n\n background-color: ", ";\n\n box-shadow: none;\n outline: none;\n\n ", "\n"])), function (_ref3) {
|
|
12419
|
+
var Input = styled.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteralLoose(["\n ", ";\n\n color: ", ";\n\n line-height: 17px;\n\n ::placeholder {\n color: ", ";\n\n line-height: 17px;\n\n ", "\n }\n\n width: 100%;\n box-sizing: border-box;\n\n padding: ", ";\n\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: 4px;\n\n background-color: ", ";\n\n box-shadow: none;\n outline: none;\n\n ", "\n\n ", "\n"])), function (_ref3) {
|
|
12412
12420
|
var theme = _ref3.theme;
|
|
12413
12421
|
return theme.useTypography('p');
|
|
12414
12422
|
}, function (_ref4) {
|
|
@@ -12423,13 +12431,13 @@ var Input = styled.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemp
|
|
|
12423
12431
|
var placeholder = _ref6.placeholder;
|
|
12424
12432
|
|
|
12425
12433
|
if (placeholder !== '••••••••') {
|
|
12426
|
-
return css(_templateObject4$
|
|
12434
|
+
return css(_templateObject4$9 || (_templateObject4$9 = _taggedTemplateLiteralLoose(["\n ", ";\n opacity: 1;\n "])), function (_ref7) {
|
|
12427
12435
|
var theme = _ref7.theme;
|
|
12428
12436
|
return theme.useTypography('p');
|
|
12429
12437
|
});
|
|
12430
12438
|
}
|
|
12431
12439
|
|
|
12432
|
-
return css(_templateObject5$
|
|
12440
|
+
return css(_templateObject5$9 || (_templateObject5$9 = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n font-size: 14px;\n letter-spacing: 0px;\n "])));
|
|
12433
12441
|
}, function (_ref8) {
|
|
12434
12442
|
var theme = _ref8.theme;
|
|
12435
12443
|
return theme.spacings.s2 + " " + theme.spacings.s3;
|
|
@@ -12445,49 +12453,55 @@ var Input = styled.input(_templateObject3$9 || (_templateObject3$9 = _taggedTemp
|
|
|
12445
12453
|
var arrows = _ref11.arrows;
|
|
12446
12454
|
if (arrows) return;
|
|
12447
12455
|
return css(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteralLoose(["\n /* Chrome, Safari, Edge, Opera */\n :-webkit-outer-spin-button,\n :-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n\n /* Firefox */\n -moz-appearance: textfield;\n "])));
|
|
12456
|
+
}, function (_ref12) {
|
|
12457
|
+
var readOnly = _ref12.readOnly,
|
|
12458
|
+
onClick = _ref12.onClick,
|
|
12459
|
+
disabled = _ref12.disabled;
|
|
12460
|
+
if (!readOnly) return;
|
|
12461
|
+
return css(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteralLoose(["\n cursor: ", ";\n "])), !onClick || disabled ? 'unset' : 'pointer');
|
|
12448
12462
|
});
|
|
12449
|
-
var Label = styled.label(
|
|
12450
|
-
var theme = _ref12.theme;
|
|
12451
|
-
return theme.useTypography('p');
|
|
12452
|
-
}, function (_ref13) {
|
|
12463
|
+
var Label = styled.label(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n ", ";\n\n color: ", ";\n\n width: ", ";\n box-sizing: border-box;\n position: relative;\n display: block;\n\n ", "\n\n > div:first-child {\n display: inline-block;\n margin-bottom: ", ";\n\n ", "\n }\n\n ", "\n"])), function (_ref13) {
|
|
12453
12464
|
var theme = _ref13.theme;
|
|
12454
|
-
return theme.
|
|
12465
|
+
return theme.useTypography('p');
|
|
12455
12466
|
}, function (_ref14) {
|
|
12456
|
-
var
|
|
12457
|
-
return
|
|
12467
|
+
var theme = _ref14.theme;
|
|
12468
|
+
return theme.colors.greyishBlue;
|
|
12458
12469
|
}, function (_ref15) {
|
|
12459
|
-
var
|
|
12460
|
-
|
|
12461
|
-
return css(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
12470
|
+
var width = _ref15.width;
|
|
12471
|
+
return width || '100%';
|
|
12462
12472
|
}, function (_ref16) {
|
|
12463
|
-
var
|
|
12464
|
-
return
|
|
12473
|
+
var disabled = _ref16.disabled;
|
|
12474
|
+
if (!disabled) return;
|
|
12475
|
+
return css(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
12465
12476
|
}, function (_ref17) {
|
|
12466
|
-
var
|
|
12467
|
-
|
|
12468
|
-
return css(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n :after {\n content: ' *';\n }\n "])));
|
|
12477
|
+
var theme = _ref17.theme;
|
|
12478
|
+
return theme.spacings.s1;
|
|
12469
12479
|
}, function (_ref18) {
|
|
12470
|
-
var
|
|
12480
|
+
var required = _ref18.required;
|
|
12481
|
+
if (!required) return;
|
|
12482
|
+
return css(_templateObject10$2 || (_templateObject10$2 = _taggedTemplateLiteralLoose(["\n :after {\n content: ' *';\n }\n "])));
|
|
12483
|
+
}, function (_ref19) {
|
|
12484
|
+
var icon = _ref19.icon;
|
|
12471
12485
|
if (!icon) return;
|
|
12472
12486
|
var width = icon.width,
|
|
12473
12487
|
position = icon.position;
|
|
12474
12488
|
|
|
12475
12489
|
if (position === 'right') {
|
|
12476
|
-
return css(
|
|
12477
|
-
var theme = _ref19.theme;
|
|
12478
|
-
return theme.spacings.s3;
|
|
12479
|
-
}, Input, function (_ref20) {
|
|
12490
|
+
return css(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteralLoose(["\n > ", " {\n width: ", ";\n right: calc(", " / 2);\n }\n\n > ", " {\n padding-right: calc(", " + ", ");\n }\n "])), IconContainer, width, function (_ref20) {
|
|
12480
12491
|
var theme = _ref20.theme;
|
|
12481
12492
|
return theme.spacings.s3;
|
|
12493
|
+
}, Input, function (_ref21) {
|
|
12494
|
+
var theme = _ref21.theme;
|
|
12495
|
+
return theme.spacings.s3;
|
|
12482
12496
|
}, width);
|
|
12483
12497
|
}
|
|
12484
12498
|
|
|
12485
|
-
return css(
|
|
12486
|
-
var theme = _ref21.theme;
|
|
12487
|
-
return theme.spacings.s3;
|
|
12488
|
-
}, Input, function (_ref22) {
|
|
12499
|
+
return css(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteralLoose(["\n > ", " {\n width: ", ";\n left: calc(", " / 2);\n }\n\n > ", " {\n padding-left: calc(", " + ", ");\n }\n "])), IconContainer, width, function (_ref22) {
|
|
12489
12500
|
var theme = _ref22.theme;
|
|
12490
12501
|
return theme.spacings.s3;
|
|
12502
|
+
}, Input, function (_ref23) {
|
|
12503
|
+
var theme = _ref23.theme;
|
|
12504
|
+
return theme.spacings.s3;
|
|
12491
12505
|
}, width);
|
|
12492
12506
|
});
|
|
12493
12507
|
|
|
@@ -12636,7 +12650,7 @@ var Input$1 = React__default.forwardRef(function (props, ref) {
|
|
|
12636
12650
|
});
|
|
12637
12651
|
Input$1.displayName = 'Input';
|
|
12638
12652
|
|
|
12639
|
-
var _templateObject$c, _templateObject2$a, _templateObject3$a, _templateObject4$
|
|
12653
|
+
var _templateObject$c, _templateObject2$a, _templateObject3$a, _templateObject4$a, _templateObject5$a, _templateObject6$7, _templateObject7$5;
|
|
12640
12654
|
var width = '17px';
|
|
12641
12655
|
var Checkmark = styled.span(_templateObject$c || (_templateObject$c = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0px;\n left: 0;\n height: ", ";\n width: ", ";\n background-color: ", ";\n\n border-style: solid;\n border-color: ", ";\n border-width: 1px;\n border-radius: 4px;\n\n transition-property: border-color;\n transition-duration: 0.25s;\n transition-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);\n\n :after {\n content: '';\n position: absolute;\n\n left: 50%;\n top: 50%;\n height: 0;\n width: 0;\n\n border-style: solid;\n border-color: ", ";\n border-width: 0;\n transform: rotate(45deg);\n\n transition-property: width height border-width top left;\n transition-duration: 0.25s;\n transition-timing-function: cubic-bezier(0.68, -0.55, 0.27, 1.55);\n }\n"])), width, width, function (_ref) {
|
|
12642
12656
|
var theme = _ref.theme;
|
|
@@ -12699,10 +12713,10 @@ var Label$1 = styled.label(_templateObject2$a || (_templateObject2$a = _taggedTe
|
|
|
12699
12713
|
var disabled = _ref6.disabled;
|
|
12700
12714
|
|
|
12701
12715
|
if (!disabled) {
|
|
12702
|
-
return css(_templateObject4$
|
|
12716
|
+
return css(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n "])));
|
|
12703
12717
|
}
|
|
12704
12718
|
|
|
12705
|
-
return css(_templateObject5$
|
|
12719
|
+
return css(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
12706
12720
|
}, width, function (_ref7) {
|
|
12707
12721
|
var theme = _ref7.theme;
|
|
12708
12722
|
return theme.spacings.s1;
|
|
@@ -12880,7 +12894,7 @@ var Time = React__default.forwardRef(function (props, ref) {
|
|
|
12880
12894
|
});
|
|
12881
12895
|
Time.displayName = 'Time';
|
|
12882
12896
|
|
|
12883
|
-
var _templateObject$d, _templateObject2$b, _templateObject3$b, _templateObject4$
|
|
12897
|
+
var _templateObject$d, _templateObject2$b, _templateObject3$b, _templateObject4$b, _templateObject5$b, _templateObject6$8, _templateObject7$6, _templateObject8$4, _templateObject9$3, _templateObject10$3, _templateObject11$2, _templateObject12$2, _templateObject13$1;
|
|
12884
12898
|
var Container$7 = styled.div(_templateObject$d || (_templateObject$d = _taggedTemplateLiteralLoose(["\n display: inline-block;\n background-color: ", ";\n padding: ", ";\n\n > div:nth-child(1) {\n border: 1px solid ", ";\n margin-bottom: ", ";\n }\n"])), function (_ref) {
|
|
12885
12899
|
var theme = _ref.theme;
|
|
12886
12900
|
return theme.colors.white;
|
|
@@ -12899,11 +12913,11 @@ var AbsoluteContainer$1 = styled(AbsoluteContainer)(_templateObject2$b || (_temp
|
|
|
12899
12913
|
return theme.spacings.s3 + " " + theme.spacings.s3 + " " + theme.spacings.s1 + " " + theme.spacings.s3;
|
|
12900
12914
|
});
|
|
12901
12915
|
var Footer = styled.div(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
12902
|
-
var MonthContainer = styled.div(_templateObject4$
|
|
12916
|
+
var MonthContainer = styled.div(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n > div {\n margin: ", " 0;\n }\n"])), function (_ref6) {
|
|
12903
12917
|
var theme = _ref6.theme;
|
|
12904
12918
|
return theme.spacings.s1;
|
|
12905
12919
|
});
|
|
12906
|
-
var NavBtn = styled.button(_templateObject5$
|
|
12920
|
+
var NavBtn = styled.button(_templateObject5$b || (_templateObject5$b = _taggedTemplateLiteralLoose(["\n ", "\n line-height: 14px;\n width: 32px;\n height: 32px;\n box-shadow: none;\n border: 0.5px solid transparent;\n background-color: transparent;\n cursor: pointer;\n border: none;\n\n padding: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n\n :disabled {\n visibility: hidden;\n }\n"])), function (_ref7) {
|
|
12907
12921
|
var theme = _ref7.theme;
|
|
12908
12922
|
return theme.useTypography('p');
|
|
12909
12923
|
});
|
|
@@ -12949,7 +12963,7 @@ var DayContainer = styled.button(_templateObject8$4 || (_templateObject8$4 = _ta
|
|
|
12949
12963
|
theme = _ref17.theme;
|
|
12950
12964
|
|
|
12951
12965
|
if (active !== 1) {
|
|
12952
|
-
return css(_templateObject12$
|
|
12966
|
+
return css(_templateObject12$2 || (_templateObject12$2 = _taggedTemplateLiteralLoose(["\n :not(:disabled) {\n :hover {\n border-color: ", ";\n color: ", ";\n }\n }\n "])), function (_ref18) {
|
|
12953
12967
|
var theme = _ref18.theme;
|
|
12954
12968
|
return theme.colors.blue;
|
|
12955
12969
|
}, function (_ref19) {
|
|
@@ -13219,7 +13233,7 @@ var Calendar = function Calendar(props) {
|
|
|
13219
13233
|
var JSDate = Date;
|
|
13220
13234
|
|
|
13221
13235
|
var _templateObject$e;
|
|
13222
|
-
var RelativeContainer = styled.div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
13236
|
+
var RelativeContainer$1 = styled.div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
13223
13237
|
|
|
13224
13238
|
var isLeapYear = function isLeapYear(year) {
|
|
13225
13239
|
if (year % 4 !== 0) return false;else if (year % 100 !== 0) return true;else if (year % 400 !== 0) return false;else return true;
|
|
@@ -13337,7 +13351,7 @@ var Date$1 = React__default.forwardRef(function (props, ref) {
|
|
|
13337
13351
|
}
|
|
13338
13352
|
} : undefined;
|
|
13339
13353
|
var inputProps = filterObject(props, ['picker', 'min', 'max']);
|
|
13340
|
-
return React__default.createElement(RelativeContainer, {
|
|
13354
|
+
return React__default.createElement(RelativeContainer$1, {
|
|
13341
13355
|
ref: useOnClickOut(function () {
|
|
13342
13356
|
return setOpen(false);
|
|
13343
13357
|
})
|
|
@@ -13372,13 +13386,13 @@ var useContext = function useContext() {
|
|
|
13372
13386
|
return React__default.useContext(Provider);
|
|
13373
13387
|
};
|
|
13374
13388
|
|
|
13375
|
-
var _templateObject$f, _templateObject2$c, _templateObject3$c, _templateObject4$
|
|
13376
|
-
var RelativeContainer$
|
|
13389
|
+
var _templateObject$f, _templateObject2$c, _templateObject3$c, _templateObject4$c;
|
|
13390
|
+
var RelativeContainer$2 = styled.div(_templateObject$f || (_templateObject$f = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
13377
13391
|
var HeaderContainer = styled.div(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
13378
13392
|
var theme = _ref.theme;
|
|
13379
13393
|
return css(_templateObject3$c || (_templateObject3$c = _taggedTemplateLiteralLoose(["\n padding: ", " calc(", " * 0.75)\n ", " ", ";\n "])), theme.spacings.s3, theme.spacings.s3, theme.spacings.s1, theme.spacings.s3);
|
|
13380
13394
|
});
|
|
13381
|
-
var SelectAllContainer = styled.div(_templateObject4$
|
|
13395
|
+
var SelectAllContainer = styled.div(_templateObject4$c || (_templateObject4$c = _taggedTemplateLiteralLoose(["\n margin-bottom: ", ";\n display: flex;\n justify-content: space-between;\n"])), function (_ref2) {
|
|
13382
13396
|
var theme = _ref2.theme;
|
|
13383
13397
|
return theme.spacings.s1;
|
|
13384
13398
|
});
|
|
@@ -13386,20 +13400,22 @@ var SelectAllContainer = styled.div(_templateObject4$b || (_templateObject4$b =
|
|
|
13386
13400
|
var Header$1 = function Header() {
|
|
13387
13401
|
var context = useContext();
|
|
13388
13402
|
|
|
13403
|
+
if (!context.props.search) {
|
|
13404
|
+
return React__default.createElement(React__default.Fragment, null);
|
|
13405
|
+
}
|
|
13406
|
+
|
|
13389
13407
|
var _useState = useState(''),
|
|
13390
13408
|
search = _useState[0],
|
|
13391
13409
|
setSearch = _useState[1];
|
|
13392
13410
|
|
|
13393
|
-
|
|
13394
|
-
|
|
13395
|
-
|
|
13396
|
-
|
|
13397
|
-
|
|
13398
|
-
|
|
13399
|
-
|
|
13400
|
-
|
|
13401
|
-
setSearched = context.setSearched,
|
|
13402
|
-
setPage = context.setPage;
|
|
13411
|
+
var _context$checked = context.checked,
|
|
13412
|
+
checked = _context$checked[0],
|
|
13413
|
+
setChecked = _context$checked[1],
|
|
13414
|
+
_context$search = context.search,
|
|
13415
|
+
searched = _context$search[0],
|
|
13416
|
+
setSearched = _context$search[1],
|
|
13417
|
+
loading = context.loading,
|
|
13418
|
+
options = context.options;
|
|
13403
13419
|
|
|
13404
13420
|
var onClick = function onClick() {
|
|
13405
13421
|
setChecked(function (prev) {
|
|
@@ -13411,7 +13427,11 @@ var Header$1 = function Header() {
|
|
|
13411
13427
|
|
|
13412
13428
|
var onSearch = function onSearch() {
|
|
13413
13429
|
setSearched(search);
|
|
13414
|
-
|
|
13430
|
+
};
|
|
13431
|
+
|
|
13432
|
+
var onClear = function onClear() {
|
|
13433
|
+
setSearch('');
|
|
13434
|
+
setSearched('');
|
|
13415
13435
|
};
|
|
13416
13436
|
|
|
13417
13437
|
return React__default.createElement(HeaderContainer, null, context.props.type === 'select-multiple' && context.props.selectAll && React__default.createElement(SelectAllContainer, null, React__default.createElement("b", null, "Selecionados (", checked.length, ")"), React__default.createElement(Button$1, {
|
|
@@ -13426,14 +13446,15 @@ var Header$1 = function Header() {
|
|
|
13426
13446
|
setValue: setSearch,
|
|
13427
13447
|
value: search,
|
|
13428
13448
|
onPressEnter: onSearch,
|
|
13429
|
-
clearable: search !== '' && search === searched,
|
|
13449
|
+
clearable: search !== '' && search === searched ? onClear : undefined,
|
|
13430
13450
|
icon: {
|
|
13431
13451
|
icon: {
|
|
13432
13452
|
type: 'feather',
|
|
13433
13453
|
icon: 'search'
|
|
13434
13454
|
},
|
|
13435
13455
|
onClick: onSearch
|
|
13436
|
-
}
|
|
13456
|
+
},
|
|
13457
|
+
loading: loading
|
|
13437
13458
|
}));
|
|
13438
13459
|
};
|
|
13439
13460
|
|
|
@@ -13441,7 +13462,8 @@ var Footer$1 = function Footer() {
|
|
|
13441
13462
|
var context = useContext();
|
|
13442
13463
|
if (context.props.type !== 'select-multiple') return React__default.createElement(React__default.Fragment, null);
|
|
13443
13464
|
var setValue = context.props.setValue,
|
|
13444
|
-
checked = context.checked,
|
|
13465
|
+
_context$checked = context.checked,
|
|
13466
|
+
checked = _context$checked[0],
|
|
13445
13467
|
setOpen = context.setOpen;
|
|
13446
13468
|
|
|
13447
13469
|
var onClick = function onClick() {
|
|
@@ -13459,9 +13481,9 @@ var Footer$1 = function Footer() {
|
|
|
13459
13481
|
});
|
|
13460
13482
|
};
|
|
13461
13483
|
|
|
13462
|
-
var getOptions = function getOptions(props, checked, setChecked) {
|
|
13484
|
+
var getOptions = function getOptions(props, options, checked, setChecked) {
|
|
13463
13485
|
if (props.type === 'select-multiple') {
|
|
13464
|
-
return
|
|
13486
|
+
return options.map(function (option) {
|
|
13465
13487
|
var label = isString(option.label) ? {
|
|
13466
13488
|
text: option.label,
|
|
13467
13489
|
element: option.label
|
|
@@ -13500,7 +13522,7 @@ var getOptions = function getOptions(props, checked, setChecked) {
|
|
|
13500
13522
|
});
|
|
13501
13523
|
}
|
|
13502
13524
|
|
|
13503
|
-
return
|
|
13525
|
+
return options.map(function (option) {
|
|
13504
13526
|
var label = isString(option.label) ? {
|
|
13505
13527
|
text: option.label,
|
|
13506
13528
|
element: option.label
|
|
@@ -13523,32 +13545,44 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13523
13545
|
loader = props.loader,
|
|
13524
13546
|
type = props.type;
|
|
13525
13547
|
|
|
13526
|
-
var _useState = useState(
|
|
13527
|
-
|
|
13528
|
-
|
|
13548
|
+
var _useState = useState([]),
|
|
13549
|
+
options = _useState[0],
|
|
13550
|
+
setOptions = _useState[1];
|
|
13529
13551
|
|
|
13530
|
-
var _useState2 = useState(
|
|
13531
|
-
|
|
13532
|
-
|
|
13552
|
+
var _useState2 = useState(false),
|
|
13553
|
+
_loading = _useState2[0],
|
|
13554
|
+
setLoading = _useState2[1];
|
|
13533
13555
|
|
|
13534
|
-
var _useState3 = useState(
|
|
13535
|
-
|
|
13536
|
-
|
|
13556
|
+
var _useState3 = useState(''),
|
|
13557
|
+
search = _useState3[0],
|
|
13558
|
+
_setSearch = _useState3[1];
|
|
13537
13559
|
|
|
13538
|
-
var _useState4 = useState(
|
|
13539
|
-
|
|
13540
|
-
|
|
13560
|
+
var _useState4 = useState(1),
|
|
13561
|
+
page = _useState4[0],
|
|
13562
|
+
setPage = _useState4[1];
|
|
13541
13563
|
|
|
13542
13564
|
var _useState5 = useState(false),
|
|
13543
|
-
|
|
13544
|
-
|
|
13565
|
+
lastPage = _useState5[0],
|
|
13566
|
+
setLastPage = _useState5[1];
|
|
13567
|
+
|
|
13568
|
+
var _useState6 = useState(false),
|
|
13569
|
+
open = _useState6[0],
|
|
13570
|
+
setOpen = _useState6[1];
|
|
13545
13571
|
|
|
13546
|
-
var
|
|
13547
|
-
checked =
|
|
13548
|
-
setChecked =
|
|
13572
|
+
var _useState7 = useState(Array.isArray(props.value) ? [].concat(props.value) : []),
|
|
13573
|
+
checked = _useState7[0],
|
|
13574
|
+
setChecked = _useState7[1];
|
|
13549
13575
|
|
|
13550
|
-
var
|
|
13551
|
-
|
|
13576
|
+
var loading = props.loading || _loading;
|
|
13577
|
+
|
|
13578
|
+
var setSearch = function setSearch(value) {
|
|
13579
|
+
_setSearch(value);
|
|
13580
|
+
|
|
13581
|
+
setPage(1);
|
|
13582
|
+
};
|
|
13583
|
+
|
|
13584
|
+
var parsedOptions = getOptions(props, options, checked, setChecked);
|
|
13585
|
+
var inputProps = filterObject(props, ['type', 'onScrollEnd', 'position', 'disableAutoPosition', 'value']);
|
|
13552
13586
|
|
|
13553
13587
|
if (props.type === 'select-multiple') {
|
|
13554
13588
|
if (props.value.length > 0) {
|
|
@@ -13557,7 +13591,7 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13557
13591
|
inputProps.value = '';
|
|
13558
13592
|
}
|
|
13559
13593
|
} else {
|
|
13560
|
-
var selected =
|
|
13594
|
+
var selected = parsedOptions.find(function (option) {
|
|
13561
13595
|
return option.data.value === props.value;
|
|
13562
13596
|
});
|
|
13563
13597
|
inputProps.value = selected ? selected.label.text : '';
|
|
@@ -13566,7 +13600,7 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13566
13600
|
var _onScrollEnd = props.onScrollEnd || function () {};
|
|
13567
13601
|
|
|
13568
13602
|
var onScrollEnd = function onScrollEnd() {
|
|
13569
|
-
if (!lastPage) {
|
|
13603
|
+
if (!lastPage && !loading) {
|
|
13570
13604
|
setPage(function (prev) {
|
|
13571
13605
|
return prev + 1;
|
|
13572
13606
|
});
|
|
@@ -13577,16 +13611,15 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13577
13611
|
|
|
13578
13612
|
var onSubmit = useCallback(function () {
|
|
13579
13613
|
try {
|
|
13580
|
-
if (!props.loader) return Promise.resolve();
|
|
13581
13614
|
setLoading(true);
|
|
13582
|
-
return Promise.resolve(
|
|
13615
|
+
return Promise.resolve(loader(search, page)).then(function (optionsResult) {
|
|
13583
13616
|
if (Array.isArray(optionsResult)) {
|
|
13584
|
-
|
|
13617
|
+
setOptions(page === 1 ? optionsResult : function (prev) {
|
|
13585
13618
|
return prev.concat(optionsResult);
|
|
13586
13619
|
});
|
|
13587
13620
|
setLastPage(true);
|
|
13588
13621
|
} else {
|
|
13589
|
-
|
|
13622
|
+
setOptions(page === 1 ? optionsResult.options : function (prev) {
|
|
13590
13623
|
return prev.concat(optionsResult.options);
|
|
13591
13624
|
});
|
|
13592
13625
|
setLastPage(optionsResult.lastPage);
|
|
@@ -13597,7 +13630,21 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13597
13630
|
} catch (e) {
|
|
13598
13631
|
return Promise.reject(e);
|
|
13599
13632
|
}
|
|
13600
|
-
}, [
|
|
13633
|
+
}, [search, page]);
|
|
13634
|
+
useEffect(function () {
|
|
13635
|
+
var changed = false;
|
|
13636
|
+
|
|
13637
|
+
_setSearch(function (prev) {
|
|
13638
|
+
if (prev !== '') changed = true;
|
|
13639
|
+
return '';
|
|
13640
|
+
});
|
|
13641
|
+
|
|
13642
|
+
setPage(function (prev) {
|
|
13643
|
+
if (prev !== 1) changed = true;
|
|
13644
|
+
return 1;
|
|
13645
|
+
});
|
|
13646
|
+
if (!changed) onSubmit();
|
|
13647
|
+
}, [loader]);
|
|
13601
13648
|
useEffect(function () {
|
|
13602
13649
|
onSubmit();
|
|
13603
13650
|
}, [onSubmit]);
|
|
@@ -13605,13 +13652,12 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13605
13652
|
value: {
|
|
13606
13653
|
props: props,
|
|
13607
13654
|
setOpen: setOpen,
|
|
13608
|
-
checked: checked,
|
|
13609
|
-
|
|
13610
|
-
|
|
13611
|
-
|
|
13612
|
-
setSearched: setSearched
|
|
13655
|
+
checked: [checked, setChecked],
|
|
13656
|
+
search: [search, setSearch],
|
|
13657
|
+
loading: loading,
|
|
13658
|
+
options: options
|
|
13613
13659
|
}
|
|
13614
|
-
}, React__default.createElement(RelativeContainer$
|
|
13660
|
+
}, React__default.createElement(RelativeContainer$2, {
|
|
13615
13661
|
ref: useOnClickOut(function () {
|
|
13616
13662
|
return setOpen(false);
|
|
13617
13663
|
})
|
|
@@ -13623,7 +13669,7 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13623
13669
|
return !prev;
|
|
13624
13670
|
});
|
|
13625
13671
|
},
|
|
13626
|
-
loading:
|
|
13672
|
+
loading: loading,
|
|
13627
13673
|
icon: {
|
|
13628
13674
|
position: 'right',
|
|
13629
13675
|
icon: {
|
|
@@ -13638,7 +13684,7 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13638
13684
|
close: function close() {
|
|
13639
13685
|
return setOpen(false);
|
|
13640
13686
|
},
|
|
13641
|
-
options:
|
|
13687
|
+
options: parsedOptions,
|
|
13642
13688
|
onScrollEnd: onScrollEnd,
|
|
13643
13689
|
width: '100%',
|
|
13644
13690
|
bordered: true,
|
|
@@ -13650,7 +13696,8 @@ var Select = React__default.forwardRef(function (props, ref) {
|
|
|
13650
13696
|
},
|
|
13651
13697
|
before: React__default.createElement(Header$1, null),
|
|
13652
13698
|
after: React__default.createElement(Footer$1, null),
|
|
13653
|
-
scrollHeight:
|
|
13699
|
+
scrollHeight: props.search ? '135px' : '165px',
|
|
13700
|
+
loading: loading
|
|
13654
13701
|
})));
|
|
13655
13702
|
});
|
|
13656
13703
|
Select.displayName = 'Select';
|
|
@@ -13897,7 +13944,7 @@ var countries = {
|
|
|
13897
13944
|
|
|
13898
13945
|
var _templateObject$h, _templateObject2$e, _templateObject3$d;
|
|
13899
13946
|
var IconContainer$1 = styled.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n\n > i.icon {\n margin-top: -1px;\n }\n"])));
|
|
13900
|
-
var RelativeContainer$
|
|
13947
|
+
var RelativeContainer$3 = styled.div(_templateObject2$e || (_templateObject2$e = _taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
13901
13948
|
var Label$2 = styled.div(_templateObject3$d || (_templateObject3$d = _taggedTemplateLiteralLoose(["\n ", "\n\n color: ", ";\n\n display: flex;\n gap: ", ";\n\n > span {\n color: ", ";\n }\n"])), function (_ref) {
|
|
13902
13949
|
var theme = _ref.theme;
|
|
13903
13950
|
return theme.useTypography('p');
|
|
@@ -14014,7 +14061,7 @@ var Phone = React__default.forwardRef(function (props, ref) {
|
|
|
14014
14061
|
var v = inputValue.replace(/\D+/g, '').substring(0, country.charLimit);
|
|
14015
14062
|
setValue(country.ddi + " " + v);
|
|
14016
14063
|
}, [inputValue]);
|
|
14017
|
-
return React__default.createElement(RelativeContainer$
|
|
14064
|
+
return React__default.createElement(RelativeContainer$3, {
|
|
14018
14065
|
ref: useOnClickOut(function () {
|
|
14019
14066
|
return setOpen(false);
|
|
14020
14067
|
})
|
|
@@ -14055,8 +14102,8 @@ var Phone = React__default.forwardRef(function (props, ref) {
|
|
|
14055
14102
|
});
|
|
14056
14103
|
Phone.displayName = 'Phone';
|
|
14057
14104
|
|
|
14058
|
-
var _templateObject$i, _templateObject2$f, _templateObject3$e, _templateObject4$
|
|
14059
|
-
var RelativeContainer$
|
|
14105
|
+
var _templateObject$i, _templateObject2$f, _templateObject3$e, _templateObject4$d, _templateObject5$c, _templateObject6$9;
|
|
14106
|
+
var RelativeContainer$4 = styled.div(_templateObject$i || (_templateObject$i = _taggedTemplateLiteralLoose(["\n position: relative;\n\n input {\n color: transparent;\n }\n"])));
|
|
14060
14107
|
var Container$8 = styled.div(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 1px;\n left: 1px;\n width: calc(100% - 2px - ", ");\n height: 33px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ", ";\n border-radius: 4px;\n\n ", "\n\n ", "\n"])), function (_ref) {
|
|
14061
14108
|
var iconWidth = _ref.iconWidth,
|
|
14062
14109
|
theme = _ref.theme;
|
|
@@ -14072,9 +14119,9 @@ var Container$8 = styled.div(_templateObject2$f || (_templateObject2$f = _tagged
|
|
|
14072
14119
|
}, function (_ref4) {
|
|
14073
14120
|
var disabled = _ref4.disabled;
|
|
14074
14121
|
if (!disabled) return;
|
|
14075
|
-
return css(_templateObject4$
|
|
14122
|
+
return css(_templateObject4$d || (_templateObject4$d = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
14076
14123
|
});
|
|
14077
|
-
var Button$3 = styled.button(_templateObject5$
|
|
14124
|
+
var Button$3 = styled.button(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (_ref5) {
|
|
14078
14125
|
var onClick = _ref5.onClick;
|
|
14079
14126
|
if (!onClick) return;
|
|
14080
14127
|
return css(_templateObject6$9 || (_templateObject6$9 = _taggedTemplateLiteralLoose(["\n :not(:disabled) {\n cursor: pointer;\n }\n "])));
|
|
@@ -14129,7 +14176,7 @@ var DatePicker = React__default.forwardRef(function (props, ref) {
|
|
|
14129
14176
|
}
|
|
14130
14177
|
} : undefined;
|
|
14131
14178
|
var inputProps = filterObject(props, ['picker', 'min', 'max']);
|
|
14132
|
-
return React__default.createElement(RelativeContainer$
|
|
14179
|
+
return React__default.createElement(RelativeContainer$4, {
|
|
14133
14180
|
ref: useOnClickOut(function () {
|
|
14134
14181
|
return setOpen(false);
|
|
14135
14182
|
})
|
|
@@ -14188,7 +14235,7 @@ var DatePicker = React__default.forwardRef(function (props, ref) {
|
|
|
14188
14235
|
});
|
|
14189
14236
|
DatePicker.displayName = 'DatePicker';
|
|
14190
14237
|
|
|
14191
|
-
var _templateObject$j, _templateObject2$g, _templateObject3$f, _templateObject4$
|
|
14238
|
+
var _templateObject$j, _templateObject2$g, _templateObject3$f, _templateObject4$e, _templateObject5$d, _templateObject6$a, _templateObject7$7;
|
|
14192
14239
|
var LabelContainer = styled.div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteralLoose(["\n ", "\n line-height: 14px;\n display: flex;\n align-items: center;\n"])), function (_ref) {
|
|
14193
14240
|
var theme = _ref.theme;
|
|
14194
14241
|
return theme.useTypography('p');
|
|
@@ -14203,11 +14250,11 @@ var Label$3 = styled.label(_templateObject2$g || (_templateObject2$g = _taggedTe
|
|
|
14203
14250
|
return css(_templateObject3$f || (_templateObject3$f = _taggedTemplateLiteralLoose(["\n > span {\n cursor: pointer;\n }\n "])));
|
|
14204
14251
|
}
|
|
14205
14252
|
|
|
14206
|
-
return css(_templateObject4$
|
|
14253
|
+
return css(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
14207
14254
|
}, function (_ref4) {
|
|
14208
14255
|
var required = _ref4.required;
|
|
14209
14256
|
if (!required) return;
|
|
14210
|
-
return css(_templateObject5$
|
|
14257
|
+
return css(_templateObject5$d || (_templateObject5$d = _taggedTemplateLiteralLoose(["\n > ", " {\n :after {\n content: '*';\n }\n }\n "])), LabelContainer);
|
|
14211
14258
|
}, function (_ref5) {
|
|
14212
14259
|
var invalid = _ref5.invalid;
|
|
14213
14260
|
|
|
@@ -14266,7 +14313,7 @@ var Switch = function Switch(props) {
|
|
|
14266
14313
|
})), React__default.createElement("span", null), label && React__default.createElement(LabelContainer, null, label));
|
|
14267
14314
|
};
|
|
14268
14315
|
|
|
14269
|
-
var _templateObject$k, _templateObject2$h, _templateObject3$g, _templateObject4$
|
|
14316
|
+
var _templateObject$k, _templateObject2$h, _templateObject3$g, _templateObject4$f, _templateObject5$e, _templateObject6$b, _templateObject7$8, _templateObject8$5, _templateObject9$4, _templateObject10$4, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15, _templateObject16;
|
|
14270
14317
|
var bullet = css(_templateObject$k || (_templateObject$k = _taggedTemplateLiteralLoose(["\n appearance: none;\n width: ", ";\n height: ", ";\n border-radius: 100%;\n border-width: 1px;\n border-style: solid;\n background-color: ", ";\n box-shadow: 0px 1px 3px ", ";\n"])), function (_ref) {
|
|
14271
14318
|
var theme = _ref.theme;
|
|
14272
14319
|
return theme.spacings.s4;
|
|
@@ -14290,14 +14337,14 @@ var Label$4 = styled.label(_templateObject3$g || (_templateObject3$g = _taggedTe
|
|
|
14290
14337
|
}, function (_ref7) {
|
|
14291
14338
|
var disabled = _ref7.disabled;
|
|
14292
14339
|
if (!disabled) return;
|
|
14293
|
-
return css(_templateObject4$
|
|
14340
|
+
return css(_templateObject4$f || (_templateObject4$f = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
14294
14341
|
}, function (_ref8) {
|
|
14295
14342
|
var theme = _ref8.theme;
|
|
14296
14343
|
return theme.spacings.s1;
|
|
14297
14344
|
}, function (_ref9) {
|
|
14298
14345
|
var required = _ref9.required;
|
|
14299
14346
|
if (!required) return;
|
|
14300
|
-
return css(_templateObject5$
|
|
14347
|
+
return css(_templateObject5$e || (_templateObject5$e = _taggedTemplateLiteralLoose(["\n :after {\n content: ' *';\n }\n "])));
|
|
14301
14348
|
});
|
|
14302
14349
|
var InputContainer = styled.div(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteralLoose(["\n flex: 1;\n display: flex;\n gap: 6px;\n\n > div {\n position: relative;\n }\n\n ", "\n"])), function (_ref10) {
|
|
14303
14350
|
var theme = _ref10.theme,
|
|
@@ -14317,7 +14364,7 @@ var LabelsContainer = styled.div(_templateObject10$4 || (_templateObject10$4 = _
|
|
|
14317
14364
|
return css(_templateObject11$3 || (_templateObject11$3 = _taggedTemplateLiteralLoose(["\n ", " {\n flex-direction: column-reverse;\n }\n\n ", " {\n :after {\n bottom: calc(100% + 10.5px);\n }\n }\n\n ", " {\n align-items: start;\n }\n "])), InputContainer, Marker, MinMaxLabelContainer);
|
|
14318
14365
|
}
|
|
14319
14366
|
|
|
14320
|
-
return css(_templateObject12$
|
|
14367
|
+
return css(_templateObject12$3 || (_templateObject12$3 = _taggedTemplateLiteralLoose(["\n ", " {\n flex-direction: column;\n }\n\n ", " {\n :after {\n top: calc(100% + 8px);\n }\n }\n\n ", " {\n align-items: end;\n }\n "])), InputContainer, Marker, MinMaxLabelContainer);
|
|
14321
14368
|
});
|
|
14322
14369
|
var SelectedArea = styled.div(_templateObject13$2 || (_templateObject13$2 = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n\n height: 3px;\n width: 100%;\n position: absolute;\n bottom: calc(50% - 2px);\n left: 0;\n display: flex;\n z-index: 1;\n\n > span {\n width: ", "%;\n display: block;\n box-sizing: border-box;\n height: 100%;\n }\n"])), function (_ref12) {
|
|
14323
14370
|
var theme = _ref12.theme;
|
|
@@ -14476,7 +14523,7 @@ var Range = React__default.forwardRef(function (props, ref) {
|
|
|
14476
14523
|
});
|
|
14477
14524
|
Range.displayName = 'input';
|
|
14478
14525
|
|
|
14479
|
-
var _templateObject$l, _templateObject2$i, _templateObject3$h, _templateObject4$
|
|
14526
|
+
var _templateObject$l, _templateObject2$i, _templateObject3$h, _templateObject4$g, _templateObject5$f, _templateObject6$c, _templateObject7$9;
|
|
14480
14527
|
var LabelContainer$1 = styled.div(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n ", "\n display: flex;\n align-items: center;\n"])), function (_ref) {
|
|
14481
14528
|
var theme = _ref.theme;
|
|
14482
14529
|
return theme.useTypography('p');
|
|
@@ -14491,11 +14538,11 @@ var Label$5 = styled.label(_templateObject2$i || (_templateObject2$i = _taggedTe
|
|
|
14491
14538
|
return css(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteralLoose(["\n > span {\n cursor: pointer;\n }\n "])));
|
|
14492
14539
|
}
|
|
14493
14540
|
|
|
14494
|
-
return css(_templateObject4$
|
|
14541
|
+
return css(_templateObject4$g || (_templateObject4$g = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
14495
14542
|
}, function (_ref4) {
|
|
14496
14543
|
var required = _ref4.required;
|
|
14497
14544
|
if (!required) return;
|
|
14498
|
-
return css(_templateObject5$
|
|
14545
|
+
return css(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n > ", " {\n :after {\n content: ' *';\n }\n }\n "])), LabelContainer$1);
|
|
14499
14546
|
}, function (_ref5) {
|
|
14500
14547
|
var invalid = _ref5.invalid;
|
|
14501
14548
|
|
|
@@ -14653,7 +14700,7 @@ var widths = {
|
|
|
14653
14700
|
default: '642.5px'
|
|
14654
14701
|
};
|
|
14655
14702
|
|
|
14656
|
-
var _templateObject$m, _templateObject2$j, _templateObject3$i, _templateObject4$
|
|
14703
|
+
var _templateObject$m, _templateObject2$j, _templateObject3$i, _templateObject4$h, _templateObject5$g, _templateObject6$d, _templateObject7$a, _templateObject8$6, _templateObject9$5, _templateObject10$5;
|
|
14657
14704
|
var Background = styled.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100vw;\n height: 100vh;\n backdrop-filter: blur(3px);\n background-color: ", ";\n"])), function (_ref) {
|
|
14658
14705
|
var theme = _ref.theme;
|
|
14659
14706
|
return theme.getColor('black', 25);
|
|
@@ -14664,9 +14711,9 @@ var Header$2 = styled.div(_templateObject3$i || (_templateObject3$i = _taggedTem
|
|
|
14664
14711
|
colors = _ref2$theme.colors,
|
|
14665
14712
|
spacings = _ref2$theme.spacings,
|
|
14666
14713
|
useTypography = _ref2$theme.useTypography;
|
|
14667
|
-
return css(_templateObject4$
|
|
14714
|
+
return css(_templateObject4$h || (_templateObject4$h = _taggedTemplateLiteralLoose(["\n border-bottom: 1px solid ", ";\n padding: ", ";\n\n ", "\n "])), colors.lightestGrey, spacings.s4, useTypography('h1'));
|
|
14668
14715
|
});
|
|
14669
|
-
var Footer$2 = styled.div(_templateObject5$
|
|
14716
|
+
var Footer$2 = styled.div(_templateObject5$g || (_templateObject5$g = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n ", "\n"])), function (_ref3) {
|
|
14670
14717
|
var _ref3$theme = _ref3.theme,
|
|
14671
14718
|
spacings = _ref3$theme.spacings,
|
|
14672
14719
|
colors = _ref3$theme.colors;
|
|
@@ -14882,15 +14929,15 @@ Modal$1.ConfirmDelete = ConfirmDelete;
|
|
|
14882
14929
|
Modal$1.ConfirmEdit = ConfirmSuccess;
|
|
14883
14930
|
Modal$1.Audit = Audit;
|
|
14884
14931
|
|
|
14885
|
-
var _templateObject$q, _templateObject2$k, _templateObject3$j, _templateObject4$
|
|
14932
|
+
var _templateObject$q, _templateObject2$k, _templateObject3$j, _templateObject4$i, _templateObject5$h, _templateObject6$e, _templateObject7$b, _templateObject8$7, _templateObject9$6, _templateObject10$6;
|
|
14886
14933
|
var Container$a = styled.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n width: 100%;\n background: #fff;\n border: 1px solid #d4d4d5;\n border-radius: 4px;\n border-left-width: 5px;\n padding: 14px;\n ", "\n ", "\n ", "\n ", "\n\n ", "\n ", "\n ", "\n\n ", "\n ", "\n"])), function (props) {
|
|
14887
14934
|
return props.size === 'mini' && css(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n width: 394px;\n height: 99px;\n "])));
|
|
14888
14935
|
}, function (props) {
|
|
14889
14936
|
return props.size === 'small' && css(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteralLoose(["\n width: 394px;\n height: 131px;\n "])));
|
|
14890
14937
|
}, function (props) {
|
|
14891
|
-
return props.size === 'medium' && css(_templateObject4$
|
|
14938
|
+
return props.size === 'medium' && css(_templateObject4$i || (_templateObject4$i = _taggedTemplateLiteralLoose(["\n width: 394px;\n "])));
|
|
14892
14939
|
}, function (props) {
|
|
14893
|
-
return props.size === 'big' && css(_templateObject5$
|
|
14940
|
+
return props.size === 'big' && css(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteralLoose(["\n width: 414px;\n height: 324px;\n "])));
|
|
14894
14941
|
}, function (props) {
|
|
14895
14942
|
return props.borderType === 'info' && css(_templateObject6$e || (_templateObject6$e = _taggedTemplateLiteralLoose(["\n border-left-color: #4d6dbe;\n "])));
|
|
14896
14943
|
}, function (props) {
|
|
@@ -14912,7 +14959,7 @@ var Card = function Card(_ref) {
|
|
|
14912
14959
|
return React__default.createElement(Container$a, Object.assign({}, rest), children);
|
|
14913
14960
|
};
|
|
14914
14961
|
|
|
14915
|
-
var _templateObject$r, _templateObject2$l, _templateObject3$k, _templateObject4$
|
|
14962
|
+
var _templateObject$r, _templateObject2$l, _templateObject3$k, _templateObject4$j, _templateObject5$i, _templateObject6$f;
|
|
14916
14963
|
var Container$b = styled.div(_templateObject$r || (_templateObject$r = _taggedTemplateLiteralLoose(["\n border-radius: 4px;\n width: ", ";\n height: 88px;\n border: 1px solid transparent;\n position: relative;\n\n ", "\n\n ", "\n\n ", "\n\n svg {\n cursor: pointer;\n position: absolute;\n top: 14px;\n right: 14px;\n width: 13px;\n height: 13px;\n }\n"])), function (props) {
|
|
14917
14964
|
return props.size === 'large' ? '837px' : '460px';
|
|
14918
14965
|
}, function (props) {
|
|
@@ -14920,9 +14967,9 @@ var Container$b = styled.div(_templateObject$r || (_templateObject$r = _taggedTe
|
|
|
14920
14967
|
}, function (props) {
|
|
14921
14968
|
return props.color === 'error' && css(_templateObject3$k || (_templateObject3$k = _taggedTemplateLiteralLoose(["\n background-color: #fff6f6;\n opacity: 1;\n border-color: #973937;\n h4 {\n color: #973937;\n }\n p {\n color: #973937;\n }\n "])));
|
|
14922
14969
|
}, function (props) {
|
|
14923
|
-
return props.color === 'warning' && css(_templateObject4$
|
|
14970
|
+
return props.color === 'warning' && css(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteralLoose(["\n background-color: #fffaf3;\n opacity: 1;\n border-color: #ccbea0;\n h4 {\n color: #7a4d05;\n }\n p {\n color: #7a4d05cc;\n }\n "])));
|
|
14924
14971
|
});
|
|
14925
|
-
var IconContainer$2 = styled.div(_templateObject5$
|
|
14972
|
+
var IconContainer$2 = styled.div(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n padding: 14px 14px 0 0;\n margin: 0;\n"])));
|
|
14926
14973
|
var IconContent = styled.div(_templateObject6$f || (_templateObject6$f = _taggedTemplateLiteralLoose(["\n width: 100%;\n padding: 13px 0 21px 28px;\n display: flex;\n flex: 1;\n flex-direction: column;\n\n h4 {\n margin-bottom: 7px;\n font-size: 18p;\n }\n p {\n margin: 0;\n font-size: 14px;\n max-width: 380px;\n }\n"])));
|
|
14927
14974
|
|
|
14928
14975
|
var Toast = function Toast(props) {
|
|
@@ -15041,12 +15088,12 @@ var CalendarInterval = function CalendarInterval(props) {
|
|
|
15041
15088
|
})));
|
|
15042
15089
|
};
|
|
15043
15090
|
|
|
15044
|
-
var _templateObject$t, _templateObject2$m, _templateObject3$l, _templateObject4$
|
|
15091
|
+
var _templateObject$t, _templateObject2$m, _templateObject3$l, _templateObject4$k, _templateObject5$j, _templateObject6$g, _templateObject7$c, _templateObject8$8, _templateObject9$7, _templateObject10$7, _templateObject11$4;
|
|
15045
15092
|
var Container$d = styled.div(_templateObject$t || (_templateObject$t = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 300px;\n position: absolute;\n padding: 14px;\n"])));
|
|
15046
15093
|
var Header$3 = styled.div(_templateObject2$m || (_templateObject2$m = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
15047
15094
|
var HeaderImage = styled.div(_templateObject3$l || (_templateObject3$l = _taggedTemplateLiteralLoose(["\n width: 43px;\n height: 44px;\n background-color: #ebebeb;\n"])));
|
|
15048
|
-
var HeaderContent = styled.div(_templateObject4$
|
|
15049
|
-
var MainContent = styled.div(_templateObject5$
|
|
15095
|
+
var HeaderContent = styled.div(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1;\n"])));
|
|
15096
|
+
var MainContent = styled.div(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteralLoose(["\n margin-top: 8px;\n"])));
|
|
15050
15097
|
var HeaderLine = styled.div(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15051
15098
|
return props.height;
|
|
15052
15099
|
}, function (props) {
|
|
@@ -15093,7 +15140,7 @@ var Template1 = function Template1(props) {
|
|
|
15093
15140
|
})));
|
|
15094
15141
|
};
|
|
15095
15142
|
|
|
15096
|
-
var _templateObject$u, _templateObject2$n, _templateObject3$m, _templateObject4$
|
|
15143
|
+
var _templateObject$u, _templateObject2$n, _templateObject3$m, _templateObject4$l, _templateObject5$k;
|
|
15097
15144
|
var HeaderLine$1 = styled.div(_templateObject$u || (_templateObject$u = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15098
15145
|
return props.height;
|
|
15099
15146
|
}, function (props) {
|
|
@@ -15101,17 +15148,17 @@ var HeaderLine$1 = styled.div(_templateObject$u || (_templateObject$u = _taggedT
|
|
|
15101
15148
|
}, function (props) {
|
|
15102
15149
|
return props.size === 'small' && css(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15103
15150
|
}, function (props) {
|
|
15104
|
-
return props.size === 'medium' && css(_templateObject4$
|
|
15151
|
+
return props.size === 'medium' && css(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15105
15152
|
}, function (props) {
|
|
15106
|
-
return props.size === 'large' && css(_templateObject5$
|
|
15153
|
+
return props.size === 'large' && css(_templateObject5$k || (_templateObject5$k = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
|
|
15107
15154
|
});
|
|
15108
15155
|
|
|
15109
|
-
var _templateObject$v, _templateObject2$o, _templateObject3$n, _templateObject4$
|
|
15156
|
+
var _templateObject$v, _templateObject2$o, _templateObject3$n, _templateObject4$m, _templateObject5$l, _templateObject6$h, _templateObject7$d, _templateObject8$9;
|
|
15110
15157
|
var Container$e = styled.div(_templateObject$v || (_templateObject$v = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-height: 100%;\n position: absolute;\n padding: 14px;\n"])));
|
|
15111
15158
|
var Template2Container = styled(Container$e)(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n background: #fff;\n border: 2px solid #ebebeb;\n"])));
|
|
15112
15159
|
var Header$4 = styled.div(_templateObject3$n || (_templateObject3$n = _taggedTemplateLiteralLoose(["\n display: flex;\n"])));
|
|
15113
|
-
var HeaderImage$1 = styled.div(_templateObject4$
|
|
15114
|
-
var HeaderContent$1 = styled.div(_templateObject5$
|
|
15160
|
+
var HeaderImage$1 = styled.div(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteralLoose(["\n width: 43px;\n height: 44px;\n background-color: #ebebeb;\n"])));
|
|
15161
|
+
var HeaderContent$1 = styled.div(_templateObject5$l || (_templateObject5$l = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex: 1;\n"])));
|
|
15115
15162
|
var MainContent$1 = styled.div(_templateObject6$h || (_templateObject6$h = _taggedTemplateLiteralLoose(["\n margin-top: 8px;\n"])));
|
|
15116
15163
|
var MainLine$1 = styled(HeaderLine$1)(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n margin-bottom: 14px;\n margin-left: 0;\n"])));
|
|
15117
15164
|
var HeaderLine$2 = styled(HeaderLine$1)(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteralLoose([""])));
|
|
@@ -15169,16 +15216,16 @@ var Template3 = function Template3(props) {
|
|
|
15169
15216
|
}));
|
|
15170
15217
|
};
|
|
15171
15218
|
|
|
15172
|
-
var _templateObject$x, _templateObject2$q, _templateObject3$p, _templateObject4$
|
|
15219
|
+
var _templateObject$x, _templateObject2$q, _templateObject3$p, _templateObject4$n, _templateObject5$m, _templateObject6$i, _templateObject7$e, _templateObject8$a;
|
|
15173
15220
|
var Container$g = styled.div(_templateObject$x || (_templateObject$x = _taggedTemplateLiteralLoose(["\n width: 100%;\n max-height: 100%;\n position: absolute;\n padding: 14px;\n"])));
|
|
15174
15221
|
var HeaderLine$3 = styled.div(_templateObject2$q || (_templateObject2$q = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15175
15222
|
return props.height;
|
|
15176
15223
|
}, function (props) {
|
|
15177
15224
|
return props.size === 'mini' && css(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15178
15225
|
}, function (props) {
|
|
15179
|
-
return props.size === 'small' && css(_templateObject4$
|
|
15226
|
+
return props.size === 'small' && css(_templateObject4$n || (_templateObject4$n = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15180
15227
|
}, function (props) {
|
|
15181
|
-
return props.size === 'medium' && css(_templateObject5$
|
|
15228
|
+
return props.size === 'medium' && css(_templateObject5$m || (_templateObject5$m = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15182
15229
|
}, function (props) {
|
|
15183
15230
|
return props.size === 'large' && css(_templateObject6$i || (_templateObject6$i = _taggedTemplateLiteralLoose(["\n width: 75%;\n "])));
|
|
15184
15231
|
});
|
|
@@ -15236,15 +15283,15 @@ var Template4 = function Template4(props) {
|
|
|
15236
15283
|
}));
|
|
15237
15284
|
};
|
|
15238
15285
|
|
|
15239
|
-
var _templateObject$y, _templateObject2$r, _templateObject3$q, _templateObject4$
|
|
15286
|
+
var _templateObject$y, _templateObject2$r, _templateObject3$q, _templateObject4$o, _templateObject5$n, _templateObject6$j, _templateObject7$f, _templateObject8$b, _templateObject9$8;
|
|
15240
15287
|
var Container$h = styled.div(_templateObject$y || (_templateObject$y = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 746px;\n height: 169px;\n border: 1px solid #e6e6e7;\n border-radius: 4px;\n padding: 14px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
|
|
15241
15288
|
var Circle = styled.div(_templateObject2$r || (_templateObject2$r = _taggedTemplateLiteralLoose(["\n width: 141px;\n height: 141px;\n background-color: #dddedf;\n border-radius: 50%;\n"])));
|
|
15242
15289
|
var HeaderLine$4 = styled.div(_templateObject3$q || (_templateObject3$q = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15243
15290
|
return props.height;
|
|
15244
15291
|
}, function (props) {
|
|
15245
|
-
return props.size === 'mini' && css(_templateObject4$
|
|
15292
|
+
return props.size === 'mini' && css(_templateObject4$o || (_templateObject4$o = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15246
15293
|
}, function (props) {
|
|
15247
|
-
return props.size === 'small' && css(_templateObject5$
|
|
15294
|
+
return props.size === 'small' && css(_templateObject5$n || (_templateObject5$n = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15248
15295
|
}, function (props) {
|
|
15249
15296
|
return props.size === 'medium' && css(_templateObject6$j || (_templateObject6$j = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15250
15297
|
}, function (props) {
|
|
@@ -15284,14 +15331,14 @@ var Template5 = function Template5(props) {
|
|
|
15284
15331
|
})));
|
|
15285
15332
|
};
|
|
15286
15333
|
|
|
15287
|
-
var _templateObject$z, _templateObject2$s, _templateObject3$r, _templateObject4$
|
|
15334
|
+
var _templateObject$z, _templateObject2$s, _templateObject3$r, _templateObject4$p, _templateObject5$o, _templateObject6$k, _templateObject7$g, _templateObject8$c, _templateObject9$9;
|
|
15288
15335
|
var Container$i = styled.div(_templateObject$z || (_templateObject$z = _taggedTemplateLiteralLoose(["\n width: 395px;\n\n display: flex;\n align-items: center;\n justify-content: space-between;\n background-color: #f5f5f5;\n"])));
|
|
15289
15336
|
var Header$5 = styled.div(_templateObject2$s || (_templateObject2$s = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n"])));
|
|
15290
15337
|
var Footer$3 = styled.div(_templateObject3$r || (_templateObject3$r = _taggedTemplateLiteralLoose(["\n width: 100%;\n border-top: 1px solid #b1b1b3;\n height: 50px;\n"])));
|
|
15291
|
-
var HeaderLine$5 = styled.div(_templateObject4$
|
|
15338
|
+
var HeaderLine$5 = styled.div(_templateObject4$p || (_templateObject4$p = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15292
15339
|
return props.height;
|
|
15293
15340
|
}, function (props) {
|
|
15294
|
-
return props.size === 'mini' && css(_templateObject5$
|
|
15341
|
+
return props.size === 'mini' && css(_templateObject5$o || (_templateObject5$o = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15295
15342
|
}, function (props) {
|
|
15296
15343
|
return props.size === 'small' && css(_templateObject6$k || (_templateObject6$k = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15297
15344
|
}, function (props) {
|
|
@@ -15327,15 +15374,15 @@ var Template6 = function Template6(props) {
|
|
|
15327
15374
|
})));
|
|
15328
15375
|
};
|
|
15329
15376
|
|
|
15330
|
-
var _templateObject$A, _templateObject2$t, _templateObject3$s, _templateObject4$
|
|
15377
|
+
var _templateObject$A, _templateObject2$t, _templateObject3$s, _templateObject4$q, _templateObject5$p, _templateObject6$l, _templateObject7$h, _templateObject8$d, _templateObject9$a, _templateObject10$8;
|
|
15331
15378
|
var Container$j = styled.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 110px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
|
|
15332
15379
|
var Header$6 = styled.div(_templateObject2$t || (_templateObject2$t = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
|
|
15333
15380
|
var HeaderLine$6 = styled.div(_templateObject3$s || (_templateObject3$s = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15334
15381
|
return props.height;
|
|
15335
15382
|
}, function (props) {
|
|
15336
|
-
return props.size === 'mini' && css(_templateObject4$
|
|
15383
|
+
return props.size === 'mini' && css(_templateObject4$q || (_templateObject4$q = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15337
15384
|
}, function (props) {
|
|
15338
|
-
return props.size === 'small' && css(_templateObject5$
|
|
15385
|
+
return props.size === 'small' && css(_templateObject5$p || (_templateObject5$p = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15339
15386
|
}, function (props) {
|
|
15340
15387
|
return props.size === 'medium' && css(_templateObject6$l || (_templateObject6$l = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15341
15388
|
}, function (props) {
|
|
@@ -15361,15 +15408,15 @@ var Template7 = function Template7(props) {
|
|
|
15361
15408
|
})), React__default.createElement(Main, null, React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null), React__default.createElement(Circle$1, null)));
|
|
15362
15409
|
};
|
|
15363
15410
|
|
|
15364
|
-
var _templateObject$B, _templateObject2$u, _templateObject3$t, _templateObject4$
|
|
15411
|
+
var _templateObject$B, _templateObject2$u, _templateObject3$t, _templateObject4$r, _templateObject5$q, _templateObject6$m, _templateObject7$i, _templateObject8$e, _templateObject9$b;
|
|
15365
15412
|
var Container$k = styled.div(_templateObject$B || (_templateObject$B = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 110px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
|
|
15366
15413
|
var Header$7 = styled.div(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
|
|
15367
15414
|
var HeaderLine$7 = styled.div(_templateObject3$t || (_templateObject3$t = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 14px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15368
15415
|
return props.height;
|
|
15369
15416
|
}, function (props) {
|
|
15370
|
-
return props.size === 'mini' && css(_templateObject4$
|
|
15417
|
+
return props.size === 'mini' && css(_templateObject4$r || (_templateObject4$r = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15371
15418
|
}, function (props) {
|
|
15372
|
-
return props.size === 'small' && css(_templateObject5$
|
|
15419
|
+
return props.size === 'small' && css(_templateObject5$q || (_templateObject5$q = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15373
15420
|
}, function (props) {
|
|
15374
15421
|
return props.size === 'medium' && css(_templateObject6$m || (_templateObject6$m = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15375
15422
|
}, function (props) {
|
|
@@ -15404,15 +15451,15 @@ var Template8 = function Template8(props) {
|
|
|
15404
15451
|
})));
|
|
15405
15452
|
};
|
|
15406
15453
|
|
|
15407
|
-
var _templateObject$C, _templateObject2$v, _templateObject3$u, _templateObject4$
|
|
15454
|
+
var _templateObject$C, _templateObject2$v, _templateObject3$u, _templateObject4$s, _templateObject5$r, _templateObject6$n, _templateObject7$j, _templateObject8$f, _templateObject9$c, _templateObject10$9;
|
|
15408
15455
|
var Container$l = styled.div(_templateObject$C || (_templateObject$C = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 245px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
|
|
15409
15456
|
var Header$8 = styled.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
|
|
15410
15457
|
var HeaderLine$8 = styled.div(_templateObject3$u || (_templateObject3$u = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 7px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15411
15458
|
return props.height;
|
|
15412
15459
|
}, function (props) {
|
|
15413
|
-
return props.size === 'mini' && css(_templateObject4$
|
|
15460
|
+
return props.size === 'mini' && css(_templateObject4$s || (_templateObject4$s = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15414
15461
|
}, function (props) {
|
|
15415
|
-
return props.size === 'small' && css(_templateObject5$
|
|
15462
|
+
return props.size === 'small' && css(_templateObject5$r || (_templateObject5$r = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15416
15463
|
}, function (props) {
|
|
15417
15464
|
return props.size === 'medium' && css(_templateObject6$n || (_templateObject6$n = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15418
15465
|
}, function (props) {
|
|
@@ -15443,15 +15490,15 @@ var Template8$1 = function Template8(props) {
|
|
|
15443
15490
|
})), React__default.createElement(Main$2, null, React__default.createElement(Circle$2, null)));
|
|
15444
15491
|
};
|
|
15445
15492
|
|
|
15446
|
-
var _templateObject$D, _templateObject2$w, _templateObject3$v, _templateObject4$
|
|
15493
|
+
var _templateObject$D, _templateObject2$w, _templateObject3$v, _templateObject4$t, _templateObject5$s, _templateObject6$o, _templateObject7$k, _templateObject8$g, _templateObject9$d, _templateObject10$a, _templateObject11$5;
|
|
15447
15494
|
var Container$m = styled.div(_templateObject$D || (_templateObject$D = _taggedTemplateLiteralLoose(["\n width: 395px;\n height: 245px;\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #f5f5f5 0% 0% no-repeat padding-box;\n"])));
|
|
15448
15495
|
var Header$9 = styled.div(_templateObject2$w || (_templateObject2$w = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n padding: 14px;\n width: 100%;\n"])));
|
|
15449
15496
|
var HeaderLine$9 = styled.div(_templateObject3$v || (_templateObject3$v = _taggedTemplateLiteralLoose(["\n height: ", ";\n background-color: #ebebeb;\n margin-left: 7px;\n\n & + div {\n margin-top: 7px;\n }\n\n ", "\n ", "\n\n ", "\n\n ", "\n"])), function (props) {
|
|
15450
15497
|
return props.height;
|
|
15451
15498
|
}, function (props) {
|
|
15452
|
-
return props.size === 'mini' && css(_templateObject4$
|
|
15499
|
+
return props.size === 'mini' && css(_templateObject4$t || (_templateObject4$t = _taggedTemplateLiteralLoose(["\n width: 15%;\n "])));
|
|
15453
15500
|
}, function (props) {
|
|
15454
|
-
return props.size === 'small' && css(_templateObject5$
|
|
15501
|
+
return props.size === 'small' && css(_templateObject5$s || (_templateObject5$s = _taggedTemplateLiteralLoose(["\n width: 25%;\n "])));
|
|
15455
15502
|
}, function (props) {
|
|
15456
15503
|
return props.size === 'medium' && css(_templateObject6$o || (_templateObject6$o = _taggedTemplateLiteralLoose(["\n width: 45%;\n "])));
|
|
15457
15504
|
}, function (props) {
|
|
@@ -15587,7 +15634,7 @@ var Placeholder = function Placeholder(props) {
|
|
|
15587
15634
|
}
|
|
15588
15635
|
};
|
|
15589
15636
|
|
|
15590
|
-
var _templateObject$E, _templateObject2$x, _templateObject3$w, _templateObject4$
|
|
15637
|
+
var _templateObject$E, _templateObject2$x, _templateObject3$w, _templateObject4$u, _templateObject5$t;
|
|
15591
15638
|
var Image = styled.img(_templateObject$E || (_templateObject$E = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n max-height: 100%;\n"])));
|
|
15592
15639
|
var Container$n = styled.div(_templateObject2$x || (_templateObject2$x = _taggedTemplateLiteralLoose(["\n position: relative;\n display: inline-flex;\n\n &,\n ", " {\n width: ", ";\n\n height: ", ";\n }\n"])), Image, function (_ref) {
|
|
15593
15640
|
var width = _ref.width;
|
|
@@ -15620,11 +15667,11 @@ var Dimmer = styled.div(_templateObject3$w || (_templateObject3$w = _taggedTempl
|
|
|
15620
15667
|
var theme = _ref3.theme;
|
|
15621
15668
|
return theme.getColor('greyishBlue', 50);
|
|
15622
15669
|
});
|
|
15623
|
-
var Button$4 = styled(Button$1)(_templateObject4$
|
|
15670
|
+
var Button$4 = styled(Button$1)(_templateObject4$u || (_templateObject4$u = _taggedTemplateLiteralLoose(["\n background-color: ", ";\n"])), function (_ref4) {
|
|
15624
15671
|
var theme = _ref4.theme;
|
|
15625
15672
|
return theme.getColor('white', 50);
|
|
15626
15673
|
});
|
|
15627
|
-
var ModalContent = styled.div(_templateObject5$
|
|
15674
|
+
var ModalContent = styled.div(_templateObject5$t || (_templateObject5$t = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n\n img {\n max-height: 100%;\n max-width: 100%;\n }\n"])));
|
|
15628
15675
|
|
|
15629
15676
|
var _excluded$3 = ["src", "defaultClickOptions"];
|
|
15630
15677
|
|