mirror of
https://github.com/logseq/logseq.git
synced 2026-04-24 14:14:55 +00:00
run prettier
This commit is contained in:
@@ -91,7 +91,7 @@
|
||||
(and (not journal?)
|
||||
(util/create-title-property? page-name)))
|
||||
|
||||
(defn- build-page-tx [format properties page journal?]
|
||||
(defn- build-page-tx [format properties page journal? whiteboard?]
|
||||
(when (:block/uuid page)
|
||||
(let [page-entity [:block/uuid (:block/uuid page)]
|
||||
create-title? (create-title-property? journal?
|
||||
@@ -123,7 +123,7 @@
|
||||
:uuid - when set, use this uuid instead of generating a new one."
|
||||
([title]
|
||||
(create! title {}))
|
||||
([title {:keys [redirect? create-first-block? format properties split-namespace? journal? uuid]
|
||||
([title {:keys [redirect? create-first-block? format properties split-namespace? journal? whiteboard? uuid]
|
||||
:or {redirect? true
|
||||
create-first-block? true
|
||||
format nil
|
||||
|
||||
@@ -8,4 +8,4 @@
|
||||
"jsxSingleQuote": false,
|
||||
"jsxBracketSameLine": false,
|
||||
"arrowParens": "avoid"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11,9 +11,9 @@ const packageJson = fs.readFileSync('package.json', 'utf8')
|
||||
const glob = JSON.parse(packageJson)
|
||||
Object.assign(glob, {
|
||||
main: './index.js',
|
||||
module: './index.mjs'
|
||||
module: './index.mjs',
|
||||
})
|
||||
|
||||
fs.writeFileSync('dist/package.json', JSON.stringify(glob, null, 2))
|
||||
|
||||
await $`ln -f ${__dirname}/dist/index.js ${__dirname}/../../../src/js/tldraw-logseq.js`
|
||||
await $`ln -f ${__dirname}/dist/index.js ${__dirname}/../../../src/js/tldraw-logseq.js`
|
||||
|
||||
@@ -1 +1 @@
|
||||
export * from './ActionBar';
|
||||
export * from './ActionBar'
|
||||
|
||||
@@ -7,7 +7,7 @@ import { DevTools } from './Devtools'
|
||||
import { Minimap } from './Minimap'
|
||||
import { ActionBar } from './ActionBar'
|
||||
|
||||
const isDev = process.env.NODE_ENV === 'development'
|
||||
const isDev = process.env.NODE_ENV !== 'development'
|
||||
|
||||
export const AppUI = observer(function AppUI() {
|
||||
return (
|
||||
|
||||
@@ -52,9 +52,5 @@ export const DevTools = observer(() => {
|
||||
)
|
||||
: null
|
||||
|
||||
return (
|
||||
<>
|
||||
{rendererStatus}
|
||||
</>
|
||||
)
|
||||
return <>{rendererStatus}</>
|
||||
})
|
||||
|
||||
@@ -10,7 +10,9 @@ export const Minimap = observer(function Minimap() {
|
||||
const app = useApp()
|
||||
|
||||
const [whiteboardPreviewManager] = React.useState(() => new PreviewManager(app.serialized))
|
||||
const [preview, setPreview] = React.useState(() => whiteboardPreviewManager.generatePreviewJsx(app.viewport))
|
||||
const [preview, setPreview] = React.useState(() =>
|
||||
whiteboardPreviewManager.generatePreviewJsx(app.viewport)
|
||||
)
|
||||
|
||||
const [active, setActive] = React.useState(false)
|
||||
|
||||
@@ -36,7 +38,7 @@ export const Minimap = observer(function Minimap() {
|
||||
|
||||
return (
|
||||
<>
|
||||
{active && (
|
||||
{active && (
|
||||
<div className="preview-minimap" {...events}>
|
||||
{preview}
|
||||
</div>
|
||||
@@ -48,7 +50,6 @@ export const Minimap = observer(function Minimap() {
|
||||
>
|
||||
<Crosshair2Icon />
|
||||
</button>
|
||||
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
@@ -9,10 +9,25 @@ export const StatusBar = observer(function StatusBar() {
|
||||
const app = useApp<Shape>()
|
||||
React.useEffect(() => {
|
||||
const canvas = document.querySelector<HTMLElement>('.logseq-tldraw-wrapper .tl-canvas')
|
||||
const actionBar = document.querySelector<HTMLElement>('.logseq-tldraw-wrapper .action-bar')
|
||||
if (canvas) {
|
||||
canvas.style.height = 'calc(100% - 32px)'
|
||||
}
|
||||
}, [])
|
||||
|
||||
if (actionBar) {
|
||||
actionBar.style.marginBottom = '32px'
|
||||
}
|
||||
|
||||
return () => {
|
||||
if (canvas) {
|
||||
canvas.style.height = '100%'
|
||||
}
|
||||
|
||||
if (actionBar) {
|
||||
actionBar.style.marginBottom = '0px'
|
||||
}
|
||||
}
|
||||
})
|
||||
return (
|
||||
<div className="statusbar">
|
||||
{app.selectedTool.id} | {app.selectedTool.currentState.id}
|
||||
|
||||
@@ -15,4 +15,4 @@ export * from './EraserIcon'
|
||||
export * from './MultiplayerIcon'
|
||||
export * from './DiscordIcon'
|
||||
export * from './LineIcon'
|
||||
export * from './LogseqIcon'
|
||||
export * from './LogseqIcon'
|
||||
|
||||
@@ -27,7 +27,7 @@ export function ColorInput({ label, value, onChange, ...rest }: ColorInputProps)
|
||||
name={`color-${label}`}
|
||||
type="color"
|
||||
value={computedValue}
|
||||
onChange={(e) => {
|
||||
onChange={e => {
|
||||
setComputedValue(e.target.value)
|
||||
onChange?.(e)
|
||||
}}
|
||||
|
||||
@@ -273,7 +273,7 @@ export class TextShape extends TLTextShape<TextShapeProps> {
|
||||
const {
|
||||
props: { text, stroke, fontSize, fontFamily },
|
||||
} = this
|
||||
// Stretch to the bound size
|
||||
// Stretch to the bound size
|
||||
const bounds = this.getBounds()
|
||||
|
||||
return (
|
||||
|
||||
@@ -20,25 +20,25 @@ export type Easing =
|
||||
| 'easeInOutExpo'
|
||||
|
||||
export const EASINGS: Record<Easing, (t: number) => number> = {
|
||||
linear: (t) => t,
|
||||
easeInQuad: (t) => t * t,
|
||||
easeOutQuad: (t) => t * (2 - t),
|
||||
easeInOutQuad: (t) => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),
|
||||
easeInCubic: (t) => t * t * t,
|
||||
easeOutCubic: (t) => --t * t * t + 1,
|
||||
easeInOutCubic: (t) => (t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1),
|
||||
easeInQuart: (t) => t * t * t * t,
|
||||
easeOutQuart: (t) => 1 - --t * t * t * t,
|
||||
easeInOutQuart: (t) => (t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t),
|
||||
easeInQuint: (t) => t * t * t * t * t,
|
||||
easeOutQuint: (t) => 1 + --t * t * t * t * t,
|
||||
easeInOutQuint: (t) => (t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t),
|
||||
easeInSine: (t) => 1 - Math.cos((t * Math.PI) / 2),
|
||||
easeOutSine: (t) => Math.sin((t * Math.PI) / 2),
|
||||
easeInOutSine: (t) => -(Math.cos(Math.PI * t) - 1) / 2,
|
||||
easeInExpo: (t) => (t <= 0 ? 0 : Math.pow(2, 10 * t - 10)),
|
||||
easeOutExpo: (t) => (t >= 1 ? 1 : 1 - Math.pow(2, -10 * t)),
|
||||
easeInOutExpo: (t) =>
|
||||
linear: t => t,
|
||||
easeInQuad: t => t * t,
|
||||
easeOutQuad: t => t * (2 - t),
|
||||
easeInOutQuad: t => (t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t),
|
||||
easeInCubic: t => t * t * t,
|
||||
easeOutCubic: t => --t * t * t + 1,
|
||||
easeInOutCubic: t => (t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1),
|
||||
easeInQuart: t => t * t * t * t,
|
||||
easeOutQuart: t => 1 - --t * t * t * t,
|
||||
easeInOutQuart: t => (t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t),
|
||||
easeInQuint: t => t * t * t * t * t,
|
||||
easeOutQuint: t => 1 + --t * t * t * t * t,
|
||||
easeInOutQuint: t => (t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t),
|
||||
easeInSine: t => 1 - Math.cos((t * Math.PI) / 2),
|
||||
easeOutSine: t => Math.sin((t * Math.PI) / 2),
|
||||
easeInOutSine: t => -(Math.cos(Math.PI * t) - 1) / 2,
|
||||
easeInExpo: t => (t <= 0 ? 0 : Math.pow(2, 10 * t - 10)),
|
||||
easeOutExpo: t => (t >= 1 ? 1 : 1 - Math.pow(2, -10 * t)),
|
||||
easeInOutExpo: t =>
|
||||
t <= 0
|
||||
? 0
|
||||
: t >= 1
|
||||
@@ -46,4 +46,4 @@ export const EASINGS: Record<Easing, (t: number) => number> = {
|
||||
: t < 0.5
|
||||
? Math.pow(2, 20 * t - 10) / 2
|
||||
: (2 - Math.pow(2, -20 * t + 10)) / 2,
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,4 +49,4 @@ export const shapes: TLReactShapeConstructor<Shape>[] = [
|
||||
TextShape,
|
||||
YouTubeShape,
|
||||
LogseqPortalShape,
|
||||
]
|
||||
]
|
||||
|
||||
@@ -24,7 +24,10 @@ export class TextAreaUtils {
|
||||
)
|
||||
}
|
||||
|
||||
/** Inserts `text` at the cursor’s position, replacing any selection, with **undo** support and by firing the `input` event. */
|
||||
/**
|
||||
* Inserts `text` at the cursor’s position, replacing any selection, with **undo** support and by
|
||||
* firing the `input` event.
|
||||
*/
|
||||
static insert(field: HTMLTextAreaElement | HTMLInputElement, text: string): void {
|
||||
const document = field.ownerDocument
|
||||
const initialFocus = document.activeElement
|
||||
@@ -43,7 +46,10 @@ export class TextAreaUtils {
|
||||
}
|
||||
}
|
||||
|
||||
/** Replaces the entire content, equivalent to `field.value = text` but with **undo** support and by firing the `input` event. */
|
||||
/**
|
||||
* Replaces the entire content, equivalent to `field.value = text` but with **undo** support and
|
||||
* by firing the `input` event.
|
||||
*/
|
||||
static set(field: HTMLTextAreaElement | HTMLInputElement, text: string): void {
|
||||
field.select()
|
||||
TextAreaUtils.insert(field, text)
|
||||
@@ -58,7 +64,10 @@ export class TextAreaUtils {
|
||||
)
|
||||
}
|
||||
|
||||
/** Adds the `wrappingText` before and after field’s selection (or cursor). If `endWrappingText` is provided, it will be used instead of `wrappingText` at on the right. */
|
||||
/**
|
||||
* Adds the `wrappingText` before and after field’s selection (or cursor). If `endWrappingText` is
|
||||
* provided, it will be used instead of `wrappingText` at on the right.
|
||||
*/
|
||||
static wrapSelection(
|
||||
field: HTMLTextAreaElement | HTMLInputElement,
|
||||
wrap: string,
|
||||
@@ -73,7 +82,10 @@ export class TextAreaUtils {
|
||||
field.selectionEnd = (selectionEnd || 0) + wrap.length
|
||||
}
|
||||
|
||||
/** Finds and replaces strings and regex in the field’s value, like `field.value = field.value.replace()` but better */
|
||||
/**
|
||||
* Finds and replaces strings and regex in the field’s value, like `field.value =
|
||||
* field.value.replace()` but better
|
||||
*/
|
||||
static replace(
|
||||
field: HTMLTextAreaElement | HTMLInputElement,
|
||||
searchValue: string | RegExp,
|
||||
|
||||
@@ -183,4 +183,3 @@ export const TextLabel = React.memo(function TextLabel({
|
||||
</div>
|
||||
)
|
||||
})
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { LETTER_SPACING } from "./constants"
|
||||
import { LETTER_SPACING } from './constants'
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
let melm: any
|
||||
|
||||
@@ -54,13 +54,13 @@
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
|
||||
.logseq-tldraw .action-bar {
|
||||
position: absolute;
|
||||
bottom: 31px;
|
||||
bottom: 0;
|
||||
|
||||
/* width: 100%; */
|
||||
float: left;
|
||||
left: 0px;
|
||||
left: 0;
|
||||
grid-row: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -68,6 +68,8 @@
|
||||
color: black;
|
||||
border-top-right-radius: 15px;
|
||||
border: black solid 1px;
|
||||
border-left: none;
|
||||
border-bottom: none;
|
||||
z-index: 100000;
|
||||
user-select: none;
|
||||
background: white;
|
||||
@@ -87,7 +89,7 @@
|
||||
background-color: #fff;
|
||||
border-radius: 6px;
|
||||
padding: 5px;
|
||||
box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2);
|
||||
box-shadow: 0 10px 38px -10px rgba(22, 23, 24, 0.35), 0 10px 20px -15px rgba(22, 23, 24, 0.2);
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
@@ -100,10 +102,11 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 25px;
|
||||
padding: 0px 5px;
|
||||
padding: 0 5px;
|
||||
position: relative;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.dropdown-item:focus {
|
||||
color: white;
|
||||
background-color: black;
|
||||
@@ -115,7 +118,7 @@
|
||||
color: black;
|
||||
}
|
||||
|
||||
.right-slot:focus{
|
||||
.right-slot:focus {
|
||||
color: whites;
|
||||
}
|
||||
|
||||
@@ -258,7 +261,7 @@
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.logseq-tldraw .floating-panel>button {
|
||||
.logseq-tldraw .floating-panel > button {
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -286,7 +289,7 @@
|
||||
color: var(--color-selectedContrast);
|
||||
}
|
||||
|
||||
.logseq-tldraw .floating-panel[data-tool-locked='true']>.button[data-selected='true']::after {
|
||||
.logseq-tldraw .floating-panel[data-tool-locked='true'] > .button[data-selected='true']::after {
|
||||
content: '';
|
||||
display: block;
|
||||
height: 6px;
|
||||
@@ -458,6 +461,7 @@
|
||||
.logseq-tldraw .preview-minimap {
|
||||
height: 300px;
|
||||
width: 400px;
|
||||
|
||||
/* Set top to be the viewport minus 10px */
|
||||
bottom: calc(100vh - 320px);
|
||||
|
||||
@@ -605,4 +609,4 @@ html[data-theme='light'] .logseq-tldraw .tl-logseq-portal-header {
|
||||
|
||||
html[data-theme='dark'] .logseq-tldraw .tl-logseq-portal-header {
|
||||
backdrop-filter: brightness(1.2);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"~*": ["src/*"]
|
||||
},
|
||||
}
|
||||
},
|
||||
"references": [
|
||||
{ "path": "../../packages/core" },
|
||||
|
||||
@@ -10,6 +10,6 @@ export default defineConfig({
|
||||
'.png': 'base64',
|
||||
},
|
||||
env: {
|
||||
NODE_ENV: 'production'
|
||||
}
|
||||
NODE_ENV: 'production',
|
||||
},
|
||||
})
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
/>
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
|
||||
</head>
|
||||
<body >
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script src="js/main.js"></script>
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
module.exports = {
|
||||
// just import everything for ease of dev
|
||||
// just import everything for ease of dev
|
||||
safelist: [{ pattern: /.*/ }],
|
||||
theme: {
|
||||
extend: {},
|
||||
|
||||
@@ -23,8 +23,8 @@ export default defineConfig({
|
||||
server: {
|
||||
port: '3031',
|
||||
fs: {
|
||||
strict: false
|
||||
}
|
||||
strict: false,
|
||||
},
|
||||
},
|
||||
resolve: {
|
||||
alias: [
|
||||
|
||||
@@ -141,7 +141,7 @@ export class TLApi<S extends TLShape = TLShape, K extends TLEventMap = TLEventMa
|
||||
this.app.viewport.update({
|
||||
point: Vec.add(Vec.neg(BoundsUtils.getBoundsCenter(commonBounds)), [
|
||||
this.app.viewport.currentView.width / 2,
|
||||
this.app.viewport.currentView.height/ 2,
|
||||
this.app.viewport.currentView.height / 2,
|
||||
]),
|
||||
})
|
||||
return this
|
||||
|
||||
@@ -6,15 +6,28 @@ import { action, computed, makeObservable, observable, transaction } from 'mobx'
|
||||
import { GRID_SIZE } from '~constants'
|
||||
import {
|
||||
TLInputs,
|
||||
TLPage, TLPageModel, TLSelectTool, TLShape, TLShapeConstructor,
|
||||
TLShapeModel, TLToolConstructor, TLViewport
|
||||
TLPage,
|
||||
TLPageModel,
|
||||
TLSelectTool,
|
||||
TLShape,
|
||||
TLShapeConstructor,
|
||||
TLShapeModel,
|
||||
TLToolConstructor,
|
||||
TLViewport,
|
||||
} from '~lib'
|
||||
import { TLApi } from '~lib/TLApi'
|
||||
import { TLCursors } from '~lib/TLCursors'
|
||||
import type {
|
||||
TLAsset, TLBounds, TLCallback, TLEventMap, TLEvents, TLShortcut, TLStateEvents, TLSubscription,
|
||||
TLAsset,
|
||||
TLBounds,
|
||||
TLCallback,
|
||||
TLEventMap,
|
||||
TLEvents,
|
||||
TLShortcut,
|
||||
TLStateEvents,
|
||||
TLSubscription,
|
||||
TLSubscriptionEventInfo,
|
||||
TLSubscriptionEventName
|
||||
TLSubscriptionEventName,
|
||||
} from '~types'
|
||||
import { BoundsUtils, KeyUtils } from '~utils'
|
||||
import { TLHistory } from '../TLHistory'
|
||||
|
||||
@@ -10,7 +10,7 @@ export class TLViewport {
|
||||
|
||||
static readonly minZoom = 0.25
|
||||
static readonly maxZoom = 4
|
||||
static readonly zooms = [0.25, 0.5, 1, 1.5 , 2, 3, 4]
|
||||
static readonly zooms = [0.25, 0.5, 1, 1.5, 2, 3, 4]
|
||||
|
||||
/* ------------------- Properties ------------------- */
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ export class TLBoxShape<P extends TLBoxShapeProps = TLBoxShapeProps, M = any> ex
|
||||
}
|
||||
|
||||
static id = 'box'
|
||||
|
||||
|
||||
canBind = true
|
||||
|
||||
static defaultProps: TLBoxShapeProps = {
|
||||
|
||||
@@ -66,29 +66,28 @@ export class ResizingState<
|
||||
this.initialCommonBounds = { ...selectionBounds }
|
||||
// @ts-expect-error maybe later
|
||||
this.snapshots = Object.fromEntries(
|
||||
selectedShapesArray
|
||||
.map(shape => {
|
||||
const bounds = { ...shape.bounds }
|
||||
const [cx, cy] = BoundsUtils.getBoundsCenter(bounds)
|
||||
return [
|
||||
shape.id,
|
||||
{
|
||||
props: shape.serialized,
|
||||
bounds,
|
||||
transformOrigin: [
|
||||
(cx - this.initialCommonBounds.minX) / this.initialCommonBounds.width,
|
||||
(cy - this.initialCommonBounds.minY) / this.initialCommonBounds.height,
|
||||
],
|
||||
innerTransformOrigin: [
|
||||
(cx - initialInnerBounds.minX) / initialInnerBounds.width,
|
||||
(cy - initialInnerBounds.minY) / initialInnerBounds.height,
|
||||
],
|
||||
isAspectRatioLocked:
|
||||
shape.props.isAspectRatioLocked ||
|
||||
Boolean(!shape.canChangeAspectRatio || shape.props.rotation),
|
||||
},
|
||||
]
|
||||
})
|
||||
selectedShapesArray.map(shape => {
|
||||
const bounds = { ...shape.bounds }
|
||||
const [cx, cy] = BoundsUtils.getBoundsCenter(bounds)
|
||||
return [
|
||||
shape.id,
|
||||
{
|
||||
props: shape.serialized,
|
||||
bounds,
|
||||
transformOrigin: [
|
||||
(cx - this.initialCommonBounds.minX) / this.initialCommonBounds.width,
|
||||
(cy - this.initialCommonBounds.minY) / this.initialCommonBounds.height,
|
||||
],
|
||||
innerTransformOrigin: [
|
||||
(cx - initialInnerBounds.minX) / initialInnerBounds.width,
|
||||
(cy - initialInnerBounds.minY) / initialInnerBounds.height,
|
||||
],
|
||||
isAspectRatioLocked:
|
||||
shape.props.isAspectRatioLocked ||
|
||||
Boolean(!shape.canChangeAspectRatio || shape.props.rotation),
|
||||
},
|
||||
]
|
||||
})
|
||||
)
|
||||
selectedShapesArray.forEach(shape => shape.onResizeStart?.({ isSingle: this.isSingle }))
|
||||
}
|
||||
|
||||
@@ -168,7 +168,7 @@ export type TLSubscriptionEvent =
|
||||
event: 'delete-assets'
|
||||
info: { assets: TLAsset[] }
|
||||
}
|
||||
| {
|
||||
| {
|
||||
event: 'canvas-dbclick'
|
||||
info: { point: number[] }
|
||||
}
|
||||
|
||||
@@ -106,8 +106,8 @@ export class PolygonUtils {
|
||||
}
|
||||
|
||||
static getPolygonCentroid(points: number[][]): number[] {
|
||||
const x = points.map((point) => point[0])
|
||||
const y = points.map((point) => point[1])
|
||||
const x = points.map(point => point[0])
|
||||
const y = points.map(point => point[1])
|
||||
const cx = Math.min(...x) + Math.max(...x)
|
||||
const cy = Math.min(...y) + Math.max(...y)
|
||||
return [cx ? cx / 2 : 0, cy ? cy / 2 : 0]
|
||||
|
||||
@@ -62,4 +62,3 @@ export function isDarwin(): boolean {
|
||||
export function modKey(e: any): boolean {
|
||||
return isDarwin() ? e.metaKey : e.ctrlKey
|
||||
}
|
||||
|
||||
|
||||
@@ -35,7 +35,7 @@ export const EdgeHandle = observer<EdgeHandleProps>(function EdgeHandle({
|
||||
|
||||
return (
|
||||
<rect
|
||||
pointerEvents={(isHidden || disabled) ? 'none' : 'all'}
|
||||
pointerEvents={isHidden || disabled ? 'none' : 'all'}
|
||||
className={'tl-transparent tl-edge-handle ' + (isHidden ? '' : edgeClassnames[edge])}
|
||||
aria-label={`${edge} target`}
|
||||
opacity={isHidden ? 0 : 1}
|
||||
|
||||
@@ -16,11 +16,11 @@ export function useKeyboardEvents() {
|
||||
}
|
||||
window.addEventListener('keydown', onKeyDown)
|
||||
window.addEventListener('keyup', onKeyUp)
|
||||
document.addEventListener('paste', (e) => {
|
||||
document.addEventListener('paste', e => {
|
||||
e.preventDefault()
|
||||
app.paste(e)
|
||||
})
|
||||
document.addEventListener('copy', (e) => {
|
||||
document.addEventListener('copy', e => {
|
||||
e.preventDefault()
|
||||
app.copy()
|
||||
})
|
||||
|
||||
@@ -46,4 +46,4 @@ export function useMinimapEvents() {
|
||||
}, [callbacks])
|
||||
|
||||
return events
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@ export function useSetup<
|
||||
onDeleteShapes,
|
||||
onFileDrop,
|
||||
onPaste,
|
||||
onCanvasDBClick
|
||||
onCanvasDBClick,
|
||||
} = props
|
||||
|
||||
React.useLayoutEffect(() => {
|
||||
|
||||
@@ -3,5 +3,5 @@ import type { TLReactShape } from './TLReactShape'
|
||||
import type { TLReactEventMap } from '~types'
|
||||
|
||||
export class TLReactApp<S extends TLReactShape = TLReactShape> extends TLApp<S, TLReactEventMap> {
|
||||
pubEvent?: any
|
||||
pubEvent?: any
|
||||
}
|
||||
|
||||
@@ -35,4 +35,4 @@
|
||||
"clean": "rm -rf dist"
|
||||
},
|
||||
"gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -37,4 +37,4 @@
|
||||
"@tldraw/vec": "2.0.0-alpha.1"
|
||||
},
|
||||
"gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -18,6 +18,7 @@ export interface TLBounds {
|
||||
|
||||
/**
|
||||
* Get an intersection.
|
||||
*
|
||||
* @param message
|
||||
* @param points
|
||||
* @internal
|
||||
@@ -28,7 +29,6 @@ function createIntersection(message: string, ...points: number[][]): TLIntersect
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param rotation
|
||||
@@ -51,6 +51,7 @@ function getRectangleSides(point: number[], size: number[], rotation = 0): [stri
|
||||
|
||||
/**
|
||||
* Get whether angle c lies between angles a and b.
|
||||
*
|
||||
* @param a
|
||||
* @param b
|
||||
* @param c
|
||||
@@ -94,6 +95,7 @@ export function intersectLineLine(AB: number[][], PQ: number[][]): number[] | un
|
||||
|
||||
/**
|
||||
* Find the intersection between a ray and a ray.
|
||||
*
|
||||
* @param p0 The first ray's point
|
||||
* @param n0 The first ray's direction vector.
|
||||
* @param p1 The second ray's point.
|
||||
@@ -126,6 +128,7 @@ export function intersectRayRay(
|
||||
|
||||
/**
|
||||
* Find the intersections between a ray and a line segment.
|
||||
*
|
||||
* @param origin
|
||||
* @param direction
|
||||
* @param a1
|
||||
@@ -157,6 +160,7 @@ export function intersectRayLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a ray and a rectangle.
|
||||
*
|
||||
* @param origin
|
||||
* @param direction
|
||||
* @param point
|
||||
@@ -175,6 +179,7 @@ export function intersectRayRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a ray and an ellipse.
|
||||
*
|
||||
* @param origin
|
||||
* @param direction
|
||||
* @param center
|
||||
@@ -197,6 +202,7 @@ export function intersectRayEllipse(
|
||||
|
||||
/**
|
||||
* Find the intersections between a ray and a bounding box.
|
||||
*
|
||||
* @param origin
|
||||
* @param direction
|
||||
* @param bounds
|
||||
@@ -218,6 +224,7 @@ export function intersectRayBounds(
|
||||
|
||||
/**
|
||||
* Find the intersection between a line segment and a ray.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param origin
|
||||
@@ -234,6 +241,7 @@ export function intersectLineSegmentRay(
|
||||
|
||||
/**
|
||||
* Find the intersection between a line segment and a line segment.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param b1
|
||||
@@ -274,6 +282,7 @@ export function intersectLineSegmentLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a line segment and a rectangle.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param point
|
||||
@@ -290,6 +299,7 @@ export function intersectLineSegmentRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a line segment and an arc.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param center
|
||||
@@ -311,7 +321,7 @@ export function intersectLineSegmentArc(
|
||||
|
||||
if (!ellipseTest.didIntersect) return createIntersection('no intersection')
|
||||
|
||||
const points = ellipseTest.points.filter((point) =>
|
||||
const points = ellipseTest.points.filter(point =>
|
||||
isAngleBetween(sa, ea, Vec.angle(center, point))
|
||||
)
|
||||
|
||||
@@ -324,6 +334,7 @@ export function intersectLineSegmentArc(
|
||||
|
||||
/**
|
||||
* Find the intersections between a line segment and a circle.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param c
|
||||
@@ -375,6 +386,7 @@ export function intersectLineSegmentCircle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a line segment and an ellipse.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param center
|
||||
@@ -429,15 +441,16 @@ export function intersectLineSegmentEllipse(
|
||||
// Filter to only points that are on the segment.
|
||||
// Solve for points, then counter-rotate points.
|
||||
const points = tValues
|
||||
.filter((t) => t >= 0 && t <= 1)
|
||||
.map((t) => Vec.add(center, Vec.add(a1, Vec.mul(Vec.sub(a2, a1), t))))
|
||||
.map((p) => Vec.rotWith(p, center, rotation))
|
||||
.filter(t => t >= 0 && t <= 1)
|
||||
.map(t => Vec.add(center, Vec.add(a1, Vec.mul(Vec.sub(a2, a1), t))))
|
||||
.map(p => Vec.rotWith(p, center, rotation))
|
||||
|
||||
return createIntersection('intersection', ...points)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a line segment and a bounding box.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param bounds
|
||||
@@ -452,6 +465,7 @@ export function intersectLineSegmentBounds(
|
||||
|
||||
/**
|
||||
* Find the intersections between a line segment and a polyline.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param points
|
||||
@@ -479,6 +493,7 @@ export function intersectLineSegmentPolyline(
|
||||
}
|
||||
/**
|
||||
* Find the intersections between a line segment and a closed polygon.
|
||||
*
|
||||
* @param a1
|
||||
* @param a2
|
||||
* @param points
|
||||
@@ -511,6 +526,7 @@ export function intersectLineSegmentPolygon(
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a ray.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param rotation
|
||||
@@ -537,11 +553,12 @@ export function intersectRectangleRay(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a line segment.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param a1
|
||||
@@ -566,11 +583,12 @@ export function intersectRectangleLineSegment(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a rectangle.
|
||||
*
|
||||
* @param point1
|
||||
* @param size1
|
||||
* @param point2
|
||||
@@ -587,9 +605,7 @@ export function intersectRectangleRectangle(
|
||||
const intersections = intersectRectangleLineSegment(point2, size2, a1, a2)
|
||||
|
||||
acc.push(
|
||||
...intersections.map((int) =>
|
||||
createIntersection(`${message} ${int.message}`, ...int.points)
|
||||
)
|
||||
...intersections.map(int => createIntersection(`${message} ${int.message}`, ...int.points))
|
||||
)
|
||||
|
||||
return acc
|
||||
@@ -597,11 +613,12 @@ export function intersectRectangleRectangle(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and an arc.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param center
|
||||
@@ -630,11 +647,12 @@ export function intersectRectangleArc(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a circle.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param c
|
||||
@@ -659,11 +677,12 @@ export function intersectRectangleCircle(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and an ellipse.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param c
|
||||
@@ -692,11 +711,12 @@ export function intersectRectangleEllipse(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a bounding box.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param bounds
|
||||
@@ -712,6 +732,7 @@ export function intersectRectangleBounds(
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a polyline.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param points
|
||||
@@ -734,10 +755,11 @@ export function intersectRectanglePolyline(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
/**
|
||||
* Find the intersections between a rectangle and a polygon.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param points
|
||||
@@ -760,7 +782,7 @@ export function intersectRectanglePolygon(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
/* -------------------------------------------------- */
|
||||
@@ -769,6 +791,7 @@ export function intersectRectanglePolygon(
|
||||
|
||||
/**
|
||||
* Find the intersections between a arc and a line segment.
|
||||
*
|
||||
* @param center
|
||||
* @param radius
|
||||
* @param start
|
||||
@@ -789,6 +812,7 @@ export function intersectArcLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a arc and a rectangle.
|
||||
*
|
||||
* @param center
|
||||
* @param radius
|
||||
* @param start
|
||||
@@ -809,6 +833,7 @@ export function intersectArcRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a arc and a bounding box.
|
||||
*
|
||||
* @param center
|
||||
* @param radius
|
||||
* @param start
|
||||
@@ -832,6 +857,7 @@ export function intersectArcBounds(
|
||||
|
||||
/**
|
||||
* Find the intersections between a circle and a line segment.
|
||||
*
|
||||
* @param c
|
||||
* @param r
|
||||
* @param a1
|
||||
@@ -848,6 +874,7 @@ export function intersectCircleLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a circle and a circle.
|
||||
*
|
||||
* @param c1
|
||||
* @param r1
|
||||
* @param c2
|
||||
@@ -878,6 +905,7 @@ export function intersectCircleCircle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a circle and a rectangle.
|
||||
*
|
||||
* @param c
|
||||
* @param r
|
||||
* @param point
|
||||
@@ -894,6 +922,7 @@ export function intersectCircleRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a circle and a bounding box.
|
||||
*
|
||||
* @param c
|
||||
* @param r
|
||||
* @param bounds
|
||||
@@ -909,6 +938,7 @@ export function intersectCircleBounds(c: number[], r: number, bounds: TLBounds):
|
||||
|
||||
/**
|
||||
* Find the intersections between an ellipse and a ray.
|
||||
*
|
||||
* @param center
|
||||
* @param rx
|
||||
* @param ry
|
||||
@@ -929,6 +959,7 @@ export function intersectEllipseRay(
|
||||
|
||||
/**
|
||||
* Find the intersections between an ellipse and a line segment.
|
||||
*
|
||||
* @param center
|
||||
* @param rx
|
||||
* @param ry
|
||||
@@ -953,6 +984,7 @@ export function intersectEllipseLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between an ellipse and a rectangle.
|
||||
*
|
||||
* @param center
|
||||
* @param rx
|
||||
* @param ry
|
||||
@@ -976,8 +1008,9 @@ export function intersectEllipseRectangle(
|
||||
}
|
||||
|
||||
/**
|
||||
* Find the intersections between an ellipse and an ellipse.
|
||||
* Adapted from https://gist.github.com/drawable/92792f59b6ff8869d8b1
|
||||
* Find the intersections between an ellipse and an ellipse. Adapted from
|
||||
* https://gist.github.com/drawable/92792f59b6ff8869d8b1
|
||||
*
|
||||
* @param _c1
|
||||
* @param _rx1
|
||||
* @param _ry1
|
||||
@@ -1011,6 +1044,7 @@ export function intersectEllipseEllipse(
|
||||
|
||||
/**
|
||||
* Find the intersections between an ellipse and a circle.
|
||||
*
|
||||
* @param c
|
||||
* @param rx
|
||||
* @param ry
|
||||
@@ -1031,6 +1065,7 @@ export function intersectEllipseCircle(
|
||||
|
||||
/**
|
||||
* Find the intersections between an ellipse and a bounding box.
|
||||
*
|
||||
* @param c
|
||||
* @param rx
|
||||
* @param ry
|
||||
@@ -1050,6 +1085,7 @@ export function intersectEllipseBounds(
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a ray.
|
||||
*
|
||||
* @param bounds
|
||||
* @param origin
|
||||
* @param direction
|
||||
@@ -1065,6 +1101,7 @@ export function intersectBoundsRay(
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a line segment.
|
||||
*
|
||||
* @param bounds
|
||||
* @param a1
|
||||
* @param a2
|
||||
@@ -1080,6 +1117,7 @@ export function intersectBoundsLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a rectangle.
|
||||
*
|
||||
* @param bounds
|
||||
* @param point
|
||||
* @param size
|
||||
@@ -1095,6 +1133,7 @@ export function intersectBoundsRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a bounding box.
|
||||
*
|
||||
* @param bounds1
|
||||
* @param bounds2
|
||||
*/
|
||||
@@ -1109,6 +1148,7 @@ export function intersectBoundsBounds(bounds1: TLBounds, bounds2: TLBounds): TLI
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and an arc.
|
||||
*
|
||||
* @param bounds
|
||||
* @param center
|
||||
* @param radius
|
||||
@@ -1128,6 +1168,7 @@ export function intersectBoundsArc(
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a circle.
|
||||
*
|
||||
* @param bounds
|
||||
* @param c
|
||||
* @param r
|
||||
@@ -1139,6 +1180,7 @@ export function intersectBoundsCircle(bounds: TLBounds, c: number[], r: number):
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and an ellipse.
|
||||
*
|
||||
* @param bounds
|
||||
* @param c
|
||||
* @param rx
|
||||
@@ -1158,6 +1200,7 @@ export function intersectBoundsEllipse(
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a polyline.
|
||||
*
|
||||
* @param bounds
|
||||
* @param points
|
||||
*/
|
||||
@@ -1167,6 +1210,7 @@ export function intersectBoundsPolyline(bounds: TLBounds, points: number[][]): T
|
||||
|
||||
/**
|
||||
* Find the intersections between a bounding box and a polygon.
|
||||
*
|
||||
* @param bounds
|
||||
* @param points
|
||||
*/
|
||||
@@ -1180,6 +1224,7 @@ export function intersectBoundsPolygon(bounds: TLBounds, points: number[][]): TL
|
||||
|
||||
/**
|
||||
* Find the intersections between a polyline and a line segment.
|
||||
*
|
||||
* @param points
|
||||
* @param a1
|
||||
* @param a2
|
||||
@@ -1194,6 +1239,7 @@ export function intersectPolylineLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a polyline and a rectangle.
|
||||
*
|
||||
* @param points
|
||||
* @param point
|
||||
* @param size
|
||||
@@ -1208,6 +1254,7 @@ export function intersectPolylineRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a polyline and a bounding box.
|
||||
*
|
||||
* @param points
|
||||
* @param bounds
|
||||
*/
|
||||
@@ -1225,6 +1272,7 @@ export function intersectPolylineBounds(points: number[][], bounds: TLBounds): T
|
||||
|
||||
/**
|
||||
* Find the intersections between a polygon nd a line segment.
|
||||
*
|
||||
* @param points
|
||||
* @param a1
|
||||
* @param a2
|
||||
@@ -1239,6 +1287,7 @@ export function intersectPolygonLineSegment(
|
||||
|
||||
/**
|
||||
* Find the intersections between a polygon and a rectangle.
|
||||
*
|
||||
* @param points
|
||||
* @param point
|
||||
* @param size
|
||||
@@ -1253,6 +1302,7 @@ export function intersectPolygonRectangle(
|
||||
|
||||
/**
|
||||
* Find the intersections between a polygon and a bounding box.
|
||||
*
|
||||
* @param points
|
||||
* @param bounds
|
||||
*/
|
||||
@@ -1266,6 +1316,7 @@ export function intersectPolygonBounds(points: number[][], bounds: TLBounds): TL
|
||||
|
||||
/**
|
||||
* Find the intersections between a rectangle and a ray.
|
||||
*
|
||||
* @param point
|
||||
* @param size
|
||||
* @param rotation
|
||||
@@ -1290,7 +1341,7 @@ export function intersectRayPolygon(
|
||||
[]
|
||||
)
|
||||
|
||||
return sideIntersections.filter((int) => int.didIntersect)
|
||||
return sideIntersections.filter(int => int.didIntersect)
|
||||
}
|
||||
|
||||
export function pointsToLineSegments(points: number[][], closed = false) {
|
||||
|
||||
@@ -33,4 +33,4 @@
|
||||
"clean": "rm -rf dist"
|
||||
},
|
||||
"gitHead": "3ab5db27b9e83736fdae934474e80e90c854922c"
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user