@mw-kit/mw-ui 1.6.10 → 1.6.11
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.
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
2
|
+
interface RelativeContainerProps {
|
|
3
|
+
invalid: boolean;
|
|
4
|
+
}
|
|
5
|
+
export declare const RelativeContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, RelativeContainerProps, never>;
|
|
3
6
|
export declare const LabelContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
4
7
|
interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
5
8
|
iconWidth: string;
|
package/dist/index.js
CHANGED
|
@@ -15254,41 +15254,45 @@ var parse = function parse(value) {
|
|
|
15254
15254
|
};
|
|
15255
15255
|
|
|
15256
15256
|
var _templateObject$q, _templateObject2$l, _templateObject3$j, _templateObject4$g, _templateObject5$f, _templateObject6$d, _templateObject7$b, _templateObject8$7, _templateObject9$7, _templateObject10$5;
|
|
15257
|
-
var RelativeContainer$5 = styled__default.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n position: relative;\n user-select: none;\n min-width: 220px;\n\n > :nth-child(1) input {\n color: transparent;\n }\n"])))
|
|
15258
|
-
var
|
|
15259
|
-
|
|
15260
|
-
return theme.
|
|
15261
|
-
}
|
|
15257
|
+
var RelativeContainer$5 = styled__default.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n position: relative;\n user-select: none;\n min-width: 220px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n border-radius: 4px;\n\n > :nth-child(1) input {\n color: transparent;\n }\n"])), function (_ref) {
|
|
15258
|
+
var theme = _ref.theme,
|
|
15259
|
+
invalid = _ref.invalid;
|
|
15260
|
+
return invalid ? theme.colors.warningRed : theme.colors.lightGrey;
|
|
15261
|
+
});
|
|
15262
|
+
var LabelContainer$3 = styled__default.div(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteralLoose(["\n ", "\n line-height: ", ";\n"])), function (_ref2) {
|
|
15262
15263
|
var theme = _ref2.theme;
|
|
15264
|
+
return theme.useTypography('p');
|
|
15265
|
+
}, function (_ref3) {
|
|
15266
|
+
var theme = _ref3.theme;
|
|
15263
15267
|
return theme.spacings.s3;
|
|
15264
15268
|
});
|
|
15265
|
-
var Container$a = styled__default.div(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 1px;\n left: 1px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-radius: 4px;\n white-space: nowrap;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (
|
|
15266
|
-
var theme =
|
|
15267
|
-
iconWidth =
|
|
15268
|
-
paddingless =
|
|
15269
|
+
var Container$a = styled__default.div(_templateObject3$j || (_templateObject3$j = _taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 1px;\n left: 1px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-radius: 4px;\n white-space: nowrap;\n\n ", "\n\n ", "\n\n ", "\n\n ", "\n"])), function (_ref4) {
|
|
15270
|
+
var theme = _ref4.theme,
|
|
15271
|
+
iconWidth = _ref4.iconWidth,
|
|
15272
|
+
paddingless = _ref4.paddingless;
|
|
15269
15273
|
|
|
15270
15274
|
if (paddingless) {
|
|
15271
15275
|
return styled.css(_templateObject4$g || (_templateObject4$g = _taggedTemplateLiteralLoose(["\n width: calc(100% - 2px - ", ");\n height: 19px;\n "])), iconWidth);
|
|
15272
15276
|
}
|
|
15273
15277
|
|
|
15274
15278
|
return styled.css(_templateObject5$f || (_templateObject5$f = _taggedTemplateLiteralLoose(["\n width: calc(100% - 2px - ", " - ", ");\n height: 33px;\n padding: ", " 0 ", " ", ";\n "])), iconWidth, theme.spacings.s3, theme.spacings.s2, theme.spacings.s2, theme.spacings.s3);
|
|
15275
|
-
}, function (_ref4) {
|
|
15276
|
-
var invalid = _ref4.invalid,
|
|
15277
|
-
theme = _ref4.theme;
|
|
15278
|
-
if (!invalid) return;
|
|
15279
|
-
return styled.css(_templateObject6$d || (_templateObject6$d = _taggedTemplateLiteralLoose(["\n color: ", ";\n "])), theme.colors.warningRed);
|
|
15280
15279
|
}, function (_ref5) {
|
|
15281
15280
|
var invalid = _ref5.invalid,
|
|
15282
15281
|
theme = _ref5.theme;
|
|
15283
15282
|
if (!invalid) return;
|
|
15284
|
-
return styled.css(
|
|
15283
|
+
return styled.css(_templateObject6$d || (_templateObject6$d = _taggedTemplateLiteralLoose(["\n color: ", ";\n "])), theme.colors.warningRed);
|
|
15285
15284
|
}, function (_ref6) {
|
|
15286
|
-
var
|
|
15285
|
+
var invalid = _ref6.invalid,
|
|
15286
|
+
theme = _ref6.theme;
|
|
15287
|
+
if (!invalid) return;
|
|
15288
|
+
return styled.css(_templateObject7$b || (_templateObject7$b = _taggedTemplateLiteralLoose(["\n color: ", ";\n "])), theme.colors.warningRed);
|
|
15289
|
+
}, function (_ref7) {
|
|
15290
|
+
var disabled = _ref7.disabled;
|
|
15287
15291
|
if (!disabled) return;
|
|
15288
15292
|
return styled.css(_templateObject8$7 || (_templateObject8$7 = _taggedTemplateLiteralLoose(["\n opacity: 0.5;\n "])));
|
|
15289
15293
|
});
|
|
15290
|
-
var Button$4 = styled__default.button(_templateObject9$7 || (_templateObject9$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (
|
|
15291
|
-
var onClick =
|
|
15294
|
+
var Button$4 = styled__default.button(_templateObject9$7 || (_templateObject9$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n background-color: transparent;\n border: none;\n padding: 0;\n box-shadow: none;\n\n ", ";\n"])), function (_ref8) {
|
|
15295
|
+
var onClick = _ref8.onClick;
|
|
15292
15296
|
if (!onClick) return;
|
|
15293
15297
|
return styled.css(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteralLoose(["\n :not(:disabled) {\n cursor: pointer;\n }\n "])));
|
|
15294
15298
|
});
|
|
@@ -15374,8 +15378,12 @@ var Component$1 = React__default.forwardRef(function (props, ref) {
|
|
|
15374
15378
|
return React__default.createElement(RelativeContainer$5, {
|
|
15375
15379
|
ref: useOnClickOut(function () {
|
|
15376
15380
|
return setOpen(null);
|
|
15377
|
-
})
|
|
15381
|
+
}),
|
|
15382
|
+
invalid: invalid
|
|
15378
15383
|
}, React__default.createElement(Input$1, Object.assign({}, inputProps, {
|
|
15384
|
+
style: {
|
|
15385
|
+
width: 0
|
|
15386
|
+
},
|
|
15379
15387
|
type: 'text',
|
|
15380
15388
|
ref: ref,
|
|
15381
15389
|
icon: {
|
|
@@ -15391,7 +15399,7 @@ var Component$1 = React__default.forwardRef(function (props, ref) {
|
|
|
15391
15399
|
});
|
|
15392
15400
|
}
|
|
15393
15401
|
},
|
|
15394
|
-
|
|
15402
|
+
borderless: true,
|
|
15395
15403
|
htmlDisabled: true
|
|
15396
15404
|
})), React__default.createElement(Container$a, {
|
|
15397
15405
|
iconWidth: '24px',
|