@helpdice/ui 2.2.3 → 2.2.5
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/auto-complete/index.js +55 -45
- package/dist/container/box.d.ts +1 -0
- package/dist/container/index.js +686 -8
- package/dist/index.js +77 -47
- package/dist/input/currency-input/components/CurrencyInput.d.ts +35 -2
- package/dist/input/currency-input/components/CurrencyInputProps.d.ts +1 -0
- package/dist/input/index.js +55 -45
- package/dist/input/input-props.d.ts +1 -0
- package/dist/input/phone-input/phone.d.ts +34 -2
- package/dist/table/index.js +55 -45
- package/esm/container/box.d.ts +1 -0
- package/esm/container/box.js +25 -3
- package/esm/input/currency-input/components/CurrencyInput.d.ts +35 -2
- package/esm/input/currency-input/components/CurrencyInput.js +18 -12
- package/esm/input/currency-input/components/CurrencyInputProps.d.ts +1 -0
- package/esm/input/input-field.js +14 -13
- package/esm/input/input-props.d.ts +1 -0
- package/esm/input/phone-input/phone.d.ts +34 -2
- package/esm/input/phone-input/phone.js +22 -21
- package/package.json +1 -1
package/dist/input/index.js
CHANGED
|
@@ -1024,7 +1024,7 @@ var withScale = function withScale(Render) {
|
|
|
1024
1024
|
return ScaleFC;
|
|
1025
1025
|
};
|
|
1026
1026
|
|
|
1027
|
-
var _excluded$3 = ["label", "labelRight", "color", "
|
|
1027
|
+
var _excluded$3 = ["label", "labelRight", "error", "color", "helperText", "type", "icon", "variant", "iconRight", "iconClickable", "onIconClick", "initialValue", "onChange", "readOnly", "value", "onClearClick", "clearable", "className", "onBlur", "onFocus", "autoComplete", "placeholder", "children", "disabled", "fullWidth"];
|
|
1028
1028
|
var simulateChangeEvent = function simulateChangeEvent(el, event) {
|
|
1029
1029
|
return _objectSpread2(_objectSpread2({}, event), {}, {
|
|
1030
1030
|
target: el,
|
|
@@ -1034,9 +1034,10 @@ var simulateChangeEvent = function simulateChangeEvent(el, event) {
|
|
|
1034
1034
|
var InputComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
1035
1035
|
var label = _ref.label,
|
|
1036
1036
|
labelRight = _ref.labelRight,
|
|
1037
|
-
_ref$color = _ref.color,
|
|
1038
|
-
_color = _ref$color === void 0 ? 'default' : _ref$color,
|
|
1039
1037
|
error = _ref.error,
|
|
1038
|
+
_ref$color = _ref.color,
|
|
1039
|
+
_color = _ref$color === void 0 ? error ? 'error' : 'default' : _ref$color,
|
|
1040
|
+
helperText = _ref.helperText,
|
|
1040
1041
|
_ref$type = _ref.type,
|
|
1041
1042
|
type = _ref$type === void 0 ? 'text' : _ref$type,
|
|
1042
1043
|
icon = _ref.icon,
|
|
@@ -1146,11 +1147,11 @@ var InputComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
1146
1147
|
var inputProps = _objectSpread2(_objectSpread2({}, props), controlledValue);
|
|
1147
1148
|
var defaultWidth = fullWidth ? '100%' : 'initial';
|
|
1148
1149
|
return /*#__PURE__*/React.createElement("div", {
|
|
1149
|
-
className: _JSXStyle.dynamic([["
|
|
1150
|
+
className: _JSXStyle.dynamic([["2582554466", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]]]) + " " + "with-label"
|
|
1150
1151
|
}, children && /*#__PURE__*/React.createElement(InputBlockLabel, null, children), /*#__PURE__*/React.createElement("div", {
|
|
1151
|
-
className: _JSXStyle.dynamic([["
|
|
1152
|
+
className: _JSXStyle.dynamic([["2582554466", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]]]) + " " + (theme.useClasses('input-container', className) || "")
|
|
1152
1153
|
}, label && /*#__PURE__*/React.createElement(MemoInputLabel, null, label), /*#__PURE__*/React.createElement("div", {
|
|
1153
|
-
className: _JSXStyle.dynamic([["
|
|
1154
|
+
className: _JSXStyle.dynamic([["2582554466", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]]]) + " " + (theme.useClasses('input-wrapper', {
|
|
1154
1155
|
hover: hover,
|
|
1155
1156
|
disabled: disabled
|
|
1156
1157
|
}, labelClasses) || "")
|
|
@@ -1167,7 +1168,7 @@ var InputComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
1167
1168
|
onChange: changeHandler,
|
|
1168
1169
|
autoComplete: autoComplete
|
|
1169
1170
|
}, inputProps, {
|
|
1170
|
-
className: _JSXStyle.dynamic([["
|
|
1171
|
+
className: _JSXStyle.dynamic([["2582554466", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]]]) + " " + (inputProps && inputProps.className != null && inputProps.className || theme.useClasses({
|
|
1171
1172
|
disabled: disabled
|
|
1172
1173
|
}, iconClasses) || "")
|
|
1173
1174
|
})), clearable && /*#__PURE__*/React.createElement(MemoInputIconClear, {
|
|
@@ -1179,8 +1180,8 @@ var InputComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
1179
1180
|
}, iconProps))), labelRight && /*#__PURE__*/React.createElement(MemoInputLabel, {
|
|
1180
1181
|
isRight: true
|
|
1181
1182
|
}, labelRight), /*#__PURE__*/React.createElement("br", {
|
|
1182
|
-
className: _JSXStyle.dynamic([["
|
|
1183
|
-
})),
|
|
1183
|
+
className: _JSXStyle.dynamic([["2582554466", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]]])
|
|
1184
|
+
})), helperText && /*#__PURE__*/React.createElement("p", {
|
|
1184
1185
|
style: {
|
|
1185
1186
|
marginTop: 0.4,
|
|
1186
1187
|
marginRight: 0,
|
|
@@ -1188,11 +1189,11 @@ var InputComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
1188
1189
|
marginBottom: '0.4rem',
|
|
1189
1190
|
textAlign: 'left'
|
|
1190
1191
|
},
|
|
1191
|
-
className: _JSXStyle.dynamic([["
|
|
1192
|
-
},
|
|
1193
|
-
id: "
|
|
1192
|
+
className: _JSXStyle.dynamic([["2582554466", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]]]) + " " + ((error ? "input-error" : '') || "")
|
|
1193
|
+
}, "\xA0", helperText), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
1194
|
+
id: "2582554466",
|
|
1194
1195
|
dynamic: [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), SCALES.width(1, defaultWidth), variant === 'normal' ? theme$1.layout.radius : '', variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), theme$1.palette.accents_1, theme$1.palette.accents_2, hoverBorder, SCALES.font(0.875), color, theme$1.palette.accents_3, theme$1.palette.background, color]
|
|
1195
|
-
}, ".with-label.__jsx-style-dynamic-selector{display:inline-block;box-sizing:border-box;-webkit-box-align:center;--input-height:".concat(SCALES.height(2.25), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, defaultWidth), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.input-error.__jsx-style-dynamic-selector{color:#
|
|
1196
|
+
}, ".with-label.__jsx-style-dynamic-selector{display:inline-block;box-sizing:border-box;-webkit-box-align:center;--input-height:".concat(SCALES.height(2.25), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, defaultWidth), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.input-error.__jsx-style-dynamic-selector{color:#e00;}.input-container.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:").concat(SCALES.width(1, defaultWidth), ";height:var(--input-height);}.input-wrapper.__jsx-style-dynamic-selector{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;vertical-align:middle;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;-webkit-flex:1;-ms-flex:1;flex:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-radius:").concat(variant === 'normal' ? theme$1.layout.radius : '', ";").concat(variant === 'none' ? '' : variant === 'line' ? "border-bottom: 1px solid ".concat(borderColor) : "border: 1px solid ".concat(borderColor), ";-webkit-transition:border 0.2s ease 0s,color 0.2s ease 0s;transition:border 0.2s ease 0s,color 0.2s ease 0s;}.input-wrapper.left-label.__jsx-style-dynamic-selector{border-top-left-radius:0;border-bottom-left-radius:0;}.input-wrapper.right-label.__jsx-style-dynamic-selector{border-top-right-radius:0;border-bottom-right-radius:0;}.input-wrapper.disabled.__jsx-style-dynamic-selector{background-color:").concat(theme$1.palette.accents_1, ";border-color:").concat(theme$1.palette.accents_2, ";cursor:not-allowed;}input.disabled.__jsx-style-dynamic-selector{cursor:not-allowed;}.input-wrapper.hover.__jsx-style-dynamic-selector{border-color:").concat(hoverBorder, ";}input.__jsx-style-dynamic-selector{margin:0.25em 0.625em;padding:0;box-shadow:none;font-size:").concat(SCALES.font(0.875), ";background-color:transparent;border:none;color:").concat(color, ";outline:none;border-radius:0;width:100%;min-width:0;-webkit-appearance:none;}input.left-icon.__jsx-style-dynamic-selector{margin-left:0;}input.right-icon.__jsx-style-dynamic-selector{margin-right:0;}.__jsx-style-dynamic-selector::-webkit-input-placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme$1.palette.accents_3, ";}.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme$1.palette.accents_3, ";}.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme$1.palette.accents_3, ";}.__jsx-style-dynamic-selector::placeholder,.__jsx-style-dynamic-selector::-moz-placeholder,.__jsx-style-dynamic-selector:-ms-input-placeholder,.__jsx-style-dynamic-selector::-webkit-input-placeholder{color:").concat(theme$1.palette.accents_3, ";}.__jsx-style-dynamic-selector::-ms-reveal{display:none !important;}input.__jsx-style-dynamic-selector:-webkit-autofill,input.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:hover,input.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:active,input.__jsx-style-dynamic-selector:-webkit-autofill.__jsx-style-dynamic-selector:focus{-webkit-box-shadow:0 0 0 30px ").concat(theme$1.palette.background, " inset !important;-webkit-text-fill-color:").concat(color, " !important;}")));
|
|
1196
1197
|
});
|
|
1197
1198
|
InputComponent.displayName = 'Input';
|
|
1198
1199
|
var Input = withScale(InputComponent);
|
|
@@ -2699,21 +2700,22 @@ function PhoneInput(_ref) {
|
|
|
2699
2700
|
var defaultWidth = fullWidth ? '100%' : 'initial';
|
|
2700
2701
|
return /*#__PURE__*/React.createElement("div", {
|
|
2701
2702
|
ref: dropdownRef,
|
|
2702
|
-
className: _JSXStyle.dynamic([["
|
|
2703
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "with-label ".concat(isFocused ? 'focused' : '')
|
|
2703
2704
|
}, children && /*#__PURE__*/React.createElement(InputBlockLabel, null, children), /*#__PURE__*/React.createElement("div", {
|
|
2704
|
-
className: _JSXStyle.dynamic([["
|
|
2705
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "input-wrapper"
|
|
2705
2706
|
}, /*#__PURE__*/React.createElement("div", {
|
|
2706
2707
|
onClick: function onClick() {
|
|
2707
2708
|
return setDropdownOpen(!dropdownOpen);
|
|
2708
2709
|
},
|
|
2709
|
-
className: _JSXStyle.dynamic([["
|
|
2710
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "dropdown-toggle"
|
|
2710
2711
|
}, /*#__PURE__*/React.createElement("span", {
|
|
2711
2712
|
style: {
|
|
2712
2713
|
display: 'flex',
|
|
2713
2714
|
alignItems: 'center',
|
|
2714
|
-
gap: 5
|
|
2715
|
+
gap: 5,
|
|
2716
|
+
paddingRight: '15px'
|
|
2715
2717
|
},
|
|
2716
|
-
className: _JSXStyle.dynamic([["
|
|
2718
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]])
|
|
2717
2719
|
}, /*#__PURE__*/React.createElement("img", {
|
|
2718
2720
|
loading: "lazy",
|
|
2719
2721
|
width: "20",
|
|
@@ -2721,9 +2723,9 @@ function PhoneInput(_ref) {
|
|
|
2721
2723
|
src: "https://flagcdn.com/w20/".concat(selectedCountry.code.toLowerCase(), ".png"),
|
|
2722
2724
|
srcSet: "https://flagcdn.com/w40/".concat(selectedCountry.code.toLowerCase(), ".png 2x"),
|
|
2723
2725
|
alt: "".concat(selectedCountry.label, " Flag"),
|
|
2724
|
-
className: _JSXStyle.dynamic([["
|
|
2726
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]])
|
|
2725
2727
|
}), /*#__PURE__*/React.createElement("span", {
|
|
2726
|
-
className: _JSXStyle.dynamic([["
|
|
2728
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]])
|
|
2727
2729
|
}, selectedCountry.phone))), /*#__PURE__*/React.createElement("input", {
|
|
2728
2730
|
type: "tel",
|
|
2729
2731
|
placeholder: placeholder,
|
|
@@ -2735,9 +2737,9 @@ function PhoneInput(_ref) {
|
|
|
2735
2737
|
onBlur: function onBlur() {
|
|
2736
2738
|
return setIsFocused(false);
|
|
2737
2739
|
},
|
|
2738
|
-
className: _JSXStyle.dynamic([["
|
|
2740
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "phone-input"
|
|
2739
2741
|
})), dropdownOpen && /*#__PURE__*/React.createElement("div", {
|
|
2740
|
-
className: _JSXStyle.dynamic([["
|
|
2742
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "dropdown"
|
|
2741
2743
|
}, /*#__PURE__*/React.createElement("input", {
|
|
2742
2744
|
type: "text",
|
|
2743
2745
|
placeholder: "Search country...",
|
|
@@ -2745,23 +2747,23 @@ function PhoneInput(_ref) {
|
|
|
2745
2747
|
onChange: function onChange(e) {
|
|
2746
2748
|
return setSearchTerm(e.target.value);
|
|
2747
2749
|
},
|
|
2748
|
-
className: _JSXStyle.dynamic([["
|
|
2750
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "search-input"
|
|
2749
2751
|
}), /*#__PURE__*/React.createElement("div", {
|
|
2750
|
-
className: _JSXStyle.dynamic([["
|
|
2752
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "country-list"
|
|
2751
2753
|
}, filteredCountries.length > 0 ? filteredCountries.map(function (c) {
|
|
2752
2754
|
return /*#__PURE__*/React.createElement("div", {
|
|
2753
2755
|
key: c.code,
|
|
2754
2756
|
onClick: function onClick() {
|
|
2755
2757
|
return handleSelectCountry(c);
|
|
2756
2758
|
},
|
|
2757
|
-
className: _JSXStyle.dynamic([["
|
|
2759
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "dropdown-item"
|
|
2758
2760
|
}, /*#__PURE__*/React.createElement("span", {
|
|
2759
2761
|
style: {
|
|
2760
2762
|
display: 'flex',
|
|
2761
2763
|
alignItems: 'center',
|
|
2762
2764
|
gap: 5
|
|
2763
2765
|
},
|
|
2764
|
-
className: _JSXStyle.dynamic([["
|
|
2766
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]])
|
|
2765
2767
|
}, /*#__PURE__*/React.createElement("img", {
|
|
2766
2768
|
loading: "lazy",
|
|
2767
2769
|
width: "23",
|
|
@@ -2769,20 +2771,21 @@ function PhoneInput(_ref) {
|
|
|
2769
2771
|
src: "https://flagcdn.com/w20/".concat(c.code.toLowerCase(), ".png"),
|
|
2770
2772
|
srcSet: "https://flagcdn.com/w40/".concat(c.code.toLowerCase(), ".png 2x"),
|
|
2771
2773
|
alt: "".concat(c.label, " Flag"),
|
|
2772
|
-
className: _JSXStyle.dynamic([["
|
|
2774
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]])
|
|
2773
2775
|
}), c.phone, " ", /*#__PURE__*/React.createElement("span", {
|
|
2774
2776
|
style: {
|
|
2775
2777
|
color: 'grey'
|
|
2776
2778
|
},
|
|
2777
|
-
className: _JSXStyle.dynamic([["
|
|
2779
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]])
|
|
2778
2780
|
}, c.label)));
|
|
2779
2781
|
}) : /*#__PURE__*/React.createElement("div", {
|
|
2780
|
-
className: _JSXStyle.dynamic([["
|
|
2782
|
+
className: _JSXStyle.dynamic([["2480261071", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']]]) + " " + "dropdown-item disabled"
|
|
2781
2783
|
}, "No results"))), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
2782
|
-
id: "
|
|
2783
|
-
dynamic: [SCALES.width(1, defaultWidth), SCALES.
|
|
2784
|
-
}, ".
|
|
2784
|
+
id: "2480261071",
|
|
2785
|
+
dynamic: [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0), hoverBorder, borderColor, SCALES.width(1, defaultWidth), borderColor, SCALES.width(1, defaultWidth), theme$1.type == 'dark' ? 'black' : 'white', borderColor, borderColor, theme$1.type == 'dark' ? '#3a3d3d' : '#efefef']
|
|
2786
|
+
}, ".with-label.__jsx-style-dynamic-selector{position:relative;display:inline-block;box-sizing:border-box;-webkit-box-align:center;--input-height:".concat(SCALES.height(2.25), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, defaultWidth), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}.phone-input-container.focused.__jsx-style-dynamic-selector{outline:1px solid ").concat(hoverBorder, ";border-radius:6px;}.input-wrapper.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px solid ").concat(borderColor, ";width:").concat(SCALES.width(1, defaultWidth), ";height:var(--input-height);border-radius:6px;overflow:hidden;}.dropdown-toggle.__jsx-style-dynamic-selector{padding:7px 12px;border-radius:6px 0px 0px 6px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:14px;border-right:1px solid ").concat(borderColor, ";}.phone-input.__jsx-style-dynamic-selector{width:100%;min-width:0;padding:5px 10px;background-color:transparent;font-size:14px;border:none;}.phone-input.__jsx-style-dynamic-selector:focus{outline:none;}.dropdown.__jsx-style-dynamic-selector{position:absolute;top:100%;left:0;width:").concat(SCALES.width(1, defaultWidth), ";background:").concat(theme$1.type == 'dark' ? 'black' : 'white', ";border:1px solid ").concat(borderColor, ";border-radius:6px;margin-top:4px;z-index:999;box-shadow:0 4px 10px rgba(0,0,0,0.1);}.search-input.__jsx-style-dynamic-selector{width:100%;padding:8px 10px;border:none;background-color:transparent;border-bottom:1px solid ").concat(borderColor, ";font-size:14px;}.search-input.__jsx-style-dynamic-selector:focus{outline:none;}.country-list.__jsx-style-dynamic-selector{max-height:200px;overflow-y:auto;}.dropdown-item.__jsx-style-dynamic-selector{padding:10px;cursor:pointer;font-size:14px;}.dropdown-item.__jsx-style-dynamic-selector:hover{background:").concat(theme$1.type == 'dark' ? '#3a3d3d' : '#efefef', ";}.dropdown-item.disabled.__jsx-style-dynamic-selector{color:#888;cursor:default;}")));
|
|
2785
2787
|
}
|
|
2788
|
+
var PhoneInput$1 = withScale(PhoneInput);
|
|
2786
2789
|
|
|
2787
2790
|
/**
|
|
2788
2791
|
* Escape regex char
|
|
@@ -3170,7 +3173,7 @@ var repositionCursor = function repositionCursor(_ref) {
|
|
|
3170
3173
|
};
|
|
3171
3174
|
};
|
|
3172
3175
|
|
|
3173
|
-
var _excluded = ["allowDecimals", "allowNegativeValue", "id", "name", "className", "customInput", "decimalsLimit", "defaultValue", "disabled", "maxLength", "value", "onValueChange", "fixedDecimalLength", "placeholder", "decimalScale", "prefix", "suffix", "intlConfig", "step", "min", "max", "disableGroupSeparators", "disableAbbreviations", "decimalSeparator", "groupSeparator", "onChange", "onFocus", "onBlur", "onKeyDown", "onKeyUp", "transformRawValue", "formatValueOnBlur", "children"];
|
|
3176
|
+
var _excluded = ["allowDecimals", "allowNegativeValue", "id", "name", "className", "customInput", "decimalsLimit", "defaultValue", "disabled", "maxLength", "value", "onValueChange", "fixedDecimalLength", "placeholder", "decimalScale", "prefix", "suffix", "intlConfig", "fullWidth", "step", "min", "max", "disableGroupSeparators", "disableAbbreviations", "decimalSeparator", "groupSeparator", "onChange", "onFocus", "onBlur", "onKeyDown", "onKeyUp", "transformRawValue", "formatValueOnBlur", "children"];
|
|
3174
3177
|
var InputCurrency = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
3175
3178
|
var _ref$allowDecimals = _ref.allowDecimals,
|
|
3176
3179
|
allowDecimals = _ref$allowDecimals === void 0 ? true : _ref$allowDecimals,
|
|
@@ -3193,6 +3196,7 @@ var InputCurrency = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3193
3196
|
prefix = _ref.prefix,
|
|
3194
3197
|
suffix = _ref.suffix,
|
|
3195
3198
|
intlConfig = _ref.intlConfig,
|
|
3199
|
+
fullWidth = _ref.fullWidth,
|
|
3196
3200
|
step = _ref.step,
|
|
3197
3201
|
min = _ref.min,
|
|
3198
3202
|
max = _ref.max,
|
|
@@ -3212,7 +3216,10 @@ var InputCurrency = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3212
3216
|
formatValueOnBlur = _ref$formatValueOnBlu === void 0 ? true : _ref$formatValueOnBlu,
|
|
3213
3217
|
children = _ref.children,
|
|
3214
3218
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
3219
|
+
var _useScale = useScale(),
|
|
3220
|
+
SCALES = _useScale.SCALES;
|
|
3215
3221
|
var theme$1 = theme.useTheme();
|
|
3222
|
+
var defaultWidth = fullWidth ? '100%' : 'initial';
|
|
3216
3223
|
if (_decimalSeparator && isNumber(_decimalSeparator)) {
|
|
3217
3224
|
throw new Error('decimalSeparator cannot be a number');
|
|
3218
3225
|
}
|
|
@@ -3480,14 +3487,9 @@ var InputCurrency = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3480
3487
|
var CustomInput = customInput;
|
|
3481
3488
|
return /*#__PURE__*/React.createElement(CustomInput, inputProps);
|
|
3482
3489
|
}
|
|
3483
|
-
return /*#__PURE__*/React.createElement("div",
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
marginBottom: '0.7rem',
|
|
3487
|
-
fontSize: '14px',
|
|
3488
|
-
fontWeight: 'light'
|
|
3489
|
-
}
|
|
3490
|
-
}, children), /*#__PURE__*/React.createElement("input", _extends({}, inputProps, {
|
|
3490
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
3491
|
+
className: _JSXStyle.dynamic([["1592876518", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + "with-label"
|
|
3492
|
+
}, children && /*#__PURE__*/React.createElement(InputBlockLabel, null, children), /*#__PURE__*/React.createElement("input", _extends({}, inputProps, {
|
|
3491
3493
|
style: {
|
|
3492
3494
|
textAlign: 'right',
|
|
3493
3495
|
border: "1px solid ".concat(theme$1.palette.border),
|
|
@@ -3499,15 +3501,23 @@ var InputCurrency = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3499
3501
|
width: 'auto',
|
|
3500
3502
|
background: 'transparent',
|
|
3501
3503
|
minWidth: '200px'
|
|
3502
|
-
}
|
|
3503
|
-
|
|
3504
|
+
},
|
|
3505
|
+
className: _JSXStyle.dynamic([["1592876518", [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]]]) + " " + (inputProps && inputProps.className != null && inputProps.className || "")
|
|
3506
|
+
})), /*#__PURE__*/React.createElement(_JSXStyle, {
|
|
3507
|
+
id: "1592876518",
|
|
3508
|
+
dynamic: [SCALES.height(2.25), SCALES.font(0.875), SCALES.width(1, defaultWidth), SCALES.pt(0), SCALES.pr(0), SCALES.pb(0), SCALES.pl(0), SCALES.mt(0), SCALES.mr(0), SCALES.mb(0), SCALES.ml(0)]
|
|
3509
|
+
}, ".with-label.__jsx-style-dynamic-selector{position:relative;display:inline-block;box-sizing:border-box;-webkit-box-align:center;--input-height:".concat(SCALES.height(2.25), ";font-size:").concat(SCALES.font(0.875), ";width:").concat(SCALES.width(1, defaultWidth), ";padding:").concat(SCALES.pt(0), " ").concat(SCALES.pr(0), " ").concat(SCALES.pb(0), " ").concat(SCALES.pl(0), ";margin:").concat(SCALES.mt(0), " ").concat(SCALES.mr(0), " ").concat(SCALES.mb(0), " ").concat(SCALES.ml(0), ";}")));
|
|
3504
3510
|
});
|
|
3505
3511
|
|
|
3512
|
+
// CurrencyInput.displayName = 'CurrencyInput';
|
|
3513
|
+
|
|
3514
|
+
var CurrencyInput = withScale(InputCurrency);
|
|
3515
|
+
|
|
3506
3516
|
/* "use client" */
|
|
3507
3517
|
Input.Textarea = Textarea;
|
|
3508
3518
|
Input.Password = InputPassword;
|
|
3509
|
-
Input.Phone = PhoneInput;
|
|
3510
|
-
Input.Currency =
|
|
3519
|
+
Input.Phone = PhoneInput$1;
|
|
3520
|
+
Input.Currency = CurrencyInput;
|
|
3511
3521
|
|
|
3512
3522
|
exports.default = Input;
|
|
3513
3523
|
exports.getColors = getColors;
|
|
@@ -9,5 +9,37 @@ type PhoneInputProps = {
|
|
|
9
9
|
placeholder?: string;
|
|
10
10
|
color?: InputTypes;
|
|
11
11
|
};
|
|
12
|
-
declare
|
|
13
|
-
|
|
12
|
+
declare const _default: React.ForwardRefExoticComponent<PhoneInputProps & {
|
|
13
|
+
width?: string | number;
|
|
14
|
+
height?: string | number;
|
|
15
|
+
padding?: string | number;
|
|
16
|
+
margin?: string | number;
|
|
17
|
+
w?: string | number;
|
|
18
|
+
h?: string | number;
|
|
19
|
+
paddingLeft?: string | number;
|
|
20
|
+
paddingRight?: string | number;
|
|
21
|
+
paddingTop?: string | number;
|
|
22
|
+
paddingBottom?: string | number;
|
|
23
|
+
pl?: string | number;
|
|
24
|
+
pr?: string | number;
|
|
25
|
+
pt?: string | number;
|
|
26
|
+
pb?: string | number;
|
|
27
|
+
marginLeft?: string | number;
|
|
28
|
+
marginRight?: string | number;
|
|
29
|
+
marginTop?: string | number;
|
|
30
|
+
marginBottom?: string | number;
|
|
31
|
+
ml?: string | number;
|
|
32
|
+
mr?: string | number;
|
|
33
|
+
mt?: string | number;
|
|
34
|
+
mb?: string | number;
|
|
35
|
+
px?: string | number;
|
|
36
|
+
py?: string | number;
|
|
37
|
+
mx?: string | number;
|
|
38
|
+
my?: string | number;
|
|
39
|
+
font?: string | number;
|
|
40
|
+
unit?: string;
|
|
41
|
+
scale?: number;
|
|
42
|
+
children?: any;
|
|
43
|
+
className?: string;
|
|
44
|
+
} & React.InputHTMLAttributes<any> & React.RefAttributes<unknown>>;
|
|
45
|
+
export default _default;
|