@tldraw/tldraw 3.16.0-next.282b7be564ae → 3.16.0-next.4337ae1ab96d

package/dist-cjs/index.js

@@ -19,7 +19,7 @@ var import_tldraw = require("tldraw");
 __reExport(index_exports, require("tldraw"), module.exports);
 (0, import_tldraw.registerTldrawLibraryVersion)(
   "@tldraw/tldraw",
-  "3.16.0-next.282b7be564ae",
+  "3.16.0-next.4337ae1ab96d",
   "cjs"
 );
 //# sourceMappingURL=index.js.map

package/dist-esm/index.mjs

@@ -2,7 +2,7 @@ import { registerTldrawLibraryVersion } from "tldraw";
 export * from "tldraw";
 registerTldrawLibraryVersion(
   "@tldraw/tldraw",
-  "3.16.0-next.282b7be564ae",
+  "3.16.0-next.4337ae1ab96d",
   "esm"
 );
 //# sourceMappingURL=index.mjs.map

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tldraw/tldraw",
   "description": "A tiny little drawing editor.",
-  "version": "3.16.0-next.282b7be564ae",
+  "version": "3.16.0-next.4337ae1ab96d",
   "author": {
     "name": "tldraw Inc.",
     "email": "hello@tldraw.com"
@@ -27,9 +27,9 @@
   ],
   "main": "dist-cjs/index.js",
   "scripts": {
-    "test-ci": "lazy inherit",
-    "test": "yarn run -T jest",
-    "test-coverage": "lazy inherit",
+    "test-ci": "yarn run -T vitest run --passWithNoTests",
+    "test": "yarn run -T vitest --passWithNoTests",
+    "test-coverage": "yarn run -T vitest run --coverage --passWithNoTests",
     "predev": "node ./scripts/copy-css-files.mjs",
     "dev": "chokidar '../tldraw/tldraw.css' -c 'node ./scripts/copy-css-files.mjs'",
     "prebuild": "node ./scripts/copy-css-files.mjs",
@@ -38,7 +38,8 @@
     "prepack": "yarn run -T tsx ../../internal/scripts/prepack.ts",
     "postpack": "../../internal/scripts/postpack.sh",
     "pack-tarball": "yarn pack",
-    "lint": "yarn run -T tsx ../../internal/scripts/lint.ts"
+    "lint": "yarn run -T tsx ../../internal/scripts/lint.ts",
+    "context": "yarn run -T tsx ../../internal/scripts/context.ts"
   },
   "files": [
     "tldraw.css",
@@ -47,7 +48,7 @@
     "src"
   ],
   "dependencies": {
-    "tldraw": "3.16.0-next.282b7be564ae"
+    "tldraw": "3.16.0-next.4337ae1ab96d"
   },
   "peerDependencies": {
     "react": "^18.2.0 || ^19.0.0",
@@ -60,27 +61,6 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },
-  "jest": {
-    "preset": "../../internal/config/jest/node/jest-preset.js",
-    "testEnvironment": "../../../packages/utils/patchedJestJsDom.js",
-    "fakeTimers": {
-      "enableGlobally": true
-    },
-    "testPathIgnorePatterns": [
-      "^.+\\.*.css$"
-    ],
-    "moduleNameMapper": {
-      "^~(.*)": "<rootDir>/src/$1",
-      "\\.(css|less|scss|sass)$": "identity-obj-proxy"
-    },
-    "setupFiles": [
-      "raf/polyfill",
-      "jest-canvas-mock"
-    ],
-    "setupFilesAfterEnv": [
-      "../../internal/config/setupJest.ts"
-    ]
-  },
   "module": "dist-esm/index.mjs",
   "source": "src/index.ts",
   "exports": {

package/tldraw.css

@@ -33,6 +33,7 @@
 	--tl-layer-watermark: 200;
 	--tl-layer-canvas-shapes: 300;
 	--tl-layer-canvas-overlays: 500;
+	--tl-layer-canvas-in-front: 600;
 	--tl-layer-canvas-blocker: 10000;
 
 	/* Canvas overlays z-index */
@@ -301,6 +302,13 @@ input,
 	contain: strict;
 }
 
+.tl-canvas__in-front {
+	position: absolute;
+	inset: 0;
+	pointer-events: none;
+	z-index: var(--tl-layer-canvas-in-front);
+}
+
 .tl-shapes {
 	position: relative;
 	z-index: var(--tl-layer-canvas-shapes);
@@ -2790,9 +2798,23 @@ it from receiving any pointer events or affecting the cursor. */
 	flex-direction: column;
 }
 
-.tlui-style-panel__section:nth-of-type(n + 2):not(:last-child) {
+/*
+add a border to the bottom of all but the last section. we have to handle empty sections too, which
+are hidden and shouldn't be counted
+*/
+.tlui-style-panel__section:not(:nth-last-child(-n + 1 of .tlui-style-panel__section:not(:empty))) {
 	border-bottom: 1px solid var(--tl-color-divider);
 }
+/*
+if a section ends with a slider and we're adding a border, we need some extra space for visual
+balance. we need to handle empty sections as above. is this the most complex css selector in all of
+tldraw? probably.
+*/
+.tlui-style-panel__section:has(.tlui-slider__container:last-child):not(
+		:nth-last-child(-n + 1 of .tlui-style-panel__section:not(:empty))
+	) {
+	margin-bottom: 7px;
+}
 
 .tlui-style-panel__section:empty {
 	display: none;
@@ -2804,7 +2826,7 @@ it from receiving any pointer events or affecting the cursor. */
 }
 
 .tlui-style-panel__dropdown-picker:only-child {
-	width: 100%;
+	flex: 1;
 }
 
 .tlui-style-panel__double-select-picker {
@@ -2830,6 +2852,9 @@ it from receiving any pointer events or affecting the cursor. */
 }
 
 @media (hover: hover) {
+	.tlui-style-panel .tlui-button[aria-expanded='true'] {
+		background: none;
+	}
 	.tlui-style-panel .tlui-button[data-state='open']:not(:hover)::after {
 		opacity: 1;
 		background: linear-gradient(270deg, rgba(144, 144, 144, 0) 0%, var(--tl-color-muted-2) 100%);