@lvce-editor/title-bar-worker 2.18.0 → 2.19.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 +196 -255
- package/package.json +1 -1
|
@@ -2291,7 +2291,7 @@ const getRecentlyOpened = () => {
|
|
|
2291
2291
|
|
|
2292
2292
|
const File = 'file://';
|
|
2293
2293
|
|
|
2294
|
-
const getTitle = (homeDir, uri) => {
|
|
2294
|
+
const getTitle$1 = (homeDir, uri) => {
|
|
2295
2295
|
if (!uri) {
|
|
2296
2296
|
return '';
|
|
2297
2297
|
}
|
|
@@ -2315,7 +2315,7 @@ const getHomeDir = () => {
|
|
|
2315
2315
|
const MAX_MENU_RECENT_ENTRIES = 10;
|
|
2316
2316
|
const toMenuItem = folder => {
|
|
2317
2317
|
const homeDir = getHomeDir();
|
|
2318
|
-
const label = getTitle(homeDir, folder);
|
|
2318
|
+
const label = getTitle$1(homeDir, folder);
|
|
2319
2319
|
return {
|
|
2320
2320
|
label,
|
|
2321
2321
|
flags: None,
|
|
@@ -2526,153 +2526,6 @@ const getMenuEntries$1 = async (id, platform) => {
|
|
|
2526
2526
|
return menu.getMenuEntries(platform);
|
|
2527
2527
|
};
|
|
2528
2528
|
|
|
2529
|
-
const MaskIconCheck = 'MaskIconCheck';
|
|
2530
|
-
const Menu = 'Menu';
|
|
2531
|
-
const MenuItem = 'MenuItem';
|
|
2532
|
-
const MenuItemCheckMark = 'MenuItemCheckMark';
|
|
2533
|
-
const MenuItemCheckmarkIcon = 'MenuItemCheckmarkIcon';
|
|
2534
|
-
const MenuItemFocused = 'MenuItemFocused';
|
|
2535
|
-
const MenuItemKeyBinding = 'MenuItemKeyBinding';
|
|
2536
|
-
const MenuItemSeparator = 'MenuItemSeparator';
|
|
2537
|
-
const MenuItemSeparatorLine = 'MenuItemSeparatorLine';
|
|
2538
|
-
const MenuItemSubMenu = 'MenuItemSubMenu';
|
|
2539
|
-
const MenuItemSubMenuArrowRight = 'MenuItemSubMenuArrowRight';
|
|
2540
|
-
const TitleBarButtons = 'TitleBarButtons';
|
|
2541
|
-
const TitleBarEntryActive = 'TitleBarEntryActive';
|
|
2542
|
-
const TitleBarIcon = 'TitleBarIcon';
|
|
2543
|
-
const TitleBarIconIcon = 'TitleBarIconIcon';
|
|
2544
|
-
const TitleBarMenuBar = 'TitleBarMenuBar';
|
|
2545
|
-
const TitleBarTopLevelEntry = 'TitleBarTopLevelEntry';
|
|
2546
|
-
const TitleBarTopLevelEntryLabel = 'TitleBarTopLevelEntryLabel';
|
|
2547
|
-
const Viewlet = 'Viewlet';
|
|
2548
|
-
|
|
2549
|
-
const getIconVirtualDom = (icon, type = Div) => {
|
|
2550
|
-
return {
|
|
2551
|
-
type,
|
|
2552
|
-
className: `MaskIcon MaskIcon${icon}`,
|
|
2553
|
-
role: None$1,
|
|
2554
|
-
childCount: 0
|
|
2555
|
-
};
|
|
2556
|
-
};
|
|
2557
|
-
|
|
2558
|
-
const createTitleBarButton = button => {
|
|
2559
|
-
const {
|
|
2560
|
-
id,
|
|
2561
|
-
icon,
|
|
2562
|
-
label,
|
|
2563
|
-
onClick
|
|
2564
|
-
} = button;
|
|
2565
|
-
const dom = [{
|
|
2566
|
-
type: Button$1,
|
|
2567
|
-
className: `TitleBarButton TitleBarButton${id}`,
|
|
2568
|
-
ariaLabel: label,
|
|
2569
|
-
childCount: 1,
|
|
2570
|
-
onClick
|
|
2571
|
-
}, getIconVirtualDom(icon, I)];
|
|
2572
|
-
return dom;
|
|
2573
|
-
};
|
|
2574
|
-
|
|
2575
|
-
const getTitleBarButtonsVirtualDom = buttons => {
|
|
2576
|
-
return [{
|
|
2577
|
-
type: Div,
|
|
2578
|
-
className: mergeClassNames(Viewlet, TitleBarButtons),
|
|
2579
|
-
childCount: buttons.length
|
|
2580
|
-
}, ...buttons.flatMap(createTitleBarButton)];
|
|
2581
|
-
};
|
|
2582
|
-
|
|
2583
|
-
const parentNode$1 = {
|
|
2584
|
-
type: Div,
|
|
2585
|
-
className: mergeClassNames(Viewlet, TitleBarIcon),
|
|
2586
|
-
childCount: 1
|
|
2587
|
-
};
|
|
2588
|
-
const getTitleBarIconVirtualDom = iconSrc => {
|
|
2589
|
-
return [parentNode$1, {
|
|
2590
|
-
type: Img,
|
|
2591
|
-
className: TitleBarIconIcon,
|
|
2592
|
-
src: iconSrc,
|
|
2593
|
-
alt: '',
|
|
2594
|
-
childCount: 0
|
|
2595
|
-
}];
|
|
2596
|
-
};
|
|
2597
|
-
|
|
2598
|
-
const HandleClick = 1;
|
|
2599
|
-
const HandleClickMinimize = 2;
|
|
2600
|
-
const HandleClickToggleClose = 3;
|
|
2601
|
-
const HandleClickToggleMaximize = 4;
|
|
2602
|
-
const HandleFocusIn = 5;
|
|
2603
|
-
const HandleFocusOut = 6;
|
|
2604
|
-
const HandlePointerOut = 7;
|
|
2605
|
-
const HandlePointerOver = 8;
|
|
2606
|
-
const HandleMenuClick = 9;
|
|
2607
|
-
const HandleMenuMouseOver = 10;
|
|
2608
|
-
|
|
2609
|
-
const getItemVirtualDom = item => {
|
|
2610
|
-
// @ts-ignore
|
|
2611
|
-
const {
|
|
2612
|
-
keyboardShortCut,
|
|
2613
|
-
label,
|
|
2614
|
-
isOpen,
|
|
2615
|
-
isFocused
|
|
2616
|
-
} = item;
|
|
2617
|
-
// TODO avoid mutation
|
|
2618
|
-
const dom = [];
|
|
2619
|
-
dom.push({
|
|
2620
|
-
type: Div,
|
|
2621
|
-
className: TitleBarTopLevelEntry,
|
|
2622
|
-
ariaHasPopup: true,
|
|
2623
|
-
ariaExpanded: isOpen,
|
|
2624
|
-
role: MenuItem$1,
|
|
2625
|
-
childCount: 1,
|
|
2626
|
-
ariaKeyShortcuts: keyboardShortCut
|
|
2627
|
-
});
|
|
2628
|
-
if (isOpen) {
|
|
2629
|
-
// @ts-ignore
|
|
2630
|
-
dom[0].ariaOwns = 'Menu-0';
|
|
2631
|
-
}
|
|
2632
|
-
if (isFocused) {
|
|
2633
|
-
dom[0].className += ' ' + TitleBarEntryActive;
|
|
2634
|
-
// @ts-ignore
|
|
2635
|
-
dom[0].id = 'TitleBarEntryActive';
|
|
2636
|
-
dom.push({
|
|
2637
|
-
type: Div,
|
|
2638
|
-
className: TitleBarTopLevelEntryLabel,
|
|
2639
|
-
childCount: 1
|
|
2640
|
-
});
|
|
2641
|
-
}
|
|
2642
|
-
dom.push(text(label));
|
|
2643
|
-
return dom;
|
|
2644
|
-
};
|
|
2645
|
-
const getTitleBarMenuBarItemsVirtualDom = visibleItems => {
|
|
2646
|
-
const dom = visibleItems.flatMap(getItemVirtualDom);
|
|
2647
|
-
return dom;
|
|
2648
|
-
};
|
|
2649
|
-
|
|
2650
|
-
const activeId = 'TitleBarEntryActive';
|
|
2651
|
-
const getTitleBarMenuBarVirtualDom = (visibleItems, focusedIndex) => {
|
|
2652
|
-
return [{
|
|
2653
|
-
type: Div,
|
|
2654
|
-
className: mergeClassNames(Viewlet, TitleBarMenuBar),
|
|
2655
|
-
role: MenuBar,
|
|
2656
|
-
tabIndex: 0,
|
|
2657
|
-
childCount: visibleItems.length,
|
|
2658
|
-
onMouseDown: HandleClick,
|
|
2659
|
-
onFocusOut: HandleFocusOut,
|
|
2660
|
-
onFocusIn: HandleFocusIn,
|
|
2661
|
-
onPointerOver: HandlePointerOver,
|
|
2662
|
-
onPointerOut: HandlePointerOut,
|
|
2663
|
-
ariaActivedescendant: focusedIndex === -1 ? '' : activeId
|
|
2664
|
-
}, ...getTitleBarMenuBarItemsVirtualDom(visibleItems)];
|
|
2665
|
-
};
|
|
2666
|
-
|
|
2667
|
-
const parentNode = {
|
|
2668
|
-
type: Div,
|
|
2669
|
-
className: 'TitleBarTitle',
|
|
2670
|
-
childCount: 1
|
|
2671
|
-
};
|
|
2672
|
-
const getTitleVirtualDom = title => {
|
|
2673
|
-
return [parentNode, text(title)];
|
|
2674
|
-
};
|
|
2675
|
-
|
|
2676
2529
|
const maximize = async () => {
|
|
2677
2530
|
await invoke('ElectronWindow.maximize');
|
|
2678
2531
|
};
|
|
@@ -3028,6 +2881,15 @@ const addWidths = (entries, labelPadding, fontWeight, fontSize, fontFamily, lett
|
|
|
3028
2881
|
return withWidths;
|
|
3029
2882
|
};
|
|
3030
2883
|
|
|
2884
|
+
const getTitle = workspaceUri => {
|
|
2885
|
+
if (!workspaceUri) {
|
|
2886
|
+
return '';
|
|
2887
|
+
}
|
|
2888
|
+
const slashIndex = workspaceUri.lastIndexOf('/');
|
|
2889
|
+
const baseName = workspaceUri.slice(slashIndex);
|
|
2890
|
+
return baseName;
|
|
2891
|
+
};
|
|
2892
|
+
|
|
3031
2893
|
const loadContent2 = async state => {
|
|
3032
2894
|
const {
|
|
3033
2895
|
platform,
|
|
@@ -3042,7 +2904,9 @@ const loadContent2 = async state => {
|
|
|
3042
2904
|
const titleBarEntries = await getMenuEntries(TitleBar$1);
|
|
3043
2905
|
const withWidths = addWidths(titleBarEntries, labelPadding, labelFontWeight, labelFontSize, labelFontFamily, labelLetterSpacing);
|
|
3044
2906
|
const buttons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
3045
|
-
|
|
2907
|
+
// @ts-ignore
|
|
2908
|
+
const workspaceUri = await invoke('Workspace.getUri');
|
|
2909
|
+
const title = getTitle(workspaceUri);
|
|
3046
2910
|
const iconWidth = 30;
|
|
3047
2911
|
return {
|
|
3048
2912
|
...state,
|
|
@@ -3053,74 +2917,6 @@ const loadContent2 = async state => {
|
|
|
3053
2917
|
};
|
|
3054
2918
|
};
|
|
3055
2919
|
|
|
3056
|
-
const loadContent = async (state, titleBarEntries) => {
|
|
3057
|
-
const {
|
|
3058
|
-
platform,
|
|
3059
|
-
controlsOverlayEnabled,
|
|
3060
|
-
titleBarStyleCustom,
|
|
3061
|
-
labelFontFamily,
|
|
3062
|
-
labelFontSize,
|
|
3063
|
-
labelFontWeight,
|
|
3064
|
-
labelLetterSpacing,
|
|
3065
|
-
labelPadding
|
|
3066
|
-
} = state;
|
|
3067
|
-
const withWidths = addWidths(titleBarEntries, labelPadding, labelFontWeight, labelFontSize, labelFontFamily, labelLetterSpacing);
|
|
3068
|
-
const buttons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
3069
|
-
const title = 'test';
|
|
3070
|
-
return {
|
|
3071
|
-
...state,
|
|
3072
|
-
titleBarEntries: withWidths,
|
|
3073
|
-
buttons,
|
|
3074
|
-
title
|
|
3075
|
-
};
|
|
3076
|
-
};
|
|
3077
|
-
|
|
3078
|
-
const Ellipsis = 'Ellipsis';
|
|
3079
|
-
|
|
3080
|
-
const getVisibleTitleBarEntries = (entries, width, focusedIndex, isMenuOpen) => {
|
|
3081
|
-
array(entries);
|
|
3082
|
-
number(width);
|
|
3083
|
-
let total = 0;
|
|
3084
|
-
const visible = [];
|
|
3085
|
-
for (let i = 0; i < entries.length; i++) {
|
|
3086
|
-
const entry = entries[i];
|
|
3087
|
-
total += entry.width;
|
|
3088
|
-
if (total >= width) {
|
|
3089
|
-
break;
|
|
3090
|
-
}
|
|
3091
|
-
const isOpen = i === focusedIndex && isMenuOpen;
|
|
3092
|
-
const isFocused = i === focusedIndex;
|
|
3093
|
-
visible.push({
|
|
3094
|
-
...entry,
|
|
3095
|
-
isOpen,
|
|
3096
|
-
isFocused
|
|
3097
|
-
});
|
|
3098
|
-
}
|
|
3099
|
-
const hasOverflow = visible.length < entries.length;
|
|
3100
|
-
if (hasOverflow) {
|
|
3101
|
-
const padding = 8;
|
|
3102
|
-
const moreIconWidth = 22;
|
|
3103
|
-
const totalPadding = padding * 2;
|
|
3104
|
-
const hasStillOverflow = total + moreIconWidth + totalPadding > width;
|
|
3105
|
-
if (hasStillOverflow) {
|
|
3106
|
-
visible.pop();
|
|
3107
|
-
}
|
|
3108
|
-
visible.push({
|
|
3109
|
-
ariaLabel: moreDot(),
|
|
3110
|
-
icon: Ellipsis,
|
|
3111
|
-
label: '',
|
|
3112
|
-
width: moreIconWidth + totalPadding
|
|
3113
|
-
});
|
|
3114
|
-
}
|
|
3115
|
-
return visible;
|
|
3116
|
-
};
|
|
3117
|
-
|
|
3118
|
-
const renderEntries = (oldState, newState) => {
|
|
3119
|
-
const visibleEntries = getVisibleTitleBarEntries(newState.titleBarEntries, newState.width, newState.focusedIndex, newState.isMenuOpen);
|
|
3120
|
-
const dom = getTitleBarMenuBarVirtualDom(visibleEntries, newState.focusedIndex);
|
|
3121
|
-
return ['Viewlet.setDom2', newState.uid, dom];
|
|
3122
|
-
};
|
|
3123
|
-
|
|
3124
2920
|
const renderFocusedIndex = (oldState, newState) => {
|
|
3125
2921
|
if (newState.focusedIndex === -1) {
|
|
3126
2922
|
return [];
|
|
@@ -3128,6 +2924,26 @@ const renderFocusedIndex = (oldState, newState) => {
|
|
|
3128
2924
|
return ['Viewlet.focusSelector', '.ViewletTitleBarMenuBar'];
|
|
3129
2925
|
};
|
|
3130
2926
|
|
|
2927
|
+
const MaskIconCheck = 'MaskIconCheck';
|
|
2928
|
+
const Menu = 'Menu';
|
|
2929
|
+
const MenuItem = 'MenuItem';
|
|
2930
|
+
const MenuItemCheckMark = 'MenuItemCheckMark';
|
|
2931
|
+
const MenuItemCheckmarkIcon = 'MenuItemCheckmarkIcon';
|
|
2932
|
+
const MenuItemFocused = 'MenuItemFocused';
|
|
2933
|
+
const MenuItemKeyBinding = 'MenuItemKeyBinding';
|
|
2934
|
+
const MenuItemSeparator = 'MenuItemSeparator';
|
|
2935
|
+
const MenuItemSeparatorLine = 'MenuItemSeparatorLine';
|
|
2936
|
+
const MenuItemSubMenu = 'MenuItemSubMenu';
|
|
2937
|
+
const MenuItemSubMenuArrowRight = 'MenuItemSubMenuArrowRight';
|
|
2938
|
+
const TitleBarButtons = 'TitleBarButtons';
|
|
2939
|
+
const TitleBarEntryActive = 'TitleBarEntryActive';
|
|
2940
|
+
const TitleBarIcon = 'TitleBarIcon';
|
|
2941
|
+
const TitleBarIconIcon = 'TitleBarIconIcon';
|
|
2942
|
+
const TitleBarMenuBar = 'TitleBarMenuBar';
|
|
2943
|
+
const TitleBarTopLevelEntry = 'TitleBarTopLevelEntry';
|
|
2944
|
+
const TitleBarTopLevelEntryLabel = 'TitleBarTopLevelEntryLabel';
|
|
2945
|
+
const Viewlet = 'Viewlet';
|
|
2946
|
+
|
|
3131
2947
|
const checkboxChecked = {
|
|
3132
2948
|
type: Div,
|
|
3133
2949
|
className: mergeClassNames(MenuItem, MenuItemCheckMark),
|
|
@@ -3359,43 +3175,175 @@ const renderMenus = (oldState, newState) => {
|
|
|
3359
3175
|
return ['Viewlet.send', newState.uid, /* method */SetMenus, /* changes */changes, newState.uid];
|
|
3360
3176
|
};
|
|
3361
3177
|
|
|
3362
|
-
const
|
|
3363
|
-
|
|
3364
|
-
case RenderEntries:
|
|
3365
|
-
return renderEntries;
|
|
3366
|
-
case RenderFocusedIndex:
|
|
3367
|
-
return renderFocusedIndex;
|
|
3368
|
-
case RenderMenus:
|
|
3369
|
-
return renderMenus;
|
|
3370
|
-
default:
|
|
3371
|
-
throw new Error('unknown renderer');
|
|
3372
|
-
}
|
|
3178
|
+
const getIcon = assetDir => {
|
|
3179
|
+
return `${assetDir}/icons/icon.svg`;
|
|
3373
3180
|
};
|
|
3374
3181
|
|
|
3375
|
-
const
|
|
3376
|
-
|
|
3377
|
-
|
|
3378
|
-
|
|
3379
|
-
|
|
3380
|
-
|
|
3381
|
-
|
|
3382
|
-
}
|
|
3383
|
-
}
|
|
3384
|
-
return commands;
|
|
3182
|
+
const getIconVirtualDom = (icon, type = Div) => {
|
|
3183
|
+
return {
|
|
3184
|
+
type,
|
|
3185
|
+
className: `MaskIcon MaskIcon${icon}`,
|
|
3186
|
+
role: None$1,
|
|
3187
|
+
childCount: 0
|
|
3188
|
+
};
|
|
3385
3189
|
};
|
|
3386
3190
|
|
|
3387
|
-
const
|
|
3191
|
+
const createTitleBarButton = button => {
|
|
3388
3192
|
const {
|
|
3389
|
-
|
|
3390
|
-
|
|
3391
|
-
|
|
3392
|
-
|
|
3393
|
-
|
|
3394
|
-
|
|
3193
|
+
id,
|
|
3194
|
+
icon,
|
|
3195
|
+
label,
|
|
3196
|
+
onClick
|
|
3197
|
+
} = button;
|
|
3198
|
+
const dom = [{
|
|
3199
|
+
type: Button$1,
|
|
3200
|
+
className: `TitleBarButton TitleBarButton${id}`,
|
|
3201
|
+
ariaLabel: label,
|
|
3202
|
+
childCount: 1,
|
|
3203
|
+
onClick
|
|
3204
|
+
}, getIconVirtualDom(icon, I)];
|
|
3205
|
+
return dom;
|
|
3395
3206
|
};
|
|
3396
3207
|
|
|
3397
|
-
const
|
|
3398
|
-
return
|
|
3208
|
+
const getTitleBarButtonsVirtualDom = buttons => {
|
|
3209
|
+
return [{
|
|
3210
|
+
type: Div,
|
|
3211
|
+
className: mergeClassNames(Viewlet, TitleBarButtons),
|
|
3212
|
+
childCount: buttons.length
|
|
3213
|
+
}, ...buttons.flatMap(createTitleBarButton)];
|
|
3214
|
+
};
|
|
3215
|
+
|
|
3216
|
+
const parentNode$1 = {
|
|
3217
|
+
type: Div,
|
|
3218
|
+
className: mergeClassNames(Viewlet, TitleBarIcon),
|
|
3219
|
+
childCount: 1
|
|
3220
|
+
};
|
|
3221
|
+
const getTitleBarIconVirtualDom = iconSrc => {
|
|
3222
|
+
return [parentNode$1, {
|
|
3223
|
+
type: Img,
|
|
3224
|
+
className: TitleBarIconIcon,
|
|
3225
|
+
src: iconSrc,
|
|
3226
|
+
alt: '',
|
|
3227
|
+
childCount: 0
|
|
3228
|
+
}];
|
|
3229
|
+
};
|
|
3230
|
+
|
|
3231
|
+
const HandleClick = 1;
|
|
3232
|
+
const HandleClickMinimize = 2;
|
|
3233
|
+
const HandleClickToggleClose = 3;
|
|
3234
|
+
const HandleClickToggleMaximize = 4;
|
|
3235
|
+
const HandleFocusIn = 5;
|
|
3236
|
+
const HandleFocusOut = 6;
|
|
3237
|
+
const HandlePointerOut = 7;
|
|
3238
|
+
const HandlePointerOver = 8;
|
|
3239
|
+
const HandleMenuClick = 9;
|
|
3240
|
+
const HandleMenuMouseOver = 10;
|
|
3241
|
+
|
|
3242
|
+
const getItemVirtualDom = item => {
|
|
3243
|
+
// @ts-ignore
|
|
3244
|
+
const {
|
|
3245
|
+
keyboardShortCut,
|
|
3246
|
+
label,
|
|
3247
|
+
isOpen,
|
|
3248
|
+
isFocused
|
|
3249
|
+
} = item;
|
|
3250
|
+
// TODO avoid mutation
|
|
3251
|
+
const dom = [];
|
|
3252
|
+
dom.push({
|
|
3253
|
+
type: Div,
|
|
3254
|
+
className: TitleBarTopLevelEntry,
|
|
3255
|
+
ariaHasPopup: true,
|
|
3256
|
+
ariaExpanded: isOpen,
|
|
3257
|
+
role: MenuItem$1,
|
|
3258
|
+
childCount: 1,
|
|
3259
|
+
ariaKeyShortcuts: keyboardShortCut
|
|
3260
|
+
});
|
|
3261
|
+
if (isOpen) {
|
|
3262
|
+
// @ts-ignore
|
|
3263
|
+
dom[0].ariaOwns = 'Menu-0';
|
|
3264
|
+
}
|
|
3265
|
+
if (isFocused) {
|
|
3266
|
+
dom[0].className += ' ' + TitleBarEntryActive;
|
|
3267
|
+
// @ts-ignore
|
|
3268
|
+
dom[0].id = 'TitleBarEntryActive';
|
|
3269
|
+
dom.push({
|
|
3270
|
+
type: Div,
|
|
3271
|
+
className: TitleBarTopLevelEntryLabel,
|
|
3272
|
+
childCount: 1
|
|
3273
|
+
});
|
|
3274
|
+
}
|
|
3275
|
+
dom.push(text(label));
|
|
3276
|
+
return dom;
|
|
3277
|
+
};
|
|
3278
|
+
const getTitleBarMenuBarItemsVirtualDom = visibleItems => {
|
|
3279
|
+
const dom = visibleItems.flatMap(getItemVirtualDom);
|
|
3280
|
+
return dom;
|
|
3281
|
+
};
|
|
3282
|
+
|
|
3283
|
+
const activeId = 'TitleBarEntryActive';
|
|
3284
|
+
const getTitleBarMenuBarVirtualDom = (visibleItems, focusedIndex) => {
|
|
3285
|
+
return [{
|
|
3286
|
+
type: Div,
|
|
3287
|
+
className: mergeClassNames(Viewlet, TitleBarMenuBar),
|
|
3288
|
+
role: MenuBar,
|
|
3289
|
+
tabIndex: 0,
|
|
3290
|
+
childCount: visibleItems.length,
|
|
3291
|
+
onMouseDown: HandleClick,
|
|
3292
|
+
onFocusOut: HandleFocusOut,
|
|
3293
|
+
onFocusIn: HandleFocusIn,
|
|
3294
|
+
onPointerOver: HandlePointerOver,
|
|
3295
|
+
onPointerOut: HandlePointerOut,
|
|
3296
|
+
ariaActivedescendant: focusedIndex === -1 ? '' : activeId
|
|
3297
|
+
}, ...getTitleBarMenuBarItemsVirtualDom(visibleItems)];
|
|
3298
|
+
};
|
|
3299
|
+
|
|
3300
|
+
const parentNode = {
|
|
3301
|
+
type: Div,
|
|
3302
|
+
className: 'TitleBarTitle',
|
|
3303
|
+
childCount: 1
|
|
3304
|
+
};
|
|
3305
|
+
const getTitleVirtualDom = title => {
|
|
3306
|
+
return [parentNode, text(title)];
|
|
3307
|
+
};
|
|
3308
|
+
|
|
3309
|
+
const Ellipsis = 'Ellipsis';
|
|
3310
|
+
|
|
3311
|
+
const getVisibleTitleBarEntries = (entries, width, focusedIndex, isMenuOpen) => {
|
|
3312
|
+
array(entries);
|
|
3313
|
+
number(width);
|
|
3314
|
+
let total = 0;
|
|
3315
|
+
const visible = [];
|
|
3316
|
+
for (let i = 0; i < entries.length; i++) {
|
|
3317
|
+
const entry = entries[i];
|
|
3318
|
+
total += entry.width;
|
|
3319
|
+
if (total >= width) {
|
|
3320
|
+
break;
|
|
3321
|
+
}
|
|
3322
|
+
const isOpen = i === focusedIndex && isMenuOpen;
|
|
3323
|
+
const isFocused = i === focusedIndex;
|
|
3324
|
+
visible.push({
|
|
3325
|
+
...entry,
|
|
3326
|
+
isOpen,
|
|
3327
|
+
isFocused
|
|
3328
|
+
});
|
|
3329
|
+
}
|
|
3330
|
+
const hasOverflow = visible.length < entries.length;
|
|
3331
|
+
if (hasOverflow) {
|
|
3332
|
+
const padding = 8;
|
|
3333
|
+
const moreIconWidth = 22;
|
|
3334
|
+
const totalPadding = padding * 2;
|
|
3335
|
+
const hasStillOverflow = total + moreIconWidth + totalPadding > width;
|
|
3336
|
+
if (hasStillOverflow) {
|
|
3337
|
+
visible.pop();
|
|
3338
|
+
}
|
|
3339
|
+
visible.push({
|
|
3340
|
+
ariaLabel: moreDot(),
|
|
3341
|
+
icon: Ellipsis,
|
|
3342
|
+
label: '',
|
|
3343
|
+
width: moreIconWidth + totalPadding
|
|
3344
|
+
});
|
|
3345
|
+
}
|
|
3346
|
+
return visible;
|
|
3399
3347
|
};
|
|
3400
3348
|
|
|
3401
3349
|
const getTitleBarVirtualDom = state => {
|
|
@@ -4066,17 +4014,12 @@ const commandMap = {
|
|
|
4066
4014
|
'TitleBar.focusLast': wrapCommand(focusIndex),
|
|
4067
4015
|
'TitleBar.focusNext': wrapCommand(focusNext),
|
|
4068
4016
|
'TitleBar.focusPrevious': wrapCommand(focusPrevious),
|
|
4069
|
-
'TitleBar.getButtonsVirtualDom': getTitleBarButtonsVirtualDom,
|
|
4070
4017
|
'TitleBar.getCommandIds': getCommandIds,
|
|
4071
4018
|
'TitleBar.getCommands': getCommandIds,
|
|
4072
|
-
'TitleBar.getIconVirtualDom': getTitleBarIconVirtualDom,
|
|
4073
4019
|
'TitleBar.getKeyBindings': getKeyBindings$1,
|
|
4074
4020
|
'TitleBar.getMenuEntries': getMenuEntries$1,
|
|
4075
4021
|
'TitleBar.getMenuIds': getMenuIds,
|
|
4076
4022
|
'TitleBar.getMenus': getMenus,
|
|
4077
|
-
'TitleBar.getTitleBarButtons': getTitleBarButtons,
|
|
4078
|
-
'TitleBar.getTitleVirtualDom': getTitleVirtualDom,
|
|
4079
|
-
'TitleBar.getVirtualDom': getTitleBarMenuBarVirtualDom,
|
|
4080
4023
|
'TitleBar.handleButtonsClick': handleClick$1,
|
|
4081
4024
|
'TitleBar.handleClick': wrapCommand(handleClick),
|
|
4082
4025
|
'TitleBar.handleClickAt': wrapCommand(handleClickAt),
|
|
@@ -4101,9 +4044,7 @@ const commandMap = {
|
|
|
4101
4044
|
'TitleBar.handleMouseOver': wrapCommand(handleMouseOver),
|
|
4102
4045
|
'TitleBar.handlePointerOut': wrapCommand(handlePointerOut),
|
|
4103
4046
|
'TitleBar.handlePointerOver': wrapCommand(handlePointerOver),
|
|
4104
|
-
'TitleBar.loadContent': wrapCommand(loadContent),
|
|
4105
4047
|
'TitleBar.loadContent2': wrapCommand(loadContent2),
|
|
4106
|
-
'TitleBar.render2': render2,
|
|
4107
4048
|
'TitleBar.render3': render3,
|
|
4108
4049
|
'TitleBar.renderEventListeners': renderEventListeners,
|
|
4109
4050
|
'TitleBar.resize': wrapCommand(resize),
|