@seeqdev/qomponents 0.0.84 → 0.0.86
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/TextField/TextField.types.d.ts +6 -0
- package/dist/index.esm.js +23 -7
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +23 -7
- package/dist/index.js.map +1 -1
- package/dist/utils/validateStyleDimension.d.ts +2 -0
- package/dist/utils/validateStyleDimension.js +14 -0
- package/dist/utils/validateStyleDimension.js.map +1 -0
- package/dist/utils/validateStyleDimension.test.d.ts +1 -0
- package/dist/utils/validateStyleDimension.test.js +20 -0
- package/dist/utils/validateStyleDimension.test.js.map +1 -0
- package/package.json +1 -1
- package/dist/utils/svg.js +0 -20
- package/dist/utils/svg.js.map +0 -1
package/dist/index.esm.js
CHANGED
|
@@ -4651,6 +4651,20 @@ const ToolbarButton = ({ isSmall = false, label, icon, secondIcon, forceSmallIco
|
|
|
4651
4651
|
popoverContent))) : undefined));
|
|
4652
4652
|
};
|
|
4653
4653
|
|
|
4654
|
+
const setValidInputDimension = (width, height) => {
|
|
4655
|
+
let inputStyle;
|
|
4656
|
+
if (typeof width === 'number' && width > 0) {
|
|
4657
|
+
inputStyle = {
|
|
4658
|
+
width: `${width}px`,
|
|
4659
|
+
};
|
|
4660
|
+
}
|
|
4661
|
+
if (typeof height === 'number' && height > 0) {
|
|
4662
|
+
inputStyle = inputStyle || {};
|
|
4663
|
+
inputStyle['height'] = `${height}px`;
|
|
4664
|
+
}
|
|
4665
|
+
return inputStyle;
|
|
4666
|
+
};
|
|
4667
|
+
|
|
4654
4668
|
const errorClasses$2 = 'tw-border-sq-danger-color';
|
|
4655
4669
|
const borderColorClasses$2 = [
|
|
4656
4670
|
'tw-border-sq-disabled-gray',
|
|
@@ -4674,7 +4688,7 @@ const sizeClasses = {
|
|
|
4674
4688
|
* Textfield.
|
|
4675
4689
|
*/
|
|
4676
4690
|
const TextField = React__default.forwardRef((props, ref) => {
|
|
4677
|
-
const { readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, required = false, autoComplete = 'off' } = props;
|
|
4691
|
+
const { readonly = false, onChange, onKeyUp, onFocus, onBlur, onKeyDown, id, name, size = 'sm', value, placeholder, extraClassNames, testId, type = 'text', inputGroup, step, showError, errorText, required = false, autoComplete = 'off', inputWidth = undefined, inputHeight = undefined, } = props;
|
|
4678
4692
|
const internalRef = useRef(null);
|
|
4679
4693
|
const [cursor, setCursor] = useState(null);
|
|
4680
4694
|
const setAllRefs = (receivedRef) => {
|
|
@@ -4710,8 +4724,13 @@ const TextField = React__default.forwardRef((props, ref) => {
|
|
|
4710
4724
|
borderRadius = 'tw-rounded-r-sm tw-border-l-0 focus:tw-border-l active:tw-border-l';
|
|
4711
4725
|
}
|
|
4712
4726
|
const appliedClasses = `${baseClasses$3} ${sizeClasses[size]} ${extraClassNames} ${lightTheme$1} ${darkTheme$1} ${borderRadius} ${showError ? errorClasses$2 : borderColorClasses$2} `;
|
|
4713
|
-
|
|
4714
|
-
|
|
4727
|
+
const styleProp = setValidInputDimension(inputWidth, inputHeight)
|
|
4728
|
+
? {
|
|
4729
|
+
style: setValidInputDimension(inputWidth, inputHeight),
|
|
4730
|
+
}
|
|
4731
|
+
: {};
|
|
4732
|
+
return (React__default.createElement(React__default.Fragment, null,
|
|
4733
|
+
React__default.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, ...styleProp }),
|
|
4715
4734
|
errorText && showError && React__default.createElement("div", { className: "tw-text-sq-danger-color tw-text-xs tw-mt-1" }, errorText)));
|
|
4716
4735
|
});
|
|
4717
4736
|
|
|
@@ -6557,9 +6576,6 @@ const QTip = () => {
|
|
|
6557
6576
|
const ttTimeout = useRef();
|
|
6558
6577
|
const onMouseMove = (e) => {
|
|
6559
6578
|
clearTimeout(ttTimeout.current);
|
|
6560
|
-
if (!(e.target instanceof HTMLElement)) {
|
|
6561
|
-
return;
|
|
6562
|
-
}
|
|
6563
6579
|
tooltipTarget.current = e.target;
|
|
6564
6580
|
let dataset = e.target?.dataset;
|
|
6565
6581
|
let text = dataset?.qtipText;
|
|
@@ -6570,7 +6586,7 @@ const QTip = () => {
|
|
|
6570
6586
|
dataset = currentTooltipTarget?.dataset;
|
|
6571
6587
|
text = dataset?.qtipText;
|
|
6572
6588
|
if (!text || text === '') {
|
|
6573
|
-
currentTooltipTarget = e.target?.parentElement?.parentElement;
|
|
6589
|
+
currentTooltipTarget = e.target?.parentElement?.parentElement || null;
|
|
6574
6590
|
dataset = currentTooltipTarget?.dataset;
|
|
6575
6591
|
text = dataset?.qtipText;
|
|
6576
6592
|
}
|