@tsdraw/react 0.9.4 → 0.9.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/dist/index.cjs +130 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +131 -13
- package/dist/index.js.map +1 -1
- package/dist/tsdraw.css +32 -10
- package/package.json +3 -3
package/dist/tsdraw.css
CHANGED
|
@@ -19,6 +19,11 @@
|
|
|
19
19
|
inset 0px 0px 0px 1px var(--tsdraw-color-panel-contrast);
|
|
20
20
|
--tsdraw-color-handle-fill: #ffffff;
|
|
21
21
|
--tsdraw-color-tool-dot-outline: rgba(255, 255, 255, 0.4);
|
|
22
|
+
--tsdraw-color-selection-handle-border: #5b7ef5;
|
|
23
|
+
--tsdraw-color-vertex-handle-fill: #5b7ef5;
|
|
24
|
+
--tsdraw-color-vertex-handle-ring: #ffffff;
|
|
25
|
+
--tsdraw-color-vertex-handle-shadow: rgba(15, 23, 42, 0.42);
|
|
26
|
+
--tsdraw-color-vertex-handle-shadow-soft: rgba(15, 23, 42, 0.2);
|
|
22
27
|
--tsdraw-color-tool-ring-border: rgba(24, 24, 24, 0.85);
|
|
23
28
|
--tsdraw-color-tool-ring-fill: rgba(24, 24, 24, 0.08);
|
|
24
29
|
--tsdraw-radius: 12px;
|
|
@@ -48,6 +53,11 @@
|
|
|
48
53
|
inset 0px 0px 0px 1px var(--tsdraw-color-panel-contrast);
|
|
49
54
|
--tsdraw-color-handle-fill: #171717;
|
|
50
55
|
--tsdraw-color-tool-dot-outline: rgba(255, 255, 255, 0.2);
|
|
56
|
+
--tsdraw-color-selection-handle-border: #5b7ef5;
|
|
57
|
+
--tsdraw-color-vertex-handle-fill: #5b7ef5;
|
|
58
|
+
--tsdraw-color-vertex-handle-ring: #ffffff;
|
|
59
|
+
--tsdraw-color-vertex-handle-shadow: rgba(0, 0, 0, 0.58);
|
|
60
|
+
--tsdraw-color-vertex-handle-shadow-soft: rgba(0, 0, 0, 0.38);
|
|
51
61
|
--tsdraw-color-tool-ring-border: rgba(255, 255, 255, 0.75);
|
|
52
62
|
--tsdraw-color-tool-ring-fill: rgba(255, 255, 255, 0.08);
|
|
53
63
|
}
|
|
@@ -304,8 +314,8 @@
|
|
|
304
314
|
|
|
305
315
|
.tsdraw-selection-brush {
|
|
306
316
|
position: absolute;
|
|
307
|
-
border:
|
|
308
|
-
background:
|
|
317
|
+
border: 2px solid var(--tsdraw-color-selection-handle-border);
|
|
318
|
+
background: var(--tsdraw-color-selection-handle-fill);
|
|
309
319
|
pointer-events: none;
|
|
310
320
|
z-index: 90;
|
|
311
321
|
}
|
|
@@ -321,7 +331,7 @@
|
|
|
321
331
|
.tsdraw-selection-bounds {
|
|
322
332
|
position: absolute;
|
|
323
333
|
inset: 0;
|
|
324
|
-
border:
|
|
334
|
+
border: 2px solid var(--tsdraw-color-selection-handle-border);
|
|
325
335
|
box-shadow: 0 0 0 1px var(--tsdraw-color-selection-contrast) inset;
|
|
326
336
|
pointer-events: none;
|
|
327
337
|
z-index: 1;
|
|
@@ -343,15 +353,27 @@
|
|
|
343
353
|
appearance: none;
|
|
344
354
|
}
|
|
345
355
|
|
|
356
|
+
.tsdraw-vertex-handle {
|
|
357
|
+
width: 12px;
|
|
358
|
+
height: 12px;
|
|
359
|
+
border: 2px solid var(--tsdraw-color-vertex-handle-ring);
|
|
360
|
+
background: var(--tsdraw-color-vertex-handle-fill);
|
|
361
|
+
border-radius: 50%;
|
|
362
|
+
box-sizing: border-box;
|
|
363
|
+
box-shadow:
|
|
364
|
+
0 2px 4px var(--tsdraw-color-vertex-handle-shadow),
|
|
365
|
+
0 6px 14px var(--tsdraw-color-vertex-handle-shadow-soft);
|
|
366
|
+
}
|
|
367
|
+
|
|
346
368
|
.tsdraw-selection-handle::after {
|
|
347
369
|
content: '';
|
|
348
370
|
position: absolute;
|
|
349
371
|
top: 50%;
|
|
350
372
|
left: 50%;
|
|
351
|
-
width:
|
|
352
|
-
height:
|
|
373
|
+
width: 12px;
|
|
374
|
+
height: 12px;
|
|
353
375
|
transform: translate(-50%, -50%);
|
|
354
|
-
border:
|
|
376
|
+
border: 2px solid var(--tsdraw-color-selection-handle-border);
|
|
355
377
|
background: var(--tsdraw-color-handle-fill);
|
|
356
378
|
border-radius: 2px;
|
|
357
379
|
pointer-events: none;
|
|
@@ -368,7 +390,7 @@
|
|
|
368
390
|
top: 0;
|
|
369
391
|
width: 0;
|
|
370
392
|
height: 15px;
|
|
371
|
-
border-left:
|
|
393
|
+
border-left: 2px solid var(--tsdraw-color-selection-handle-border);
|
|
372
394
|
transform: translate(-50%, -100%);
|
|
373
395
|
pointer-events: none;
|
|
374
396
|
z-index: 1;
|
|
@@ -397,10 +419,10 @@
|
|
|
397
419
|
position: absolute;
|
|
398
420
|
top: 50%;
|
|
399
421
|
left: 50%;
|
|
400
|
-
width:
|
|
401
|
-
height:
|
|
422
|
+
width: 12px;
|
|
423
|
+
height: 12px;
|
|
402
424
|
transform: translate(-50%, -50%);
|
|
403
|
-
border:
|
|
425
|
+
border: 2px solid var(--tsdraw-color-selection-handle-border);
|
|
404
426
|
background: var(--tsdraw-color-handle-fill);
|
|
405
427
|
border-radius: 50%;
|
|
406
428
|
pointer-events: none;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tsdraw/react",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.5",
|
|
4
4
|
"description": "@tsdraw/react - React components and hooks for tsdraw",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -44,10 +44,10 @@
|
|
|
44
44
|
"prepublishOnly": "npm run build"
|
|
45
45
|
},
|
|
46
46
|
"dependencies": {
|
|
47
|
-
"@tabler/icons-react": "^3.40.0"
|
|
48
|
-
"@tsdraw/core": "latest"
|
|
47
|
+
"@tabler/icons-react": "^3.40.0"
|
|
49
48
|
},
|
|
50
49
|
"peerDependencies": {
|
|
50
|
+
"@tsdraw/core": ">=0.9.0",
|
|
51
51
|
"react": "^18.0.0 || ^19.0.0",
|
|
52
52
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
53
53
|
},
|