@xfers/design-system 4.5.0-dev.46c0ad3276 → 4.5.0-dev.9b4ee84bdd
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/cjs/index.js +9 -9
- package/cjs/index.js.map +1 -1
- package/dist/components/DatePicker/index.js +16 -16
- package/dist/components/DatePicker/index.js.map +1 -1
- package/dist/components/DynamicSelect/DynamicSelect.js +3 -3
- package/dist/components/DynamicSelect/DynamicSelect.js.map +1 -1
- package/dist/components/Input/HelperText.js +17 -0
- package/dist/components/Input/HelperText.js.map +1 -0
- package/dist/components/Input/InputLabel.js +31 -0
- package/dist/components/Input/InputLabel.js.map +1 -0
- package/dist/components/Input/index.js +33 -53
- package/dist/components/Input/index.js.map +1 -1
- package/dist/components/Input/inputStyles.js +25 -0
- package/dist/components/Input/inputStyles.js.map +1 -0
- package/dist/components/InputWithButton/index.js +35 -0
- package/dist/components/InputWithButton/index.js.map +1 -0
- package/dist/components/RangePicker/index.js +7 -5
- package/dist/components/RangePicker/index.js.map +1 -1
- package/dist/components/Select/const.js +12 -0
- package/dist/components/Select/const.js.map +1 -0
- package/dist/components/Select/helpers.js +52 -0
- package/dist/components/Select/helpers.js.map +1 -0
- package/dist/components/Select/index.js +10 -27
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/Select/style.js +42 -69
- package/dist/components/Select/style.js.map +1 -1
- package/dist/components/Tag/index.js +10 -3
- package/dist/components/Tag/index.js.map +1 -1
- package/dist/index.js +4 -2
- package/dist/index.js.map +1 -1
- package/dist/types/components/DatePicker/index.d.ts +8 -1
- package/dist/types/components/Input/HelperText.d.ts +6 -0
- package/dist/types/components/Input/InputLabel.d.ts +10 -0
- package/dist/types/components/Input/index.d.ts +29 -15
- package/dist/types/components/Input/inputStyles.d.ts +14 -0
- package/dist/types/components/InputWithButton/index.d.ts +18 -0
- package/dist/types/components/RangePicker/index.d.ts +3 -1
- package/dist/types/components/Select/const.d.ts +8 -0
- package/dist/types/components/Select/helpers.d.ts +17 -0
- package/dist/types/components/Select/index.d.ts +19 -17
- package/dist/types/components/Select/style.d.ts +20 -2
- package/dist/types/index.d.ts +1 -0
- package/es/{MintSetupWallet-d8dd9538.js → MintSetupWallet-16164339.js} +2 -2
- package/es/{MintSetupWallet-d8dd9538.js.map → MintSetupWallet-16164339.js.map} +1 -1
- package/es/icons.js +1 -1
- package/es/index.js +9 -9
- package/es/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/Select/helpers.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,8 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
-
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
-
return cooked;
|
|
5
|
-
};
|
|
6
2
|
var __assign = (this && this.__assign) || function () {
|
|
7
3
|
__assign = Object.assign || function(t) {
|
|
8
4
|
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
@@ -27,34 +23,21 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
27
23
|
};
|
|
28
24
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
25
|
var react_1 = require("react");
|
|
30
|
-
var emotion_1 = require("emotion");
|
|
31
26
|
var select_1 = require("antd/es/select");
|
|
32
27
|
require("antd/es/select/style/css");
|
|
33
|
-
var
|
|
34
|
-
require("
|
|
35
|
-
var Typography_1 = require("src/components/Typography");
|
|
36
|
-
var ThemeContext_1 = require("src/theme/ThemeContext");
|
|
37
|
-
var ColorStyles_1 = require("src/shared/ColorStyles");
|
|
38
|
-
var TypographyStyles_1 = require("src/shared/TypographyStyles");
|
|
28
|
+
var Typography_1 = require("src/constants/Typography/Typography");
|
|
29
|
+
var helpers_1 = require("./helpers");
|
|
39
30
|
var style_1 = require("./style");
|
|
40
|
-
(0, emotion_1.injectGlobal)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .ant-select-dropdown .ant-select-item-option {\n -webkit-font-smoothing: antialiased;\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n padding-top: 10px;\n padding-bottom: 10px;\n }\n\n .ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {\n font-weight: 500;\n }\n\n div.ant-select-dropdown {\n border-radius: 5px;\n max-height: 100vh;\n overflow-y: scroll;\n }\n"], ["\n .ant-select-dropdown .ant-select-item-option {\n -webkit-font-smoothing: antialiased;\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n padding-top: 10px;\n padding-bottom: 10px;\n }\n\n .ant-select-dropdown .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {\n font-weight: 500;\n }\n\n div.ant-select-dropdown {\n border-radius: 5px;\n max-height: 100vh;\n overflow-y: scroll;\n }\n"])), ColorStyles_1.MAIN_COLORS.PRIMARY_BLACK, TypographyStyles_1.MAIN_FONT, TypographyStyles_1.FONT_SIZE.P1);
|
|
41
31
|
var Select = function (_a) {
|
|
42
|
-
var _b = _a.
|
|
43
|
-
var
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
Select.Tag = function (_a) {
|
|
51
|
-
var _b = _a.className, className = _b === void 0 ? '' : _b, props = __rest(_a, ["className"]);
|
|
52
|
-
var primary = (0, ThemeContext_1.useTheme)().brand.primary;
|
|
53
|
-
var tagStyle = "\n height: 28px;\n color: #FFFFFF;\n background: ".concat(primary.default, ";\n border-radius: 23px;\n border: 0;\n display: inline-flex;\n align-items: center;\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 20px;\n padding-left: 10px;\n cursor: pointer;\n font-family: ").concat(TypographyStyles_1.MAIN_FONT, ";\n padding-right: 10px;\n margin-right: 4px;\n\n &:hover {\n opacity: 1;\n }\n\n &.ant-tag .anticon-close {\n color: white;\n margin-left: 5px;\n margin-top: 0px;\n }\n ");
|
|
54
|
-
return react_1.default.createElement(tag_1.default, __assign({ className: "".concat((0, emotion_1.css)(tagStyle), " ").concat(className) }, props));
|
|
32
|
+
var children = _a.children, _b = _a.disabled, disabled = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? 'sm' : _c, mode = _a.mode, label = _a.label, labelTooltip = _a.labelTooltip, selectRef = _a.selectRef, placeholder = _a.placeholder, _d = _a.error, error = _d === void 0 ? false : _d, secondaryText = _a.secondaryText, helperText = _a.helperText, options = _a.options, rest = __rest(_a, ["children", "disabled", "size", "mode", "label", "labelTooltip", "selectRef", "placeholder", "error", "secondaryText", "helperText", "options"]);
|
|
33
|
+
var internalRef = (0, react_1.useRef)(null);
|
|
34
|
+
var ref = selectRef || internalRef;
|
|
35
|
+
return (react_1.default.createElement(style_1.SelectContainer, null,
|
|
36
|
+
label && (0, helpers_1.renderLabel)(label, labelTooltip),
|
|
37
|
+
react_1.default.createElement(style_1.StyledAntSelect, __assign({ disabled: disabled, mode: mode, ref: ref, "$size": size, "$mode": mode }, rest, { error: error, dropdownRender: function (menu) { return (react_1.default.createElement(style_1.StyledDropdown, { "$size": size },
|
|
38
|
+
react_1.default.createElement(Typography_1.Typography.Body, { size: size === 'sm' ? 'md' : 'lg' }, menu))); }, dropdownStyle: style_1.dropdownStyle, suffixIcon: (0, helpers_1.getSuffixIcon)(secondaryText), placeholder: (0, helpers_1.getPlaceholder)(size, placeholder), showArrow: true, tagRender: (0, helpers_1.getCustomSelectTag)(mode, disabled, size), maxTagCount: 999 }), options ? (0, helpers_1.renderOptions)(options, size) : children),
|
|
39
|
+
(0, helpers_1.renderHelperText)(helperText)));
|
|
55
40
|
};
|
|
56
|
-
Select.OptGroup = select_1.default.OptGroup;
|
|
57
41
|
Select.Option = select_1.default.Option;
|
|
58
42
|
exports.default = Select;
|
|
59
|
-
var templateObject_1, templateObject_2;
|
|
60
43
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAgD;AAChD,yCAAuD;AAGvD,oCAAiC;AACjC,kEAAgE;AAChE,qCAOkB;AAClB,iCAKgB;AAyBhB,IAAM,MAAM,GAAG,UAAU,EAcjB;IAbN,IAAA,QAAQ,cAAA,EACR,gBAAgB,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,YAAW,EAAX,IAAI,mBAAG,IAAI,KAAA,EACX,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,YAAY,kBAAA,EACZ,SAAS,eAAA,EACT,WAAW,iBAAA,EACX,aAAa,EAAb,KAAK,mBAAG,KAAK,KAAA,EACb,aAAa,mBAAA,EACb,UAAU,gBAAA,EACV,OAAO,aAAA,EACJ,IAAI,cAbgB,gJAcxB,CADQ;IAEP,IAAM,WAAW,GAAG,IAAA,cAAM,EAAgB,IAAI,CAAC,CAAA;IAC/C,IAAM,GAAG,GAAG,SAAS,IAAI,WAAW,CAAA;IAEpC,OAAO,CACL,8BAAC,uBAAe;QACb,KAAK,IAAI,IAAA,qBAAW,EAAC,KAAK,EAAE,YAAY,CAAC;QAC1C,8BAAC,uBAAe,aACd,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,WACD,IAAI,WACJ,IAAI,IACP,IAAI,IACR,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,UAAC,IAAI,IAAK,OAAA,CACxB,8BAAC,sBAAc,aAAQ,IAAI;gBACzB,8BAAC,uBAAU,CAAC,IAAI,IAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAC/C,IAAI,CACW,CACH,CAClB,EANyB,CAMzB,EACD,aAAa,EAAE,qBAAa,EAC5B,UAAU,EAAE,IAAA,uBAAa,EAAC,aAAa,CAAC,EACxC,WAAW,EAAE,IAAA,wBAAc,EAAC,IAAI,EAAE,WAAW,CAAC,EAC9C,SAAS,QACT,SAAS,EAAE,IAAA,4BAAkB,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,EACnD,WAAW,EAAE,GAAG,KAEf,OAAO,CAAC,CAAC,CAAC,IAAA,uBAAa,EAAC,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,CAClC;QACjB,IAAA,0BAAgB,EAAC,UAAU,CAAC,CACb,CACnB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,GAAG,gBAAS,CAAC,MAAM,CAAA;AAChC,kBAAe,MAAM,CAAA"}
|
|
@@ -1,74 +1,47 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
3
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
4
|
+
return cooked;
|
|
5
|
+
};
|
|
2
6
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var fontStyles_1 = require("src/constants/fontStyles");
|
|
7
|
+
exports.dropdownStyle = exports.StyledDropdown = exports.StyledAntSelect = exports.SelectContainer = exports.OptionContainer = exports.LabelContainer = void 0;
|
|
8
|
+
var styled_1 = require("@emotion/styled");
|
|
9
|
+
var select_1 = require("antd/es/select");
|
|
7
10
|
var theme_1 = require("src/theme/theme");
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
return "height: 36px;";
|
|
11
|
+
exports.LabelContainer = styled_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 4px;\n span {\n display: inline-flex;\n cursor: pointer;\n }\n"], ["\n display: flex;\n align-items: center;\n gap: 4px;\n span {\n display: inline-flex;\n cursor: pointer;\n }\n"])));
|
|
12
|
+
exports.OptionContainer = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: 8px;\n"], ["\n display: flex;\n align-items: center;\n gap: 8px;\n"])));
|
|
13
|
+
exports.SelectContainer = styled_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 4px;\n min-width: 100px;\n width: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 4px;\n min-width: 100px;\n width: 100%;\n"])));
|
|
14
|
+
var selectSelectorStyles = function (props) {
|
|
15
|
+
// For multiple select, calculate padding to fit tags within min-height
|
|
16
|
+
// Small: 36px min-height - 24px tag = 12px total padding (6px top + 6px bottom)
|
|
17
|
+
// Large: 48px min-height - 32px tag = 16px total padding (8px top + 8px bottom)
|
|
18
|
+
var getVerticalPadding = function () {
|
|
19
|
+
if (props.$mode === 'multiple') {
|
|
20
|
+
return props.$size === 'sm' ? '6px' : '8px';
|
|
19
21
|
}
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
return "padding: 0 13px;";
|
|
46
|
-
default:
|
|
47
|
-
return '';
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
function getBaseColor(_a) {
|
|
51
|
-
var type = _a.type;
|
|
52
|
-
switch (type) {
|
|
53
|
-
case 'dropdown':
|
|
54
|
-
return "color: ".concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, ";");
|
|
55
|
-
case 'filter':
|
|
56
|
-
return "color: ".concat(ColorStyles_1.NEUTRAL_COLORS.G400, ";");
|
|
57
|
-
default:
|
|
58
|
-
return '';
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
function default_1(_a) {
|
|
62
|
-
var mode = _a.mode, disabled = _a.disabled, type = _a.type;
|
|
63
|
-
var style = "\n width: 100%;\n ".concat(fontStyles_1.pStyle, "\n ").concat(getBaseColor({ type: type }), "\n cursor: pointer;\n\n &.ant-select-single:not(.ant-select-customize-input) .ant-select-selector, &.ant-select-multiple:not(.ant-select-customize-input) .ant-select-selector {\n ").concat(getBaseHeight({ mode: mode, type: type }), "\n\n\n border-radius: 5px;\n border-color: ").concat(ColorStyles_1.NEUTRAL_COLORS.G200, ";\n ").concat(getSelectorPadding({ mode: mode, type: type }), "\n\n &:hover {\n ").concat(!disabled
|
|
64
|
-
? "border-color: ".concat(theme_1.straitsXTheme.brand.primary.default, ";")
|
|
65
|
-
: '', "\n }\n\n &:active .ant-select-selection-placeholder {\n ").concat(type === 'filter'
|
|
66
|
-
? "\n color: ".concat(theme_1.straitsXTheme.brand.primary.default, ";\n ")
|
|
67
|
-
: '', "\n }\n }\n\n &.ant-select-single.ant-select-focused:not(.ant-select-customize-input) .ant-select-selector, &.ant-select-multiple.ant-select-focused:not(.ant-select-customize-input) .ant-select-selector {\n border-color: ").concat(theme_1.straitsXTheme.brand.primary.default, ";\n -webkit-box-shadow: 0 0 0 2px ").concat(theme_1.straitsXTheme.brand.primary.background, ";\n box-shadow: 0 0 0 2px ").concat(theme_1.straitsXTheme.brand.primary.background, ";\n }\n\n &.ant-select-single .ant-select-selector .ant-select-selection-placeholder {\n display: flex;\n align-items: center;\n line-height: 34px;\n ").concat(getPlaceholderColor({ type: type, disabled: disabled }), "\n }\n\n &.ant-select-multiple .ant-select-selection-placeholder {\n display: flex;\n align-items: center;\n line-height: 34px;\n ").concat(getPlaceholderColor({ type: type, disabled: disabled }), "\n }\n\n &.ant-select-single:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input {\n height: 100%;\n }\n\n & .ant-select-selection-search > input {\n color: ").concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, ";\n padding-bottom: 2px;\n }\n\n &.ant-select-single .ant-select-selector .ant-select-selection-item {\n display: flex;\n align-items: center;\n line-height: 34px;\n color: ").concat(ColorStyles_1.MAIN_COLORS.PRIMARY_BLACK, ";\n\n ").concat(type === 'filter' && !disabled
|
|
68
|
-
? "\n color: ".concat(ColorStyles_1.MAIN_COLORS.PRIMARY_BLACK, ";\n ")
|
|
69
|
-
: '', "\n }\n\n &.ant-select-single.ant-select-show-arrow .ant-select-selection-item {\n padding-right: 15px;\n }\n\n &.ant-select-multiple .ant-select-selection-item {\n height: 28px;\n color: #FFFFFF;\n background: ").concat(theme_1.straitsXTheme.brand.primary.default, ";\n border-radius: 23px;\n border: 0;\n display: inline-flex;\n align-items: center;\n font-family: \"Hanken Grotesk\", Inter;\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 20px;\n padding-left: 10px;\n cursor: pointer;\n font-family: ").concat(TypographyStyles_1.MAIN_FONT, ";\n }\n\n &.ant-select-multiple .ant-select-selection-item-remove {\n font-size: 10px;\n color: #FFFFFF;\n padding-right: 5px;\n margin-top: 2px;\n }\n\n &.ant-select-multiple .ant-select-selection-item-content {\n margin-right: 3px;\n }\n\n &.ant-select-multiple .zoom-leave {\n display: none;\n }\n\n &.ant-select-multiple .ant-select-selection-placeholder {\n left: 16px;\n ").concat(type === 'filter' && !disabled
|
|
70
|
-
? "\n color: ".concat(ColorStyles_1.MAIN_COLORS.PRIMARY_BLACK, ";\n opacity: 1;\n ")
|
|
71
|
-
: '', "\n }\n\n & .ant-select-selection-placeholder {\n opacity: 1;\n }\n\n &.ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {\n color: ").concat(ColorStyles_1.NEUTRAL_COLORS.BLACK, ";\n }\n\n &.ant-select-disabled.ant-select-single:not(.ant-select-customize-input) .ant-select-selector {\n background: #F6F7F9;\n }\n\n & .ant-select-arrow .anticon.anticon-search {\n transform: scale(1.3);\n margin-left: -10px;\n }\n\n &.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {\n border-color: ").concat(theme_1.straitsXTheme.brand.primary.default, ";\n -webkit-box-shadow: 0 0 0 2px ").concat(theme_1.straitsXTheme.brand.primary.default, "33;\n box-shadow: 0 0 0 2px ").concat(theme_1.straitsXTheme.brand.primary.default, "33;\n }\n ");
|
|
72
|
-
return style;
|
|
73
|
-
}
|
|
22
|
+
return '12px';
|
|
23
|
+
};
|
|
24
|
+
var verticalPadding = getVerticalPadding();
|
|
25
|
+
return "\n .ant-select-selector {\n border-radius: ".concat(props.$size === 'sm' ? '8px' : '12px', " !important;\n position: relative !important;\n display: flex;\n align-items: ").concat(props.$mode === 'multiple' ? 'flex-start' : 'center', " !important;\n padding: ").concat(verticalPadding, " 16px !important;\n\n min-height: ").concat(props.$size === 'sm' ? '36px' : '48px', " !important;\n ").concat(props.$mode !== 'multiple' ? "height: ".concat(props.$size === 'sm' ? '36px' : '48px', " !important;") : 'height: auto !important;', "\n\n background: ").concat(props.disabled
|
|
26
|
+
? theme_1.straitsXTheme.color.surface.disabledSurface
|
|
27
|
+
: theme_1.straitsXTheme.color.surface.neutral, " !important;\n\n border: 1px solid ").concat(props.error
|
|
28
|
+
? theme_1.straitsXTheme.color.status.critical
|
|
29
|
+
: theme_1.straitsXTheme.color.base.line, " !important;\n }\n");
|
|
30
|
+
};
|
|
31
|
+
var selectHoverFocusStyles = function (props) { return "\n &:hover .ant-select-selector,\n &.ant-select-focused .ant-select-selector {\n ".concat(!props.disabled &&
|
|
32
|
+
"\n box-shadow: 0 0 0 1px ".concat(theme_1.straitsXTheme.color.base.onNeutral, "20 !important;\n border: 1px solid ").concat(props.error
|
|
33
|
+
? theme_1.straitsXTheme.color.status.critical
|
|
34
|
+
: theme_1.straitsXTheme.color.base.primary2, " !important;\n "), "\n }\n"); };
|
|
35
|
+
var selectPlaceholderStyles = "\n .ant-select-selection-placeholder {\n height: 100% !important;\n display: flex;\n align-items: center;\n \n span {\n color: ".concat(theme_1.straitsXTheme.color.component.placeholderInput, " !important;\n }\n }\n");
|
|
36
|
+
var selectOverflowStyles = function (props) { return "\n .ant-select-selection-overflow {\n gap: 8px;\n ".concat(props.$mode === 'multiple' ? 'flex-wrap: wrap !important;' : '', "\n ").concat(props.$mode === 'multiple' ? 'align-content: center !important;' : '', "\n }\n"); };
|
|
37
|
+
var selectSelectedItemStyles = "\n .ant-select-selection-item {\n display: flex !important;\n align-items: center !important;\n color: ".concat(theme_1.straitsXTheme.color.base.onNeutral, " !important;\n }\n");
|
|
38
|
+
var selectArrowStyles = "\n .ant-select-arrow {\n display: flex !important;\n align-items: center !important;\n gap: 8px !important;\n width: auto !important;\n align-self: center !important;\n \n span {\n color: ".concat(theme_1.straitsXTheme.color.base.onNeutral, " !important;\n }\n }\n");
|
|
39
|
+
exports.StyledAntSelect = (0, styled_1.default)(select_1.default)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n"], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n"])), function (props) { return selectSelectorStyles(props); }, function (props) { return selectHoverFocusStyles(props); }, selectPlaceholderStyles, function (props) { return selectOverflowStyles(props); }, selectSelectedItemStyles, selectArrowStyles);
|
|
40
|
+
var dropdownBaseItemStyles = "\n .ant-select-item {\n color: ".concat(theme_1.straitsXTheme.color.base.onNeutral, " !important;\n padding: 12px !important;\n }\n");
|
|
41
|
+
var dropdownSelectedOptionStyles = "\n .ant-select-item-option-selected {\n background: #d7efe2 !important;\n position: relative !important;\n \n .anticon {\n display: none !important;\n }\n \n &::after {\n content: 'check' !important;\n font-family: 'Material Symbols Rounded' !important;\n color: ".concat(theme_1.straitsXTheme.color.status.positive, " !important;\n position: absolute !important;\n right: 12px !important;\n top: 50% !important;\n transform: translateY(-50%) !important;\n font-size: 16px !important;\n }\n }\n");
|
|
42
|
+
var dropdownInteractiveStyles = "\n .ant-select-item:hover {\n background: ".concat(theme_1.straitsXTheme.color.interactive.hoverSurface, " !important;\n }\n \n .ant-select-item:active {\n background: ").concat(theme_1.straitsXTheme.color.interactive.pressedSurface, " !important;\n }\n");
|
|
43
|
+
var dropdownDisabledOptionStyles = "\n .ant-select-item-option-disabled,\n .ant-select-item-option-disabled:hover {\n background: ".concat(theme_1.straitsXTheme.color.surface.disabledSurface, " !important;\n span { \n color: ").concat(theme_1.straitsXTheme.color.surface.disabledOnSurface, " !important;\n }\n }\n");
|
|
44
|
+
exports.StyledDropdown = styled_1.default.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n"], ["\n ", "\n ", "\n ", "\n ", "\n"])), dropdownBaseItemStyles, dropdownSelectedOptionStyles, dropdownInteractiveStyles, dropdownDisabledOptionStyles);
|
|
45
|
+
exports.dropdownStyle = { padding: 0, borderRadius: '12px' };
|
|
46
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
|
|
74
47
|
//# sourceMappingURL=style.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/components/Select/style.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"style.js","sourceRoot":"","sources":["../../../src/components/Select/style.ts"],"names":[],"mappings":"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"}
|
|
@@ -9,7 +9,7 @@ var react_1 = require("react");
|
|
|
9
9
|
var styled_1 = require("@emotion/styled");
|
|
10
10
|
var MaterialSymbols_1 = require("src/icons/MaterialSymbols");
|
|
11
11
|
var Typography_1 = require("src/constants/Typography/Typography");
|
|
12
|
-
var
|
|
12
|
+
var index_1 = require("src/components/Button/index");
|
|
13
13
|
var const_1 = require("src/components/Tag/const");
|
|
14
14
|
function getColorByProperty(type, variant, property) {
|
|
15
15
|
switch (variant) {
|
|
@@ -28,13 +28,20 @@ function default_1(_a) {
|
|
|
28
28
|
return (react_1.default.createElement(Base, { type: type, size: size, variant: variant, onClick: variant !== 'removable' ? onClick : undefined },
|
|
29
29
|
showIcon && type !== 'disabled' && (react_1.default.createElement(MaterialSymbols_1.MaterialSymbols, { icon: const_1.ICON_MAP[type], size: const_1.ICON_SIZE_MAP[size], color: getColorByProperty(type, variant, 'icon') })),
|
|
30
30
|
react_1.default.createElement(Typography_1.Typography.Body, { size: size, color: getColorByProperty(type, variant, 'text') }, children),
|
|
31
|
-
variant === 'removable' && (react_1.default.createElement(CloseButton, {
|
|
31
|
+
variant === 'removable' && (react_1.default.createElement(CloseButton, { onMouseDown: function (e) {
|
|
32
|
+
e.preventDefault();
|
|
33
|
+
e.stopPropagation();
|
|
34
|
+
}, onClick: function (e) {
|
|
35
|
+
e.preventDefault();
|
|
36
|
+
e.stopPropagation();
|
|
37
|
+
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
38
|
+
}, type: "tertiary", icon: react_1.default.createElement(MaterialSymbols_1.MaterialSymbols, { icon: "close", size: const_1.ICON_SIZE_MAP[size], color: getColorByProperty(type, variant, 'icon') }) }))));
|
|
32
39
|
}
|
|
33
40
|
var getAdditionalStyles = function (_a) {
|
|
34
41
|
var type = _a.type, _b = _a.variant, variant = _b === void 0 ? 'outlined' : _b, _c = _a.size, size = _c === void 0 ? 'sm' : _c, onClick = _a.onClick;
|
|
35
42
|
return "\n border-radius: ".concat(variant === 'removable' ? '999px' : '4px', ";\n min-height: ").concat(size === 'sm' ? '24px' : '32px', ";\n background-color: ").concat(type && variant ? getColorByProperty(type, variant, 'base') : 'transparent', ";\n border: 1px solid ").concat(type && variant ? getColorByProperty(type, variant, 'border') : 'transparent', ";\n padding-inline: ").concat(variant === 'removable' ? '12px' : '8px', ";\n cursor: ").concat(onClick ? 'pointer' : 'default', ";\n\n");
|
|
36
43
|
};
|
|
37
|
-
var CloseButton = (0, styled_1.default)(
|
|
44
|
+
var CloseButton = (0, styled_1.default)(index_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n && {\n padding: 0 !important;\n width: auto !important;\n height: auto !important;\n }\n\n &&:hover {\n background: transparent !important;\n }\n\n &&:focus {\n background: transparent !important;\n }\n\n &&:active {\n background: transparent !important;\n }\n"], ["\n && {\n padding: 0 !important;\n width: auto !important;\n height: auto !important;\n }\n\n &&:hover {\n background: transparent !important;\n }\n\n &&:focus {\n background: transparent !important;\n }\n\n &&:active {\n background: transparent !important;\n }\n"])));
|
|
38
45
|
var Base = styled_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n gap: 4px;\n align-items: center;\n justify-content: center;\n width: fit-content;\n height: fit-content;\n text-transform: capitalize;\n\n ", ";\n"], ["\n display: flex;\n flex-direction: row;\n gap: 4px;\n align-items: center;\n justify-content: center;\n width: fit-content;\n height: fit-content;\n text-transform: capitalize;\n\n ", ";\n"])), function (props) { return getAdditionalStyles(props); });
|
|
39
46
|
var templateObject_1, templateObject_2;
|
|
40
47
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tag/index.tsx"],"names":[],"mappings":";;;;;;AA+CA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Tag/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -16,8 +16,8 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
16
16
|
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
|
|
17
17
|
};
|
|
18
18
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
|
-
exports.
|
|
20
|
-
exports.LINE_HEIGHT = exports.FONT_SIZE = exports.FONT_WEIGHT = exports.FALLBACK_FONT = exports.MAIN_FONT = exports.BACKGROUND_COLORS = exports.TEXT_COLORS = exports.ICON_COLORS = exports.MAIN_COLORS = exports.NEUTRAL_COLORS = exports.YELLOW_COLORS = exports.RED_COLORS = exports.GREEN_COLORS = exports.BLUE_COLORS = exports.TABLET_BREAKPOINT = exports.LAPTOP_BREAKPOINT = exports.DESKTOP_BREAKPOINT = exports.EXTRA_LARGE_DESKTOP_BREAKPOINT = exports.useModal = exports.ModalProvider = exports.straitsXTheme = exports.xfersTheme = exports.useTheme = exports.ThemeProvider = exports.Typography = void 0;
|
|
19
|
+
exports.getCoachmarkJoyrideConfig = exports.Coachmark = exports.Timeline = exports.SummaryCard = exports.Spin = exports.ErrorPage = exports.Tooltip = exports.CopyBox = exports.Section = exports.Banner = exports.Note = exports.ContentBreakdown = exports.Hidden = exports.Link = exports.Divider = exports.EmptyData = exports.SmallP = exports.P1Bold = exports.P1 = exports.H4 = exports.H3 = exports.H2 = exports.H1 = exports.Checkbox = exports.DatePicker = exports.Timer = exports.Tabs = exports.Table = exports.Steps = exports.Select = exports.RangePicker = exports.Radio = exports.Pagination = exports.DeprecatedModal = exports.Modal = exports.Tag = exports.InputWithButton = exports.Input = exports.Form = exports.DynamicSelect = exports.Dropdown = exports.Carousel = exports.Chart = exports.Card = exports.BadgeIcon = exports.Accordion = exports.ActionCard = exports.ActionButton = exports.Button = exports.Alert = void 0;
|
|
20
|
+
exports.LINE_HEIGHT = exports.FONT_SIZE = exports.FONT_WEIGHT = exports.FALLBACK_FONT = exports.MAIN_FONT = exports.BACKGROUND_COLORS = exports.TEXT_COLORS = exports.ICON_COLORS = exports.MAIN_COLORS = exports.NEUTRAL_COLORS = exports.YELLOW_COLORS = exports.RED_COLORS = exports.GREEN_COLORS = exports.BLUE_COLORS = exports.TABLET_BREAKPOINT = exports.LAPTOP_BREAKPOINT = exports.DESKTOP_BREAKPOINT = exports.EXTRA_LARGE_DESKTOP_BREAKPOINT = exports.useModal = exports.ModalProvider = exports.straitsXTheme = exports.xfersTheme = exports.useTheme = exports.ThemeProvider = exports.Typography = exports.MaterialSymbols = void 0;
|
|
21
21
|
// Components
|
|
22
22
|
var Alert_1 = require("./components/Alert");
|
|
23
23
|
Object.defineProperty(exports, "Alert", { enumerable: true, get: function () { return Alert_1.default; } });
|
|
@@ -45,6 +45,8 @@ var Form_1 = require("./components/Form");
|
|
|
45
45
|
Object.defineProperty(exports, "Form", { enumerable: true, get: function () { return Form_1.default; } });
|
|
46
46
|
var Input_1 = require("./components/Input");
|
|
47
47
|
Object.defineProperty(exports, "Input", { enumerable: true, get: function () { return Input_1.default; } });
|
|
48
|
+
var InputWithButton_1 = require("./components/InputWithButton");
|
|
49
|
+
Object.defineProperty(exports, "InputWithButton", { enumerable: true, get: function () { return InputWithButton_1.default; } });
|
|
48
50
|
var Tag_1 = require("./components/Tag");
|
|
49
51
|
Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return Tag_1.default; } });
|
|
50
52
|
var Modal_1 = require("./components/Modal");
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";AAAA,0EAA0E;AAC1E,iCAAiC;;;;;;;;;;;;;;;;;;AAEjC,aAAa;AACb,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,8CAAuD;AAA9C,gGAAA,OAAO,OAAU;AAC1B,0DAAmE;AAA1D,4GAAA,OAAO,OAAgB;AAChC,sDAA+D;AAAtD,wGAAA,OAAO,OAAc;AAC9B,oDAA6D;AAApD,sGAAA,OAAO,OAAa;AAC7B,oDAA6D;AAApD,sGAAA,OAAO,OAAa;AAC7B,0CAAmD;AAA1C,4FAAA,OAAO,OAAQ;AACxB,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,kDAA2D;AAAlD,oGAAA,OAAO,OAAY;AAC5B,kDAA2D;AAAlD,oGAAA,OAAO,OAAY;AAC5B,4DAAqE;AAA5D,8GAAA,OAAO,OAAiB;AACjC,0CAAmD;AAA1C,4FAAA,OAAO,OAAQ;AACxB,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,gEAAyE;AAAhE,kHAAA,OAAO,OAAmB;AACnC,wCAAiD;AAAxC,0FAAA,OAAO,OAAO;AACvB,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,gEAAyE;AAAhE,kHAAA,OAAO,OAAmB;AACnC,sDAA+D;AAAtD,wGAAA,OAAO,OAAc;AAC9B,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,wDAAiE;AAAxD,0GAAA,OAAO,OAAe;AAC/B,8CAAuD;AAA9C,gGAAA,OAAO,OAAU;AAC1B,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,0CAAmD;AAA1C,4FAAA,OAAO,OAAQ;AACxB,4CAAqD;AAA5C,8FAAA,OAAO,OAAS;AACzB,sDAA+D;AAAtD,wGAAA,OAAO,OAAc;AAC9B,kDAA2D;AAAlD,oGAAA,OAAO,OAAY;AAC5B,sDAA4E;AAAnE,gGAAA,EAAE,OAAA;AAAE,gGAAA,EAAE,OAAA;AAAE,gGAAA,EAAE,OAAA;AAAE,gGAAA,EAAE,OAAA;AAAE,gGAAA,EAAE,OAAA;AAAE,oGAAA,MAAM,OAAA;AAAE,oGAAA,MAAM,OAAA;AAC3C,oDAA6D;AAApD,sGAAA,OAAO,OAAa;AAC7B,gDAAyD;AAAhD,kGAAA,OAAO,OAAW;AAC3B,0CAAmD;AAA1C,4FAAA,OAAO,OAAQ;AACxB,8CAAuD;AAA9C,gGAAA,OAAO,OAAU;AAC1B,kEAA2E;AAAlE,oHAAA,OAAO,OAAoB;AACpC,0CAAmD;AAA1C,4FAAA,OAAO,OAAQ;AACxB,8CAAuD;AAA9C,gGAAA,OAAO,OAAU;AAC1B,0CAA2C;AAAlC,+FAAA,OAAO,OAAA;AAChB,gDAAyD;AAAhD,kGAAA,OAAO,OAAW;AAC3B,gDAAyD;AAAhD,kGAAA,OAAO,OAAW;AAC3B,oDAA6D;AAApD,sGAAA,OAAO,OAAa;AAC7B,0CAAmD;AAA1C,4FAAA,OAAO,OAAQ;AACxB,wDAAiE;AAAxD,0GAAA,OAAO,OAAe;AAC/B,kDAA2D;AAAlD,oGAAA,OAAO,OAAY;AAC5B,oDAA6D;AAApD,sGAAA,OAAO,OAAa;AAE7B,mBAAmB;AACnB,4EAAmF;AAA1E,6HAAA,yBAAyB,OAAA;AAElC,QAAQ;AACR,0CAAuB;AACvB,2DAAyD;AAAhD,kHAAA,eAAe,OAAA;AAExB,QAAQ;AACR,0CAAuB;AAEvB,aAAa;AACb,gEAA8D;AAArD,wGAAA,UAAU,OAAA;AAEnB,qDAA8D;AAArD,6GAAA,aAAa,OAAA;AAAE,wGAAA,QAAQ,OAAA;AAChC,uCAAyD;AAAhD,mGAAA,UAAU,OAAA;AAAE,sGAAA,aAAa,OAAA;AAElC,sDAA+D;AAAtD,6GAAA,aAAa,OAAA;AAAE,wGAAA,QAAQ,OAAA;AAEhC,uDAKgC;AAJ9B,6HAAA,8BAA8B,OAAA;AAC9B,iHAAA,kBAAkB,OAAA;AAClB,gHAAA,iBAAiB,OAAA;AACjB,gHAAA,iBAAiB,OAAA;AAGnB,wBAAwB;AAExB,oDAU6B;AAT3B,0GAAA,WAAW,OAAA;AACX,2GAAA,YAAY,OAAA;AACZ,yGAAA,UAAU,OAAA;AACV,4GAAA,aAAa,OAAA;AACb,6GAAA,cAAc,OAAA;AACd,0GAAA,WAAW,OAAA;AACX,0GAAA,WAAW,OAAA;AACX,0GAAA,WAAW,OAAA;AACX,gHAAA,iBAAiB,OAAA;AAGnB,8DAMkC;AALhC,6GAAA,SAAS,OAAA;AACT,iHAAA,aAAa,OAAA;AACb,+GAAA,WAAW,OAAA;AACX,6GAAA,SAAS,OAAA;AACT,+GAAA,WAAW,OAAA"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import 'antd/es/date-picker/style/css';
|
|
3
|
+
import { InputSize } from '../Input/inputStyles';
|
|
3
4
|
type Props = {
|
|
4
5
|
placeholder?: string;
|
|
5
6
|
format?: string;
|
|
@@ -11,6 +12,12 @@ type Props = {
|
|
|
11
12
|
value?: any;
|
|
12
13
|
label?: string;
|
|
13
14
|
required?: boolean;
|
|
15
|
+
optional?: boolean;
|
|
16
|
+
size?: InputSize;
|
|
17
|
+
error?: boolean;
|
|
18
|
+
helperText?: string;
|
|
19
|
+
showInfoIcon?: boolean;
|
|
20
|
+
onInfoClick?: () => void;
|
|
14
21
|
};
|
|
15
|
-
export default function ({ disabled, label, required, ...rest }: Props): React.JSX.Element;
|
|
22
|
+
export default function ({ disabled, label, required, optional, size, error, helperText, showInfoIcon, onInfoClick, ...rest }: Props): React.JSX.Element;
|
|
16
23
|
export {};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
type InputLabelProps = {
|
|
2
|
+
label?: string;
|
|
3
|
+
required?: boolean;
|
|
4
|
+
optional?: boolean;
|
|
5
|
+
showInfoIcon?: boolean;
|
|
6
|
+
infoText?: string;
|
|
7
|
+
onInfoClick?: () => void;
|
|
8
|
+
};
|
|
9
|
+
export declare function InputLabel({ label, required, optional, showInfoIcon, infoText, onInfoClick, }: InputLabelProps): JSX.Element | null;
|
|
10
|
+
export {};
|
|
@@ -1,23 +1,40 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { InputProps } from 'antd/es/input';
|
|
3
|
+
import { InputSize } from './inputStyles';
|
|
3
4
|
import 'antd/es/input/style/css';
|
|
4
|
-
type
|
|
5
|
-
addonBefore?: string;
|
|
6
|
-
placeholder?: string;
|
|
7
|
-
disabled?: boolean;
|
|
8
|
-
className?: string;
|
|
5
|
+
type BaseInputProps = {
|
|
9
6
|
label?: string;
|
|
10
7
|
required?: boolean;
|
|
11
8
|
optional?: boolean;
|
|
12
|
-
|
|
9
|
+
size?: InputSize;
|
|
10
|
+
helperText?: string;
|
|
11
|
+
error?: boolean;
|
|
12
|
+
showInfoIcon?: boolean;
|
|
13
|
+
infoText?: string;
|
|
14
|
+
onInfoClick?: () => void;
|
|
15
|
+
};
|
|
16
|
+
type Props = BaseInputProps & {
|
|
17
|
+
addonBefore?: string | React.ReactNode;
|
|
18
|
+
addonAfter?: string | React.ReactNode;
|
|
19
|
+
placeholder?: string;
|
|
20
|
+
disabled?: boolean;
|
|
21
|
+
disabledAddon?: boolean;
|
|
22
|
+
className?: string;
|
|
23
|
+
} & Omit<InputProps, 'addonBefore' | 'addonAfter' | 'placeholder' | 'disabled' | 'className' | 'size'>;
|
|
13
24
|
declare const MainInput: {
|
|
14
|
-
({ addonBefore, placeholder, disabled, className, label, required, optional, ...rest }: Props): React.JSX.Element;
|
|
15
|
-
Password({ addonBefore, placeholder, disabled, className, label, required, ...rest }:
|
|
16
|
-
Search({ addonBefore, placeholder, className, onChange, onSearch, ...rest }: SearchProps): React.JSX.Element;
|
|
17
|
-
TextArea({ className, label, required, optional, ...rest }: TextAreaProps): React.JSX.Element;
|
|
25
|
+
({ addonBefore, addonAfter, placeholder, disabled, disabledAddon, className, label, required, optional, size, helperText, error, showInfoIcon, infoText, onInfoClick, ...rest }: Props): React.JSX.Element;
|
|
26
|
+
Password({ addonBefore, placeholder, disabled, className, label, required, optional, size, helperText, error, showInfoIcon, infoText, onInfoClick, ...rest }: PasswordProps): React.JSX.Element;
|
|
27
|
+
Search({ addonBefore, placeholder, className, onChange, onSearch, size, helperText, error, ...rest }: SearchProps): React.JSX.Element;
|
|
28
|
+
TextArea({ className, label, required, optional, size, helperText, error, showInfoIcon, infoText, onInfoClick, ...rest }: TextAreaProps): React.JSX.Element;
|
|
18
29
|
Group: import("react").FC<import("antd/es/input").GroupProps>;
|
|
19
30
|
};
|
|
20
|
-
type
|
|
31
|
+
type PasswordProps = BaseInputProps & {
|
|
32
|
+
addonBefore?: string;
|
|
33
|
+
placeholder?: string;
|
|
34
|
+
disabled?: boolean;
|
|
35
|
+
className?: string;
|
|
36
|
+
} & Omit<InputProps, 'addonBefore' | 'placeholder' | 'disabled' | 'className' | 'size'>;
|
|
37
|
+
type SearchProps = Pick<BaseInputProps, 'size' | 'helperText' | 'error'> & {
|
|
21
38
|
addonBefore?: string | React.ReactNode;
|
|
22
39
|
placeholder?: string;
|
|
23
40
|
className?: string;
|
|
@@ -26,15 +43,12 @@ type SearchProps = {
|
|
|
26
43
|
onSearch?: () => void;
|
|
27
44
|
value?: string;
|
|
28
45
|
};
|
|
29
|
-
type TextAreaProps = {
|
|
46
|
+
type TextAreaProps = BaseInputProps & {
|
|
30
47
|
placeholder?: string;
|
|
31
48
|
className?: string;
|
|
32
49
|
style?: Record<string, unknown>;
|
|
33
50
|
onChange?: (e: any) => void;
|
|
34
51
|
onFocus?: any;
|
|
35
|
-
label?: string;
|
|
36
|
-
required?: boolean;
|
|
37
|
-
optional?: boolean;
|
|
38
52
|
disabled?: boolean;
|
|
39
53
|
value?: string;
|
|
40
54
|
rows?: number;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export type InputSize = 'large' | 'small';
|
|
2
|
+
export declare const SIZE_CONFIG: {
|
|
3
|
+
large: {
|
|
4
|
+
height: string;
|
|
5
|
+
borderRadius: string;
|
|
6
|
+
padding: string;
|
|
7
|
+
};
|
|
8
|
+
small: {
|
|
9
|
+
height: string;
|
|
10
|
+
borderRadius: string;
|
|
11
|
+
padding: string;
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
export declare function getBaseInputStyle(theme: any, size?: InputSize, error?: boolean, disabledAddon?: boolean): string;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
type Props = {
|
|
3
|
+
buttonText: string;
|
|
4
|
+
onButtonClick?: () => void;
|
|
5
|
+
prefix?: React.ReactNode;
|
|
6
|
+
placeholder?: string;
|
|
7
|
+
value?: string;
|
|
8
|
+
defaultValue?: string;
|
|
9
|
+
onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
disabledInput?: boolean;
|
|
12
|
+
disabledPrefix?: boolean;
|
|
13
|
+
staticPrefix?: boolean;
|
|
14
|
+
error?: boolean;
|
|
15
|
+
className?: string;
|
|
16
|
+
};
|
|
17
|
+
declare const InputWithButton: React.FC<Props>;
|
|
18
|
+
export default InputWithButton;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import 'antd/es/date-picker/style/css';
|
|
3
|
+
import { InputSize } from '../Input/inputStyles';
|
|
3
4
|
type Props = {
|
|
4
5
|
format?: string;
|
|
5
6
|
style?: Record<string, unknown>;
|
|
@@ -9,6 +10,7 @@ type Props = {
|
|
|
9
10
|
disabledDate?: any;
|
|
10
11
|
value?: [any, any];
|
|
11
12
|
picker?: any;
|
|
13
|
+
size?: InputSize;
|
|
12
14
|
};
|
|
13
|
-
export default function ({ format, ...rest }: Props): React.JSX.Element;
|
|
15
|
+
export default function ({ format, size, ...rest }: Props): React.JSX.Element;
|
|
14
16
|
export {};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const getSuffixIcon: (secondaryText?: string) => React.JSX.Element;
|
|
3
|
+
export declare const renderLabel: (label: string, tooltip?: React.ReactElement) => React.JSX.Element | null;
|
|
4
|
+
export declare const getPlaceholder: (size: "sm" | "lg", placeholder?: string) => React.JSX.Element | null;
|
|
5
|
+
export declare const renderOptions: (options: Array<{
|
|
6
|
+
value: string;
|
|
7
|
+
label: string;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
icon?: React.ComponentType<{
|
|
10
|
+
style?: React.CSSProperties;
|
|
11
|
+
}>;
|
|
12
|
+
}>, size: "sm" | "lg") => React.JSX.Element[];
|
|
13
|
+
export declare const renderHelperText: (helperText?: string) => React.JSX.Element | null;
|
|
14
|
+
export declare const getCustomSelectTag: (mode: string | undefined, disabled: boolean, size: "sm" | "lg") => (({ label, onClose }: {
|
|
15
|
+
label: React.ReactNode;
|
|
16
|
+
onClose: () => void;
|
|
17
|
+
}) => React.JSX.Element) | undefined;
|
|
@@ -1,29 +1,31 @@
|
|
|
1
1
|
import React, { RefObject } from 'react';
|
|
2
2
|
import { SelectProps } from 'antd/es/select';
|
|
3
|
+
import type { BaseSelectRef } from 'rc-select';
|
|
4
|
+
import type { BaseOptionType, DefaultOptionType } from 'rc-select/lib/Select';
|
|
3
5
|
import 'antd/es/select/style/css';
|
|
4
|
-
import 'antd/es/tag/style/css';
|
|
5
6
|
export type Props = {
|
|
6
7
|
disabled?: boolean;
|
|
7
8
|
children?: React.ReactNode;
|
|
8
|
-
className?: string;
|
|
9
|
-
type?: 'dropdown' | 'filter';
|
|
10
9
|
placeholder?: string;
|
|
11
|
-
|
|
12
|
-
dropdownstyle?: Record<string, unknown>;
|
|
13
|
-
open?: boolean;
|
|
14
|
-
onClick?: (event: React.MouseEvent<HTMLElement>) => void;
|
|
15
|
-
mode?: 'multiple' | 'tags';
|
|
10
|
+
mode?: 'multiple';
|
|
16
11
|
label?: string;
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
12
|
+
size?: 'sm' | 'lg';
|
|
13
|
+
error?: boolean;
|
|
14
|
+
labelTooltip?: React.ReactElement;
|
|
15
|
+
secondaryText?: string;
|
|
16
|
+
helperText?: string;
|
|
17
|
+
options?: Array<{
|
|
18
|
+
value: string;
|
|
19
|
+
label: string;
|
|
20
|
+
disabled?: boolean;
|
|
21
|
+
icon?: React.ComponentType<{
|
|
22
|
+
style?: React.CSSProperties;
|
|
23
|
+
}>;
|
|
24
|
+
}>;
|
|
25
|
+
selectRef?: RefObject<BaseSelectRef>;
|
|
26
|
+
} & Omit<SelectProps<unknown, DefaultOptionType | BaseOptionType>, 'disabled' | 'size'>;
|
|
20
27
|
declare const Select: {
|
|
21
|
-
({
|
|
22
|
-
Tag({ className, ...props }: {
|
|
23
|
-
[x: string]: any;
|
|
24
|
-
className?: string | undefined;
|
|
25
|
-
}): React.JSX.Element;
|
|
26
|
-
OptGroup: import("rc-select/lib/OptGroup").OptionGroupFC;
|
|
28
|
+
({ children, disabled, size, mode, label, labelTooltip, selectRef, placeholder, error, secondaryText, helperText, options, ...rest }: Props): React.JSX.Element;
|
|
27
29
|
Option: import("rc-select/lib/Option").OptionFC;
|
|
28
30
|
};
|
|
29
31
|
export default Select;
|