Skip to content

Commit 03fabdd

Browse files
chenshenhaichenshenhai
authored
Merge pull request #66 from idrawjs/dev-v0.4
Dev v0.4
2 parents 6a0cafd + 24f163f commit 03fabdd

32 files changed

+317
-195
lines changed

‎README.md

+8-1
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,13 @@
1313
<a href="https://idrawjs.com/studio/" target="_blank">idrawjs.com/studio/</a>
1414
</p>
1515

16+
## Sponsors
17+
18+
`@idraw/studio` is an MIT-licensed open source project with its ongoing development made possible entirely by the support of these awesome backers. If you'd like to join them, please consider [sponsoring iDrawjs's development](https://opencollective.com/idrawjs).
19+
20+
[![Become a Backer](https://opencollective.com/idrawjs/tiers/backers.svg?avatarHeight=48)](https://opencollective.com/idrawjs)
21+
22+
1623

1724
## @idraw/studio Preview
1825

@@ -25,7 +32,7 @@ The preview of `@idraw/studo`.
2532

2633
<img width="700" alt="idraw-studio-light-theme" src="https://github.com/idrawjs/studio/assets/8216630/8a49bab8-1e4a-44dd-9836-b6ce3861aaea" />
2734

28-
<img width="600" alt="idraw-studio-dark-theme" src="https://github.com/idrawjs/studio/assets/8216630/479fce0b-891f-47f2-ace8-d91580e68b4b" />
35+
<img width="700" alt="idraw-studio-dark-theme" src="https://github.com/idrawjs/studio/assets/8216630/479fce0b-891f-47f2-ace8-d91580e68b4b" />
2936

3037
</p>
3138

‎package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"private": false,
3-
"version": "0.4.0-alpha.12",
3+
"version": "0.4.0-alpha.13",
44
"workspaces": [
55
"packages/*"
66
],
@@ -19,7 +19,7 @@
1919
"upgrade:version": "vite-node ./scripts/upgrade-version.ts && pnpm i"
2020
},
2121
"dependencies": {
22-
"idraw": "0.4.0-beta.12",
22+
"idraw": "0.4.0-beta.13",
2323
"antd": "5.12.1"
2424
},
2525
"devDependencies": {

‎packages/studio-base/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@idraw/studio-base",
3-
"version": "0.4.0-alpha.12",
3+
"version": "0.4.0-alpha.13",
44
"main": "dist/index.js",
55
"module": "dist/index.js",
66
"types": "dist/index.d.ts",
@@ -22,7 +22,7 @@
2222
"peerDependencies": {
2323
"antd": "^5.12.1",
2424
"classnames": "^2.3.2",
25-
"idraw": "^0.4.0-beta.12",
25+
"idraw": "^0.4.0-beta.13",
2626
"react": "^18.2.0",
2727
"react-color": "^2.19.3",
2828
"react-dom": "^18.2.0"

‎packages/studio-base/src/css/theme/dark.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// @import '../variable.less';
22

33
&.@{prefix}-theme.@{prefix}-theme-dark {
4-
--@{prefix}-bg-color: @gray-9;
4+
--@{prefix}-bg-color: @gray-10;
55
--@{prefix}-canvas-bg-color: @gray-9;
66
--@{prefix}-text-color: @gray-4;
77
--@{prefix}-text-hover-color: @gray-1;

‎packages/studio-base/src/icons/file-copy.tsx

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import React from 'react';
2+
import { IconWrapper } from './util';
3+
import type { IconWrapperProps } from './util';
4+
5+
const Icon = (props: IconWrapperProps) => {
6+
return (
7+
<IconWrapper {...props}>
8+
<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor">
9+
<path d="M832 64H296c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h496v688c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8V96c0-17.7-14.3-32-32-32z"></path>
10+
<path d="M704 192H192c-17.7 0-32 14.3-32 32v530.7c0 8.5 3.4 16.6 9.4 22.6l173.3 173.3c2.2 2.2 4.7 4 7.4 5.5v1.9h4.2c3.5 1.3 7.2 2 11 2H704c17.7 0 32-14.3 32-32V224c0-17.7-14.3-32-32-32zM350 856.2L263.9 770H350v86.2zM664 888H414V746c0-22.1-17.9-40-40-40H232V264h432v624z"></path>
11+
</svg>
12+
</IconWrapper>
13+
);
14+
};
15+
16+
export default Icon;

‎packages/studio-base/src/icons/index.ts

+6
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import IconDrag from './drag';
2828
import IconEdit from './edit';
2929
import IconExperiment from './experiment';
3030
import IconFile from './file';
31+
import IconFileCopy from './file-copy';
3132
import IconFullCornerRadius from './full-corner-radius';
3233
import IconGroup from './group';
3334
import IconHand from './hand';
@@ -47,6 +48,7 @@ import IconPath from './path';
4748
import IconPen from './pen';
4849
import IconPlus from './plus';
4950
import IconPosition from './position';
51+
import IconRedo from './redo';
5052
import IconRect from './rect';
5153
import IconResize from './resize';
5254
import IconRotation from './rotation';
@@ -56,6 +58,7 @@ import IconSetting from './setting';
5658
import IconSolidColor from './solid-color';
5759
import IconStar from './star';
5860
import IconText from './text';
61+
import IconUndo from './undo';
5962
import IconUnlock from './unlock';
6063
import IconVerticalBottom from './vertical-bottom';
6164
import IconVerticalMiddle from './vertical-middle';
@@ -94,6 +97,7 @@ export {
9497
IconEdit,
9598
IconExperiment,
9699
IconFile,
100+
IconFileCopy,
97101
IconFullCornerRadius,
98102
IconGroup,
99103
IconHand,
@@ -113,6 +117,7 @@ export {
113117
IconPen,
114118
IconPlus,
115119
IconPosition,
120+
IconRedo,
116121
IconRect,
117122
IconResize,
118123
IconRotation,
@@ -122,6 +127,7 @@ export {
122127
IconSolidColor,
123128
IconStar,
124129
IconText,
130+
IconUndo,
125131
IconUnlock,
126132
IconVerticalBottom,
127133
IconVerticalMiddle,

‎packages/studio-base/src/icons/redo.tsx

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import React from 'react';
2+
import { IconWrapper } from './util';
3+
import type { IconWrapperProps } from './util';
4+
5+
const Icon = (props: IconWrapperProps) => {
6+
return (
7+
<IconWrapper {...props}>
8+
<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor">
9+
<path d="M1000.65998 0.00002h-94.819998a24 24 0 0 0-23.999999 25.14l8 165.519996A494.83999 494.83999 0 0 0 511.99999 16.00002C238.679995 16.00002 15.8 239.060015 16 512.38001 16.2 786.140005 238.199995 1008 511.99999 1008a494.19999 494.19999 0 0 0 332.359994-127.819997 24 24 0 0 0 0.959999-34.86l-67.999998-67.999998a24 24 0 0 0-32.76-1.1A351.999993 351.999993 0 1 1 804.199984 315.600014l-203.059996-9.74a24 24 0 0 0-25.139999 24v94.819998a24 24 0 0 0 23.999999 23.999999h400.659992a24 24 0 0 0 24-23.999999V24.00002a24 24 0 0 0-24-24z"></path>
10+
</svg>
11+
</IconWrapper>
12+
);
13+
};
14+
15+
export default Icon;

‎packages/studio-base/src/icons/undo.tsx

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import React from 'react';
2+
import { IconWrapper } from './util';
3+
import type { IconWrapperProps } from './util';
4+
5+
const Icon = (props: IconWrapperProps) => {
6+
return (
7+
<IconWrapper {...props}>
8+
<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor">
9+
<path d="M424.666 448.666H24c-13.254 0-24-10.746-24-24V24C0 10.746 10.746 0 24 0h96c13.254 0 24 10.746 24 24v156.224C235.546 78.558 368.52 14.94 516.35 16.014c273.812 1.988 492.896 223.246 492.314 497.064C1008.082 786.516 786.24 1008 512.666 1008c-128.178 0-244.992-48.626-333.02-128.43-10.198-9.244-10.668-25.108-0.934-34.84l67.934-67.934c8.948-8.948 23.324-9.434 32.802-1.05C341.52 830.672 423.16 864 512.666 864c194.536 0 352-157.432 352-352 0-194.534-157.432-352-352-352-116.992 0-220.56 56.952-284.548 144.666h196.548c13.254 0 24 10.746 24 24v96c0 13.254-10.746 24-24 24z"></path>
10+
</svg>
11+
</IconWrapper>
12+
);
13+
};
14+
15+
export default Icon;

‎packages/studio-base/src/index.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ export * from './types';
22

33
export { ConfigContext, ConfigProvider, type ConfigContextValue } from './modules/config-provider';
44
export { SplitPane, SplitPaneItem } from './modules/split-pane';
5-
export { Toolbar, type ToolbarProps } from './modules/toolbar';
65
export { ThemeSwitch, type ThemeSwitchProps } from './modules/theme-switch';
76
export { LocaleSelector, type LocaleSelectorProps } from './modules/locale-selector';
87
export { ScaleSelector, type ScaleSelectorProps } from './modules/scale-selector';
@@ -45,6 +44,7 @@ export {
4544
IconEdit,
4645
IconExperiment,
4746
IconFile,
47+
IconFileCopy,
4848
IconFullCornerRadius,
4949
IconGroup,
5050
IconHand,
@@ -64,6 +64,7 @@ export {
6464
IconPen,
6565
IconPlus,
6666
IconPosition,
67+
IconRedo,
6768
IconRect,
6869
IconResize,
6970
IconRotation,
@@ -73,6 +74,7 @@ export {
7374
IconSolidColor,
7475
IconStar,
7576
IconText,
77+
IconUndo,
7678
IconUnlock,
7779
IconVerticalBottom,
7880
IconVerticalMiddle,

‎packages/studio-base/src/modules/element-detail/detail-text.tsx

+20-4
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, { useMemo, useEffect, useContext, useRef } from 'react';
22
import type { CSSProperties } from 'react';
33
import classnames from 'classnames';
44
import type { Element, ElementTextDetail } from 'idraw';
5-
import { getElementSize } from 'idraw';
5+
import { getElementSize, formatNumber, is } from 'idraw';
66
import { Radio, Row, Col, Form, InputNumber } from 'antd';
77
import type { FormInstance } from 'antd';
88
import { ConfigContext } from '../config-provider';
@@ -17,6 +17,13 @@ import IconAlignRight from '../../icons/align-right';
1717
const modName = 'base-element-detail-text';
1818
const iconStyle = { fontSize: 20 };
1919

20+
const formatter = (val: any) => {
21+
if (is.number(val * 1)) {
22+
return formatNumber(val * 1);
23+
}
24+
return val;
25+
};
26+
2027
export interface DetailTextProps {
2128
className?: string;
2229
style?: CSSProperties;
@@ -121,7 +128,7 @@ export const DetailText = (props: DetailTextProps) => {
121128
</Col>
122129
<Col span="14" className={colClassName}>
123130
<Form.Item className={formItemClassName} name="fontSize">
124-
<InputNumber disabled={disabled} size="small" style={{ width: '100%' }} step={1} min={0} />
131+
<InputNumber disabled={disabled} size="small" style={{ width: '100%' }} step={1} min={0} formatter={formatter} parser={formatter} />
125132
</Form.Item>
126133
</Col>
127134
</Row>
@@ -131,7 +138,16 @@ export const DetailText = (props: DetailTextProps) => {
131138
</Col>
132139
<Col span="14" className={colClassName}>
133140
<Form.Item className={formItemClassName} name="fontWeight">
134-
<InputNumber disabled={disabled} size="small" style={{ width: '100%' }} step={100} max={1000} min={100} />
141+
<InputNumber
142+
disabled={disabled}
143+
size="small"
144+
style={{ width: '100%' }}
145+
step={100}
146+
max={1000}
147+
min={100}
148+
formatter={formatter}
149+
parser={formatter}
150+
/>
135151
</Form.Item>
136152
</Col>
137153
</Row>
@@ -141,7 +157,7 @@ export const DetailText = (props: DetailTextProps) => {
141157
</Col>
142158
<Col span="14" className={colClassName}>
143159
<Form.Item className={formItemClassName} name="lineHeight">
144-
<InputNumber disabled={disabled} size="small" style={{ width: '100%' }} step={1} min={0} />
160+
<InputNumber disabled={disabled} size="small" style={{ width: '100%' }} step={1} min={0} formatter={formatter} parser={formatter} />
145161
</Form.Item>
146162
</Col>
147163
</Row>

‎packages/studio-base/src/modules/toolbar/index.tsx

-61
This file was deleted.

‎packages/studio/README.md

+8-1
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,13 @@
1313
<a href="https://idrawjs.com/studio/" target="_blank">idrawjs.com/studio/</a>
1414
</p>
1515

16+
## Sponsors
17+
18+
`@idraw/studio` is an MIT-licensed open source project with its ongoing development made possible entirely by the support of these awesome backers. If you'd like to join them, please consider [sponsoring iDrawjs's development](https://opencollective.com/idrawjs).
19+
20+
[![Become a Backer](https://opencollective.com/idrawjs/tiers/backers.svg?avatarHeight=48)](https://opencollective.com/idrawjs)
21+
22+
1623

1724
## @idraw/studio Preview
1825

@@ -25,7 +32,7 @@ The preview of `@idraw/studo`.
2532

2633
<img width="700" alt="idraw-studio-light-theme" src="https://github.com/idrawjs/studio/assets/8216630/8a49bab8-1e4a-44dd-9836-b6ce3861aaea" />
2734

28-
<img width="600" alt="idraw-studio-dark-theme" src="https://github.com/idrawjs/studio/assets/8216630/479fce0b-891f-47f2-ace8-d91580e68b4b" />
35+
<img width="700" alt="idraw-studio-dark-theme" src="https://github.com/idrawjs/studio/assets/8216630/479fce0b-891f-47f2-ace8-d91580e68b4b" />
2936

3037
</p>
3138

‎packages/studio/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@idraw/studio",
3-
"version": "0.4.0-alpha.12",
3+
"version": "0.4.0-alpha.13",
44
"main": "dist/index.js",
55
"module": "dist/index.js",
66
"types": "dist/index.d.ts",
@@ -20,13 +20,13 @@
2020
"author": "chenshenhai",
2121
"license": "MIT",
2222
"dependencies": {
23-
"@idraw/studio-base": "^0.4.0-alpha.12",
23+
"@idraw/studio-base": "^0.4.0-alpha.13",
2424
"classnames": "^2.3.2",
2525
"is-hotkey": "^0.2.0"
2626
},
2727
"peerDependencies": {
2828
"antd": "^5.12.1",
29-
"idraw": "^0.4.0-beta.12",
29+
"idraw": "^0.4.0-beta.13",
3030
"react": "^18.2.0",
3131
"react-color": "^2.19.3",
3232
"react-dom": "^18.2.0"

‎packages/studio/src/css/modules/dashboard.less

+2-1
Original file line numberDiff line numberDiff line change
@@ -48,9 +48,10 @@
4848
right: 0;
4949
}
5050
.@{mod-dashboard}-left {
51-
border-right: 1px solid;
51+
border-right: 2px solid;
5252
border-color: ~'var(--@{prefix}-border-color)';
5353
height: 100%;
54+
box-sizing: border-box;
5455
}
5556

5657
.@{mod-dashboard}-right {

‎packages/studio/src/css/modules/header.less

+1
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@
1616
flex-direction: row;
1717
}
1818
.@{mod-header}-center {
19+
width: 100%;
1920
display: flex;
2021
flex-direction: row;
2122
}

‎packages/studio/src/locale/languages/en-US.ts

+6
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@ const localeValues: Locale = {
1818
group: 'Group',
1919
devicePixelRatio: 'Device pixel ratio'
2020
},
21+
Toolbar: {
22+
layers: 'Layers',
23+
ruler: 'Ruler',
24+
attributes: 'Attributes',
25+
hand: 'Hand tool'
26+
},
2127
contextMenu: {
2228
copy: 'Copy',
2329
paste: 'Paste',

0 commit comments

Comments
 (0)