tldraw 3.16.0-canary.ffdf566dd0a8 → 3.16.0-internal.a478398270c6

package/src/lib/ui/components/primitives/TldrawUiToolbar.tsx

@@ -1,7 +1,6 @@
 import classnames from 'classnames'
 import { Toolbar as _Toolbar } from 'radix-ui'
 import React from 'react'
-import { TldrawUiTooltip } from './TldrawUiTooltip'
 
 /** @public */
 export interface TLUiToolbarProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -35,30 +34,23 @@ export interface TLUiToolbarButtonProps extends React.HTMLAttributes<HTMLButtonE
 	disabled?: boolean
 	isActive?: boolean
 	type: 'icon' | 'tool' | 'menu'
-	tooltip?: string
 }
 
 /** @public @react */
 export const TldrawUiToolbarButton = React.forwardRef<HTMLButtonElement, TLUiToolbarButtonProps>(
-	({ asChild, children, type, isActive, tooltip, ...props }: TLUiToolbarButtonProps, ref) => {
-		const button = (
+	({ asChild, children, type, isActive, ...props }: TLUiToolbarButtonProps, ref) => {
+		return (
 			<_Toolbar.Button
 				ref={ref}
 				asChild={asChild}
 				draggable={false}
 				data-isactive={isActive}
 				{...props}
-				// The tooltip takes care of this.
-				title={undefined}
 				className={classnames('tlui-button', `tlui-button__${type}`, props.className)}
 			>
 				{children}
 			</_Toolbar.Button>
 		)
-
-		const tooltipContent = tooltip || props.title
-
-		return <TldrawUiTooltip content={tooltipContent}>{button}</TldrawUiTooltip>
 	}
 )
 
@@ -67,7 +59,6 @@ export interface TLUiToolbarToggleGroupProps extends React.HTMLAttributes<HTMLDi
 	children?: React.ReactNode
 	className?: string
 	dir?: 'ltr' | 'rtl'
-	value: any
 	// TODO: fix up this type later
 	defaultValue?: any
 	type: 'single' | 'multiple'
@@ -84,10 +75,6 @@ export const TldrawUiToolbarToggleGroup = ({
 		<_Toolbar.ToggleGroup
 			type={type}
 			{...props}
-			// TODO: this fixes a bug in Radix until they fix it.
-			// https://github.com/radix-ui/primitives/issues/3188
-			// https://github.com/radix-ui/primitives/pull/3189
-			role="radiogroup"
 			className={classnames('tlui-toolbar-toggle-group', className)}
 		>
 			{children}
@@ -101,7 +88,6 @@ export interface TLUiToolbarToggleItemProps extends React.HTMLAttributes<HTMLBut
 	className?: string
 	type: 'icon' | 'tool'
 	value: string
-	tooltip?: string
 }
 
 /** @public @react */
@@ -110,14 +96,11 @@ export const TldrawUiToolbarToggleItem = ({
 	className,
 	type,
 	value,
-	tooltip,
 	...props
 }: TLUiToolbarToggleItemProps) => {
-	const toggleItem = (
+	return (
 		<_Toolbar.ToggleItem
 			{...props}
-			// The tooltip takes care of this.
-			title={undefined}
 			className={classnames(
 				'tlui-button',
 				`tlui-button__${type}`,
@@ -129,8 +112,4 @@ export const TldrawUiToolbarToggleItem = ({
 			{children}
 		</_Toolbar.ToggleItem>
 	)
-
-	const tooltipContent = tooltip || props.title
-
-	return <TldrawUiTooltip content={tooltipContent}>{toggleItem}</TldrawUiTooltip>
 }

package/src/lib/ui/components/primitives/menus/TldrawUiMenuCheckboxItem.tsx

@@ -5,7 +5,7 @@ import { TLUiEventSource } from '../../../context/events'
 import { useReadonly } from '../../../hooks/useReadonly'
 import { TLUiTranslationKey } from '../../../hooks/useTranslation/TLUiTranslationKey'
 import { useTranslation } from '../../../hooks/useTranslation/useTranslation'
-import { TldrawUiIcon, TLUiIconJsx } from '../TldrawUiIcon'
+import { TldrawUiIcon } from '../TldrawUiIcon'
 import { TldrawUiKbd } from '../TldrawUiKbd'
 import { useTldrawUiMenuContext } from './TldrawUiMenuContext'
 
@@ -14,7 +14,7 @@ export interface TLUiMenuCheckboxItemProps<
 	TranslationKey extends string = string,
 	IconType extends string = string,
 > {
-	icon?: IconType | TLUiIconJsx
+	icon?: IconType
 	id: string
 	kbd?: string
 	title?: string

package/src/lib/ui/components/primitives/menus/TldrawUiMenuItem.tsx

@@ -12,7 +12,6 @@ import { TldrawUiButton } from '../Button/TldrawUiButton'
 import { TldrawUiButtonIcon } from '../Button/TldrawUiButtonIcon'
 import { TldrawUiButtonLabel } from '../Button/TldrawUiButtonLabel'
 import { TldrawUiDropdownMenuItem } from '../TldrawUiDropdownMenu'
-import { TLUiIconJsx } from '../TldrawUiIcon'
 import { TldrawUiKbd } from '../TldrawUiKbd'
 import { TldrawUiToolbarButton } from '../TldrawUiToolbar'
 import { useTldrawUiMenuContext } from './TldrawUiMenuContext'
@@ -26,11 +25,11 @@ export interface TLUiMenuItemProps<
 	/**
 	 * The icon to display on the item. Icons are only shown in certain menu types.
 	 */
-	icon?: IconType | TLUiIconJsx
+	icon?: IconType
 	/**
 	 * An icon to display to the left of the menu item.
 	 */
-	iconLeft?: IconType | TLUiIconJsx
+	iconLeft?: IconType
 	/**
 	 * The keyboard shortcut to display on the item.
 	 */
@@ -219,6 +218,7 @@ export function TldrawUiMenuItem<
 						preventDefault(e)
 						onSelect('toolbar')
 					}}
+					role="option"
 					title={titleStr}
 					type="tool"
 				>
@@ -237,6 +237,7 @@ export function TldrawUiMenuItem<
 					data-value={id}
 					disabled={disabled}
 					onClick={() => onSelect('toolbar')}
+					role="option"
 					title={titleStr}
 					type="icon"
 				>

package/src/lib/ui/context/TldrawUiContextProvider.tsx

@@ -1,7 +1,6 @@
 import { RecursivePartial, defaultUserPreferences, track, useMaybeEditor } from '@tldraw/editor'
 import { ReactNode } from 'react'
 import { TLUiAssetUrls, useDefaultUiAssetUrlsWithOverrides } from '../assetUrls'
-import { TldrawUiTooltipProvider } from '../components/primitives/TldrawUiTooltip'
 import { ToolsProvider } from '../hooks/useTools'
 import { TldrawUiTranslationProvider } from '../hooks/useTranslation/useTranslation'
 import {
@@ -73,28 +72,26 @@ export const TldrawUiContextProvider = track(function TldrawUiContextProvider({
 	const editor = useMaybeEditor()
 	return (
 		<MimeTypeContext.Provider value={mediaMimeTypes}>
-			<TldrawUiTooltipProvider>
-				<AssetUrlsProvider assetUrls={useDefaultUiAssetUrlsWithOverrides(assetUrls)}>
-					<TldrawUiTranslationProvider
-						overrides={useMergedTranslationOverrides(overrides)}
-						locale={editor?.user.getLocale() ?? defaultUserPreferences.locale}
-					>
-						<TldrawUiEventsProvider onEvent={onUiEvent}>
-							<TldrawUiToastsProvider>
-								<TldrawUiDialogsProvider context={'tla'}>
-									<TldrawUiA11yProvider>
-										<BreakPointProvider forceMobile={forceMobile}>
-											<TldrawUiComponentsProvider overrides={components}>
-												<InternalProviders overrides={overrides}>{children}</InternalProviders>
-											</TldrawUiComponentsProvider>
-										</BreakPointProvider>
-									</TldrawUiA11yProvider>
-								</TldrawUiDialogsProvider>
-							</TldrawUiToastsProvider>
-						</TldrawUiEventsProvider>
-					</TldrawUiTranslationProvider>
-				</AssetUrlsProvider>
-			</TldrawUiTooltipProvider>
+			<AssetUrlsProvider assetUrls={useDefaultUiAssetUrlsWithOverrides(assetUrls)}>
+				<TldrawUiTranslationProvider
+					overrides={useMergedTranslationOverrides(overrides)}
+					locale={editor?.user.getLocale() ?? defaultUserPreferences.locale}
+				>
+					<TldrawUiEventsProvider onEvent={onUiEvent}>
+						<TldrawUiToastsProvider>
+							<TldrawUiDialogsProvider context={'tla'}>
+								<TldrawUiA11yProvider>
+									<BreakPointProvider forceMobile={forceMobile}>
+										<TldrawUiComponentsProvider overrides={components}>
+											<InternalProviders overrides={overrides}>{children}</InternalProviders>
+										</TldrawUiComponentsProvider>
+									</BreakPointProvider>
+								</TldrawUiA11yProvider>
+							</TldrawUiDialogsProvider>
+						</TldrawUiToastsProvider>
+					</TldrawUiEventsProvider>
+				</TldrawUiTranslationProvider>
+			</AssetUrlsProvider>
 		</MimeTypeContext.Provider>
 	)
 })

package/src/lib/ui/context/actions.tsx

@@ -28,7 +28,6 @@ import { fitFrameToContent, removeFrame } from '../../utils/frames/frames'
 import { generateShapeAnnouncementMessage } from '../components/A11y'
 import { EditLinkDialog } from '../components/EditLinkDialog'
 import { EmbedDialog } from '../components/EmbedDialog'
-import { DefaultKeyboardShortcutsDialog } from '../components/KeyboardShortcutsDialog/DefaultKeyboardShortcutsDialog'
 import { useShowCollaborationUi } from '../hooks/useCollaborationStatus'
 import { flattenShapesToImages } from '../hooks/useFlatten'
 import { TLUiTranslationKey } from '../hooks/useTranslation/TLUiTranslationKey'
@@ -43,13 +42,12 @@ export interface TLUiActionItem<
 	TransationKey extends string = string,
 	IconType extends string = string,
 > {
-	icon?: IconType | React.ReactElement
+	icon?: IconType
 	id: string
 	kbd?: string
 	label?: TransationKey | { [key: string]: TransationKey }
 	readonlyOk?: boolean
 	checkbox?: boolean
-	isRequiredA11yAction?: boolean
 	onSelect(source: TLUiEventSource): Promise<void> | void
 }
 
@@ -170,15 +168,6 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 					helpers.addDialog({ component: EmbedDialog })
 				},
 			},
-			{
-				id: 'open-kbd-shortcuts',
-				label: 'action.open-kbd-shortcuts',
-				kbd: 'cmd+alt+/,ctrl+alt+/',
-				onSelect(source) {
-					trackEvent('open-kbd-shortcuts', { source })
-					helpers.addDialog({ component: DefaultKeyboardShortcutsDialog })
-				},
-			},
 			{
 				id: 'insert-media',
 				label: 'action.insert-media',
@@ -513,6 +502,7 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 								}
 					}
 
+					if (!editor.canCreateShapes(ids)) return
 					editor.markHistoryStoppingPoint('duplicate shapes')
 					editor.duplicateShapes(ids, offset)
 
@@ -1037,20 +1027,17 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 				id: 'rotate-cw',
 				label: 'action.rotate-cw',
 				icon: 'rotate-cw',
-				kbd: 'shift+.,shift+alt+.',
 				onSelect(source) {
 					if (!canApplySelectionAction()) return
 					if (mustGoBackToSelectToolFirst()) return
 
-					const isFine = editor.inputs.altKey
-					trackEvent('rotate-cw', { source, fine: isFine })
+					trackEvent('rotate-cw', { source })
 					editor.markHistoryStoppingPoint('rotate-cw')
 					editor.run(() => {
-						const rotation = HALF_PI / (isFine ? 96 : 6)
-						const offset = editor.getSelectionRotation() % rotation
-						const dontUseOffset = approximately(offset, 0) || approximately(offset, rotation)
+						const offset = editor.getSelectionRotation() % (HALF_PI / 2)
+						const dontUseOffset = approximately(offset, 0) || approximately(offset, HALF_PI / 2)
 						const selectedShapeIds = editor.getSelectedShapeIds()
-						editor.rotateShapesBy(selectedShapeIds, rotation - (dontUseOffset ? 0 : offset))
+						editor.rotateShapesBy(selectedShapeIds, HALF_PI / 2 - (dontUseOffset ? 0 : offset))
 						kickoutOccludedShapes(editor, selectedShapeIds)
 					})
 				},
@@ -1059,21 +1046,17 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 				id: 'rotate-ccw',
 				label: 'action.rotate-ccw',
 				icon: 'rotate-ccw',
-				// omg double comma
-				kbd: 'shift+,,shift+alt+,',
 				onSelect(source) {
 					if (!canApplySelectionAction()) return
 					if (mustGoBackToSelectToolFirst()) return
 
-					const isFine = editor.inputs.altKey
-					trackEvent('rotate-ccw', { source, fine: isFine })
+					trackEvent('rotate-ccw', { source })
 					editor.markHistoryStoppingPoint('rotate-ccw')
 					editor.run(() => {
-						const rotation = HALF_PI / (isFine ? 96 : 6)
-						const offset = editor.getSelectionRotation() % rotation
+						const offset = editor.getSelectionRotation() % (HALF_PI / 2)
 						const offsetCloseToZero = approximately(offset, 0)
 						const selectedShapeIds = editor.getSelectedShapeIds()
-						editor.rotateShapesBy(selectedShapeIds, offsetCloseToZero ? -rotation : -offset)
+						editor.rotateShapesBy(selectedShapeIds, offsetCloseToZero ? -(HALF_PI / 2) : -offset)
 						kickoutOccludedShapes(editor, selectedShapeIds)
 					})
 				},
@@ -1251,36 +1234,6 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 				},
 				checkbox: true,
 			},
-			{
-				id: 'toggle-keyboard-shortcuts',
-				label: {
-					default: 'action.toggle-keyboard-shortcuts',
-					menu: 'action.toggle-keyboard-shortcuts.menu',
-				},
-				readonlyOk: true,
-				onSelect(source) {
-					trackEvent('toggle-keyboard-shortcuts', { source })
-					editor.user.updateUserPreferences({
-						areKeyboardShortcutsEnabled: !editor.user.getAreKeyboardShortcutsEnabled(),
-					})
-				},
-				checkbox: true,
-			},
-			{
-				id: 'toggle-ui-labels',
-				label: {
-					default: 'action.toggle-ui-labels',
-					menu: 'action.toggle-ui-labels.menu',
-				},
-				readonlyOk: true,
-				onSelect(source) {
-					trackEvent('toggle-ui-labels', { source })
-					editor.user.updateUserPreferences({
-						showUiLabels: !editor.user.getShowUiLabels(),
-					})
-				},
-				checkbox: true,
-			},
 			{
 				id: 'toggle-edge-scrolling',
 				label: {
@@ -1577,7 +1530,6 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 				id: 'adjust-shape-styles',
 				label: 'a11y.adjust-shape-styles',
 				kbd: 'cmd+Enter,ctrl+Enter',
-				isRequiredA11yAction: true,
 				onSelect: async (source) => {
 					if (!canApplySelectionAction()) return
 
@@ -1591,7 +1543,6 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 			{
 				id: 'a11y-open-context-menu',
 				kbd: 'cmd+shift+Enter,ctrl+shift+Enter',
-				isRequiredA11yAction: true,
 				readonlyOk: true,
 				onSelect: async (source) => {
 					if (!canApplySelectionAction()) return
@@ -1644,7 +1595,6 @@ export function ActionsProvider({ overrides, children }: ActionsProviderProps) {
 				id: 'a11y-repeat-shape-announce',
 				kbd: 'alt+r',
 				label: 'a11y.repeat-shape',
-				isRequiredA11yAction: true,
 				readonlyOk: true,
 				onSelect: async (source) => {
 					const selectedShapeIds = editor.getSelectedShapeIds()

package/src/lib/ui/context/events.tsx

@@ -76,8 +76,8 @@ export interface TLUiEventMap {
 	'delete-shapes': null
 	'select-all-shapes': null
 	'select-none-shapes': null
-	'rotate-ccw': { fine: boolean }
-	'rotate-cw': { fine: boolean }
+	'rotate-ccw': null
+	'rotate-cw': null
 	'zoom-in': { towardsCursor: boolean }
 	'zoom-out': { towardsCursor: boolean }
 	'zoom-to-fit': null
@@ -107,8 +107,6 @@ export interface TLUiEventMap {
 	'toggle-paste-at-cursor': null
 	'toggle-lock': null
 	'toggle-reduce-motion': null
-	'toggle-keyboard-shortcuts': null
-	'toggle-ui-labels': null
 	'toggle-edge-scrolling': null
 	'color-scheme': { value: string }
 	'exit-pen-mode': null
@@ -129,7 +127,6 @@ export interface TLUiEventMap {
 	'copy-link': null
 	'image-replace': null
 	'video-replace': null
-	'open-kbd-shortcuts': null
 	'rich-text': {
 		operation:
 			| 'bold'

package/src/lib/ui/hooks/menu-hooks.ts

@@ -123,7 +123,6 @@ export function useAnySelectedShapesCount(min?: number, max?: number) {
 
 /**
  * Returns true if the number of UNLOCKED selected shapes is at least min or at most max.
- * @public
  */
 export function useUnlockedSelectedShapesCount(min?: number, max?: number) {
 	const editor = useEditor()

package/src/lib/ui/hooks/useKeyboardShortcuts.ts

@@ -61,7 +61,7 @@ export function useKeyboardShortcuts() {
 			if (SKIP_KBDS.includes(action.id)) continue
 
 			hot(getHotkeysStringFromKbd(action.kbd), (event) => {
-				if (areShortcutsDisabled(editor) && !action.isRequiredA11yAction) return
+				if (areShortcutsDisabled(editor)) return
 				preventDefault(event)
 				action.onSelect('kbd')
 			})
@@ -149,8 +149,7 @@ export function areShortcutsDisabled(editor: Editor) {
 	return (
 		editor.menus.hasAnyOpenMenus() ||
 		editor.getEditingShapeId() !== null ||
-		editor.getCrashingError() ||
-		!editor.user.getAreKeyboardShortcutsEnabled()
+		editor.getCrashingError()
 	)
 }
 

package/src/lib/ui/hooks/useTools.tsx

@@ -1,7 +1,6 @@
 import { Editor, GeoShapeGeoStyle, useMaybeEditor } from '@tldraw/editor'
 import * as React from 'react'
 import { EmbedDialog } from '../components/EmbedDialog'
-import { TLUiIconJsx } from '../components/primitives/TldrawUiIcon'
 import { useA11y } from '../context/a11y'
 import { TLUiEventSource, useUiEvents } from '../context/events'
 import { TLUiIconType } from '../icon-types'
@@ -17,7 +16,7 @@ export interface TLUiToolItem<
 	id: string
 	label: TranslationKey
 	shortcutsLabel?: TranslationKey
-	icon: IconType | TLUiIconJsx
+	icon: IconType
 	onSelect(source: TLUiEventSource): void
 	/**
 	 * The keyboard shortcut for this tool. This is a string that can be a single key,

package/src/lib/ui/hooks/useTranslation/TLUiTranslationKey.ts

@@ -55,7 +55,6 @@ export type TLUiTranslationKey =
 	| 'action.new-project'
 	| 'action.new-shared-project'
 	| 'action.open-cursor-chat'
-	| 'action.open-kbd-shortcuts'
 	| 'action.open-file'
 	| 'action.pack'
 	| 'action.paste'
@@ -91,10 +90,6 @@ export type TLUiTranslationKey =
 	| 'action.toggle-wrap-mode'
 	| 'action.toggle-reduce-motion.menu'
 	| 'action.toggle-reduce-motion'
-	| 'action.toggle-keyboard-shortcuts.menu'
-	| 'action.toggle-keyboard-shortcuts'
-	| 'action.toggle-ui-labels.menu'
-	| 'action.toggle-ui-labels'
 	| 'action.toggle-edge-scrolling.menu'
 	| 'action.toggle-edge-scrolling'
 	| 'action.toggle-debug-mode.menu'
@@ -288,19 +283,13 @@ export type TLUiTranslationKey =
 	| 'a11y.repeat-shape'
 	| 'a11y.move-shape'
 	| 'a11y.move-shape-faster'
-	| 'a11y.rotate-shape-cw'
-	| 'a11y.rotate-shape-ccw'
-	| 'a11y.rotate-shape-cw-fine'
-	| 'a11y.rotate-shape-ccw-fine'
 	| 'a11y.enlarge-shape'
 	| 'a11y.shrink-shape'
 	| 'a11y.pan-camera'
 	| 'a11y.adjust-shape-styles'
 	| 'a11y.open-context-menu'
-	| 'a11y.open-keyboard-shortcuts'
 	| 'menu.title'
 	| 'menu.theme'
-	| 'menu.accessibility'
 	| 'menu.copy-as'
 	| 'menu.edit'
 	| 'menu.export-as'

package/src/lib/ui/hooks/useTranslation/defaultTranslation.ts

@@ -55,7 +55,6 @@ export const DEFAULT_TRANSLATION = {
 	'action.new-project': 'New project',
 	'action.new-shared-project': 'New shared project',
 	'action.open-cursor-chat': 'Cursor chat',
-	'action.open-kbd-shortcuts': 'Open keyboard shortcuts',
 	'action.open-file': 'Open file',
 	'action.pack': 'Pack',
 	'action.paste': 'Paste',
@@ -92,10 +91,6 @@ export const DEFAULT_TRANSLATION = {
 	'action.toggle-wrap-mode': 'Toggle Select on wrap',
 	'action.toggle-reduce-motion.menu': 'Reduce motion',
 	'action.toggle-reduce-motion': 'Toggle reduce motion',
-	'action.toggle-keyboard-shortcuts.menu': 'Keyboard shortcuts',
-	'action.toggle-keyboard-shortcuts': 'Toggle keyboard shortcuts',
-	'action.toggle-ui-labels.menu': 'UI labels',
-	'action.toggle-ui-labels': 'Toggle UI labels',
 	'action.toggle-edge-scrolling.menu': 'Edge scrolling',
 	'action.toggle-edge-scrolling': 'Toggle edge scrolling',
 	'action.toggle-debug-mode.menu': 'Debug mode',
@@ -289,19 +284,13 @@ export const DEFAULT_TRANSLATION = {
 	'a11y.repeat-shape': 'Repeat shape',
 	'a11y.move-shape': 'Move shape',
 	'a11y.move-shape-faster': 'Move shape faster',
-	'a11y.rotate-shape-cw': 'Rotate shape clockwise',
-	'a11y.rotate-shape-ccw': 'Rotate shape counterclockwise',
-	'a11y.rotate-shape-cw-fine': 'Rotate shape clockwise (fine)',
-	'a11y.rotate-shape-ccw-fine': 'Rotate shape counterclockwise (fine)',
 	'a11y.enlarge-shape': 'Enlarge shape',
 	'a11y.shrink-shape': 'Shrink shape',
 	'a11y.pan-camera': 'Pan camera',
 	'a11y.adjust-shape-styles': 'Adjust shape styles',
 	'a11y.open-context-menu': 'Open context menu',
-	'a11y.open-keyboard-shortcuts': 'Open keyboard shortcuts',
 	'menu.title': 'Menu',
 	'menu.theme': 'Theme',
-	'menu.accessibility': 'Accessibility',
 	'menu.copy-as': 'Copy as',
 	'menu.edit': 'Edit',
 	'menu.export-as': 'Export as',

package/src/lib/ui/kbd-utils.ts

@@ -2,7 +2,6 @@ import { tlenv } from '@tldraw/editor'
 
 // N.B. We rework these Windows placeholders down below.
 const cmdKey = tlenv.isDarwin ? '⌘' : '__CTRL__'
-const ctrlKey = tlenv.isDarwin ? '⌃' : '__CTRL__'
 const altKey = tlenv.isDarwin ? '⌥' : '__ALT__'
 
 /** @public */
@@ -20,7 +19,7 @@ export function kbd(str: string) {
 					? s.replace(/[[\]]/g, '')
 					: s
 							.replace(/cmd\+/g, cmdKey)
-							.replace(/ctrl\+/g, ctrlKey)
+							.replace(/ctrl\+/g, cmdKey)
 							.replace(/alt\+/g, altKey)
 							.replace(/shift\+/g, '⇧')
 							// Backwards compatibility with the old system.

package/src/lib/ui/version.ts

@@ -1,9 +1,9 @@
 // This file is automatically generated by internal/scripts/refresh-assets.ts.
 // Do not edit manually. Or do, I'm a comment, not a cop.
 
-export const version = '3.16.0-canary.ffdf566dd0a8'
+export const version = '3.16.0-internal.a478398270c6'
 export const publishDates = {
 	major: '2024-09-13T14:36:29.063Z',
-	minor: '2025-08-06T13:55:07.190Z',
-	patch: '2025-08-06T13:55:07.190Z',
+	minor: '2025-08-19T10:21:26.717Z',
+	patch: '2025-08-19T10:21:26.717Z',
 }