@laser-ui/components 2.3.4 → 2.3.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/CHANGELOG.md +6 -0
- package/cascader/Cascader.js +2 -4
- package/checkbox/Checkbox.js +4 -1
- package/date-picker/DatePicker.js +5 -1
- package/input/Input.js +4 -1
- package/input/InputNumber.js +4 -1
- package/package.json +2 -2
- package/radio/Radio.js +4 -1
- package/select/Select.js +2 -4
- package/slider/Slider.js +45 -39
- package/switch/Switch.js +4 -1
- package/time-picker/TimePicker.js +5 -1
- package/tree-select/TreeSelect.js +2 -4
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
4
4
|
|
|
5
|
+
## [2.3.5](https://github.com/laser-ui/laser-ui/compare/v2.3.4...v2.3.5) (2026-03-16)
|
|
6
|
+
|
|
7
|
+
### Bug Fixes
|
|
8
|
+
|
|
9
|
+
- **components:** fix pass class or style to `inputProps` ([1f7a6ba](https://github.com/laser-ui/laser-ui/commit/1f7a6ba7524742cb7095b2f335a87f91434203a0))
|
|
10
|
+
|
|
5
11
|
## [2.3.4](https://github.com/laser-ui/laser-ui/compare/v2.3.3...v2.3.4) (2026-03-06)
|
|
6
12
|
|
|
7
13
|
### Bug Fixes
|
package/cascader/Cascader.js
CHANGED
|
@@ -281,10 +281,8 @@ export function Cascader(props) {
|
|
|
281
281
|
changeVisible((draft) => (searchable ? true : !draft));
|
|
282
282
|
}, children: [_jsxs("div", Object.assign({}, styled('cascader__container'), { title: selectedLabel, children: [(() => {
|
|
283
283
|
const nodeProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, inputProps), mergeCS(styled('cascader__search'), {
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
zIndex: inputable ? undefined : -1,
|
|
287
|
-
},
|
|
284
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
285
|
+
style: Object.assign(Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps.style), { opacity: inputable ? undefined : 0, zIndex: inputable ? undefined : -1 }),
|
|
288
286
|
})), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria), { ref: (instance) => {
|
|
289
287
|
inputRef.current = instance;
|
|
290
288
|
const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
|
package/checkbox/Checkbox.js
CHANGED
|
@@ -17,7 +17,10 @@ export const Checkbox = (props) => {
|
|
|
17
17
|
}), {
|
|
18
18
|
className: restProps.className,
|
|
19
19
|
style: restProps.style,
|
|
20
|
-
}), { children: [_jsxs("div", Object.assign({}, styled('checkbox__state-container'), { children: [_jsx("input", Object.assign({}, inputProps, styled('checkbox__input'),
|
|
20
|
+
}), { children: [_jsxs("div", Object.assign({}, styled('checkbox__state-container'), { children: [_jsx("input", Object.assign({}, inputProps, mergeCS(styled('checkbox__input'), {
|
|
21
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
22
|
+
style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
|
|
23
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "checkbox", disabled: disabled, "aria-checked": indeterminate ? 'mixed' : checked, onChange: () => {
|
|
21
24
|
changeChecked((draft) => !draft);
|
|
22
25
|
} })), indeterminate ? _jsx("div", Object.assign({}, styled('checkbox__indeterminate'))) : checked && _jsx("div", Object.assign({}, styled('checkbox__tick')))] })), checkNodeExist(children) && _jsx("div", Object.assign({}, styled('checkbox__label'), { children: children }))] })));
|
|
23
26
|
};
|
|
@@ -191,10 +191,14 @@ export function DatePicker(props) {
|
|
|
191
191
|
};
|
|
192
192
|
const clearable = clearableProp && !isNull(_value) && !visible && !disabled;
|
|
193
193
|
const inputNode = (isLeft) => {
|
|
194
|
+
var _a, _b;
|
|
194
195
|
const index = isLeft ? 0 : 1;
|
|
195
196
|
const value = isLeft ? valueLeft : valueRight;
|
|
196
197
|
const inputRef = isLeft ? inputLeftRef : inputRightRef;
|
|
197
|
-
return (_jsx(BaseInput, Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], styled('date-picker__input'),
|
|
198
|
+
return (_jsx(BaseInput, Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], mergeCS(styled('date-picker__input'), {
|
|
199
|
+
className: (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.className,
|
|
200
|
+
style: (_b = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _b === void 0 ? void 0 : _b.style,
|
|
201
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
|
|
198
202
|
var _a;
|
|
199
203
|
inputRef.current = instance;
|
|
200
204
|
const ret = setRef((_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.ref, instance);
|
package/input/Input.js
CHANGED
|
@@ -42,7 +42,10 @@ export const Input = (props) => {
|
|
|
42
42
|
var _a, _b;
|
|
43
43
|
(_a = restProps.onClick) === null || _a === void 0 ? void 0 : _a.call(restProps, e);
|
|
44
44
|
(_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.focus({ preventScroll: true });
|
|
45
|
-
}, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, styled('input__input'),
|
|
45
|
+
}, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, mergeCS(styled('input__input'), {
|
|
46
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
47
|
+
style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
|
|
48
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
|
|
46
49
|
inputRef.current = instance;
|
|
47
50
|
const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
|
|
48
51
|
return () => {
|
package/input/InputNumber.js
CHANGED
|
@@ -85,7 +85,10 @@ export function InputNumber(props) {
|
|
|
85
85
|
var _a, _b;
|
|
86
86
|
(_a = restProps.onClick) === null || _a === void 0 ? void 0 : _a.call(restProps, e);
|
|
87
87
|
(_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.focus({ preventScroll: true });
|
|
88
|
-
}, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, styled('input__input'),
|
|
88
|
+
}, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, mergeCS(styled('input__input'), {
|
|
89
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
90
|
+
style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
|
|
91
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
|
|
89
92
|
inputRef.current = instance;
|
|
90
93
|
const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
|
|
91
94
|
return () => {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@laser-ui/components",
|
|
3
|
-
"version": "2.3.
|
|
3
|
+
"version": "2.3.5",
|
|
4
4
|
"description": "React components.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ui",
|
|
@@ -37,5 +37,5 @@
|
|
|
37
37
|
"access": "public",
|
|
38
38
|
"directory": "../../dist/libs/components"
|
|
39
39
|
},
|
|
40
|
-
"gitHead": "
|
|
40
|
+
"gitHead": "e51fff3eacbe15668fbce67291124b3bb36d19c3"
|
|
41
41
|
}
|
package/radio/Radio.js
CHANGED
|
@@ -36,7 +36,10 @@ export const Radio = (props) => {
|
|
|
36
36
|
return () => {
|
|
37
37
|
waveRef.current = null;
|
|
38
38
|
};
|
|
39
|
-
}, color: `var(--${namespace}-color-primary)` }), _jsx("div", Object.assign({}, styled('radio__input-wrapper'), { children: _jsx("input", Object.assign({}, inputProps, styled('radio__input'),
|
|
39
|
+
}, color: `var(--${namespace}-color-primary)` }), _jsx("div", Object.assign({}, styled('radio__input-wrapper'), { children: _jsx("input", Object.assign({}, inputProps, mergeCS(styled('radio__input'), {
|
|
40
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
41
|
+
style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
|
|
42
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "radio", checked: checked, disabled: disabled, "aria-checked": checked, onChange: () => {
|
|
40
43
|
changeChecked(true);
|
|
41
44
|
} })) })), checkNodeExist(children) && _jsx("div", Object.assign({}, styled('radio__label'), { children: children }))] })));
|
|
42
45
|
};
|
package/select/Select.js
CHANGED
|
@@ -290,10 +290,8 @@ export function Select(props) {
|
|
|
290
290
|
changeVisible((draft) => (searchable ? true : !draft));
|
|
291
291
|
}, children: [_jsxs("div", Object.assign({}, styled('select__container'), { title: selectedLabel, children: [(() => {
|
|
292
292
|
const nodeProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, inputProps), mergeCS(styled('select__search'), {
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
zIndex: inputable ? undefined : -1,
|
|
296
|
-
},
|
|
293
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
294
|
+
style: Object.assign(Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps.style), { opacity: inputable ? undefined : 0, zIndex: inputable ? undefined : -1 }),
|
|
297
295
|
})), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria), { ref: (instance) => {
|
|
298
296
|
inputRef.current = instance;
|
|
299
297
|
const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
|
package/slider/Slider.js
CHANGED
|
@@ -248,46 +248,52 @@ export function Slider(props) {
|
|
|
248
248
|
};
|
|
249
249
|
}, visible: isLeft ? visibleLeft : visibleRight, title: customTooltip ? customTooltip(value) : value, placement: vertical ? 'right' : 'top', onVisibleChange: (visible) => {
|
|
250
250
|
setDotVisible(visible ? (isLeft ? 'left' : 'right') : null);
|
|
251
|
-
}, children: (tooltipProps) =>
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
dotRef.current =
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
251
|
+
}, children: (tooltipProps) => {
|
|
252
|
+
var _a, _b;
|
|
253
|
+
return (_jsx("div", Object.assign({}, mergeCS(styled('slider__input-wrapper'), {
|
|
254
|
+
style: {
|
|
255
|
+
left: vertical ? undefined : `calc(${value} / ${max - min} * 100% - 7px)`,
|
|
256
|
+
bottom: vertical ? `calc(${value} / ${max - min} * 100% - 7px)` : undefined,
|
|
257
|
+
},
|
|
258
|
+
}), { ref: (instance) => {
|
|
259
|
+
const dotRef = isLeft ? dotLeftRef : dotRightRef;
|
|
260
|
+
dotRef.current = instance;
|
|
261
|
+
return () => {
|
|
262
|
+
dotRef.current = null;
|
|
263
|
+
};
|
|
264
|
+
} }, tooltipProps, { children: _jsx("input", Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], mergeCS(styled('slider__input'), {
|
|
265
|
+
className: (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.className,
|
|
266
|
+
style: (_b = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _b === void 0 ? void 0 : _b.style,
|
|
267
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "range", value: value, max: max, min: min, step: step !== null && step !== void 0 ? step : undefined, disabled: disabled, "aria-orientation": vertical ? 'vertical' : 'horizontal', onChange: (e) => {
|
|
268
|
+
const val = toNumber(e.currentTarget.value);
|
|
269
|
+
if (range) {
|
|
270
|
+
const index = isLeft ? 0 : 1;
|
|
271
|
+
changeValue((draft) => {
|
|
272
|
+
const offset = val - draft[index];
|
|
273
|
+
const isAdd = offset > 0;
|
|
274
|
+
draft[index] = val;
|
|
275
|
+
if (isNumber(rangeMinDistance) && draft[1] - draft[0] < rangeMinDistance) {
|
|
276
|
+
const _index = isLeft ? 1 : 0;
|
|
277
|
+
draft[_index] = getValue(draft[_index] + offset, isAdd ? 'ceil' : 'floor');
|
|
278
|
+
if (draft[1] - draft[0] < rangeMinDistance) {
|
|
279
|
+
draft[index] = getValue(draft[_index] + (isAdd ? -rangeMinDistance : rangeMinDistance), isAdd ? 'floor' : 'ceil');
|
|
280
|
+
}
|
|
275
281
|
}
|
|
276
|
-
}
|
|
277
|
-
}
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
}
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
282
|
+
});
|
|
283
|
+
}
|
|
284
|
+
else {
|
|
285
|
+
changeValue(val);
|
|
286
|
+
}
|
|
287
|
+
}, onFocus: (e) => {
|
|
288
|
+
var _a, _b;
|
|
289
|
+
(_b = (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.onFocus) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
|
290
|
+
setDotFocused(isLeft ? 'left' : 'right');
|
|
291
|
+
}, onBlur: (e) => {
|
|
292
|
+
var _a, _b;
|
|
293
|
+
(_b = (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.onBlur) === null || _b === void 0 ? void 0 : _b.call(_a, e);
|
|
294
|
+
setDotFocused(null);
|
|
295
|
+
} })) })));
|
|
296
|
+
} }));
|
|
291
297
|
};
|
|
292
298
|
const preventBlur = (e) => {
|
|
293
299
|
if (e.button === 0) {
|
package/switch/Switch.js
CHANGED
|
@@ -26,7 +26,10 @@ export function Switch(props) {
|
|
|
26
26
|
style: { opacity: checked ? 1 : 0 },
|
|
27
27
|
}), { children: stateContent[0] }))), checkNodeExist(stateContent[1]) && (_jsx("div", Object.assign({}, mergeCS(styled('switch__state-content'), {
|
|
28
28
|
style: { opacity: checked ? 0 : 1 },
|
|
29
|
-
}), { children: stateContent[1] })))] })), _jsx("input", Object.assign({}, inputProps, styled('switch__input'),
|
|
29
|
+
}), { children: stateContent[1] })))] })), _jsx("input", Object.assign({}, inputProps, mergeCS(styled('switch__input'), {
|
|
30
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
31
|
+
style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
|
|
32
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "checkbox", disabled: disabled, role: "switch", "aria-checked": checked, onChange: () => {
|
|
30
33
|
changeChecked((draft) => !draft);
|
|
31
34
|
} })), _jsx(Transition, { enter: checked, name: `${namespace}-switch`, duration: TTANSITION_DURING, onSkipEnter: (el) => {
|
|
32
35
|
if (el) {
|
|
@@ -179,10 +179,14 @@ export function TimePicker(props) {
|
|
|
179
179
|
};
|
|
180
180
|
const clearable = clearableProp && !isNull(_value) && !visible && !disabled;
|
|
181
181
|
const inputNode = (isLeft) => {
|
|
182
|
+
var _a, _b;
|
|
182
183
|
const index = isLeft ? 0 : 1;
|
|
183
184
|
const value = isLeft ? valueLeft : valueRight;
|
|
184
185
|
const inputRef = isLeft ? inputLeftRef : inputRightRef;
|
|
185
|
-
return (_jsx(BaseInput, Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], styled('time-picker__input'),
|
|
186
|
+
return (_jsx(BaseInput, Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], mergeCS(styled('time-picker__input'), {
|
|
187
|
+
className: (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.className,
|
|
188
|
+
style: (_b = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _b === void 0 ? void 0 : _b.style,
|
|
189
|
+
}), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
|
|
186
190
|
var _a;
|
|
187
191
|
inputRef.current = instance;
|
|
188
192
|
const ret = setRef((_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.ref, instance);
|
|
@@ -301,10 +301,8 @@ export function TreeSelect(props) {
|
|
|
301
301
|
changeVisible((draft) => (searchable ? true : !draft));
|
|
302
302
|
}, children: [_jsxs("div", Object.assign({}, styled('tree-select__container'), { title: selectedLabel, children: [(() => {
|
|
303
303
|
const nodeProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, inputProps), mergeCS(styled('tree-select__search'), {
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
zIndex: inputable ? undefined : -1,
|
|
307
|
-
},
|
|
304
|
+
className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
|
|
305
|
+
style: Object.assign(Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps.style), { opacity: inputable ? undefined : 0, zIndex: inputable ? undefined : -1 }),
|
|
308
306
|
})), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria), { ref: (instance) => {
|
|
309
307
|
inputRef.current = instance;
|
|
310
308
|
const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
|