@lvce-editor/title-bar-worker 3.1.0 → 3.2.0
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/titleBarWorkerMain.js +120 -118
- package/package.json +1 -1
|
@@ -1401,6 +1401,27 @@ const Selection$1 = 'Selection';
|
|
|
1401
1401
|
const Terminal$1 = 'Terminal';
|
|
1402
1402
|
const ToggleDeveloperTools = 'Toggle Developer Tools';
|
|
1403
1403
|
const View$1 = 'View';
|
|
1404
|
+
const AddCursorAbove = 'Add Cursor Above';
|
|
1405
|
+
const AddCursorBelow = 'Add Cursor Below';
|
|
1406
|
+
const AddCursorsToLineEnds = 'Add Cursors to Line ends';
|
|
1407
|
+
const AddNextOccurrence = 'Add Next Occurrence';
|
|
1408
|
+
const AddPreviousOccurrence = 'Add Previous Occurrence';
|
|
1409
|
+
const Copy = 'Copy';
|
|
1410
|
+
const CopyLineDown = 'Copy Line Down';
|
|
1411
|
+
const CopyLineUp = 'Copy Line Up';
|
|
1412
|
+
const Cut = 'Cut';
|
|
1413
|
+
const DuplicateSelection = 'Duplicate Selection';
|
|
1414
|
+
const ExpandSelection = 'Expand Selection';
|
|
1415
|
+
const MoveLineDown = 'Move Line Down';
|
|
1416
|
+
const MoveLineUp = 'Move Line Up';
|
|
1417
|
+
const Paste = 'Paste';
|
|
1418
|
+
const Redo = 'Redo';
|
|
1419
|
+
const SelectAll = 'Select All';
|
|
1420
|
+
const SelectAllOccurrences = 'Select All Occurrences';
|
|
1421
|
+
const ShrinkSelection = 'Shrink Selection';
|
|
1422
|
+
const ToggleBlockComment = 'Toggle Block Comment';
|
|
1423
|
+
const ToggleLineComment = 'Toggle Line Comment';
|
|
1424
|
+
const Undo = 'Undo';
|
|
1404
1425
|
|
|
1405
1426
|
const file = () => {
|
|
1406
1427
|
return i18nString(File$2);
|
|
@@ -1679,90 +1700,68 @@ const getMenuIds = () => {
|
|
|
1679
1700
|
return [Edit$2, File$3, Go$2, Help$2, OpenRecent$1, Run$2, Selection$2, Terminal$2, TitleBar, View$2, MenuIdTitleBarContextMenu, TitleBarContextMenu];
|
|
1680
1701
|
};
|
|
1681
1702
|
|
|
1682
|
-
/**
|
|
1683
|
-
* @enum {string}
|
|
1684
|
-
*/
|
|
1685
|
-
const UiStrings$1 = {
|
|
1686
|
-
AddCursorAbove: 'Add Cursor Above',
|
|
1687
|
-
AddNextOccurrence: 'Add Next Occurrence',
|
|
1688
|
-
AddPreviousOccurrence: 'Add Previous Occurrence',
|
|
1689
|
-
Copy: 'Copy',
|
|
1690
|
-
CopyLineDown: 'Copy Line Down',
|
|
1691
|
-
CopyLineUp: 'Copy Line Up',
|
|
1692
|
-
Cut: 'Cut',
|
|
1693
|
-
MoveLineDown: 'Move Line Down',
|
|
1694
|
-
MoveLineUp: 'Move Line Up',
|
|
1695
|
-
Paste: 'Paste',
|
|
1696
|
-
Redo: 'Redo',
|
|
1697
|
-
SelectAll: 'Select All',
|
|
1698
|
-
SelectAllOccurrences: 'Select All Occurrences',
|
|
1699
|
-
ShrinkSelection: 'Shrink Selection',
|
|
1700
|
-
ToggleBlockComment: 'Toggle Block Comment',
|
|
1701
|
-
ToggleLineComment: 'Toggle Line Comment',
|
|
1702
|
-
Undo: 'Undo'
|
|
1703
|
-
};
|
|
1704
1703
|
const cut = () => {
|
|
1705
|
-
return i18nString(
|
|
1704
|
+
return i18nString(Cut);
|
|
1706
1705
|
};
|
|
1707
1706
|
const copy = () => {
|
|
1708
|
-
return i18nString(
|
|
1707
|
+
return i18nString(Copy);
|
|
1709
1708
|
};
|
|
1710
1709
|
const paste = () => {
|
|
1711
|
-
return i18nString(
|
|
1710
|
+
return i18nString(Paste);
|
|
1712
1711
|
};
|
|
1713
1712
|
const undo = () => {
|
|
1714
|
-
return i18nString(
|
|
1713
|
+
return i18nString(Undo);
|
|
1715
1714
|
};
|
|
1716
1715
|
const redo = () => {
|
|
1717
|
-
return i18nString(
|
|
1716
|
+
return i18nString(Redo);
|
|
1718
1717
|
};
|
|
1719
1718
|
const toggleLineComment = () => {
|
|
1720
|
-
return i18nString(
|
|
1719
|
+
return i18nString(ToggleLineComment);
|
|
1721
1720
|
};
|
|
1722
1721
|
const toggleBlockComment = () => {
|
|
1723
|
-
return i18nString(
|
|
1722
|
+
return i18nString(ToggleBlockComment);
|
|
1724
1723
|
};
|
|
1725
1724
|
const selectAll = () => {
|
|
1726
|
-
return i18nString(
|
|
1725
|
+
return i18nString(SelectAll);
|
|
1727
1726
|
};
|
|
1728
1727
|
const expandSelection = () => {
|
|
1729
|
-
return i18nString(
|
|
1728
|
+
return i18nString(ExpandSelection);
|
|
1730
1729
|
};
|
|
1731
1730
|
const shrinkSelection = () => {
|
|
1732
|
-
return i18nString(
|
|
1731
|
+
return i18nString(ShrinkSelection);
|
|
1733
1732
|
};
|
|
1734
1733
|
const copyLineUp = () => {
|
|
1735
|
-
return i18nString(
|
|
1734
|
+
return i18nString(CopyLineUp);
|
|
1736
1735
|
};
|
|
1737
1736
|
const copyLineDown = () => {
|
|
1738
|
-
return i18nString(
|
|
1737
|
+
return i18nString(CopyLineDown);
|
|
1739
1738
|
};
|
|
1740
1739
|
const moveLineUp = () => {
|
|
1741
|
-
return i18nString(
|
|
1740
|
+
return i18nString(MoveLineUp);
|
|
1742
1741
|
};
|
|
1743
1742
|
const moveLineDown = () => {
|
|
1744
|
-
return i18nString(
|
|
1743
|
+
return i18nString(MoveLineDown);
|
|
1745
1744
|
};
|
|
1746
1745
|
const duplicateSelection = () => {
|
|
1747
|
-
return i18nString(
|
|
1746
|
+
return i18nString(DuplicateSelection);
|
|
1748
1747
|
};
|
|
1749
1748
|
const addCursorAbove = () => {
|
|
1750
|
-
return i18nString(
|
|
1749
|
+
return i18nString(AddCursorAbove);
|
|
1751
1750
|
};
|
|
1752
1751
|
const addCursorBelow = () => {
|
|
1753
|
-
return i18nString(
|
|
1752
|
+
return i18nString(AddCursorBelow);
|
|
1754
1753
|
};
|
|
1755
1754
|
const addCursorsToLineEnds = () => {
|
|
1756
|
-
return i18nString(
|
|
1755
|
+
return i18nString(AddCursorsToLineEnds);
|
|
1757
1756
|
};
|
|
1758
1757
|
const addNextOccurrence = () => {
|
|
1759
|
-
return i18nString(
|
|
1758
|
+
return i18nString(AddNextOccurrence);
|
|
1760
1759
|
};
|
|
1761
1760
|
const addPreviousOccurrence = () => {
|
|
1762
|
-
return i18nString(
|
|
1761
|
+
return i18nString(AddPreviousOccurrence);
|
|
1763
1762
|
};
|
|
1764
1763
|
const selectAllOccurrences = () => {
|
|
1765
|
-
return i18nString(
|
|
1764
|
+
return i18nString(SelectAllOccurrences);
|
|
1766
1765
|
};
|
|
1767
1766
|
|
|
1768
1767
|
const menuEntrySeparator = {
|
|
@@ -2927,7 +2926,10 @@ const createTitleBarButton = button => {
|
|
|
2927
2926
|
return dom;
|
|
2928
2927
|
};
|
|
2929
2928
|
|
|
2930
|
-
const getTitleBarButtonsVirtualDom = buttons => {
|
|
2929
|
+
const getTitleBarButtonsVirtualDom = (buttonsEnabled, buttons) => {
|
|
2930
|
+
if (!buttonsEnabled) {
|
|
2931
|
+
return [];
|
|
2932
|
+
}
|
|
2931
2933
|
return [{
|
|
2932
2934
|
childCount: buttons.length,
|
|
2933
2935
|
className: mergeClassNames(Viewlet, TitleBarButtons),
|
|
@@ -2940,7 +2942,10 @@ const parentNode$1 = {
|
|
|
2940
2942
|
className: mergeClassNames(Viewlet, TitleBarIcon),
|
|
2941
2943
|
type: Div
|
|
2942
2944
|
};
|
|
2943
|
-
const getTitleBarIconVirtualDom = iconSrc => {
|
|
2945
|
+
const getTitleBarIconVirtualDom = (titleBarIconEnabled, iconSrc) => {
|
|
2946
|
+
if (!titleBarIconEnabled) {
|
|
2947
|
+
return [];
|
|
2948
|
+
}
|
|
2944
2949
|
return [parentNode$1, {
|
|
2945
2950
|
alt: '',
|
|
2946
2951
|
childCount: 0,
|
|
@@ -2970,34 +2975,27 @@ const getItemVirtualDom = item => {
|
|
|
2970
2975
|
keyboardShortCut,
|
|
2971
2976
|
label
|
|
2972
2977
|
} = item;
|
|
2973
|
-
|
|
2974
|
-
|
|
2978
|
+
let className = TitleBarTopLevelEntry;
|
|
2979
|
+
if (isFocused) {
|
|
2980
|
+
className += ' ' + TitleBarEntryActive;
|
|
2981
|
+
}
|
|
2982
|
+
return [{
|
|
2975
2983
|
ariaExpanded: isOpen,
|
|
2976
2984
|
ariaHasPopup: true,
|
|
2977
2985
|
ariaKeyShortcuts: keyboardShortCut,
|
|
2986
|
+
ariaOwns: isOpen ? 'Menu-0' : undefined,
|
|
2978
2987
|
childCount: 1,
|
|
2979
|
-
className
|
|
2988
|
+
className,
|
|
2989
|
+
id: isFocused ? 'TitleBarEntryActive' : undefined,
|
|
2980
2990
|
name: label,
|
|
2981
2991
|
// TODO have separate name attribute
|
|
2982
2992
|
role: MenuItem$1,
|
|
2983
2993
|
type: Button$1
|
|
2984
|
-
}
|
|
2985
|
-
|
|
2986
|
-
|
|
2987
|
-
|
|
2988
|
-
}
|
|
2989
|
-
if (isFocused) {
|
|
2990
|
-
dom[0].className += ' ' + TitleBarEntryActive;
|
|
2991
|
-
// @ts-ignore
|
|
2992
|
-
dom[0].id = 'TitleBarEntryActive';
|
|
2993
|
-
dom.push({
|
|
2994
|
-
childCount: 1,
|
|
2995
|
-
className: TitleBarTopLevelEntryLabel,
|
|
2996
|
-
type: Div
|
|
2997
|
-
});
|
|
2998
|
-
}
|
|
2999
|
-
dom.push(text(label));
|
|
3000
|
-
return dom;
|
|
2994
|
+
}, ...(isFocused ? [{
|
|
2995
|
+
childCount: 1,
|
|
2996
|
+
className: TitleBarTopLevelEntryLabel,
|
|
2997
|
+
type: Div
|
|
2998
|
+
}] : []), text(label)];
|
|
3001
2999
|
};
|
|
3002
3000
|
const getTitleBarMenuBarItemsVirtualDom = visibleItems => {
|
|
3003
3001
|
const dom = visibleItems.flatMap(getItemVirtualDom);
|
|
@@ -3005,7 +3003,10 @@ const getTitleBarMenuBarItemsVirtualDom = visibleItems => {
|
|
|
3005
3003
|
};
|
|
3006
3004
|
|
|
3007
3005
|
const activeId = 'TitleBarEntryActive';
|
|
3008
|
-
const getTitleBarMenuBarVirtualDom = (visibleItems, focusedIndex) => {
|
|
3006
|
+
const getTitleBarMenuBarVirtualDom = (menuBarEnabled, visibleItems, focusedIndex) => {
|
|
3007
|
+
if (!menuBarEnabled) {
|
|
3008
|
+
return [];
|
|
3009
|
+
}
|
|
3009
3010
|
return [{
|
|
3010
3011
|
ariaActivedescendant: focusedIndex === -1 ? '' : activeId,
|
|
3011
3012
|
childCount: visibleItems.length,
|
|
@@ -3026,7 +3027,10 @@ const parentNode = {
|
|
|
3026
3027
|
className: 'TitleBarTitle',
|
|
3027
3028
|
type: Div
|
|
3028
3029
|
};
|
|
3029
|
-
const getTitleVirtualDom = title => {
|
|
3030
|
+
const getTitleVirtualDom = (titleBarTitleEnabled, title) => {
|
|
3031
|
+
if (!titleBarTitleEnabled) {
|
|
3032
|
+
return [];
|
|
3033
|
+
}
|
|
3030
3034
|
return [parentNode, text(title)];
|
|
3031
3035
|
};
|
|
3032
3036
|
|
|
@@ -3077,44 +3081,24 @@ const getTitleBarVirtualDom = state => {
|
|
|
3077
3081
|
isMenuOpen,
|
|
3078
3082
|
title,
|
|
3079
3083
|
titleBarButtons,
|
|
3084
|
+
titleBarButtonsEnabled,
|
|
3080
3085
|
titleBarEntries,
|
|
3086
|
+
titleBarIconEnabled,
|
|
3087
|
+
titleBarMenuBarEnabled,
|
|
3088
|
+
titleBarTitleEnabled,
|
|
3081
3089
|
width
|
|
3082
3090
|
} = state;
|
|
3083
|
-
const
|
|
3091
|
+
const iconSrc = getIcon(assetDir);
|
|
3092
|
+
const visibleEntries = getVisibleTitleBarEntries(titleBarEntries, width, focusedIndex, isMenuOpen);
|
|
3093
|
+
return [{
|
|
3084
3094
|
ariaLabel: 'Title Bar',
|
|
3095
|
+
// TODO i18n string
|
|
3085
3096
|
childCount: 4,
|
|
3086
3097
|
className: 'Viewlet TitleBar',
|
|
3087
3098
|
id: 'TitleBar',
|
|
3088
3099
|
role: ContentInfo,
|
|
3089
3100
|
type: Div
|
|
3090
|
-
}];
|
|
3091
|
-
|
|
3092
|
-
// Add icon if enabled
|
|
3093
|
-
if (state.titleBarIconEnabled) {
|
|
3094
|
-
const iconSrc = getIcon(assetDir);
|
|
3095
|
-
const iconDom = getTitleBarIconVirtualDom(iconSrc);
|
|
3096
|
-
dom.push(...iconDom);
|
|
3097
|
-
}
|
|
3098
|
-
|
|
3099
|
-
// Add menu bar if enabled
|
|
3100
|
-
if (state.titleBarMenuBarEnabled) {
|
|
3101
|
-
const visibleEntries = getVisibleTitleBarEntries(titleBarEntries, width, focusedIndex, isMenuOpen);
|
|
3102
|
-
const menuBarDom = getTitleBarMenuBarVirtualDom(visibleEntries, focusedIndex);
|
|
3103
|
-
dom.push(...menuBarDom);
|
|
3104
|
-
}
|
|
3105
|
-
|
|
3106
|
-
// Add title if enabled
|
|
3107
|
-
if (state.titleBarTitleEnabled) {
|
|
3108
|
-
const titleDom = getTitleVirtualDom(title);
|
|
3109
|
-
dom.push(...titleDom);
|
|
3110
|
-
}
|
|
3111
|
-
|
|
3112
|
-
// Add buttons if enabled
|
|
3113
|
-
if (state.titleBarButtonsEnabled) {
|
|
3114
|
-
const buttonsDom = getTitleBarButtonsVirtualDom(titleBarButtons);
|
|
3115
|
-
dom.push(...buttonsDom);
|
|
3116
|
-
}
|
|
3117
|
-
return dom;
|
|
3101
|
+
}, ...getTitleBarIconVirtualDom(titleBarIconEnabled, iconSrc), ...getTitleBarMenuBarVirtualDom(titleBarMenuBarEnabled, visibleEntries, focusedIndex), ...getTitleVirtualDom(titleBarTitleEnabled, title), ...getTitleBarButtonsVirtualDom(titleBarButtonsEnabled, titleBarButtons)];
|
|
3118
3102
|
};
|
|
3119
3103
|
|
|
3120
3104
|
const renderTitleBar = (oldState, newState) => {
|
|
@@ -3398,6 +3382,9 @@ const handleKeyArrowDownMenuOpen = state => {
|
|
|
3398
3382
|
menus
|
|
3399
3383
|
} = state;
|
|
3400
3384
|
const menu = menus.at(-1);
|
|
3385
|
+
if (!menu) {
|
|
3386
|
+
return state;
|
|
3387
|
+
}
|
|
3401
3388
|
const newFocusedIndex = getIndexToFocusNext(menu);
|
|
3402
3389
|
const newMenus = [...menus.slice(0, -1), {
|
|
3403
3390
|
...menu,
|
|
@@ -3421,6 +3408,9 @@ const closeOneMenu = state => {
|
|
|
3421
3408
|
menus
|
|
3422
3409
|
} = state;
|
|
3423
3410
|
const parentMenu = menus.at(-2);
|
|
3411
|
+
if (!parentMenu) {
|
|
3412
|
+
return state;
|
|
3413
|
+
}
|
|
3424
3414
|
const newParentMenu = {
|
|
3425
3415
|
...parentMenu,
|
|
3426
3416
|
expanded: false
|
|
@@ -3487,6 +3477,9 @@ const handleKeyArrowRightMenuOpen = async state => {
|
|
|
3487
3477
|
} = state;
|
|
3488
3478
|
// if menu can open sub menu to the right -> do that
|
|
3489
3479
|
const menu = menus.at(-1);
|
|
3480
|
+
if (!menu) {
|
|
3481
|
+
return state;
|
|
3482
|
+
}
|
|
3490
3483
|
const {
|
|
3491
3484
|
focusedIndex,
|
|
3492
3485
|
items,
|
|
@@ -3698,16 +3691,10 @@ const handleMenuClick = async (state, level, index) => {
|
|
|
3698
3691
|
}
|
|
3699
3692
|
};
|
|
3700
3693
|
|
|
3701
|
-
const
|
|
3702
|
-
object(state);
|
|
3703
|
-
number(level);
|
|
3704
|
-
number(index);
|
|
3705
|
-
const {
|
|
3706
|
-
menus
|
|
3707
|
-
} = state;
|
|
3694
|
+
const getNewMenus = async (menus, level, index, flags) => {
|
|
3708
3695
|
const menu = menus[level];
|
|
3709
3696
|
if (!menu) {
|
|
3710
|
-
return
|
|
3697
|
+
return menus;
|
|
3711
3698
|
}
|
|
3712
3699
|
const {
|
|
3713
3700
|
focusedIndex,
|
|
@@ -3718,7 +3705,7 @@ const handleMenuMouseOver = async (state, level, index) => {
|
|
|
3718
3705
|
const item = items[index];
|
|
3719
3706
|
if (focusedIndex === index) {
|
|
3720
3707
|
if (index === -1) {
|
|
3721
|
-
return
|
|
3708
|
+
return menus;
|
|
3722
3709
|
}
|
|
3723
3710
|
if (item.flags === SubMenu && level === menus.length - 2) {
|
|
3724
3711
|
const subMenu = menus[level + 1];
|
|
@@ -3728,23 +3715,17 @@ const handleMenuMouseOver = async (state, level, index) => {
|
|
|
3728
3715
|
focusedIndex: -1
|
|
3729
3716
|
};
|
|
3730
3717
|
const newMenus = [...menus.slice(0, -1), newSubMenu];
|
|
3731
|
-
return
|
|
3732
|
-
...state,
|
|
3733
|
-
menus: newMenus
|
|
3734
|
-
};
|
|
3718
|
+
return newMenus;
|
|
3735
3719
|
}
|
|
3736
3720
|
}
|
|
3737
|
-
return
|
|
3721
|
+
return menus;
|
|
3738
3722
|
}
|
|
3739
3723
|
if (index === -1) {
|
|
3740
3724
|
const newMenus = [...menus.slice(0, level), {
|
|
3741
3725
|
...menu,
|
|
3742
3726
|
focusedIndex: -1
|
|
3743
3727
|
}];
|
|
3744
|
-
return
|
|
3745
|
-
...state,
|
|
3746
|
-
menus: newMenus
|
|
3747
|
-
};
|
|
3728
|
+
return newMenus;
|
|
3748
3729
|
}
|
|
3749
3730
|
if (item.flags === SubMenu) {
|
|
3750
3731
|
const item = items[index];
|
|
@@ -3761,15 +3742,36 @@ const handleMenuMouseOver = async (state, level, index) => {
|
|
|
3761
3742
|
focusedIndex: index
|
|
3762
3743
|
};
|
|
3763
3744
|
const newMenus = [...menus.slice(0, level - 1), newParentMenu, subMenu];
|
|
3764
|
-
return
|
|
3765
|
-
...state,
|
|
3766
|
-
menus: newMenus
|
|
3767
|
-
};
|
|
3745
|
+
return newMenus;
|
|
3768
3746
|
}
|
|
3769
3747
|
const newMenus = [...menus.slice(0, level), {
|
|
3770
3748
|
...menu,
|
|
3771
3749
|
focusedIndex: index
|
|
3772
3750
|
}];
|
|
3751
|
+
return newMenus;
|
|
3752
|
+
};
|
|
3753
|
+
const handleMenuMouseOver = async (state, level, index) => {
|
|
3754
|
+
object(state);
|
|
3755
|
+
number(level);
|
|
3756
|
+
number(index);
|
|
3757
|
+
const {
|
|
3758
|
+
menus
|
|
3759
|
+
} = state;
|
|
3760
|
+
const menu = menus[level];
|
|
3761
|
+
if (!menu) {
|
|
3762
|
+
return state;
|
|
3763
|
+
}
|
|
3764
|
+
const {
|
|
3765
|
+
items
|
|
3766
|
+
} = menu;
|
|
3767
|
+
const item = items[index];
|
|
3768
|
+
if (!item) {
|
|
3769
|
+
return state;
|
|
3770
|
+
}
|
|
3771
|
+
const newMenus = await getNewMenus(menus, level, index);
|
|
3772
|
+
if (menus === newMenus) {
|
|
3773
|
+
return state;
|
|
3774
|
+
}
|
|
3773
3775
|
return {
|
|
3774
3776
|
...state,
|
|
3775
3777
|
menus: newMenus
|