tldraw 4.2.0-canary.882ff736bec2 → 4.2.0-canary.88d4fa0b1a42
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-cjs/index.d.ts +1 -0
- package/dist-cjs/index.js +1 -1
- package/dist-cjs/lib/ui/components/Dialogs.js +2 -14
- package/dist-cjs/lib/ui/components/Dialogs.js.map +2 -2
- package/dist-cjs/lib/ui/components/primitives/Button/TldrawUiButton.js +2 -2
- package/dist-cjs/lib/ui/components/primitives/Button/TldrawUiButton.js.map +2 -2
- package/dist-cjs/lib/ui/version.js +3 -3
- package/dist-cjs/lib/ui/version.js.map +1 -1
- package/dist-esm/index.d.mts +1 -0
- package/dist-esm/index.mjs +1 -1
- package/dist-esm/lib/ui/components/Dialogs.mjs +2 -14
- package/dist-esm/lib/ui/components/Dialogs.mjs.map +2 -2
- package/dist-esm/lib/ui/components/primitives/Button/TldrawUiButton.mjs +2 -2
- package/dist-esm/lib/ui/components/primitives/Button/TldrawUiButton.mjs.map +2 -2
- package/dist-esm/lib/ui/version.mjs +3 -3
- package/dist-esm/lib/ui/version.mjs.map +1 -1
- package/package.json +3 -3
- package/src/lib/ui/components/Dialogs.tsx +2 -14
- package/src/lib/ui/components/primitives/Button/TldrawUiButton.tsx +3 -2
- package/src/lib/ui/version.ts +3 -3
package/dist-cjs/index.d.ts
CHANGED
|
@@ -3566,6 +3566,7 @@ export declare interface TLUiButtonProps extends React_2.HTMLAttributes<HTMLButt
|
|
|
3566
3566
|
disabled?: boolean;
|
|
3567
3567
|
isActive?: boolean;
|
|
3568
3568
|
type: 'danger' | 'help' | 'icon' | 'low' | 'menu' | 'normal' | 'primary' | 'tool';
|
|
3569
|
+
htmlButtonType?: 'button' | 'reset' | 'submit';
|
|
3569
3570
|
}
|
|
3570
3571
|
|
|
3571
3572
|
/** @public */
|
package/dist-cjs/index.js
CHANGED
|
@@ -584,7 +584,7 @@ var import_buildFromV1Document = require("./lib/utils/tldr/buildFromV1Document")
|
|
|
584
584
|
var import_file = require("./lib/utils/tldr/file");
|
|
585
585
|
(0, import_editor.registerTldrawLibraryVersion)(
|
|
586
586
|
"tldraw",
|
|
587
|
-
"4.2.0-canary.
|
|
587
|
+
"4.2.0-canary.88d4fa0b1a42",
|
|
588
588
|
"cjs"
|
|
589
589
|
);
|
|
590
590
|
//# sourceMappingURL=index.js.map
|
|
@@ -26,29 +26,17 @@ var import_editor = require("@tldraw/editor");
|
|
|
26
26
|
var import_radix_ui = require("radix-ui");
|
|
27
27
|
var import_react = require("react");
|
|
28
28
|
var import_dialogs = require("../context/dialogs");
|
|
29
|
-
const TldrawUiDialog = ({
|
|
30
|
-
id,
|
|
31
|
-
component: ModalContent,
|
|
32
|
-
onClose,
|
|
33
|
-
preventBackgroundClose
|
|
34
|
-
}) => {
|
|
29
|
+
const TldrawUiDialog = ({ id, component: ModalContent, preventBackgroundClose }) => {
|
|
35
30
|
const { removeDialog } = (0, import_dialogs.useDialogs)();
|
|
36
31
|
const mouseDownInsideContentRef = (0, import_react.useRef)(false);
|
|
37
32
|
const container = (0, import_editor.useContainer)();
|
|
38
33
|
const handleOpenChange = (0, import_react.useCallback)(
|
|
39
34
|
(isOpen) => {
|
|
40
35
|
if (!isOpen) {
|
|
41
|
-
if (onClose) {
|
|
42
|
-
try {
|
|
43
|
-
onClose();
|
|
44
|
-
} catch (err) {
|
|
45
|
-
console.warn(err);
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
36
|
removeDialog(id);
|
|
49
37
|
}
|
|
50
38
|
},
|
|
51
|
-
[id,
|
|
39
|
+
[id, removeDialog]
|
|
52
40
|
);
|
|
53
41
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Dialog.Root, { onOpenChange: handleOpenChange, defaultOpen: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Dialog.Portal, { container, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
42
|
import_radix_ui.Dialog.Overlay,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/lib/ui/components/Dialogs.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useContainer, useValue } from '@tldraw/editor'\nimport { Dialog as _Dialog } from 'radix-ui'\nimport { memo, useCallback, useRef } from 'react'\nimport { TLUiDialog, useDialogs } from '../context/dialogs'\n\n/** @internal */\nconst TldrawUiDialog = ({
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { useContainer, useValue } from '@tldraw/editor'\nimport { Dialog as _Dialog } from 'radix-ui'\nimport { memo, useCallback, useRef } from 'react'\nimport { TLUiDialog, useDialogs } from '../context/dialogs'\n\n/** @internal */\nconst TldrawUiDialog = ({ id, component: ModalContent, preventBackgroundClose }: TLUiDialog) => {\n\tconst { removeDialog } = useDialogs()\n\tconst mouseDownInsideContentRef = useRef(false)\n\n\tconst container = useContainer()\n\n\tconst handleOpenChange = useCallback(\n\t\t(isOpen: boolean) => {\n\t\t\tif (!isOpen) {\n\t\t\t\tremoveDialog(id)\n\t\t\t}\n\t\t},\n\t\t[id, removeDialog]\n\t)\n\n\treturn (\n\t\t<_Dialog.Root onOpenChange={handleOpenChange} defaultOpen>\n\t\t\t<_Dialog.Portal container={container}>\n\t\t\t\t<_Dialog.Overlay\n\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\tclassName=\"tlui-dialog__overlay\"\n\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t// We pressed mouse down inside the content of the dialog then moved the mouse\n\t\t\t\t\t\t// outside it and let go of the mouse button. This should not close the dialog.\n\t\t\t\t\t\tif (mouseDownInsideContentRef.current) return\n\t\t\t\t\t\t// only close if the click is on the overlay itself, ignore bubbling clicks\n\t\t\t\t\t\tif (!preventBackgroundClose && e.target === e.currentTarget) handleOpenChange(false)\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<_Dialog.Content\n\t\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\t\tclassName=\"tlui-dialog__content\"\n\t\t\t\t\t\taria-describedby={undefined}\n\t\t\t\t\t\tonMouseDown={() => (mouseDownInsideContentRef.current = true)}\n\t\t\t\t\t\tonMouseUp={() => (mouseDownInsideContentRef.current = false)}\n\t\t\t\t\t\tonInteractOutside={(e) => {\n\t\t\t\t\t\t\tmouseDownInsideContentRef.current = false\n\t\t\t\t\t\t\tif (preventBackgroundClose) {\n\t\t\t\t\t\t\t\te.preventDefault()\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ModalContent\n\t\t\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\t\t\tmouseDownInsideContentRef.current = false\n\t\t\t\t\t\t\t\thandleOpenChange(false)\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</_Dialog.Content>\n\t\t\t\t</_Dialog.Overlay>\n\t\t\t</_Dialog.Portal>\n\t\t</_Dialog.Root>\n\t)\n}\n\n/** @public @react */\nexport const DefaultDialogs = memo(function DefaultDialogs() {\n\tconst { dialogs } = useDialogs()\n\tconst dialogsArray = useValue('dialogs', () => dialogs.get(), [dialogs])\n\treturn dialogsArray.map((dialog) => <TldrawUiDialog key={dialog.id} {...dialog} />)\n})\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgDM;AAhDN,oBAAuC;AACvC,sBAAkC;AAClC,mBAA0C;AAC1C,qBAAuC;AAGvC,MAAM,iBAAiB,CAAC,EAAE,IAAI,WAAW,cAAc,uBAAuB,MAAkB;AAC/F,QAAM,EAAE,aAAa,QAAI,2BAAW;AACpC,QAAM,gCAA4B,qBAAO,KAAK;AAE9C,QAAM,gBAAY,4BAAa;AAE/B,QAAM,uBAAmB;AAAA,IACxB,CAAC,WAAoB;AACpB,UAAI,CAAC,QAAQ;AACZ,qBAAa,EAAE;AAAA,MAChB;AAAA,IACD;AAAA,IACA,CAAC,IAAI,YAAY;AAAA,EAClB;AAEA,SACC,4CAAC,gBAAAA,OAAQ,MAAR,EAAa,cAAc,kBAAkB,aAAW,MACxD,sDAAC,gBAAAA,OAAQ,QAAR,EAAe,WACf;AAAA,IAAC,gBAAAA,OAAQ;AAAA,IAAR;AAAA,MACA,KAAI;AAAA,MACJ,WAAU;AAAA,MACV,SAAS,CAAC,MAAM;AAGf,YAAI,0BAA0B,QAAS;AAEvC,YAAI,CAAC,0BAA0B,EAAE,WAAW,EAAE,cAAe,kBAAiB,KAAK;AAAA,MACpF;AAAA,MAEA;AAAA,QAAC,gBAAAA,OAAQ;AAAA,QAAR;AAAA,UACA,KAAI;AAAA,UACJ,WAAU;AAAA,UACV,oBAAkB;AAAA,UAClB,aAAa,MAAO,0BAA0B,UAAU;AAAA,UACxD,WAAW,MAAO,0BAA0B,UAAU;AAAA,UACtD,mBAAmB,CAAC,MAAM;AACzB,sCAA0B,UAAU;AACpC,gBAAI,wBAAwB;AAC3B,gBAAE,eAAe;AAAA,YAClB;AAAA,UACD;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACA,SAAS,MAAM;AACd,0CAA0B,UAAU;AACpC,iCAAiB,KAAK;AAAA,cACvB;AAAA;AAAA,UACD;AAAA;AAAA,MACD;AAAA;AAAA,EACD,GACD,GACD;AAEF;AAGO,MAAM,qBAAiB,mBAAK,SAASC,kBAAiB;AAC5D,QAAM,EAAE,QAAQ,QAAI,2BAAW;AAC/B,QAAM,mBAAe,wBAAS,WAAW,MAAM,QAAQ,IAAI,GAAG,CAAC,OAAO,CAAC;AACvE,SAAO,aAAa,IAAI,CAAC,WAAW,4CAAC,kBAAgC,GAAG,UAAf,OAAO,EAAgB,CAAE;AACnF,CAAC;",
|
|
6
6
|
"names": ["_Dialog", "DefaultDialogs"]
|
|
7
7
|
}
|
|
@@ -45,12 +45,12 @@ const namedClassNamesSoThatICanGrepForThis = {
|
|
|
45
45
|
help: "tlui-button__help"
|
|
46
46
|
};
|
|
47
47
|
const TldrawUiButton = React.forwardRef(
|
|
48
|
-
function TldrawUiButton2({ children, type, isActive, ...props }, ref) {
|
|
48
|
+
function TldrawUiButton2({ children, type, htmlButtonType, isActive, ...props }, ref) {
|
|
49
49
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
50
50
|
"button",
|
|
51
51
|
{
|
|
52
52
|
ref,
|
|
53
|
-
type: "button",
|
|
53
|
+
type: htmlButtonType || "button",
|
|
54
54
|
draggable: false,
|
|
55
55
|
"data-isactive": isActive,
|
|
56
56
|
...props,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/lib/ui/components/primitives/Button/TldrawUiButton.tsx"],
|
|
4
|
-
"sourcesContent": ["import classnames from 'classnames'\nimport * as React from 'react'\n\n/** @public */\nexport interface TLUiButtonProps extends React.HTMLAttributes<HTMLButtonElement> {\n\tdisabled?: boolean\n\tisActive?: boolean\n\ttype: 'normal' | 'primary' | 'danger' | 'low' | 'icon' | 'tool' | 'menu' | 'help'\n}\n\nconst namedClassNamesSoThatICanGrepForThis = {\n\tnormal: 'tlui-button__normal',\n\tprimary: 'tlui-button__primary',\n\tdanger: 'tlui-button__danger',\n\tlow: 'tlui-button__low',\n\ticon: 'tlui-button__icon',\n\ttool: 'tlui-button__tool',\n\tmenu: 'tlui-button__menu',\n\thelp: 'tlui-button__help',\n}\n\n/** @public @react */\nexport const TldrawUiButton = React.forwardRef<HTMLButtonElement, TLUiButtonProps>(\n\tfunction TldrawUiButton({ children, type, isActive, ...props }, ref) {\n\t\treturn (\n\t\t\t<button\n\t\t\t\tref={ref}\n\t\t\t\ttype
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import classnames from 'classnames'\nimport * as React from 'react'\n\n/** @public */\nexport interface TLUiButtonProps extends React.HTMLAttributes<HTMLButtonElement> {\n\tdisabled?: boolean\n\tisActive?: boolean\n\ttype: 'normal' | 'primary' | 'danger' | 'low' | 'icon' | 'tool' | 'menu' | 'help'\n\thtmlButtonType?: 'button' | 'submit' | 'reset'\n}\n\nconst namedClassNamesSoThatICanGrepForThis = {\n\tnormal: 'tlui-button__normal',\n\tprimary: 'tlui-button__primary',\n\tdanger: 'tlui-button__danger',\n\tlow: 'tlui-button__low',\n\ticon: 'tlui-button__icon',\n\ttool: 'tlui-button__tool',\n\tmenu: 'tlui-button__menu',\n\thelp: 'tlui-button__help',\n}\n\n/** @public @react */\nexport const TldrawUiButton = React.forwardRef<HTMLButtonElement, TLUiButtonProps>(\n\tfunction TldrawUiButton({ children, type, htmlButtonType, isActive, ...props }, ref) {\n\t\treturn (\n\t\t\t<button\n\t\t\t\tref={ref}\n\t\t\t\ttype={htmlButtonType || 'button'}\n\t\t\t\tdraggable={false}\n\t\t\t\tdata-isactive={isActive}\n\t\t\t\t{...props}\n\t\t\t\tclassName={classnames(\n\t\t\t\t\t'tlui-button',\n\t\t\t\t\tnamedClassNamesSoThatICanGrepForThis[type],\n\t\t\t\t\tprops.className\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</button>\n\t\t)\n\t}\n)\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BG;AA1BH,wBAAuB;AACvB,YAAuB;AAUvB,MAAM,uCAAuC;AAAA,EAC5C,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACP;AAGO,MAAM,iBAAiB,MAAM;AAAA,EACnC,SAASA,gBAAe,EAAE,UAAU,MAAM,gBAAgB,UAAU,GAAG,MAAM,GAAG,KAAK;AACpF,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,MAAM,kBAAkB;AAAA,QACxB,WAAW;AAAA,QACX,iBAAe;AAAA,QACd,GAAG;AAAA,QACJ,eAAW,kBAAAC;AAAA,UACV;AAAA,UACA,qCAAqC,IAAI;AAAA,UACzC,MAAM;AAAA,QACP;AAAA,QAEC;AAAA;AAAA,IACF;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["TldrawUiButton", "classnames"]
|
|
7
7
|
}
|
|
@@ -22,10 +22,10 @@ __export(version_exports, {
|
|
|
22
22
|
version: () => version
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(version_exports);
|
|
25
|
-
const version = "4.2.0-canary.
|
|
25
|
+
const version = "4.2.0-canary.88d4fa0b1a42";
|
|
26
26
|
const publishDates = {
|
|
27
27
|
major: "2025-09-18T14:39:22.803Z",
|
|
28
|
-
minor: "2025-11-
|
|
29
|
-
patch: "2025-11-
|
|
28
|
+
minor: "2025-11-11T11:24:10.444Z",
|
|
29
|
+
patch: "2025-11-11T11:24:10.444Z"
|
|
30
30
|
};
|
|
31
31
|
//# sourceMappingURL=version.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/lib/ui/version.ts"],
|
|
4
|
-
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.
|
|
4
|
+
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.88d4fa0b1a42'\nexport const publishDates = {\n\tmajor: '2025-09-18T14:39:22.803Z',\n\tminor: '2025-11-11T11:24:10.444Z',\n\tpatch: '2025-11-11T11:24:10.444Z',\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist-esm/index.d.mts
CHANGED
|
@@ -3566,6 +3566,7 @@ export declare interface TLUiButtonProps extends React_2.HTMLAttributes<HTMLButt
|
|
|
3566
3566
|
disabled?: boolean;
|
|
3567
3567
|
isActive?: boolean;
|
|
3568
3568
|
type: 'danger' | 'help' | 'icon' | 'low' | 'menu' | 'normal' | 'primary' | 'tool';
|
|
3569
|
+
htmlButtonType?: 'button' | 'reset' | 'submit';
|
|
3569
3570
|
}
|
|
3570
3571
|
|
|
3571
3572
|
/** @public */
|
package/dist-esm/index.mjs
CHANGED
|
@@ -3,29 +3,17 @@ import { useContainer, useValue } from "@tldraw/editor";
|
|
|
3
3
|
import { Dialog as _Dialog } from "radix-ui";
|
|
4
4
|
import { memo, useCallback, useRef } from "react";
|
|
5
5
|
import { useDialogs } from "../context/dialogs.mjs";
|
|
6
|
-
const TldrawUiDialog = ({
|
|
7
|
-
id,
|
|
8
|
-
component: ModalContent,
|
|
9
|
-
onClose,
|
|
10
|
-
preventBackgroundClose
|
|
11
|
-
}) => {
|
|
6
|
+
const TldrawUiDialog = ({ id, component: ModalContent, preventBackgroundClose }) => {
|
|
12
7
|
const { removeDialog } = useDialogs();
|
|
13
8
|
const mouseDownInsideContentRef = useRef(false);
|
|
14
9
|
const container = useContainer();
|
|
15
10
|
const handleOpenChange = useCallback(
|
|
16
11
|
(isOpen) => {
|
|
17
12
|
if (!isOpen) {
|
|
18
|
-
if (onClose) {
|
|
19
|
-
try {
|
|
20
|
-
onClose();
|
|
21
|
-
} catch (err) {
|
|
22
|
-
console.warn(err);
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
13
|
removeDialog(id);
|
|
26
14
|
}
|
|
27
15
|
},
|
|
28
|
-
[id,
|
|
16
|
+
[id, removeDialog]
|
|
29
17
|
);
|
|
30
18
|
return /* @__PURE__ */ jsx(_Dialog.Root, { onOpenChange: handleOpenChange, defaultOpen: true, children: /* @__PURE__ */ jsx(_Dialog.Portal, { container, children: /* @__PURE__ */ jsx(
|
|
31
19
|
_Dialog.Overlay,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/lib/ui/components/Dialogs.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useContainer, useValue } from '@tldraw/editor'\nimport { Dialog as _Dialog } from 'radix-ui'\nimport { memo, useCallback, useRef } from 'react'\nimport { TLUiDialog, useDialogs } from '../context/dialogs'\n\n/** @internal */\nconst TldrawUiDialog = ({
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { useContainer, useValue } from '@tldraw/editor'\nimport { Dialog as _Dialog } from 'radix-ui'\nimport { memo, useCallback, useRef } from 'react'\nimport { TLUiDialog, useDialogs } from '../context/dialogs'\n\n/** @internal */\nconst TldrawUiDialog = ({ id, component: ModalContent, preventBackgroundClose }: TLUiDialog) => {\n\tconst { removeDialog } = useDialogs()\n\tconst mouseDownInsideContentRef = useRef(false)\n\n\tconst container = useContainer()\n\n\tconst handleOpenChange = useCallback(\n\t\t(isOpen: boolean) => {\n\t\t\tif (!isOpen) {\n\t\t\t\tremoveDialog(id)\n\t\t\t}\n\t\t},\n\t\t[id, removeDialog]\n\t)\n\n\treturn (\n\t\t<_Dialog.Root onOpenChange={handleOpenChange} defaultOpen>\n\t\t\t<_Dialog.Portal container={container}>\n\t\t\t\t<_Dialog.Overlay\n\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\tclassName=\"tlui-dialog__overlay\"\n\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t// We pressed mouse down inside the content of the dialog then moved the mouse\n\t\t\t\t\t\t// outside it and let go of the mouse button. This should not close the dialog.\n\t\t\t\t\t\tif (mouseDownInsideContentRef.current) return\n\t\t\t\t\t\t// only close if the click is on the overlay itself, ignore bubbling clicks\n\t\t\t\t\t\tif (!preventBackgroundClose && e.target === e.currentTarget) handleOpenChange(false)\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<_Dialog.Content\n\t\t\t\t\t\tdir=\"ltr\"\n\t\t\t\t\t\tclassName=\"tlui-dialog__content\"\n\t\t\t\t\t\taria-describedby={undefined}\n\t\t\t\t\t\tonMouseDown={() => (mouseDownInsideContentRef.current = true)}\n\t\t\t\t\t\tonMouseUp={() => (mouseDownInsideContentRef.current = false)}\n\t\t\t\t\t\tonInteractOutside={(e) => {\n\t\t\t\t\t\t\tmouseDownInsideContentRef.current = false\n\t\t\t\t\t\t\tif (preventBackgroundClose) {\n\t\t\t\t\t\t\t\te.preventDefault()\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ModalContent\n\t\t\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\t\t\tmouseDownInsideContentRef.current = false\n\t\t\t\t\t\t\t\thandleOpenChange(false)\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</_Dialog.Content>\n\t\t\t\t</_Dialog.Overlay>\n\t\t\t</_Dialog.Portal>\n\t\t</_Dialog.Root>\n\t)\n}\n\n/** @public @react */\nexport const DefaultDialogs = memo(function DefaultDialogs() {\n\tconst { dialogs } = useDialogs()\n\tconst dialogsArray = useValue('dialogs', () => dialogs.get(), [dialogs])\n\treturn dialogsArray.map((dialog) => <TldrawUiDialog key={dialog.id} {...dialog} />)\n})\n"],
|
|
5
|
+
"mappings": "AAgDM;AAhDN,SAAS,cAAc,gBAAgB;AACvC,SAAS,UAAU,eAAe;AAClC,SAAS,MAAM,aAAa,cAAc;AAC1C,SAAqB,kBAAkB;AAGvC,MAAM,iBAAiB,CAAC,EAAE,IAAI,WAAW,cAAc,uBAAuB,MAAkB;AAC/F,QAAM,EAAE,aAAa,IAAI,WAAW;AACpC,QAAM,4BAA4B,OAAO,KAAK;AAE9C,QAAM,YAAY,aAAa;AAE/B,QAAM,mBAAmB;AAAA,IACxB,CAAC,WAAoB;AACpB,UAAI,CAAC,QAAQ;AACZ,qBAAa,EAAE;AAAA,MAChB;AAAA,IACD;AAAA,IACA,CAAC,IAAI,YAAY;AAAA,EAClB;AAEA,SACC,oBAAC,QAAQ,MAAR,EAAa,cAAc,kBAAkB,aAAW,MACxD,8BAAC,QAAQ,QAAR,EAAe,WACf;AAAA,IAAC,QAAQ;AAAA,IAAR;AAAA,MACA,KAAI;AAAA,MACJ,WAAU;AAAA,MACV,SAAS,CAAC,MAAM;AAGf,YAAI,0BAA0B,QAAS;AAEvC,YAAI,CAAC,0BAA0B,EAAE,WAAW,EAAE,cAAe,kBAAiB,KAAK;AAAA,MACpF;AAAA,MAEA;AAAA,QAAC,QAAQ;AAAA,QAAR;AAAA,UACA,KAAI;AAAA,UACJ,WAAU;AAAA,UACV,oBAAkB;AAAA,UAClB,aAAa,MAAO,0BAA0B,UAAU;AAAA,UACxD,WAAW,MAAO,0BAA0B,UAAU;AAAA,UACtD,mBAAmB,CAAC,MAAM;AACzB,sCAA0B,UAAU;AACpC,gBAAI,wBAAwB;AAC3B,gBAAE,eAAe;AAAA,YAClB;AAAA,UACD;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACA,SAAS,MAAM;AACd,0CAA0B,UAAU;AACpC,iCAAiB,KAAK;AAAA,cACvB;AAAA;AAAA,UACD;AAAA;AAAA,MACD;AAAA;AAAA,EACD,GACD,GACD;AAEF;AAGO,MAAM,iBAAiB,KAAK,SAASA,kBAAiB;AAC5D,QAAM,EAAE,QAAQ,IAAI,WAAW;AAC/B,QAAM,eAAe,SAAS,WAAW,MAAM,QAAQ,IAAI,GAAG,CAAC,OAAO,CAAC;AACvE,SAAO,aAAa,IAAI,CAAC,WAAW,oBAAC,kBAAgC,GAAG,UAAf,OAAO,EAAgB,CAAE;AACnF,CAAC;",
|
|
6
6
|
"names": ["DefaultDialogs"]
|
|
7
7
|
}
|
|
@@ -12,12 +12,12 @@ const namedClassNamesSoThatICanGrepForThis = {
|
|
|
12
12
|
help: "tlui-button__help"
|
|
13
13
|
};
|
|
14
14
|
const TldrawUiButton = React.forwardRef(
|
|
15
|
-
function TldrawUiButton2({ children, type, isActive, ...props }, ref) {
|
|
15
|
+
function TldrawUiButton2({ children, type, htmlButtonType, isActive, ...props }, ref) {
|
|
16
16
|
return /* @__PURE__ */ jsx(
|
|
17
17
|
"button",
|
|
18
18
|
{
|
|
19
19
|
ref,
|
|
20
|
-
type: "button",
|
|
20
|
+
type: htmlButtonType || "button",
|
|
21
21
|
draggable: false,
|
|
22
22
|
"data-isactive": isActive,
|
|
23
23
|
...props,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/lib/ui/components/primitives/Button/TldrawUiButton.tsx"],
|
|
4
|
-
"sourcesContent": ["import classnames from 'classnames'\nimport * as React from 'react'\n\n/** @public */\nexport interface TLUiButtonProps extends React.HTMLAttributes<HTMLButtonElement> {\n\tdisabled?: boolean\n\tisActive?: boolean\n\ttype: 'normal' | 'primary' | 'danger' | 'low' | 'icon' | 'tool' | 'menu' | 'help'\n}\n\nconst namedClassNamesSoThatICanGrepForThis = {\n\tnormal: 'tlui-button__normal',\n\tprimary: 'tlui-button__primary',\n\tdanger: 'tlui-button__danger',\n\tlow: 'tlui-button__low',\n\ticon: 'tlui-button__icon',\n\ttool: 'tlui-button__tool',\n\tmenu: 'tlui-button__menu',\n\thelp: 'tlui-button__help',\n}\n\n/** @public @react */\nexport const TldrawUiButton = React.forwardRef<HTMLButtonElement, TLUiButtonProps>(\n\tfunction TldrawUiButton({ children, type, isActive, ...props }, ref) {\n\t\treturn (\n\t\t\t<button\n\t\t\t\tref={ref}\n\t\t\t\ttype
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import classnames from 'classnames'\nimport * as React from 'react'\n\n/** @public */\nexport interface TLUiButtonProps extends React.HTMLAttributes<HTMLButtonElement> {\n\tdisabled?: boolean\n\tisActive?: boolean\n\ttype: 'normal' | 'primary' | 'danger' | 'low' | 'icon' | 'tool' | 'menu' | 'help'\n\thtmlButtonType?: 'button' | 'submit' | 'reset'\n}\n\nconst namedClassNamesSoThatICanGrepForThis = {\n\tnormal: 'tlui-button__normal',\n\tprimary: 'tlui-button__primary',\n\tdanger: 'tlui-button__danger',\n\tlow: 'tlui-button__low',\n\ticon: 'tlui-button__icon',\n\ttool: 'tlui-button__tool',\n\tmenu: 'tlui-button__menu',\n\thelp: 'tlui-button__help',\n}\n\n/** @public @react */\nexport const TldrawUiButton = React.forwardRef<HTMLButtonElement, TLUiButtonProps>(\n\tfunction TldrawUiButton({ children, type, htmlButtonType, isActive, ...props }, ref) {\n\t\treturn (\n\t\t\t<button\n\t\t\t\tref={ref}\n\t\t\t\ttype={htmlButtonType || 'button'}\n\t\t\t\tdraggable={false}\n\t\t\t\tdata-isactive={isActive}\n\t\t\t\t{...props}\n\t\t\t\tclassName={classnames(\n\t\t\t\t\t'tlui-button',\n\t\t\t\t\tnamedClassNamesSoThatICanGrepForThis[type],\n\t\t\t\t\tprops.className\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t</button>\n\t\t)\n\t}\n)\n"],
|
|
5
|
+
"mappings": "AA0BG;AA1BH,OAAO,gBAAgB;AACvB,YAAY,WAAW;AAUvB,MAAM,uCAAuC;AAAA,EAC5C,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AAAA,EACN,MAAM;AACP;AAGO,MAAM,iBAAiB,MAAM;AAAA,EACnC,SAASA,gBAAe,EAAE,UAAU,MAAM,gBAAgB,UAAU,GAAG,MAAM,GAAG,KAAK;AACpF,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,MAAM,kBAAkB;AAAA,QACxB,WAAW;AAAA,QACX,iBAAe;AAAA,QACd,GAAG;AAAA,QACJ,WAAW;AAAA,UACV;AAAA,UACA,qCAAqC,IAAI;AAAA,UACzC,MAAM;AAAA,QACP;AAAA,QAEC;AAAA;AAAA,IACF;AAAA,EAEF;AACD;",
|
|
6
6
|
"names": ["TldrawUiButton"]
|
|
7
7
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
const version = "4.2.0-canary.
|
|
1
|
+
const version = "4.2.0-canary.88d4fa0b1a42";
|
|
2
2
|
const publishDates = {
|
|
3
3
|
major: "2025-09-18T14:39:22.803Z",
|
|
4
|
-
minor: "2025-11-
|
|
5
|
-
patch: "2025-11-
|
|
4
|
+
minor: "2025-11-11T11:24:10.444Z",
|
|
5
|
+
patch: "2025-11-11T11:24:10.444Z"
|
|
6
6
|
};
|
|
7
7
|
export {
|
|
8
8
|
publishDates,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/lib/ui/version.ts"],
|
|
4
|
-
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.
|
|
4
|
+
"sourcesContent": ["// This file is automatically generated by internal/scripts/refresh-assets.ts.\n// Do not edit manually. Or do, I'm a comment, not a cop.\n\nexport const version = '4.2.0-canary.88d4fa0b1a42'\nexport const publishDates = {\n\tmajor: '2025-09-18T14:39:22.803Z',\n\tminor: '2025-11-11T11:24:10.444Z',\n\tpatch: '2025-11-11T11:24:10.444Z',\n}\n"],
|
|
5
5
|
"mappings": "AAGO,MAAM,UAAU;AAChB,MAAM,eAAe;AAAA,EAC3B,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACR;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "tldraw",
|
|
3
3
|
"description": "A tiny little drawing editor.",
|
|
4
|
-
"version": "4.2.0-canary.
|
|
4
|
+
"version": "4.2.0-canary.88d4fa0b1a42",
|
|
5
5
|
"author": {
|
|
6
6
|
"name": "tldraw Inc.",
|
|
7
7
|
"email": "hello@tldraw.com"
|
|
@@ -62,8 +62,8 @@
|
|
|
62
62
|
"@tiptap/pm": "3.6.2",
|
|
63
63
|
"@tiptap/react": "3.6.2",
|
|
64
64
|
"@tiptap/starter-kit": "3.6.2",
|
|
65
|
-
"@tldraw/editor": "4.2.0-canary.
|
|
66
|
-
"@tldraw/store": "4.2.0-canary.
|
|
65
|
+
"@tldraw/editor": "4.2.0-canary.88d4fa0b1a42",
|
|
66
|
+
"@tldraw/store": "4.2.0-canary.88d4fa0b1a42",
|
|
67
67
|
"classnames": "^2.5.1",
|
|
68
68
|
"hotkeys-js": "^3.13.9",
|
|
69
69
|
"idb": "^7.1.1",
|
|
@@ -4,12 +4,7 @@ import { memo, useCallback, useRef } from 'react'
|
|
|
4
4
|
import { TLUiDialog, useDialogs } from '../context/dialogs'
|
|
5
5
|
|
|
6
6
|
/** @internal */
|
|
7
|
-
const TldrawUiDialog = ({
|
|
8
|
-
id,
|
|
9
|
-
component: ModalContent,
|
|
10
|
-
onClose,
|
|
11
|
-
preventBackgroundClose,
|
|
12
|
-
}: TLUiDialog) => {
|
|
7
|
+
const TldrawUiDialog = ({ id, component: ModalContent, preventBackgroundClose }: TLUiDialog) => {
|
|
13
8
|
const { removeDialog } = useDialogs()
|
|
14
9
|
const mouseDownInsideContentRef = useRef(false)
|
|
15
10
|
|
|
@@ -18,17 +13,10 @@ const TldrawUiDialog = ({
|
|
|
18
13
|
const handleOpenChange = useCallback(
|
|
19
14
|
(isOpen: boolean) => {
|
|
20
15
|
if (!isOpen) {
|
|
21
|
-
if (onClose) {
|
|
22
|
-
try {
|
|
23
|
-
onClose()
|
|
24
|
-
} catch (err: any) {
|
|
25
|
-
console.warn(err)
|
|
26
|
-
}
|
|
27
|
-
}
|
|
28
16
|
removeDialog(id)
|
|
29
17
|
}
|
|
30
18
|
},
|
|
31
|
-
[id,
|
|
19
|
+
[id, removeDialog]
|
|
32
20
|
)
|
|
33
21
|
|
|
34
22
|
return (
|
|
@@ -6,6 +6,7 @@ export interface TLUiButtonProps extends React.HTMLAttributes<HTMLButtonElement>
|
|
|
6
6
|
disabled?: boolean
|
|
7
7
|
isActive?: boolean
|
|
8
8
|
type: 'normal' | 'primary' | 'danger' | 'low' | 'icon' | 'tool' | 'menu' | 'help'
|
|
9
|
+
htmlButtonType?: 'button' | 'submit' | 'reset'
|
|
9
10
|
}
|
|
10
11
|
|
|
11
12
|
const namedClassNamesSoThatICanGrepForThis = {
|
|
@@ -21,11 +22,11 @@ const namedClassNamesSoThatICanGrepForThis = {
|
|
|
21
22
|
|
|
22
23
|
/** @public @react */
|
|
23
24
|
export const TldrawUiButton = React.forwardRef<HTMLButtonElement, TLUiButtonProps>(
|
|
24
|
-
function TldrawUiButton({ children, type, isActive, ...props }, ref) {
|
|
25
|
+
function TldrawUiButton({ children, type, htmlButtonType, isActive, ...props }, ref) {
|
|
25
26
|
return (
|
|
26
27
|
<button
|
|
27
28
|
ref={ref}
|
|
28
|
-
type=
|
|
29
|
+
type={htmlButtonType || 'button'}
|
|
29
30
|
draggable={false}
|
|
30
31
|
data-isactive={isActive}
|
|
31
32
|
{...props}
|
package/src/lib/ui/version.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
// This file is automatically generated by internal/scripts/refresh-assets.ts.
|
|
2
2
|
// Do not edit manually. Or do, I'm a comment, not a cop.
|
|
3
3
|
|
|
4
|
-
export const version = '4.2.0-canary.
|
|
4
|
+
export const version = '4.2.0-canary.88d4fa0b1a42'
|
|
5
5
|
export const publishDates = {
|
|
6
6
|
major: '2025-09-18T14:39:22.803Z',
|
|
7
|
-
minor: '2025-11-
|
|
8
|
-
patch: '2025-11-
|
|
7
|
+
minor: '2025-11-11T11:24:10.444Z',
|
|
8
|
+
patch: '2025-11-11T11:24:10.444Z',
|
|
9
9
|
}
|