@tldraw/tldraw 4.3.0 → 4.4.0-canary.0791272556f5
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/README.md +1 -1
- package/dist-cjs/index.js +1 -1
- package/dist-esm/index.mjs +1 -1
- package/package.json +2 -2
- package/tldraw.css +74 -18
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ This package is kept around for legacy purposes. It just tracks the normal `tldr
|
|
|
6
6
|
|
|
7
7
|
This project is part of the tldraw SDK. It is provided under the [tldraw SDK license](https://github.com/tldraw/tldraw/blob/main/LICENSE.md).
|
|
8
8
|
|
|
9
|
-
You can use the tldraw SDK in commercial or non-commercial projects so long as you preserve the "Made with tldraw" watermark on the canvas. To remove the watermark, you can purchase a [business license](https://tldraw.dev
|
|
9
|
+
You can use the tldraw SDK in commercial or non-commercial projects so long as you preserve the "Made with tldraw" watermark on the canvas. To remove the watermark, you can purchase a [business license](https://tldraw.dev/pricing). Visit [tldraw.dev](https://tldraw.dev) to learn more.
|
|
10
10
|
|
|
11
11
|
## Trademarks
|
|
12
12
|
|
package/dist-cjs/index.js
CHANGED
|
@@ -19,7 +19,7 @@ var import_tldraw = require("tldraw");
|
|
|
19
19
|
__reExport(index_exports, require("tldraw"), module.exports);
|
|
20
20
|
(0, import_tldraw.registerTldrawLibraryVersion)(
|
|
21
21
|
"@tldraw/tldraw",
|
|
22
|
-
"4.
|
|
22
|
+
"4.4.0-canary.0791272556f5",
|
|
23
23
|
"cjs"
|
|
24
24
|
);
|
|
25
25
|
//# sourceMappingURL=index.js.map
|
package/dist-esm/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tldraw/tldraw",
|
|
3
3
|
"description": "A tiny little drawing editor.",
|
|
4
|
-
"version": "4.
|
|
4
|
+
"version": "4.4.0-canary.0791272556f5",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "tldraw Inc.",
|
|
7
7
|
"email": "hello@tldraw.com"
|
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"src"
|
|
49
49
|
],
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"tldraw": "4.
|
|
51
|
+
"tldraw": "4.4.0-canary.0791272556f5"
|
|
52
52
|
},
|
|
53
53
|
"peerDependencies": {
|
|
54
54
|
"react": "^18.2.0 || ^19.2.1",
|
package/tldraw.css
CHANGED
|
@@ -64,6 +64,7 @@
|
|
|
64
64
|
|
|
65
65
|
/* Misc */
|
|
66
66
|
--tl-zoom: 1;
|
|
67
|
+
--tl-tab-size: 2;
|
|
67
68
|
|
|
68
69
|
/* Cursor SVGs */
|
|
69
70
|
--tl-cursor-none: none;
|
|
@@ -899,6 +900,10 @@ input,
|
|
|
899
900
|
/* white-space: break-spaces; */
|
|
900
901
|
}
|
|
901
902
|
|
|
903
|
+
.tl-rich-text {
|
|
904
|
+
tab-size: var(--tl-tab-size, 2);
|
|
905
|
+
}
|
|
906
|
+
|
|
902
907
|
.tl-rich-text p {
|
|
903
908
|
margin: 0;
|
|
904
909
|
/* Depending on the extensions, <p> tags can be empty, without a <br />. */
|
|
@@ -1166,6 +1171,12 @@ input,
|
|
|
1166
1171
|
contain: size layout;
|
|
1167
1172
|
}
|
|
1168
1173
|
|
|
1174
|
+
.tl-canvas-indicators {
|
|
1175
|
+
position: absolute;
|
|
1176
|
+
inset: 0;
|
|
1177
|
+
pointer-events: none;
|
|
1178
|
+
}
|
|
1179
|
+
|
|
1169
1180
|
/* ---------------------- Shape --------------------- */
|
|
1170
1181
|
|
|
1171
1182
|
.tl-shape {
|
|
@@ -1540,15 +1551,6 @@ input,
|
|
|
1540
1551
|
cursor: var(--tl-cursor-text);
|
|
1541
1552
|
}
|
|
1542
1553
|
|
|
1543
|
-
/* If mobile use 16px as font size */
|
|
1544
|
-
/* On iOS, font size under 16px in an input will make the page zoom into the input 🤦♂️ */
|
|
1545
|
-
/* https://css-tricks.com/16px-or-larger-text-prevents-ios-form-zoom/ */
|
|
1546
|
-
@media (max-width: 600px) {
|
|
1547
|
-
.tl-frame-heading {
|
|
1548
|
-
font-size: 16px;
|
|
1549
|
-
}
|
|
1550
|
-
}
|
|
1551
|
-
|
|
1552
1554
|
/* ------------------- Embed Shape ------------------ */
|
|
1553
1555
|
|
|
1554
1556
|
.tl-embed {
|
|
@@ -1840,13 +1842,15 @@ it from receiving any pointer events or affecting the cursor. */
|
|
|
1840
1842
|
z-index: 0;
|
|
1841
1843
|
}
|
|
1842
1844
|
|
|
1843
|
-
.tlui-button:disabled
|
|
1845
|
+
.tlui-button:disabled,
|
|
1846
|
+
.tlui-button[data-disabled] {
|
|
1844
1847
|
color: var(--tl-color-text-3);
|
|
1845
1848
|
text-shadow: none;
|
|
1846
1849
|
cursor: default;
|
|
1847
1850
|
}
|
|
1848
1851
|
|
|
1849
|
-
.tlui-button:disabled .tlui-kbd
|
|
1852
|
+
.tlui-button:disabled .tlui-kbd,
|
|
1853
|
+
.tlui-button[data-disabled] .tlui-kbd {
|
|
1850
1854
|
color: var(--tl-color-text-3);
|
|
1851
1855
|
}
|
|
1852
1856
|
|
|
@@ -1895,7 +1899,7 @@ it from receiving any pointer events or affecting the cursor. */
|
|
|
1895
1899
|
}
|
|
1896
1900
|
|
|
1897
1901
|
.tlui-button[data-isactive='true']::after,
|
|
1898
|
-
.tlui-button[data-isactive='true']:not(:disabled, :focus-visible):active:after {
|
|
1902
|
+
.tlui-button[data-isactive='true']:not(:disabled, [data-disabled], :focus-visible):active:after {
|
|
1899
1903
|
background: var(--tl-color-hint);
|
|
1900
1904
|
opacity: 1;
|
|
1901
1905
|
}
|
|
@@ -1911,11 +1915,11 @@ it from receiving any pointer events or affecting the cursor. */
|
|
|
1911
1915
|
opacity: 1;
|
|
1912
1916
|
}
|
|
1913
1917
|
|
|
1914
|
-
.tlui-button:not(:disabled):hover {
|
|
1918
|
+
.tlui-button:not(:disabled, [data-disabled]):hover {
|
|
1915
1919
|
z-index: 1;
|
|
1916
1920
|
}
|
|
1917
1921
|
|
|
1918
|
-
.tlui-button:not(:disabled):hover::after {
|
|
1922
|
+
.tlui-button:not(:disabled, [data-disabled]):hover::after {
|
|
1919
1923
|
opacity: 1;
|
|
1920
1924
|
}
|
|
1921
1925
|
}
|
|
@@ -1954,11 +1958,11 @@ it from receiving any pointer events or affecting the cursor. */
|
|
|
1954
1958
|
}
|
|
1955
1959
|
|
|
1956
1960
|
@media (hover: hover) {
|
|
1957
|
-
.tlui-button__primary:not(:disabled, :focus-visible):hover {
|
|
1961
|
+
.tlui-button__primary:not(:disabled, [data-disabled], :focus-visible):hover {
|
|
1958
1962
|
color: var(--tl-color-primary);
|
|
1959
1963
|
}
|
|
1960
1964
|
|
|
1961
|
-
.tlui-button__danger:not(:disabled, :focus-visible):hover {
|
|
1965
|
+
.tlui-button__danger:not(:disabled, [data-disabled], :focus-visible):hover {
|
|
1962
1966
|
color: var(--tl-color-danger);
|
|
1963
1967
|
text-shadow: none;
|
|
1964
1968
|
}
|
|
@@ -2046,11 +2050,11 @@ it from receiving any pointer events or affecting the cursor. */
|
|
|
2046
2050
|
color: var(--tl-color-selected-contrast);
|
|
2047
2051
|
}
|
|
2048
2052
|
|
|
2049
|
-
.tlui-button__tool[aria-pressed='true']:not(:disabled, :focus-visible):active {
|
|
2053
|
+
.tlui-button__tool[aria-pressed='true']:not(:disabled, [data-disabled], :focus-visible):active {
|
|
2050
2054
|
color: var(--tl-color-selected-contrast);
|
|
2051
2055
|
}
|
|
2052
2056
|
|
|
2053
|
-
.tlui-button__tool[aria-pressed='true']:not(:disabled)::after {
|
|
2057
|
+
.tlui-button__tool[aria-pressed='true']:not(:disabled, [data-disabled])::after {
|
|
2054
2058
|
background: var(--tl-color-selected);
|
|
2055
2059
|
opacity: 1;
|
|
2056
2060
|
}
|
|
@@ -2324,6 +2328,52 @@ it from receiving any pointer events or affecting the cursor. */
|
|
|
2324
2328
|
}
|
|
2325
2329
|
}
|
|
2326
2330
|
|
|
2331
|
+
/* --------------------- Select --------------------- */
|
|
2332
|
+
|
|
2333
|
+
/* Trigger extends .tlui-button with space-between layout */
|
|
2334
|
+
.tlui-select__trigger {
|
|
2335
|
+
justify-content: space-between;
|
|
2336
|
+
gap: var(--tl-space-3);
|
|
2337
|
+
}
|
|
2338
|
+
|
|
2339
|
+
.tlui-select__trigger[data-state='open']::after {
|
|
2340
|
+
opacity: 1;
|
|
2341
|
+
}
|
|
2342
|
+
|
|
2343
|
+
.tlui-select__value {
|
|
2344
|
+
display: flex;
|
|
2345
|
+
align-items: center;
|
|
2346
|
+
gap: var(--tl-space-2);
|
|
2347
|
+
}
|
|
2348
|
+
|
|
2349
|
+
.tlui-select__chevron {
|
|
2350
|
+
flex-shrink: 0;
|
|
2351
|
+
color: var(--tl-color-text-2);
|
|
2352
|
+
}
|
|
2353
|
+
|
|
2354
|
+
/* Content extends .tlui-menu with Radix-aware sizing */
|
|
2355
|
+
.tlui-select__content {
|
|
2356
|
+
min-width: var(--radix-select-trigger-width);
|
|
2357
|
+
max-height: var(--radix-select-content-available-height);
|
|
2358
|
+
}
|
|
2359
|
+
|
|
2360
|
+
.tlui-select__viewport {
|
|
2361
|
+
padding: 4px 0;
|
|
2362
|
+
}
|
|
2363
|
+
|
|
2364
|
+
/* Item extends .tlui-button__checkbox with left-aligned text */
|
|
2365
|
+
.tlui-select__item {
|
|
2366
|
+
justify-content: flex-start;
|
|
2367
|
+
}
|
|
2368
|
+
|
|
2369
|
+
.tlui-select__item-indicator {
|
|
2370
|
+
visibility: hidden;
|
|
2371
|
+
}
|
|
2372
|
+
|
|
2373
|
+
.tlui-select__item[data-state='checked'] .tlui-select__item-indicator {
|
|
2374
|
+
visibility: visible;
|
|
2375
|
+
}
|
|
2376
|
+
|
|
2327
2377
|
/* ----------------------- Kbd ---------------------- */
|
|
2328
2378
|
|
|
2329
2379
|
.tlui-kbd {
|
|
@@ -3529,6 +3579,12 @@ tldraw? probably.
|
|
|
3529
3579
|
|
|
3530
3580
|
/* Terrible fix to allow firefox users to scroll the dialog */
|
|
3531
3581
|
overflow-x: auto;
|
|
3582
|
+
|
|
3583
|
+
scrollbar-width: none;
|
|
3584
|
+
}
|
|
3585
|
+
|
|
3586
|
+
.tlui-shortcuts-dialog__body::-webkit-scrollbar {
|
|
3587
|
+
display: none;
|
|
3532
3588
|
}
|
|
3533
3589
|
|
|
3534
3590
|
.tlui-shortcuts-dialog__body__tablet {
|