Merge pull request #21 from KDSBrowne/tl-menu-ui-update

Remove UI for Undo, Redo, Delete, and Duplicate; Relocate Alignment Options
bigbluebutton · Nov 13, 2024 · 59ce62c · 59ce62c
2 parents 08963a9 + e86d0c5
commit 59ce62c
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 20 deletions.
diff --git a/packages/tldraw/src/lib/ui/components/StylePanel/StylePanel.tsx b/packages/tldraw/src/lib/ui/components/StylePanel/StylePanel.tsx
@@ -19,11 +19,6 @@ import {
 import React, { useCallback } from 'react'
 import { useRelevantStyles } from '../../hooks/useRevelantStyles'
 import { useTranslation } from '../../hooks/useTranslation/useTranslation'
-import { ActionsMenu } from '../ActionsMenu'
-import { DuplicateButton } from '../DuplicateButton'
-import { RedoButton } from '../RedoButton'
-import { TrashButton } from '../TrashButton'
-import { UndoButton } from '../UndoButton'
 import { Button } from '../primitives/Button'
 import { ButtonPicker } from '../primitives/ButtonPicker'
 import { Slider } from '../primitives/Slider'
@@ -63,21 +58,6 @@ export const StylePanel = function StylePanel({ isMobile }: StylePanelProps) {
 
 	return (
 		<div className="tlui-style-panel" data-ismobile={isMobile} onPointerLeave={handlePointerOut}>
-			<div className="tlui-style-panel__section" aria-label="style panel actions">
-				<div
-					style={{
-						display: 'flex',
-						position: 'relative',
-						flexDirection: 'row',
-					}}
-				>
-					<UndoButton />
-					<RedoButton />
-					<TrashButton />
-					<DuplicateButton />
-					<ActionsMenu />
-				</div>
-			</div>
 			<CommonStylePickerSet styles={styles} opacity={opacity} />
 			{!hideText && <TextStylePickerSet styles={styles} />}
 			{!(hideGeo && hideArrowHeads && hideSpline) && (

diff --git a/packages/tldraw/src/lib/ui/components/Toolbar/Toolbar.tsx b/packages/tldraw/src/lib/ui/components/Toolbar/Toolbar.tsx
@@ -6,6 +6,7 @@ import { useReadonly } from '../../hooks/useReadonly'
 import { TLUiToolbarItem, useToolbarSchema } from '../../hooks/useToolbarSchema'
 import { TLUiToolItem } from '../../hooks/useTools'
 import { useTranslation } from '../../hooks/useTranslation/useTranslation'
+import { ActionsMenu } from '../ActionsMenu'
 import { MobileStylePanel } from '../MobileStylePanel'
 import { Button } from '../primitives/Button'
 import * as M from '../primitives/DropdownMenu'
@@ -192,6 +193,7 @@ export const Toolbar = memo(function Toolbar() {
 												<OverflowToolsContent toolbarItems={itemsInDropdown} />
 											</M.Content>
 										</M.Root>
+										<ActionsMenu />
 									</>
 								) : null}
 							</>