@laser-ui/components 0.1.3 → 0.1.4
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/icon/Icon.js +5 -2
- package/package.json +4 -4
- package/progress/Progress.js +1 -3
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
|
+
## [0.1.4](https://github.com/laser-ui/laser-ui/compare/v0.1.3...v0.1.4) (2023-09-18)
|
|
6
|
+
|
|
7
|
+
### Bug Fixes
|
|
8
|
+
|
|
9
|
+
- **components:** fix `Icon` override style ([fc75aca](https://github.com/laser-ui/laser-ui/commit/fc75acac62f714ff5d8b633ed572331cac82b2cb))
|
|
10
|
+
|
|
5
11
|
## [0.1.3](https://github.com/laser-ui/laser-ui/compare/v0.1.2...v0.1.3) (2023-09-15)
|
|
6
12
|
|
|
7
13
|
### Bug Fixes
|
package/icon/Icon.js
CHANGED
|
@@ -6,13 +6,16 @@ import { CLASSES } from './vars';
|
|
|
6
6
|
import { useComponentProps, useNamespace, useStyled } from '../hooks';
|
|
7
7
|
import { mergeCS } from '../utils';
|
|
8
8
|
export function Icon(props) {
|
|
9
|
-
|
|
9
|
+
var _a, _b;
|
|
10
|
+
const _c = useComponentProps('Icon', props), { children, styleOverrides, styleProvider, size = '1em', theme, rotate, spin, spinSpeed = 1 } = _c, restProps = __rest(_c, ["children", "styleOverrides", "styleProvider", "size", "theme", "rotate", "spin", "spinSpeed"]);
|
|
10
11
|
const namespace = useNamespace();
|
|
11
12
|
const styled = useStyled(CLASSES, { icon: styleProvider === null || styleProvider === void 0 ? void 0 : styleProvider.icon }, styleOverrides);
|
|
12
13
|
const [width, height] = isArray(size) ? size : [size, size];
|
|
13
14
|
return (_jsx("div", Object.assign({}, restProps, mergeCS(styled('icon', { [`icon.t-${theme}`]: theme }), {
|
|
14
15
|
className: restProps.className,
|
|
15
16
|
style: restProps.style,
|
|
16
|
-
}), { children: cloneElement(children, Object.assign(Object.assign({}, children.props), { style: Object.assign(Object.assign({}, children.props.style), { transform: isUndefined(rotate) ?
|
|
17
|
+
}), { children: cloneElement(children, Object.assign(Object.assign({}, children.props), { style: Object.assign(Object.assign({}, children.props.style), { transform: isUndefined(rotate) ? (_a = children.props.style) === null || _a === void 0 ? void 0 : _a.transform : `rotate(${rotate}deg)`, animation: spin
|
|
18
|
+
? `${namespace}-spin ${spinSpeed}${isNumber(spinSpeed) ? 's' : ''} linear infinite`
|
|
19
|
+
: (_b = children.props.style) === null || _b === void 0 ? void 0 : _b.animation }), fill: 'currentColor', width,
|
|
17
20
|
height })) })));
|
|
18
21
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@laser-ui/components",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.4",
|
|
4
4
|
"description": "React components.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ui",
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"module": "./index.js",
|
|
27
27
|
"types": "./index.d.ts",
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@laser-ui/hooks": "0.1.
|
|
30
|
-
"@laser-ui/utils": "0.1.
|
|
29
|
+
"@laser-ui/hooks": "0.1.4",
|
|
30
|
+
"@laser-ui/utils": "0.1.4",
|
|
31
31
|
"@material-design-icons/svg": "^0.14.12",
|
|
32
32
|
"jss": "^10.10.0",
|
|
33
33
|
"jss-preset-default": "^10.10.0",
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"access": "public",
|
|
46
46
|
"directory": "../../dist/libs/components"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "eb0e7cedff3b277b90e724eddc6850c3b623d7b2"
|
|
49
49
|
}
|
package/progress/Progress.js
CHANGED
|
@@ -36,9 +36,7 @@ export function Progress(props) {
|
|
|
36
36
|
const r = 60 - lineWidth / 2;
|
|
37
37
|
const c = 2 * Math.PI * r;
|
|
38
38
|
const dash = c - (pattern === 'circle' ? 0 : (gapDegree / 360) * c);
|
|
39
|
-
return (_jsx(Icon, { size: size, children: _jsxs("svg", Object.assign({},
|
|
40
|
-
style: { transform: pattern === 'circle' ? 'rotate(-90deg)' : `rotate(${90 + gapDegree / 2}deg)` },
|
|
41
|
-
}), { viewBox: "0 0 120 120", children: [linearGradient && (_jsx("defs", { children: _jsxs("linearGradient", { id: `${namespace}-progress-gradient-${uniqueId}-1`, gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { offset: "0%", stopColor: linearGradient[0] }), _jsx("stop", { offset: "100%", stopColor: linearGradient[100] })] }) })), _jsx("circle", { cx: 60, cy: 60, r: r, strokeLinecap: lineCap, strokeWidth: lineWidth, stroke: "var(--background-color)", fill: "none", strokeDasharray: `${dash} ${c}` }), _jsx("circle", { style: { opacity: percent === 0 ? 0 : 1 }, cx: 60, cy: 60, r: r, strokeLinecap: lineCap, strokeWidth: lineWidth, stroke: isUndefined(linearGradient) ? 'var(--color)' : `url(#${namespace}-progress-gradient-${uniqueId}-1)`, fill: "none", strokeDasharray: `${dash * (percent / 100)} ${c}` })] })) }));
|
|
39
|
+
return (_jsx(Icon, { size: size, rotate: pattern === 'circle' ? -90 : 90 + gapDegree / 2, children: _jsxs("svg", Object.assign({}, styled('progress__svg'), { viewBox: "0 0 120 120", children: [linearGradient && (_jsx("defs", { children: _jsxs("linearGradient", { id: `${namespace}-progress-gradient-${uniqueId}-1`, gradientUnits: "userSpaceOnUse", children: [_jsx("stop", { offset: "0%", stopColor: linearGradient[0] }), _jsx("stop", { offset: "100%", stopColor: linearGradient[100] })] }) })), _jsx("circle", { cx: 60, cy: 60, r: r, strokeLinecap: lineCap, strokeWidth: lineWidth, stroke: "var(--background-color)", fill: "none", strokeDasharray: `${dash} ${c}` }), _jsx("circle", { style: { opacity: percent === 0 ? 0 : 1 }, cx: 60, cy: 60, r: r, strokeLinecap: lineCap, strokeWidth: lineWidth, stroke: isUndefined(linearGradient) ? 'var(--color)' : `url(#${namespace}-progress-gradient-${uniqueId}-1)`, fill: "none", strokeDasharray: `${dash * (percent / 100)} ${c}` })] })) }));
|
|
42
40
|
})()), label !== false && (_jsx("div", Object.assign({}, mergeCS(styled('progress__label'), {
|
|
43
41
|
style: { fontSize: pattern === 'line' ? undefined : `calc(${size}px / 5)` },
|
|
44
42
|
}), { children: checkNodeExist(label) ? (label) : state === 'process' ? (`${percent}%`) : (_jsx(Icon, { size: "1.25em", children: state === 'success' ? (pattern === 'line' ? (_jsx(CheckCircleFilled, {})) : (_jsx(CheckOutlined, {}))) : state === 'warning' ? (pattern === 'line' ? (_jsx(WarningFilled, {})) : (_jsx(WarningAmberOutlined, {}))) : pattern === 'line' ? (_jsx(CancelFilled, {})) : (_jsx(CloseOutlined, {})) })) })))] })));
|