@ballistix.digital/react-components 4.4.0 → 4.4.2
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/index.d.ts +1 -0
- package/dist/index.esm.js +5 -3
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +5 -3
- package/dist/index.js.map +1 -1
- package/dist/lib/tsconfig.tsbuildinfo +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -786,10 +786,12 @@ var InputGroupForm = function (props) {
|
|
|
786
786
|
var _b;
|
|
787
787
|
var name = props.name, _c = props.htmlType, htmlType = _c === void 0 ? 'text' : _c, label = props.label, description = props.description, placeholder = props.placeholder, leading = props.leading, trailing = props.trailing, required = props.required, value = props.value, mask$1 = props.mask, min = props.min, max = props.max, maxLength = props.maxLength, rows = props.rows, error = props.error, _d = props.type, type = _d === void 0 ? 'normal' : _d, isDisabled = props.isDisabled, _e = props.isRequired, isRequired = _e === void 0 ? false : _e, _f = props.isTouched, isTouched = _f === void 0 ? false : _f, _g = props.isSolo, isSolo = _g === void 0 ? false : _g, onChange = props.onChange, onClear = props.onClear, onBlur = props.onBlur, onClick = props.onClick, onKeyDown = props.onKeyDown, setRefOnLoad = props.setRefOnLoad, stylesOverrides = props.styles;
|
|
788
788
|
var isValid = error === undefined;
|
|
789
|
-
var
|
|
789
|
+
var maskRef = mask.useMask({
|
|
790
790
|
mask: mask$1 === null || mask$1 === void 0 ? void 0 : mask$1.mask,
|
|
791
791
|
replacement: (_a = {}, _a[(_b = mask$1 === null || mask$1 === void 0 ? void 0 : mask$1.replacementCharacter) !== null && _b !== void 0 ? _b : 'X'] = /\d|\D/, _a),
|
|
792
792
|
});
|
|
793
|
+
var defaultRef = React.useRef(null);
|
|
794
|
+
var ref = mask$1 ? maskRef : defaultRef;
|
|
793
795
|
var handleGenerateStyle = function () {
|
|
794
796
|
var result = deepCopyObject(styles$p.base);
|
|
795
797
|
var keys = calculateNestedKeys(styles$p.base);
|
|
@@ -808,7 +810,7 @@ var InputGroupForm = function (props) {
|
|
|
808
810
|
setRefOnLoad(ref);
|
|
809
811
|
}, [ref, setRefOnLoad]);
|
|
810
812
|
return (jsxRuntime.jsxs("div", { className: styles.container, children: [jsxRuntime.jsxs("div", { className: styles.head, children: [label && (jsxRuntime.jsx("label", { htmlFor: name, className: styles.label, children: label })), !required && !isRequired && typeof label === 'string' && (jsxRuntime.jsx("span", { className: styles.hint, children: "Optional" })), required && required({ isRequired: isRequired })] }), jsxRuntime.jsxs("div", { className: styles.body, children: [leading && jsxRuntime.jsx("div", { className: styles.leading, children: leading }), !htmlType ||
|
|
811
|
-
(htmlType !== 'area' && (jsxRuntime.jsxs("div", { className: "flex items-center", children: [jsxRuntime.jsx("input", { type: mask$1 !== undefined ? 'text' : htmlType, ref:
|
|
813
|
+
(htmlType !== 'area' && (jsxRuntime.jsxs("div", { className: "flex items-center", children: [jsxRuntime.jsx("input", { type: mask$1 !== undefined ? 'text' : htmlType, ref: ref, name: name, id: name, "data-cy": inputDataCy, className: toClassName(styles.input, htmlType === 'color' && '!h-10'), placeholder: placeholder, defaultValue: isSolo ? value : undefined, value: isSolo ? undefined : value, min: min, max: max, maxLength: maxLength, disabled: isDisabled, onChange: onChange, onBlur: onBlur, onClick: onClick, onKeyDown: onKeyDown }), htmlType === 'text' && isClearable && (jsxRuntime.jsx("div", { className: "right-5 px-2 absolute cursor-pointer hover:opacity-60", onClick: onClear, children: jsxRuntime.jsx(IconElement, { accessor: "times", className: "text-gray-500" }) })), htmlType === 'date' && isClearable && (jsxRuntime.jsx("div", { className: "right-10 px-2 absolute cursor-pointer hover:opacity-60", onClick: onClear, children: jsxRuntime.jsx(IconElement, { accessor: "times", className: "text-gray-500" }) }))] }))), htmlType === 'area' && (jsxRuntime.jsx("textarea", { rows: rows, name: name, id: name, "data-cy": inputDataCy, className: styles.input, placeholder: placeholder, defaultValue: isSolo ? value : undefined, value: isSolo ? undefined : value, maxLength: maxLength, disabled: isDisabled, onChange: onChange, onBlur: onBlur, onClick: onClick, onKeyDown: onKeyDown })), type === 'floored' && (jsxRuntime.jsx("div", { className: "absolute inset-x-0 bottom-0 border-t border-gray-300 peer-focus:border-t-2 peer-focus:border-primary-600", "aria-hidden": "true" })), trailing && isValid && (jsxRuntime.jsx("div", { className: styles.trailing, children: trailing })), isTouched && !isValid && (jsxRuntime.jsx("div", { className: styles.trailing, children: invalidIcon }))] }), jsxRuntime.jsxs("div", { className: styles.foot, children: [description && !(error && isTouched) && (jsxRuntime.jsx("p", { className: styles.description, children: description })), error && isTouched && (jsxRuntime.jsx("p", { className: styles.error, "data-cy": errorDataCy, children: error }))] })] }));
|
|
812
814
|
};
|
|
813
815
|
|
|
814
816
|
var base$m = {
|
|
@@ -7252,7 +7254,7 @@ var md = {
|
|
|
7252
7254
|
};
|
|
7253
7255
|
var sm = {
|
|
7254
7256
|
switch: { base: 'h-5' },
|
|
7255
|
-
toggle: { base: 'h-4 w-4' },
|
|
7257
|
+
toggle: { base: 'h-4 w-4', checked: 'translate-x-6' },
|
|
7256
7258
|
};
|
|
7257
7259
|
var styles$4 = {
|
|
7258
7260
|
base: base$3,
|